From a20750bf071d90eb1ebe34ef44a14427e0bf3a69 Mon Sep 17 00:00:00 2001 From: codecalm Date: Tue, 22 Oct 2019 20:20:05 +0200 Subject: [PATCH] jqvmap plugin, ui fixes --- build/copy-libs.js | 4 +++- js/tabler.js | 1 - package.json | 8 ++++---- pages/_data/libs.json | 28 +++++++++++++++++++--------- pages/_data/maps.yml | 31 ++++++++++--------------------- pages/_includes/js/maps.html | 21 +++++---------------- pages/_includes/layout/css.html | 10 ++++++++++ pages/_includes/layout/js.html | 12 ++++++------ pages/_includes/ui/map.html | 18 ++++++++++++++++++ pages/_layouts/base.html | 5 +++-- pages/maps.html | 21 ++++++++++++--------- scss/tabler.scss | 1 + scss/vendor/_jqvmap.scss | 17 +++++++++++++++++ 13 files changed, 108 insertions(+), 69 deletions(-) create mode 100644 pages/_includes/ui/map.html create mode 100644 scss/vendor/_jqvmap.scss diff --git a/build/copy-libs.js b/build/copy-libs.js index 27055c2ac..f4e6525cc 100755 --- a/build/copy-libs.js +++ b/build/copy-libs.js @@ -2,7 +2,9 @@ const libs = require('../pages/_data/libs'), path = require('path'), { exec } = require('child_process'); -libs.forEach(function (lib) { +const all_libs = libs.js.concat(libs.css); + +all_libs.forEach(function (lib) { let dirname = path.dirname(lib); let cmd = `mkdir -p "dist/libs/${dirname}" && cp -r node_modules/${lib} dist/libs/${lib}`; exec(cmd) diff --git a/js/tabler.js b/js/tabler.js index 0942a6762..e3e0914c8 100644 --- a/js/tabler.js +++ b/js/tabler.js @@ -134,7 +134,6 @@ $(document).ready(function() { (function() { const elements = document.querySelectorAll('[data-toggle="autosize"]'); - console.log('elements.length', elements.length); if (elements.length) { elements.forEach(function(element) { console.log('1', element); diff --git a/package.json b/package.json index 5b3c8fb20..44ada661d 100644 --- a/package.json +++ b/package.json @@ -65,16 +65,16 @@ "clean-css-cli": "4.3.0", "cross-env": "6.0.3", "eslint": "6.5.1", - "eslint-config-xo": "0.27.1", + "eslint-config-xo": "0.27.2", "eslint-plugin-import": "2.18.2", "eslint-plugin-unicorn": "12.1.0", "http-server": "0.11.1", "icon-font-generator": "2.1.10", "node-sass": "4.12.0", - "nodemon": "1.19.3", + "nodemon": "1.19.4", "npm-run-all": "4.1.5", "postcss-cli": "6.1.3", - "rollup": "1.24.0", + "rollup": "1.25.1", "rollup-plugin-babel": "4.3.3", "rollup-plugin-babel-minify": "9.1.0", "rollup-plugin-commonjs": "10.1.0", @@ -94,8 +94,8 @@ "bootstrap": "twbs/bootstrap#8d56c19", "imask": "5.2.1", "jquery": "3.4.1", + "jqvmap": "1.5.1", "peity": "3.3.0", - "popper.js": "1.15.0", "selectize": "0.12.6" }, "bundlesize": [ diff --git a/pages/_data/libs.json b/pages/_data/libs.json index 4e1b409b1..296b41f79 100644 --- a/pages/_data/libs.json +++ b/pages/_data/libs.json @@ -1,9 +1,19 @@ -[ - "jquery/dist/jquery.min.js", - "bootstrap/dist/js/bootstrap.bundle.min.js", - "autosize/dist/autosize.min.js", - "imask/dist/imask.min.js", - "selectize/dist/js/standalone/selectize.min.js", - "apexcharts/dist/apexcharts.min.js", - "peity/jquery.peity.min.js" -] +{ + "js": [ + "jquery/dist/jquery.min.js", + "bootstrap/dist/js/bootstrap.bundle.min.js", + "autosize/dist/autosize.min.js", + "imask/dist/imask.min.js", + + "selectize/dist/js/standalone/selectize.min.js", + "apexcharts/dist/apexcharts.min.js", + "jqvmap/dist/jquery.vmap.min.js", + "jqvmap/dist/maps/jquery.vmap.world.js", + "jqvmap/dist/maps/jquery.vmap.usa.js", + "jqvmap/dist/maps/continents/jquery.vmap.europe.js", + "peity/jquery.peity.min.js" + ], + "css": [ + "jqvmap/dist/jqvmap.min.css" + ] +} diff --git a/pages/_data/maps.yml b/pages/_data/maps.yml index 92aaf601e..b74c2aaea 100644 --- a/pages/_data/maps.yml +++ b/pages/_data/maps.yml @@ -1,23 +1,12 @@ world: - map: "world_en" - backgroundColor: 'transparent' - borderColor: '#ffffff' - borderWidth: 0.25 - borderOpacity: 0.25 - color: 'rgba(120,130,140, 0.1)' - enableZoom: false - showTooltip: true - selectedColor: null - hoverColor: 'red' + title: World map + map: world_en -france: - map: 'france_fr' - backgroundColor: 'transparent' - borderColor: '#ffffff' - borderWidth: 0.25 - borderOpacity: 0.25 - color: 'rgba(120,130,140, 0.1)' - enableZoom: false - showTooltip: true - selectedColor: null - hoverColor: null \ No newline at end of file +europe: + title: Map of Europe + map: europe_en + zoom: true + +usa: + title: Map of USA + map: usa_en diff --git a/pages/_includes/js/maps.html b/pages/_includes/js/maps.html index c01fd575d..6feb3ef77 100644 --- a/pages/_includes/js/maps.html +++ b/pages/_includes/js/maps.html @@ -1,20 +1,9 @@ \ No newline at end of file + diff --git a/pages/_includes/layout/css.html b/pages/_includes/layout/css.html index 6949987e9..dc681ccf7 100644 --- a/pages/_includes/layout/css.html +++ b/pages/_includes/layout/css.html @@ -1,3 +1,13 @@ +{% if site.data.libs %} + +{% for lib in site.data.libs.css %} + +{% endfor %} +{% endif %} + + + + diff --git a/pages/_includes/layout/js.html b/pages/_includes/layout/js.html index 8912b13bc..928740860 100644 --- a/pages/_includes/layout/js.html +++ b/pages/_includes/layout/js.html @@ -4,15 +4,15 @@ }; - -{% for lib in site.data.libs %} - -{% endfor %} +{% if site.data.libs %} + + {% for lib in site.data.libs.js %} + + {% endfor %} +{% endif %} - - diff --git a/pages/_includes/ui/map.html b/pages/_includes/ui/map.html new file mode 100644 index 000000000..d2cc5cc03 --- /dev/null +++ b/pages/_includes/ui/map.html @@ -0,0 +1,18 @@ +{% assign id = include.map %} +{% assign height = include.height | default: 20 %} +{% assign data = site.data.maps[id] %} + +{% if data %} +
+ +{% endif %} diff --git a/pages/_layouts/base.html b/pages/_layouts/base.html index 4455d01d0..67724577a 100644 --- a/pages/_layouts/base.html +++ b/pages/_layouts/base.html @@ -26,9 +26,11 @@ {% endif %} - {% include layout/css.html %} {% include layout/og.html %} + {% include layout/css.html %} + {% include layout/js.html %} + document.body.style.display = 'block'; diff --git a/pages/maps.html b/pages/maps.html index e5154517d..de971f190 100644 --- a/pages/maps.html +++ b/pages/maps.html @@ -3,13 +3,16 @@ title: Maps page-title: Maps --- +
+ {% for map in site.data.maps %} +
-{% for map in site.data.maps %} -{% assign title = map[0] %} -{% assign key = 'map-' | append: title %} - -
- -{% include js/maps.html id=key data=map %} - -{% endfor %} +
+
+ {% assign id = map[0] %} + {% include ui/map.html map=id %} +
+
+
+ {% endfor %} +
diff --git a/scss/tabler.scss b/scss/tabler.scss index 6fe829974..45d21bf0f 100644 --- a/scss/tabler.scss +++ b/scss/tabler.scss @@ -50,6 +50,7 @@ @import "vendor/pace"; @import "vendor/selectize"; +@import "vendor/jqvmap"; @import "utils/border"; @import "utils/background"; diff --git a/scss/vendor/_jqvmap.scss b/scss/vendor/_jqvmap.scss new file mode 100644 index 000000000..19d74f453 --- /dev/null +++ b/scss/vendor/_jqvmap.scss @@ -0,0 +1,17 @@ +.jqvmap-zoomin, +.jqvmap-zoomout { + @extend .btn; + @extend .btn-sm; + @extend .btn-secondary; + height: auto; + width: auto; + left: .5rem; +} + +.jqvmap-zoomin { + top: .5rem; +} + +.jqvmap-zoomout { + top: 2rem; +}