Commit 93a54ea84d1b6534d91eed90224fd5f5b6ffdd8e
Merge branch 'master' of http://service.routetopa.eu:7480/WebCompDev/COMPONENTS
Showing
60 changed files
with
5516 additions
and
1031 deletions
alasql-utility/alasql-utility.js
| 1 | 1 | function alasql_QUERY (data, fields, filters, aggregators, orders) { |
| 2 | - if(fields.length == 0) | |
| 2 | + if(fields && fields.length == 0) | |
| 3 | 3 | return []; |
| 4 | 4 | |
| 5 | - var _fields = _addParenthesis(fields); | |
| 5 | + return alasql(alasql_QUERY_string(fields, filters, aggregators, orders), [data]); | |
| 6 | +} | |
| 7 | + | |
| 8 | +function alasql_QUERY_string (fields, filters, aggregators, orders) { | |
| 6 | 9 | |
| 7 | - var select = _alasql_SELECT(_fields); | |
| 10 | + if(fields) { | |
| 11 | + var _fields = _addParenthesis(fields); | |
| 12 | + var select = _alasql_SELECT(_fields); | |
| 13 | + } | |
| 8 | 14 | |
| 9 | 15 | var where = ""; |
| 10 | 16 | if(filters && filters.length) { |
| ... | ... | @@ -28,7 +34,7 @@ function alasql_QUERY (data, fields, filters, aggregators, orders) { |
| 28 | 34 | |
| 29 | 35 | var query = select + " FROM ?" + where + " " + groupBy + " " + orderBy; |
| 30 | 36 | |
| 31 | - return alasql(query, [data]); | |
| 37 | + return query; | |
| 32 | 38 | } |
| 33 | 39 | |
| 34 | 40 | function _alasql_SELECT (fields) { |
| ... | ... | @@ -44,16 +50,19 @@ function _alasql_SELECT (fields) { |
| 44 | 50 | } |
| 45 | 51 | |
| 46 | 52 | function _alasql_WHERE (filters) { |
| 47 | - var where = " WHERE "; | |
| 48 | - var logicalOperator; | |
| 53 | + //var logicalOperator; | |
| 54 | + // | |
| 55 | + ///*DEPRECATED*/if(filters[0].logicalOperator == undefined) { | |
| 56 | + // logicalOperator = "AND" | |
| 57 | + //} | |
| 58 | + //else { | |
| 59 | + // logicalOperator = filters[0].logicalOperator; | |
| 60 | + // filters = filters.slice(1); | |
| 61 | + //} | |
| 49 | 62 | |
| 50 | - /*DEPRECATED*/if(filters[0].logicalOperator == undefined) { | |
| 51 | - logicalOperator = "AND" | |
| 52 | - } | |
| 53 | - else { | |
| 54 | - logicalOperator = filters[0].logicalOperator; | |
| 55 | - filters = filters.slice(1); | |
| 56 | - } | |
| 63 | + var where = " WHERE "; | |
| 64 | + var logicalOperator = filters[0].logicalOperator; | |
| 65 | + filters = filters.slice(1); | |
| 57 | 66 | |
| 58 | 67 | for (var i=0; i < filters.length; i++) |
| 59 | 68 | filters[i]["field"] = _normalizeField(filters[i]["field"]); |
| ... | ... | @@ -87,7 +96,8 @@ function _alasql_GROUPBY (aggregators) { |
| 87 | 96 | groupBy += aggregators[i]["field"] + ", "; |
| 88 | 97 | } |
| 89 | 98 | else |
| 90 | - select += aggregators[i]["operation"] + "(" + aggregators[i]["field"] + ") as " + aggregators[i]["field"] + ", "; | |
| 99 | + //select += aggregators[i]["operation"] + "(" + aggregators[i]["field"] + ") as " + aggregators[i]["field"] + ", "; | |
| 100 | + select += aggregators[i]["operation"] + "(" + aggregators[i]["field"] + "), "; | |
| 91 | 101 | } |
| 92 | 102 | |
| 93 | 103 | return [select.slice(0, -2), groupBy.slice(0, -2)]; |
| ... | ... | @@ -118,7 +128,7 @@ function _normalizeField (field) { |
| 118 | 128 | return "[" + field + "]"; |
| 119 | 129 | } |
| 120 | 130 | |
| 121 | -function alasql_transformData (data, fields, truncate) { | |
| 131 | +function alasql_transformData (data, fields, round) { | |
| 122 | 132 | if(!data || data.length == 0) |
| 123 | 133 | return []; |
| 124 | 134 | |
| ... | ... | @@ -129,11 +139,11 @@ function alasql_transformData (data, fields, truncate) { |
| 129 | 139 | var field = fields[i]; |
| 130 | 140 | var values = []; |
| 131 | 141 | |
| 132 | - for (var i in data) { | |
| 133 | - var v = data[i][field]; | |
| 134 | - if(truncate) | |
| 142 | + for (var j in data) { | |
| 143 | + var v = data[j][field]; | |
| 144 | + if(round) | |
| 135 | 145 | if(!isNaN(v) && v % 1 != 0) |
| 136 | - v = Math.floor(v * 100) / 100; | |
| 146 | + v = Math.round(v * 1000000) / 1000000; | |
| 137 | 147 | values.push(v); |
| 138 | 148 | } |
| 139 | 149 | ... | ... |
bower_components/paper-listbox/.bower.json
0 → 100644
| 1 | +{ | |
| 2 | + "name": "paper-listbox", | |
| 3 | + "version": "1.1.2", | |
| 4 | + "description": "Implements an accessible material design listbox", | |
| 5 | + "authors": "The Polymer Authors", | |
| 6 | + "keywords": [ | |
| 7 | + "web-components", | |
| 8 | + "polymer", | |
| 9 | + "listbox" | |
| 10 | + ], | |
| 11 | + "main": [ | |
| 12 | + "paper-listbox.html", | |
| 13 | + "paper-sublistbox.html" | |
| 14 | + ], | |
| 15 | + "private": true, | |
| 16 | + "repository": { | |
| 17 | + "type": "git", | |
| 18 | + "url": "git://github.com/PolymerElements/paper-listbox" | |
| 19 | + }, | |
| 20 | + "license": "http://polymer.github.io/LICENSE.txt", | |
| 21 | + "homepage": "https://github.com/PolymerElements/paper-listbox", | |
| 22 | + "ignore": [], | |
| 23 | + "dependencies": { | |
| 24 | + "polymer": "Polymer/polymer#^1.1.0", | |
| 25 | + "iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0", | |
| 26 | + "iron-collapse": "PolymerElements/iron-collapse#^1.0.0", | |
| 27 | + "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^1.0.0", | |
| 28 | + "paper-styles": "PolymerElements/paper-styles#^1.0.0" | |
| 29 | + }, | |
| 30 | + "devDependencies": { | |
| 31 | + "iron-component-page": "PolymerElements/iron-component-page#^1.0.0", | |
| 32 | + "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0", | |
| 33 | + "paper-item": "PolymerElements/paper-item#^1.0.0", | |
| 34 | + "test-fixture": "PolymerElements/test-fixture#^1.0.0", | |
| 35 | + "web-component-tester": "Polymer/web-component-tester#^3.4.0", | |
| 36 | + "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" | |
| 37 | + }, | |
| 38 | + "_release": "1.1.2", | |
| 39 | + "_resolution": { | |
| 40 | + "type": "version", | |
| 41 | + "tag": "v1.1.2", | |
| 42 | + "commit": "b0fde50f57db3e8e4926e9d046be9d3c159a2bff" | |
| 43 | + }, | |
| 44 | + "_source": "git://github.com/polymerelements/paper-listbox.git", | |
| 45 | + "_target": "~1.1.2", | |
| 46 | + "_originalSource": "polymerelements/paper-listbox", | |
| 47 | + "_direct": true | |
| 48 | +} | |
| 0 | 49 | \ No newline at end of file | ... | ... |
bower_components/paper-listbox/.gitignore
0 → 100644
| 1 | +bower_components/ | ... | ... |
bower_components/paper-listbox/.travis.yml
0 → 100644
| 1 | +language: node_js | |
| 2 | +sudo: false | |
| 3 | +cache: | |
| 4 | + directories: | |
| 5 | + - node_modules | |
| 6 | +matrix: | |
| 7 | + include: | |
| 8 | + - node_js: stable | |
| 9 | + script: xvfb-run -a wct --simpleOutput -l firefox -l chrome | |
| 10 | + addons: | |
| 11 | + firefox: latest | |
| 12 | + apt: | |
| 13 | + sources: | |
| 14 | + - google-chrome | |
| 15 | + packages: | |
| 16 | + - google-chrome-stable | |
| 17 | + - node_js: node | |
| 18 | + script: | |
| 19 | + - | | |
| 20 | + if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then | |
| 21 | + wct --simpleOutput -s 'Windows 10/microsoftedge' -s 'Windows 8.1/internet explorer@11' -s 'Windows 7/internet explorer@10' -s 'OS X 10.10/safari@8' -s 'OS X 10.9/safari@7' | |
| 22 | + fi | |
| 23 | +before_script: | |
| 24 | +- npm install bower | |
| 25 | +- npm install web-component-tester | |
| 26 | +- export PATH=$PWD/node_modules/.bin:$PATH | |
| 27 | +- bower install | |
| 28 | +env: | |
| 29 | + global: | |
| 30 | + - secure: uR09ZOD9Sm4HB8QLY2CAr2dWkjxzCggAQF7Tf9mjyk6ZFdzIkktv/IG5Q6ywUPrBwEgpR15a//vknAh1e96w2sdsU7x4SHdnVFV46mN0i3higjiQ0V6qSbFKH0Lom89yh3+nQtmJ8JCF/zWRYGsgpfUC/O3kRQv0ghZ0pjWeO57pvSv8mOTRMUi34cSJchBDZj9U1CzJqJYakST30XBMDHabqm6wbIqvSDve9duPiFPJi6GloRfMXxzC+Lt+WpEdjiYuZ33cmqepW3TEQf0TiZFqg9aQcBINv8723O9IcInvylXmtHRCBikCqoXE6xUNDJZWXbjxzNOwiFO4WSF9t1M7il99ByE3r4MwHlmKTCwHUb4VTvfXy1Ad+sZ0dwDJl92CmTd1/jJGXLXrqUjnUTDFucH4OxQPWtSPxOINzxBebXq+x+cpjdZPe5wp0BpcNiYN0QBNOT08C9B+vLw+/cSn5FXkYO/T+8F/Lhu6SYN1ZQ3HGpjUsNpqhEJgw+l6syQoIZfs3xN6mWqWFbs1RgtGJNrJRwn8umH1I8xy+5yZaif88RhoqTSZnTIkVWMF3/USEDZlhPv+iivFn3Oq3sAopxbR39s9KAGCMu9XdaJk/WA8crS3Jeeq+78tknrpO0VTth8DY6fHY/dV56ZJrc8wHO5souGzg2NLC+D/X20= | |
| 31 | + - secure: k4qJ+VUFYDfWN1FEGqDSLXz6s6zb9fQu9Pwc+b4EMCvhC4Tfhdk7LbGDaw8cnBuDEA1jA9NvmbNN5PqvQ65MxTtPOWpQ/G2N08x9BVJ/u/MkWIY5/LZZoabaiHj4pQAA10sBEeBnhOhfKjNHT3H9s1lo2aWTucc+27fhiWsf2Kmkc4meYU9HKLazrCh+34neOdrkLAMA0EGIEn8OSsmDNhaY5yL71X3wil3qNvfpzXIy0ceAPvLqhM4WvEEYSeel7AohlSyTSC/9GdBvdqN6UmPKJTrk1J2wMsAMcznWDjashORcf/PaVVg4WHfYEBuDk7ECnX+G3Zb02hhw1JnVP+zK/wI9vwwkQXvYqNa+Q+713cWuGXYgVwH2TXKpsO6u69WHw50yKn6k+oOqDvX5SzRgOouFaHFO4GAllgFuX4iAltpluE+aE7I98C968FI3JrHEhCSxH8NlmmPRx794MKUsXBzPLeZ8CqrFs2llvBjVif0vJkad+X4xSxXgxs7SzK0sQS+CtKG3EFLMRNqi9OR98LRFgmkwM7OtOABnZ49lVXqrIaBk0quKAvjSg6PPXf4BUOJdvs8G91N1sf80XOfMj22iGdVUVnmwcktfhdwbm+hN5ToGgbVFTpYOM45+husfmUn7DamYmPudN2EJoawqe44zD6MfjfwqjJCv5Dk= | ... | ... |
bower_components/paper-listbox/README.md
0 → 100644
bower_components/paper-listbox/bower.json
0 → 100644
| 1 | +{ | |
| 2 | + "name": "paper-listbox", | |
| 3 | + "version": "1.1.2", | |
| 4 | + "description": "Implements an accessible material design listbox", | |
| 5 | + "authors": "The Polymer Authors", | |
| 6 | + "keywords": [ | |
| 7 | + "web-components", | |
| 8 | + "polymer", | |
| 9 | + "listbox" | |
| 10 | + ], | |
| 11 | + "main": [ | |
| 12 | + "paper-listbox.html", | |
| 13 | + "paper-sublistbox.html" | |
| 14 | + ], | |
| 15 | + "private": true, | |
| 16 | + "repository": { | |
| 17 | + "type": "git", | |
| 18 | + "url": "git://github.com/PolymerElements/paper-listbox" | |
| 19 | + }, | |
| 20 | + "license": "http://polymer.github.io/LICENSE.txt", | |
| 21 | + "homepage": "https://github.com/PolymerElements/paper-listbox", | |
| 22 | + "ignore": [], | |
| 23 | + "dependencies": { | |
| 24 | + "polymer": "Polymer/polymer#^1.1.0", | |
| 25 | + "iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0", | |
| 26 | + "iron-collapse": "PolymerElements/iron-collapse#^1.0.0", | |
| 27 | + "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^1.0.0", | |
| 28 | + "paper-styles": "PolymerElements/paper-styles#^1.0.0" | |
| 29 | + }, | |
| 30 | + "devDependencies": { | |
| 31 | + "iron-component-page": "PolymerElements/iron-component-page#^1.0.0", | |
| 32 | + "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0", | |
| 33 | + "paper-item": "PolymerElements/paper-item#^1.0.0", | |
| 34 | + "test-fixture": "PolymerElements/test-fixture#^1.0.0", | |
| 35 | + "web-component-tester": "Polymer/web-component-tester#^3.4.0", | |
| 36 | + "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" | |
| 37 | + } | |
| 38 | +} | ... | ... |
bower_components/paper-listbox/demo/index.html
0 → 100644
| 1 | +<!doctype html> | |
| 2 | +<!-- | |
| 3 | +@license | |
| 4 | +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
| 5 | +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt | |
| 6 | +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
| 7 | +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt | |
| 8 | +Code distributed by Google as part of the polymer project is also | |
| 9 | +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt | |
| 10 | +--> | |
| 11 | +<html> | |
| 12 | +<head> | |
| 13 | + | |
| 14 | + <meta charset="utf-8"> | |
| 15 | + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| 16 | + <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> | |
| 17 | + | |
| 18 | + <title>paper-listbox demo</title> | |
| 19 | + | |
| 20 | + <script src="../../webcomponentsjs/webcomponents-lite.js"></script> | |
| 21 | + | |
| 22 | + <link rel="import" href="../../paper-item/paper-item.html"> | |
| 23 | + <link rel="import" href="../../iron-collapse/iron-collapse.html"> | |
| 24 | + <link rel="import" href="../paper-listbox.html"> | |
| 25 | + <link rel="import" href="../../paper-styles/demo-pages.html"> | |
| 26 | + | |
| 27 | + <style is="custom-style"> | |
| 28 | + .horizontal-section { | |
| 29 | + padding: 0 !important; | |
| 30 | + } | |
| 31 | + | |
| 32 | + .avatar { | |
| 33 | + display: inline-block; | |
| 34 | + width: 40px; | |
| 35 | + height: 40px; | |
| 36 | + border-radius: 50%; | |
| 37 | + overflow: hidden; | |
| 38 | + background: #ccc; | |
| 39 | + } | |
| 40 | + | |
| 41 | + paper-item { | |
| 42 | + --paper-item: { | |
| 43 | + cursor: pointer; | |
| 44 | + }; | |
| 45 | + } | |
| 46 | + | |
| 47 | + .sublist { | |
| 48 | + padding-left: 20px; | |
| 49 | + padding-right: 20px; | |
| 50 | + | |
| 51 | + } | |
| 52 | + </style> | |
| 53 | +</head> | |
| 54 | +<body unresolved> | |
| 55 | + <div class="horizontal-section-container"> | |
| 56 | + <div> | |
| 57 | + <h4>Standard</h4> | |
| 58 | + <div class="horizontal-section"> | |
| 59 | + <paper-listbox> | |
| 60 | + <paper-item>Inbox</paper-item> | |
| 61 | + <paper-item>Starred</paper-item> | |
| 62 | + <paper-item>Sent mail</paper-item> | |
| 63 | + <paper-item>Drafts</paper-item> | |
| 64 | + </paper-listbox> | |
| 65 | + </div> | |
| 66 | + </div> | |
| 67 | + | |
| 68 | + <div> | |
| 69 | + <h4>Pre-selected</h4> | |
| 70 | + <div class="horizontal-section"> | |
| 71 | + <paper-listbox selected="0"> | |
| 72 | + <paper-item>Inbox</paper-item> | |
| 73 | + <paper-item disabled>Starred</paper-item> | |
| 74 | + <paper-item>Sent mail</paper-item> | |
| 75 | + <paper-item>Drafts</paper-item> | |
| 76 | + </paper-listbox> | |
| 77 | + </div> | |
| 78 | + </div> | |
| 79 | + | |
| 80 | + <div> | |
| 81 | + <h4>Multi-select</h4> | |
| 82 | + <div class="horizontal-section"> | |
| 83 | + <paper-listbox multi> | |
| 84 | + <paper-item>Bold</paper-item> | |
| 85 | + <paper-item>Italic</paper-item> | |
| 86 | + <paper-item>Underline</paper-item> | |
| 87 | + <paper-item>Strikethrough</paper-item> | |
| 88 | + </paper-listbox> | |
| 89 | + </div> | |
| 90 | + </div> | |
| 91 | + </div> | |
| 92 | +</body> | |
| 93 | +</html> | ... | ... |
bower_components/paper-listbox/hero.svg
0 → 100644
| 1 | +<?xml version="1.0" encoding="utf-8"?> | |
| 2 | +<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> | |
| 3 | +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | |
| 4 | +<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" | |
| 5 | + viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve"> | |
| 6 | +<g id="background" display="none"> | |
| 7 | + <rect display="inline" fill="#B0BEC5" width="225" height="126"/> | |
| 8 | +</g> | |
| 9 | +<g id="label"> | |
| 10 | +</g> | |
| 11 | +<g id="art"> | |
| 12 | + <g> | |
| 13 | + <circle cx="86.5" cy="39" r="4"/> | |
| 14 | + <path d="M138,44c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6 | |
| 15 | + c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,37.3,100,36,98,36v-2 | |
| 16 | + c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6 | |
| 17 | + c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V44z"/> | |
| 18 | + <circle cx="86.5" cy="63" r="4"/> | |
| 19 | + <path d="M138,68c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6 | |
| 20 | + c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,61.3,100,60,98,60v-2 | |
| 21 | + c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6 | |
| 22 | + c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V68z"/> | |
| 23 | + <circle cx="86.5" cy="88" r="4"/> | |
| 24 | + <path d="M138,93c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6 | |
| 25 | + c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,86.3,100,85,98,85v-2 | |
| 26 | + c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6 | |
| 27 | + c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V93z"/> | |
| 28 | + <path d="M151,102H73V24h78V102z M75,100h74V26H75V100z"/> | |
| 29 | + </g> | |
| 30 | + <g id="ic_x5F_add_x0D_"> | |
| 31 | + </g> | |
| 32 | +</g> | |
| 33 | +<g id="Guides"> | |
| 34 | +</g> | |
| 35 | +</svg> | ... | ... |
bower_components/paper-listbox/index.html
0 → 100644
| 1 | +<!doctype html> | |
| 2 | +<!-- | |
| 3 | +@license | |
| 4 | +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
| 5 | +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt | |
| 6 | +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
| 7 | +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt | |
| 8 | +Code distributed by Google as part of the polymer project is also | |
| 9 | +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt | |
| 10 | +--> | |
| 11 | +<html> | |
| 12 | +<head> | |
| 13 | + | |
| 14 | + <meta charset="utf-8"> | |
| 15 | + <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes"> | |
| 16 | + | |
| 17 | + <title>paper-listbox</title> | |
| 18 | + | |
| 19 | + <script src="../webcomponentsjs/webcomponents-lite.js"></script> | |
| 20 | + | |
| 21 | + <link rel="import" href="../polymer/polymer.html"> | |
| 22 | + <link rel="import" href="../iron-component-page/iron-component-page.html"> | |
| 23 | + | |
| 24 | +</head> | |
| 25 | +<body> | |
| 26 | + | |
| 27 | + <iron-component-page></iron-component-page> | |
| 28 | + | |
| 29 | +</body> | |
| 30 | +</html> | ... | ... |
bower_components/paper-listbox/paper-listbox.html
0 → 100644
| 1 | +<!-- | |
| 2 | +@license | |
| 3 | +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
| 4 | +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt | |
| 5 | +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
| 6 | +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt | |
| 7 | +Code distributed by Google as part of the polymer project is also | |
| 8 | +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt | |
| 9 | +--> | |
| 10 | + | |
| 11 | +<link rel="import" href="../polymer/polymer.html"> | |
| 12 | +<link rel="import" href="../iron-menu-behavior/iron-menu-behavior.html"> | |
| 13 | +<link rel="import" href="../paper-styles/default-theme.html"> | |
| 14 | + | |
| 15 | +<!-- | |
| 16 | +Material design: [Menus](https://www.google.com/design/spec/components/menus.html) | |
| 17 | + | |
| 18 | +`<paper-listbox>` implements an accessible listbox control with Material Design styling. The focused item | |
| 19 | +is highlighted, and the selected item has bolded text. | |
| 20 | + | |
| 21 | + <paper-listbox> | |
| 22 | + <paper-item>Item 1</paper-item> | |
| 23 | + <paper-item>Item 2</paper-item> | |
| 24 | + </paper-listbox> | |
| 25 | + | |
| 26 | +An initial selection can be specified with the `selected` attribute. | |
| 27 | + | |
| 28 | + <paper-listbox selected="0"> | |
| 29 | + <paper-item>Item 1</paper-item> | |
| 30 | + <paper-item>Item 2</paper-item> | |
| 31 | + </paper-listbox> | |
| 32 | + | |
| 33 | +Make a multi-select listbox with the `multi` attribute. Items in a multi-select listbox can be deselected, | |
| 34 | +and multiple item can be selected. | |
| 35 | + | |
| 36 | + <paper-listbox multi> | |
| 37 | + <paper-item>Item 1</paper-item> | |
| 38 | + <paper-item>Item 2</paper-item> | |
| 39 | + </paper-listbox> | |
| 40 | + | |
| 41 | +### Styling | |
| 42 | + | |
| 43 | +The following custom properties and mixins are available for styling: | |
| 44 | + | |
| 45 | +Custom property | Description | Default | |
| 46 | +----------------|-------------|---------- | |
| 47 | +`--paper-listbox-background-color` | Menu background color | `--primary-background-color` | |
| 48 | +`--paper-listbox-color` | Menu foreground color | `--primary-text-color` | |
| 49 | +`--paper-listbox` | Mixin applied to the listbox | `{}` | |
| 50 | + | |
| 51 | +### Accessibility | |
| 52 | + | |
| 53 | +`<paper-listbox>` has `role="listbox"` by default. A multi-select listbox will also have | |
| 54 | +`aria-multiselectable` set. It implements key bindings to navigate through the listbox with the up and | |
| 55 | +down arrow keys, esc to exit the listbox, and enter to activate a listbox item. Typing the first letter | |
| 56 | +of a listbox item will also focus it. | |
| 57 | + | |
| 58 | +@group Paper Elements | |
| 59 | +@element paper-listbox | |
| 60 | +@hero hero.svg | |
| 61 | +@demo demo/index.html | |
| 62 | +--> | |
| 63 | + | |
| 64 | +<dom-module id="paper-listbox"> | |
| 65 | + <template> | |
| 66 | + <style> | |
| 67 | + :host { | |
| 68 | + display: block; | |
| 69 | + padding: 8px 0; | |
| 70 | + | |
| 71 | + background: var(--paper-listbox-background-color, --primary-background-color); | |
| 72 | + color: var(--paper-listbox-color, --primary-text-color); | |
| 73 | + | |
| 74 | + @apply(--paper-listbox); | |
| 75 | + } | |
| 76 | + </style> | |
| 77 | + | |
| 78 | + <content></content> | |
| 79 | + </template> | |
| 80 | + | |
| 81 | + <script> | |
| 82 | + (function() { | |
| 83 | + Polymer({ | |
| 84 | + is: 'paper-listbox', | |
| 85 | + | |
| 86 | + behaviors: [ | |
| 87 | + Polymer.IronMenuBehavior | |
| 88 | + ], | |
| 89 | + | |
| 90 | + hostAttributes: { | |
| 91 | + role: 'listbox' | |
| 92 | + } | |
| 93 | + }); | |
| 94 | + })(); | |
| 95 | + </script> | |
| 96 | +</dom-module> | ... | ... |
bower_components/paper-listbox/test/index.html
0 → 100644
| 1 | +<!doctype html> | |
| 2 | +<!-- | |
| 3 | +@license | |
| 4 | +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
| 5 | +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt | |
| 6 | +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
| 7 | +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt | |
| 8 | +Code distributed by Google as part of the polymer project is also | |
| 9 | +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt | |
| 10 | +--> | |
| 11 | +<html> | |
| 12 | + <head> | |
| 13 | + | |
| 14 | + <title>paper-listbox tests</title> | |
| 15 | + | |
| 16 | + <meta charset="utf-8"> | |
| 17 | + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| 18 | + <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> | |
| 19 | + | |
| 20 | + <script src="../../web-component-tester/browser.js"></script> | |
| 21 | + | |
| 22 | + </head> | |
| 23 | + <body> | |
| 24 | + | |
| 25 | + <script> | |
| 26 | + | |
| 27 | + WCT.loadSuites([ | |
| 28 | + 'paper-listbox.html' | |
| 29 | + ]); | |
| 30 | + | |
| 31 | + </script> | |
| 32 | + | |
| 33 | + </body> | |
| 34 | +</html> | ... | ... |
bower_components/paper-listbox/test/paper-listbox.html
0 → 100644
| 1 | +<!doctype html> | |
| 2 | +<!-- | |
| 3 | +@license | |
| 4 | +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
| 5 | +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt | |
| 6 | +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
| 7 | +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt | |
| 8 | +Code distributed by Google as part of the polymer project is also | |
| 9 | +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt | |
| 10 | +--> | |
| 11 | +<html> | |
| 12 | + <head> | |
| 13 | + | |
| 14 | + <title>paper-listbox tests</title> | |
| 15 | + | |
| 16 | + <meta charset="utf-8"> | |
| 17 | + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| 18 | + <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> | |
| 19 | + | |
| 20 | + <script src="../../webcomponentsjs/webcomponents-lite.js"></script> | |
| 21 | + <script src="../../web-component-tester/browser.js"></script> | |
| 22 | + | |
| 23 | + <link rel="import" href="../paper-listbox.html"> | |
| 24 | + | |
| 25 | + </head> | |
| 26 | + <body> | |
| 27 | + | |
| 28 | + <test-fixture id="basic"> | |
| 29 | + <template> | |
| 30 | + <paper-listbox selected="0"> | |
| 31 | + <div role="option">item 1</div> | |
| 32 | + <div role="option">item 2</div> | |
| 33 | + <div role="option">item 3</div> | |
| 34 | + </paper-listbox> | |
| 35 | + </template> | |
| 36 | + </test-fixture> | |
| 37 | + | |
| 38 | + <script> | |
| 39 | + | |
| 40 | + suite('<paper-listbox>', function() { | |
| 41 | + var listbox; | |
| 42 | + | |
| 43 | + setup(function() { | |
| 44 | + listbox = fixture('basic'); | |
| 45 | + }); | |
| 46 | + | |
| 47 | + test('selected item has an appropriate className', function(done) { | |
| 48 | + Polymer.Base.async(function() { | |
| 49 | + assert(listbox.selectedItem.classList.contains('iron-selected')); | |
| 50 | + done(); | |
| 51 | + }, 1); | |
| 52 | + }); | |
| 53 | + | |
| 54 | + test('has listbox aria role', function() { | |
| 55 | + assert(listbox.getAttribute('role') === 'listbox'); | |
| 56 | + }); | |
| 57 | + | |
| 58 | + a11ySuite('basic'); | |
| 59 | + }); | |
| 60 | + | |
| 61 | + </script> | |
| 62 | + | |
| 63 | + </body> | |
| 64 | +</html> | ... | ... |
controllets/aggregators-controllet/aggregators-controllet.html
0 → 100755
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> | |
| 4 | +<link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> | |
| 5 | +<link rel="import" href="../../bower_components/paper-item/paper-item.html"> | |
| 6 | + | |
| 7 | +<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html"> | |
| 8 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> | |
| 9 | +<link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> | |
| 10 | + | |
| 11 | +<link rel="import" href="../../bower_components/paper-button/paper-button.html"> | |
| 12 | + | |
| 13 | +<dom-module id="aggregators-controllet"> | |
| 14 | + | |
| 15 | + <template> | |
| 16 | + | |
| 17 | + <style is="custom-style"> | |
| 18 | + | |
| 19 | + #aggregators_container { | |
| 20 | + height: 100%; | |
| 21 | + width: 100%; | |
| 22 | + position: relative; | |
| 23 | + } | |
| 24 | + | |
| 25 | + #aggregators_container * { | |
| 26 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 27 | + font-size: 16px; | |
| 28 | + line-height: 24px; | |
| 29 | + } | |
| 30 | + | |
| 31 | + paper-dropdown-menu { | |
| 32 | + width: 100%; | |
| 33 | + --paper-input-container-focus-color: #2196F3; | |
| 34 | + } | |
| 35 | + | |
| 36 | + :host { | |
| 37 | + --paper-dropdown-menu-icon: { | |
| 38 | + color: #2196F3; | |
| 39 | + }; | |
| 40 | + } | |
| 41 | + | |
| 42 | + paper-item { | |
| 43 | + min-width: 128px; | |
| 44 | + white-space: nowrap; | |
| 45 | + } | |
| 46 | + | |
| 47 | + paper-item.iron-selected { | |
| 48 | + background-color: #2196F3; | |
| 49 | + color: #FFFFFF; | |
| 50 | + } | |
| 51 | + | |
| 52 | + paper-input { | |
| 53 | + width: 100%; | |
| 54 | + --paper-input-container-focus-color: #2196F3; | |
| 55 | + } | |
| 56 | + | |
| 57 | + paper-button { | |
| 58 | + position: absolute; | |
| 59 | + bottom: 0; | |
| 60 | + right: 0; | |
| 61 | + margin: 0 8px 8px 0; | |
| 62 | + height: 48px; | |
| 63 | + padding: 12px; | |
| 64 | + color: #FFFFFF; | |
| 65 | + background: #2196F3; | |
| 66 | + font-weight: 700; | |
| 67 | + | |
| 68 | + min-width: 216px; | |
| 69 | + } | |
| 70 | + | |
| 71 | + paper-button.disabled { | |
| 72 | + background-color: #B6B6B6; | |
| 73 | + } | |
| 74 | + | |
| 75 | + iron-icon[icon=group-work] { | |
| 76 | + height: 32px; | |
| 77 | + width: 32px; | |
| 78 | + color: #FFFFFF; | |
| 79 | + margin-top: -4px; | |
| 80 | + } | |
| 81 | + | |
| 82 | + paper-button:hover { | |
| 83 | + box-shadow: 0px 8px 12px #888; | |
| 84 | + -webkit-box-shadow: 0px 8px 12px #888; | |
| 85 | + -moz-box-shadow: 0px 8px 12px #888; | |
| 86 | + } | |
| 87 | + | |
| 88 | + paper-icon-button { | |
| 89 | + padding: 4px; | |
| 90 | + } | |
| 91 | + | |
| 92 | + paper-icon-button.add { | |
| 93 | + color: #2196F3; | |
| 94 | + --paper-icon-button-ink-color: #2196F3; | |
| 95 | + } | |
| 96 | + | |
| 97 | + paper-icon-button.cancel { | |
| 98 | + color: #F44336; | |
| 99 | + --paper-icon-button-ink-color: #F44336; | |
| 100 | + } | |
| 101 | + | |
| 102 | + #aggregators_container .row { | |
| 103 | + display: flex; | |
| 104 | + height: 60px; | |
| 105 | + width: 100%; | |
| 106 | + } | |
| 107 | + | |
| 108 | + #aggregators_container .ddl_container { | |
| 109 | + display: flex; | |
| 110 | + height: 60px; | |
| 111 | + width: 25%; | |
| 112 | + padding: 0px 8px; | |
| 113 | + } | |
| 114 | + | |
| 115 | + #aggregators_container .add_container { | |
| 116 | + height: 40px; | |
| 117 | + width: 40px; | |
| 118 | + padding: 10px 0px; | |
| 119 | + } | |
| 120 | + | |
| 121 | + #aggregators_container .row2 { | |
| 122 | + display: flex; | |
| 123 | + height: 48px; | |
| 124 | + width: 100%; | |
| 125 | + } | |
| 126 | + | |
| 127 | + #aggregators_container .row2 .highlighted { | |
| 128 | + color: #2196F3; | |
| 129 | + font-weight: 700; | |
| 130 | + } | |
| 131 | + | |
| 132 | + #aggregators_container .aggregator { | |
| 133 | + height: 24px; | |
| 134 | + width: calc(75% - 16px); | |
| 135 | + padding: 12px 8px; | |
| 136 | + } | |
| 137 | + | |
| 138 | + #aggregators_container .remove_container { | |
| 139 | + height: 40px; | |
| 140 | + width: 40px; | |
| 141 | + padding: 4px 8px; | |
| 142 | + } | |
| 143 | + | |
| 144 | + </style> | |
| 145 | + | |
| 146 | + <div id="aggregators_container"> | |
| 147 | + | |
| 148 | + <div class="row"> | |
| 149 | + <div class="ddl_container"> | |
| 150 | + <paper-dropdown-menu id="aggregator_groupby" label="GROUP BY"> | |
| 151 | + <paper-menu id="aggregator_groupby_menu" class="dropdown-content"> | |
| 152 | + <template is="dom-repeat" items={{selectedFields}}> | |
| 153 | + <paper-item id={{index}}>{{item}}</paper-item> | |
| 154 | + </template> | |
| 155 | + </paper-menu> | |
| 156 | + </paper-dropdown-menu> | |
| 157 | + </div> | |
| 158 | + | |
| 159 | + <div class="ddl_container"></div> | |
| 160 | + <div class="ddl_container"></div> | |
| 161 | + | |
| 162 | + <div class="ddl_container"> | |
| 163 | + <div class="add_container"> | |
| 164 | + <paper-icon-button on-click="_addGroupBy" icon="add-circle" class="add"></paper-icon-button> | |
| 165 | + </div> | |
| 166 | + </div> | |
| 167 | + </div> | |
| 168 | + | |
| 169 | + <div class="row"> | |
| 170 | + <div class="ddl_container"> | |
| 171 | + <paper-dropdown-menu id="aggregator_calculate" label="CALCULATE"> | |
| 172 | + <paper-menu id="aggregator_calculate_menu" class="dropdown-content"> | |
| 173 | + <template is="dom-repeat" items={{operations}}> | |
| 174 | + <paper-item id={{index}}>{{_getOperationlName(item)}}</paper-item> | |
| 175 | + </template> | |
| 176 | + </paper-menu> | |
| 177 | + </paper-dropdown-menu> | |
| 178 | + </div> | |
| 179 | + <div class="ddl_container"> | |
| 180 | + <paper-dropdown-menu id="aggregator_field" label="Field"> | |
| 181 | + <paper-menu id="aggregator_field_menu" class="dropdown-content"> | |
| 182 | + <template is="dom-repeat" items={{selectedFields}}> | |
| 183 | + <paper-item id={{index}}>{{item}}</paper-item> | |
| 184 | + </template> | |
| 185 | + </paper-menu> | |
| 186 | + </paper-dropdown-menu> | |
| 187 | + </div> | |
| 188 | + | |
| 189 | + <div class="ddl_container"></div> | |
| 190 | + | |
| 191 | + <div class="ddl_container"> | |
| 192 | + <div class="add_container"> | |
| 193 | + <paper-icon-button on-click="_addCalculate" icon="add-circle" class="add"></paper-icon-button> | |
| 194 | + </div> | |
| 195 | + </div> | |
| 196 | + </div> | |
| 197 | + | |
| 198 | + <template is="dom-repeat" items={{aggregators}}> | |
| 199 | + <div class="row2"> | |
| 200 | + <div class="aggregator"> | |
| 201 | + <span class="highlighted">{{_calculate(item.operation)}} {{_getOperationlName(item.operation)}}</span> {{item.field}} | |
| 202 | + </div> | |
| 203 | + <div class="remove_container"> | |
| 204 | + <paper-icon-button on-click="_deleteAggregator" icon="cancel" class="cancel"></paper-icon-button> | |
| 205 | + </div> | |
| 206 | + </div> | |
| 207 | + </template> | |
| 208 | + | |
| 209 | + <paper-button id="disable_aggregators" raised on-click="_disableAggregators"><iron-icon icon="group-work"></iron-icon> <span id="disable_enable"></span></paper-button> | |
| 210 | + | |
| 211 | + </div> | |
| 212 | + | |
| 213 | + </template> | |
| 214 | + | |
| 215 | + <script> | |
| 216 | + | |
| 217 | + Polymer({ | |
| 218 | + | |
| 219 | + is : 'aggregators-controllet', | |
| 220 | + | |
| 221 | + properties : { | |
| 222 | + | |
| 223 | + fields : { | |
| 224 | + type : Array, | |
| 225 | + value : [] | |
| 226 | + }, | |
| 227 | + | |
| 228 | + selectedFields : { | |
| 229 | + type : Array, | |
| 230 | + value : [] | |
| 231 | + }, | |
| 232 | + | |
| 233 | + operations : { | |
| 234 | + type : Array, | |
| 235 | + value : ["COUNT", "SUM", "MIN", "MAX", "AVG", "FIRST", "LAST"] | |
| 236 | + }, | |
| 237 | + | |
| 238 | + aggregators : { | |
| 239 | + type : Array, | |
| 240 | + value : [] | |
| 241 | + } | |
| 242 | + | |
| 243 | + }, | |
| 244 | + | |
| 245 | + ready : function() { | |
| 246 | + $(this.$.aggregators_container).perfectScrollbar(); | |
| 247 | + }, | |
| 248 | + | |
| 249 | + attached : function() { | |
| 250 | + this._translate(); | |
| 251 | + }, | |
| 252 | + | |
| 253 | + setFields : function(fields) { | |
| 254 | + this.fields = this._copy(fields); | |
| 255 | + }, | |
| 256 | + | |
| 257 | + setSelectedFields : function(selectedFields) { | |
| 258 | + this.selectedFields = this._copy(selectedFields); | |
| 259 | + }, | |
| 260 | + | |
| 261 | + setAggregators : function(aggregators) { | |
| 262 | + if(aggregators && aggregators.length > 0) { | |
| 263 | + this.aggregators = this._copy(aggregators); | |
| 264 | + this._fire(); | |
| 265 | + } | |
| 266 | + }, | |
| 267 | + | |
| 268 | + getAggregators : function() { | |
| 269 | + if(this.aggregators.length > 0 && this.aggregators[0].operation == "GROUP BY") | |
| 270 | + return this.aggregators; | |
| 271 | + return []; | |
| 272 | + }, | |
| 273 | + | |
| 274 | + reset : function() { | |
| 275 | + this.fields = []; | |
| 276 | + this.selectedFields = []; | |
| 277 | + this.aggregators = []; | |
| 278 | + }, | |
| 279 | + | |
| 280 | + _translate : function() { | |
| 281 | + this.$.aggregator_groupby.setAttribute("label", ln["GROUP BY_" + ln["localization"]]); | |
| 282 | + this.$.aggregator_calculate.setAttribute("label", ln["CALCULATE_" + ln["localization"]]); | |
| 283 | + this.$.aggregator_field.setAttribute("label", ln["aggregatorField_" + ln["localization"]]); | |
| 284 | + | |
| 285 | + this.$.disable_enable.innerHTML = ln["disableGroupBy_" + ln["localization"]]; | |
| 286 | + }, | |
| 287 | + | |
| 288 | + _calculate: function(operation) { | |
| 289 | + if(operation.indexOf("GROUP BY") > -1) | |
| 290 | + return ""; | |
| 291 | + return ln["Calculate_" + ln["localization"]] + " "; | |
| 292 | + }, | |
| 293 | + | |
| 294 | + _getOperationlName: function(operation) { | |
| 295 | + return ln[operation + "_" + ln["localization"]]; | |
| 296 | + }, | |
| 297 | + | |
| 298 | + _fire : function() { | |
| 299 | + this.$.disable_enable.innerHTML = ln["disableGroupBy_" + ln["localization"]]; | |
| 300 | + this.$.disable_aggregators.className = this.$.disable_aggregators.className.replace(" disabled", ""); | |
| 301 | + | |
| 302 | + if(this.aggregators.length > 0 && this.aggregators[0].operation == "GROUP BY") | |
| 303 | + this.fire('aggregators-controllet_aggregators', {aggregators: this.aggregators}); | |
| 304 | + else | |
| 305 | + this.fire('aggregators-controllet_aggregators', {aggregators: []}); | |
| 306 | + }, | |
| 307 | + | |
| 308 | + _addGroupBy : function() { | |
| 309 | + if (this.$.aggregator_groupby_menu.selectedItem) { | |
| 310 | + var field = this.$.aggregator_groupby.value; | |
| 311 | + | |
| 312 | + this.aggregators.unshift({"field": field, "operation": "GROUP BY"});//insert as last GB | |
| 313 | + | |
| 314 | + this.$.aggregator_groupby_menu.select(-1); | |
| 315 | + | |
| 316 | + this._fire(); | |
| 317 | + | |
| 318 | + this._renderAggregators(); | |
| 319 | + } | |
| 320 | + }, | |
| 321 | + | |
| 322 | + _addCalculate : function() { | |
| 323 | + if (this.$.aggregator_calculate_menu.selectedItem && this.$.aggregator_field.selectedItem) { | |
| 324 | + var field = this.$.aggregator_field.value; | |
| 325 | + var id = this.$.aggregator_calculate.selectedItem.id; | |
| 326 | + var operation = this.operations[id]; | |
| 327 | + | |
| 328 | + this.aggregators.push({"field": field, "operation": operation}); | |
| 329 | + | |
| 330 | + this.$.aggregator_field_menu.select(-1); | |
| 331 | + this.$.aggregator_calculate_menu.select(-1); | |
| 332 | + | |
| 333 | + this._fire(); | |
| 334 | + | |
| 335 | + this._renderAggregators(); | |
| 336 | + } | |
| 337 | + }, | |
| 338 | + | |
| 339 | + _deleteAggregator : function(e) { | |
| 340 | + var index = e.model.index; | |
| 341 | + | |
| 342 | + this.aggregators.splice(index, 1); | |
| 343 | + | |
| 344 | + this._fire(); | |
| 345 | + | |
| 346 | + this._renderAggregators(); | |
| 347 | + }, | |
| 348 | + | |
| 349 | +// _addAggregator : function() { | |
| 350 | +// if (this.$.aggregator_operation_menu.selectedItem && this.$.aggregator_field.selectedItem) { | |
| 351 | +// var field = this.$.aggregator_field.value; | |
| 352 | +// var id = this.$.aggregator_operation.selectedItem.id; | |
| 353 | +// var operation = this.operations[id]; | |
| 354 | +// | |
| 355 | +// this.aggregators.push({"field": field, "operation": operation}); | |
| 356 | +// | |
| 357 | +// this.$.aggregator_field_menu.select(-1); | |
| 358 | +// this.$.aggregator_operation_menu.select(-1); | |
| 359 | +// | |
| 360 | +// this._fire(); | |
| 361 | +// | |
| 362 | +// this._renderAggregators(); | |
| 363 | +// } | |
| 364 | +// }, | |
| 365 | +// | |
| 366 | +// _deleteAggregator : function(e) { | |
| 367 | +// var index = e.model.index; | |
| 368 | +// | |
| 369 | +// this.aggregators.splice(index, 1); | |
| 370 | +// | |
| 371 | +// this._fire(); | |
| 372 | +// | |
| 373 | +// this._renderAggregators(); | |
| 374 | +// }, | |
| 375 | + | |
| 376 | + _renderAggregators : function() { | |
| 377 | + var aggregators = this._copy(this.aggregators); | |
| 378 | + this.aggregators = []; | |
| 379 | + this.async(function() { | |
| 380 | + this.aggregators = aggregators; | |
| 381 | + }, 0); | |
| 382 | + }, | |
| 383 | + | |
| 384 | + _disableAggregators : function() { | |
| 385 | + var classes = this.$.disable_aggregators.className; | |
| 386 | + if (classes.indexOf("disabled") > -1) { | |
| 387 | + this._fire(); | |
| 388 | + } | |
| 389 | + else { | |
| 390 | + this.$.disable_enable.innerHTML = ln["enableGroupBy_" + ln["localization"]]; | |
| 391 | + this.$.disable_aggregators.className = classes + " disabled"; | |
| 392 | + this.fire('aggregators-controllet_aggregators', {aggregators: []}); | |
| 393 | + } | |
| 394 | + }, | |
| 395 | + | |
| 396 | + _copy : function(o) { | |
| 397 | + var out, v, key; | |
| 398 | + out = Array.isArray(o) ? [] : {}; | |
| 399 | + for (key in o) { | |
| 400 | + v = o[key]; | |
| 401 | + out[key] = (typeof v === "object") ? this._copy(v) : v; | |
| 402 | + } | |
| 403 | + return out; | |
| 404 | + } | |
| 405 | + | |
| 406 | + }); | |
| 407 | + | |
| 408 | + </script> | |
| 409 | + | |
| 410 | +</dom-module> | |
| 0 | 411 | \ No newline at end of file | ... | ... |
controllets/aggregators-controllet/demo/index.html
0 → 100755
| 1 | +<html> | |
| 2 | + | |
| 3 | +<head> | |
| 4 | + <script src="../../shared_js/jquery-1.11.2.min.js"></script> | |
| 5 | + | |
| 6 | + <script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> | |
| 7 | + | |
| 8 | + <link rel="import" href="../aggregators-controllet.html"/> | |
| 9 | + | |
| 10 | + <script src="../../../locales/controllet_ln.js"></script> | |
| 11 | + | |
| 12 | + <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> | |
| 13 | + <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> | |
| 14 | +</head> | |
| 15 | + | |
| 16 | +<body> | |
| 17 | + | |
| 18 | + <style> | |
| 19 | + | |
| 20 | + .container { | |
| 21 | + height: 400px; | |
| 22 | + width: 1200px; | |
| 23 | + /*width: 400px;*/ | |
| 24 | + position: relative; | |
| 25 | + top: 100px; | |
| 26 | + left:300px; | |
| 27 | + } | |
| 28 | + | |
| 29 | + </style> | |
| 30 | + | |
| 31 | + <div class="container"> | |
| 32 | + <aggregators-controllet id="aggregators_controllet"></aggregators-controllet> | |
| 33 | + </div> | |
| 34 | + | |
| 35 | + <script> | |
| 36 | + ln["localization"] = "en"; | |
| 37 | + | |
| 38 | + var fields = ["aaa","bbb", "ccc", "ddd", "eee", "fff"]; | |
| 39 | + var selectedFields = ["ccc","aaa", "eee"]; | |
| 40 | + | |
| 41 | +// var aggregators_controllet = document.getElementById('aggregators_controllet'); | |
| 42 | + | |
| 43 | + aggregators_controllet.setFields(fields); | |
| 44 | + aggregators_controllet.setSelectedFields(selectedFields); | |
| 45 | + | |
| 46 | +// aggregators_controllet.aggregators = [{logicalOperator: "OR"}, {field: "Lat", operation: "<=", value: "16"}, {field: "Long", operation: "!=", value: "32"}, {field: "Sbiricos", operation: "!=", value: "12AAA32+DAO"}]; | |
| 47 | +// filters_controllet.logicalOperator = "or"; | |
| 48 | + | |
| 49 | +// var filters = filters_controllet.getFilters(); | |
| 50 | +// | |
| 51 | +// console.log(filters); | |
| 52 | + | |
| 53 | + </script> | |
| 54 | + | |
| 55 | +</body> | |
| 56 | + | |
| 57 | +</html> | |
| 0 | 58 | \ No newline at end of file | ... | ... |
controllets/data-sevc-controllet/co-datalets-creator-controllet.html
| ... | ... | @@ -41,7 +41,8 @@ |
| 41 | 41 | listeners : { |
| 42 | 42 | 'page-slider-controllet_selected' : '_updateSlider', |
| 43 | 43 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', |
| 44 | - 'filters-controllet_filters': '_allowThirdStep' | |
| 44 | + 'filters-controllet_filters': '_allowThirdStep', | |
| 45 | + 'aggregators-controllet_aggregators': '_allowThirdStep' | |
| 45 | 46 | }, |
| 46 | 47 | |
| 47 | 48 | properties : { |
| ... | ... | @@ -104,13 +105,15 @@ |
| 104 | 105 | |
| 105 | 106 | _allowThirdStep : function(){ |
| 106 | 107 | this.$.slider.chevronRight(false); |
| 107 | - var fields = this.$.select_data.getSelectedFields(); | |
| 108 | + var selectedFields = this.$.select_data.getSelectedFields(); | |
| 108 | 109 | var filters = this.$.select_data.getFilters(); |
| 110 | + var aggregators = this.$.select_data.getAggregators(); | |
| 109 | 111 | var data = this.$.select_data.getData(); |
| 110 | - if(fields.length > 0) { | |
| 112 | + if(selectedFields.length > 0) { | |
| 111 | 113 | this.$.select_visualization.init(); |
| 112 | - this.$.select_visualization.setFields(fields); | |
| 114 | + this.$.select_visualization.setSelectedFields(selectedFields); | |
| 113 | 115 | this.$.select_visualization.setFilters(filters); |
| 116 | + this.$.select_visualization.setAggregators(aggregators); | |
| 114 | 117 | this.$.select_visualization.setData(data); |
| 115 | 118 | this.$.slider.chevronRight(true); |
| 116 | 119 | } | ... | ... |
controllets/data-sevc-controllet/data-sevc-controllet.html
| ... | ... | @@ -50,6 +50,7 @@ |
| 50 | 50 | 'dataset-selection-controllet_data-url' : '_allowSecondStep', |
| 51 | 51 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', |
| 52 | 52 | 'filters-controllet_filters': '_allowThirdStep', |
| 53 | + 'aggregators-controllet_aggregators': '_allowThirdStep', | |
| 53 | 54 | 'data-ready': '_dataReady' |
| 54 | 55 | }, |
| 55 | 56 | |
| ... | ... | @@ -138,13 +139,15 @@ |
| 138 | 139 | |
| 139 | 140 | _allowThirdStep : function(){ |
| 140 | 141 | this.$.slider.chevronRight(false); |
| 141 | - var fields = this.$.select_data.getSelectedFields(); | |
| 142 | + var selectedFields = this.$.select_data.getSelectedFields(); | |
| 142 | 143 | var filters = this.$.select_data.getFilters(); |
| 144 | + var aggregators = this.$.select_data.getAggregators(); | |
| 143 | 145 | var data = this.$.select_data.getData(); |
| 144 | - if(fields.length > 0) { | |
| 146 | + if(selectedFields.length > 0) { | |
| 145 | 147 | this.$.select_visualization.init(); |
| 146 | - this.$.select_visualization.setFields(fields); | |
| 148 | + this.$.select_visualization.setSelectedFields(selectedFields); | |
| 147 | 149 | this.$.select_visualization.setFilters(filters); |
| 150 | + this.$.select_visualization.setAggregators(aggregators); | |
| 148 | 151 | this.$.select_visualization.setData(data); |
| 149 | 152 | this.$.slider.chevronRight(true); |
| 150 | 153 | } | ... | ... |
controllets/datalet-preview-controllet/datalet-preview-controllet.html
0 → 100644
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | + | |
| 5 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html"> | |
| 6 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html"> | |
| 7 | + | |
| 8 | +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"> | |
| 9 | +<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> | |
| 10 | +<link rel="import" href="../../bower_components/neon-animation/neon-animations.html"> | |
| 11 | + | |
| 12 | +<dom-module id="datalet-preview-controllet"> | |
| 13 | + | |
| 14 | + <template> | |
| 15 | + | |
| 16 | + <style is="custom-style"> | |
| 17 | + #preview_container { | |
| 18 | + height: 100%; | |
| 19 | + width: 100%; | |
| 20 | + } | |
| 21 | + | |
| 22 | + #preview_container * { | |
| 23 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 24 | + font-size: 16px; | |
| 25 | + line-height: 24px; | |
| 26 | + } | |
| 27 | + | |
| 28 | + #preview_container #neon_container { | |
| 29 | + height: calc(100% - 48px); | |
| 30 | + width: 100%; | |
| 31 | + } | |
| 32 | + | |
| 33 | + #preview_container #preview, #preview_container #info { | |
| 34 | + position: relative; | |
| 35 | + height: calc(100% - 32px); | |
| 36 | + width: calc(100% - 32px); | |
| 37 | + padding: 16px; | |
| 38 | + } | |
| 39 | + | |
| 40 | + #preview_container #info_container { | |
| 41 | + display: flex; | |
| 42 | + flex-direction: row; | |
| 43 | + } | |
| 44 | + | |
| 45 | + #preview_container #datalet_img{ | |
| 46 | + min-height: 124px; | |
| 47 | + width: 124px; | |
| 48 | + position:relative; | |
| 49 | + } | |
| 50 | + | |
| 51 | + #preview_container img{ | |
| 52 | + max-width: 124px; | |
| 53 | + position: absolute; | |
| 54 | + top: 0; | |
| 55 | + bottom: 0; | |
| 56 | + margin: auto; | |
| 57 | + } | |
| 58 | + | |
| 59 | + #preview_container #datalet_base_info { | |
| 60 | + width: calc(100% - 124px - 16px); | |
| 61 | + margin-left: 16px; | |
| 62 | + } | |
| 63 | + | |
| 64 | + #preview_container #datalet_name{ | |
| 65 | + font-size: 32px; | |
| 66 | + line-height: 48px; | |
| 67 | + color: #2196F3; | |
| 68 | + } | |
| 69 | + | |
| 70 | + #preview_container #datalet_description{ | |
| 71 | + } | |
| 72 | + | |
| 73 | + #preview_container #datalet_inputs{ | |
| 74 | + margin-top: 16px; | |
| 75 | + } | |
| 76 | + | |
| 77 | + #preview_container .input_label { | |
| 78 | + color: #2196F3; | |
| 79 | + font-weight: 700; | |
| 80 | + } | |
| 81 | + | |
| 82 | + #preview_container ul { | |
| 83 | + list-style-type: disc; | |
| 84 | + } | |
| 85 | + | |
| 86 | + #preview_container li { | |
| 87 | + font-weight: 700; | |
| 88 | + } | |
| 89 | + | |
| 90 | + paper-tabs { | |
| 91 | + background: #B6B6B6; | |
| 92 | + /*--paper-tabs-selection-bar-color: #00BCD4;*/ | |
| 93 | + } | |
| 94 | + | |
| 95 | + paper-tab { | |
| 96 | + font-weight: 700; | |
| 97 | + border-right: 2px solid #FFFFFF; | |
| 98 | + /*--paper-tab-ink: #2196F3;*/ | |
| 99 | + } | |
| 100 | + | |
| 101 | + paper-tab:nth-child(2) { | |
| 102 | + border-right: 0; | |
| 103 | + } | |
| 104 | + | |
| 105 | + paper-tab.iron-selected { | |
| 106 | + color: #FFFFFF; | |
| 107 | + background: #2196F3;; | |
| 108 | + } | |
| 109 | + | |
| 110 | + paper-tab:not(.iron-selected):hover { | |
| 111 | + color: #2196F3; | |
| 112 | + } | |
| 113 | + | |
| 114 | + </style> | |
| 115 | + | |
| 116 | + <paper-material id="preview_container" elevation="5"> | |
| 117 | + | |
| 118 | + <paper-tabs selected="{{tabIndex}}" no-bar> | |
| 119 | + <paper-tab noink><span id="previewTab"></span></paper-tab> | |
| 120 | + <paper-tab noink><span id="infoTab"></span></paper-tab> | |
| 121 | + </paper-tabs> | |
| 122 | + | |
| 123 | + <neon-animated-pages id="neon_container" selected="{{_getNeonIndex(tabIndex)}}" entry-animation="fade-in-animation" exit-animation="fade-out-animation"> | |
| 124 | + | |
| 125 | + <neon-animatable> | |
| 126 | + <div id="preview"> | |
| 127 | + | |
| 128 | + </div> | |
| 129 | + </neon-animatable> | |
| 130 | + | |
| 131 | + <neon-animatable> | |
| 132 | + <div id="info"> | |
| 133 | + <div id="info_container"> | |
| 134 | + <div id="datalet_img"> | |
| 135 | + <img src="{{dataletImg}}"> | |
| 136 | + </div> | |
| 137 | + <div id="datalet_base_info"> | |
| 138 | + <div id="datalet_name"> | |
| 139 | + {{dataletName}} | |
| 140 | + </div> | |
| 141 | + <div id="datalet_description"> | |
| 142 | + {{dataletDescription}} | |
| 143 | + </div> | |
| 144 | + </div> | |
| 145 | + </div> | |
| 146 | + <div id="datalet_inputs"> | |
| 147 | + <span id="inputs" class="input_label"></span> | |
| 148 | + <ul> | |
| 149 | + <template is="dom-repeat" items="{{inputs}}"> | |
| 150 | + <li>{{_getInputName(item.name)}}</li> | |
| 151 | + {{_getInputDescription(item.name)}} | |
| 152 | + </template> | |
| 153 | + </ul> | |
| 154 | + <span id="options" class="input_label"></span> | |
| 155 | + <ul> | |
| 156 | + <template is="dom-repeat" items="{{options}}"> | |
| 157 | + <li>{{_getInputName(item.name)}}</li> | |
| 158 | + {{_getInputDescription(item.name)}} | |
| 159 | + </template> | |
| 160 | + </ul> | |
| 161 | + </div> | |
| 162 | + </div> | |
| 163 | + </neon-animatable> | |
| 164 | + | |
| 165 | + </neon-animated-pages> | |
| 166 | + | |
| 167 | + </paper-material> | |
| 168 | + | |
| 169 | + </template> | |
| 170 | + | |
| 171 | + <script> | |
| 172 | + | |
| 173 | + Polymer({ | |
| 174 | + | |
| 175 | + is : 'datalet-preview-controllet', | |
| 176 | + | |
| 177 | + properties : { | |
| 178 | + | |
| 179 | + deepUrl : { | |
| 180 | + type : String, | |
| 181 | + value : undefined | |
| 182 | + }, | |
| 183 | + | |
| 184 | + tabIndex: { | |
| 185 | + type: Number, | |
| 186 | + value: 0 | |
| 187 | + } | |
| 188 | + | |
| 189 | + }, | |
| 190 | + | |
| 191 | + ready : function() { | |
| 192 | + $(this.$.preview).perfectScrollbar(); | |
| 193 | + $(this.$.info).perfectScrollbar(); | |
| 194 | + }, | |
| 195 | + | |
| 196 | + attached : function() { | |
| 197 | + this._translate(); | |
| 198 | + }, | |
| 199 | + | |
| 200 | + _translate : function(){ | |
| 201 | + this.$.previewTab.innerHTML = ln["previewTab_" + ln["localization"]]; | |
| 202 | + this.$.infoTab.innerHTML = ln["infoTab_" + ln["localization"]]; | |
| 203 | + }, | |
| 204 | + | |
| 205 | + loadDatalet : function(dataletParams){ | |
| 206 | + this._setTabindex(0); | |
| 207 | + | |
| 208 | + dataletParams.placeHolder = this.$.preview; | |
| 209 | + | |
| 210 | + ComponentService.deep_url = this.deepUrl; | |
| 211 | + ComponentService.getComponent(dataletParams); | |
| 212 | + }, | |
| 213 | + | |
| 214 | + eraseDatalet : function(){ | |
| 215 | + this.$.preview.innerHTML = ""; | |
| 216 | + }, | |
| 217 | + | |
| 218 | + loadInfo : function(selectedDatalet){ | |
| 219 | + this._setTabindex(1); | |
| 220 | + | |
| 221 | + this.dataletImg = (selectedDatalet.bridge_link + selectedDatalet.component_link).replace("html", "png"); | |
| 222 | + this.dataletName = this._getChartName(selectedDatalet.name.replace("-datalet", "")); | |
| 223 | + this.dataletDescription = this._getChartName(selectedDatalet.name.replace("-datalet", "Description")); | |
| 224 | + | |
| 225 | + var inputs = selectedDatalet.idm.inputs.input; | |
| 226 | + var options = []; | |
| 227 | + if(selectedDatalet.idm.inputs.layouts) | |
| 228 | + options = selectedDatalet.idm.inputs.layouts.input; | |
| 229 | + | |
| 230 | + if(!(inputs instanceof Array)) | |
| 231 | + inputs = [inputs]; | |
| 232 | + | |
| 233 | + if(!(options instanceof Array)) | |
| 234 | + options = [options]; | |
| 235 | + | |
| 236 | + this.inputs = inputs; | |
| 237 | + this.options = options; | |
| 238 | + | |
| 239 | + this.$.inputs.innerHTML = ln["inputs_" + ln["localization"]]; | |
| 240 | + if(this.options.length > 0) | |
| 241 | + this.$.options.innerHTML = ln["options_" + ln["localization"]]; | |
| 242 | + else | |
| 243 | + this.$.options.innerHTML = ""; | |
| 244 | + }, | |
| 245 | + | |
| 246 | + eraseInfo : function(){ | |
| 247 | + this.dataletImg = ""; | |
| 248 | + this.dataletName = ""; | |
| 249 | + this.dataletDescription = ""; | |
| 250 | + | |
| 251 | + this.inputs = []; | |
| 252 | + this.options = []; | |
| 253 | + | |
| 254 | + this.$.inputs.innerHTML = ""; | |
| 255 | + this.$.options.innerHTML = ""; | |
| 256 | + }, | |
| 257 | + | |
| 258 | + _getChartName: function(key) { | |
| 259 | + return ln[key + "_" +ln["localization"]]; | |
| 260 | + }, | |
| 261 | + | |
| 262 | +// _getInputRichName : function(item) { | |
| 263 | +// var name = ln[item.name + "_" +ln["localization"]]; | |
| 264 | +// if(item.type != "TEXT") | |
| 265 | +// name += " [" + item.type + "]"; | |
| 266 | +// if(item.selection == "?") | |
| 267 | +// name += " [OPT]"; | |
| 268 | +// return name; | |
| 269 | +// }, | |
| 270 | + | |
| 271 | + _getInputName : function(name) { | |
| 272 | + return ln[name + "_" +ln["localization"]]; | |
| 273 | + }, | |
| 274 | + | |
| 275 | + _getInputDescription : function(name) { | |
| 276 | + return ln[name + "Description_" +ln["localization"]]; | |
| 277 | + }, | |
| 278 | + | |
| 279 | + _setTabindex : function(tabIndex) { | |
| 280 | + this.debounce('_filter', function () { | |
| 281 | + this.tabIndex = -1; | |
| 282 | + this.tabIndex = tabIndex; | |
| 283 | + }, 0); | |
| 284 | + }, | |
| 285 | + | |
| 286 | + _getNeonIndex : function(tabIndex){ | |
| 287 | + if(tabIndex == -1) | |
| 288 | + return 0; | |
| 289 | + return tabIndex; | |
| 290 | + } | |
| 291 | + | |
| 292 | + }); | |
| 293 | + | |
| 294 | + </script> | |
| 295 | + | |
| 296 | +</dom-module> | |
| 0 | 297 | \ No newline at end of file | ... | ... |
controllets/datalet-preview-controllet/index/index.html
0 → 100644
controllets/datalets-modifier-controllet/datalets-modifier-controllet.html
| ... | ... | @@ -42,6 +42,7 @@ |
| 42 | 42 | 'page-slider-controllet_selected' : '_updateSlider', |
| 43 | 43 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', |
| 44 | 44 | 'filters-controllet_filters': '_allowThirdStep', |
| 45 | + 'aggregators-controllet_aggregators': '_allowThirdStep', | |
| 45 | 46 | 'data-ready': '_preselect' |
| 46 | 47 | }, |
| 47 | 48 | |
| ... | ... | @@ -96,6 +97,8 @@ |
| 96 | 97 | _preselect : function(){ |
| 97 | 98 | this.$.select_data.setSelectedFields(this.selectedFields); |
| 98 | 99 | this.$.select_data.setFilters(JSON.parse(this.dataletPreset["filters"])); |
| 100 | + this.$.select_data.setAggregators(JSON.parse(this.dataletPreset["aggregators"])); | |
| 101 | +// this.$.select_visualization.preselect(); | |
| 99 | 102 | }, |
| 100 | 103 | |
| 101 | 104 | _updateSlider : function(e){ |
| ... | ... | @@ -114,23 +117,27 @@ |
| 114 | 117 | |
| 115 | 118 | this.$.slider.chevronLeft(true); |
| 116 | 119 | this.$.slider.chevronRight("invisible"); |
| 117 | - | |
| 118 | - /**/this.$.select_visualization.show();//resize | |
| 120 | + | |
| 121 | + this.$.select_visualization.preselect(); | |
| 119 | 122 | } |
| 120 | 123 | }, |
| 121 | 124 | |
| 122 | 125 | _allowThirdStep : function(){ |
| 123 | - this.$.slider.chevronRight(false); | |
| 124 | - var fields = this.$.select_data.getSelectedFields(); | |
| 125 | - var filters = this.$.select_data.getFilters(); | |
| 126 | - var data = this.$.select_data.getData(); | |
| 127 | - if(fields.length > 0) { | |
| 128 | - this.$.select_visualization.init(); | |
| 129 | - this.$.select_visualization.setFields(fields); | |
| 130 | - this.$.select_visualization.setFilters(filters); | |
| 131 | - this.$.select_visualization.setData(data); | |
| 132 | - this.$.slider.chevronRight(true); | |
| 133 | - } | |
| 126 | +// this.debounce('_allowThirdStep', function () { console.log("_allowThirdStep"); | |
| 127 | + this.$.slider.chevronRight(false); | |
| 128 | + var selectedFields = this.$.select_data.getSelectedFields(); | |
| 129 | + var filters = this.$.select_data.getFilters(); | |
| 130 | + var aggregators = this.$.select_data.getAggregators(); | |
| 131 | + var data = this.$.select_data.getData(); | |
| 132 | + if(selectedFields.length > 0) { | |
| 133 | + this.$.select_visualization.init(); | |
| 134 | + this.$.select_visualization.setSelectedFields(selectedFields); | |
| 135 | + this.$.select_visualization.setFilters(filters); | |
| 136 | + this.$.select_visualization.setAggregators(aggregators); | |
| 137 | + this.$.select_visualization.setData(data); | |
| 138 | + this.$.slider.chevronRight(true); | |
| 139 | + } | |
| 140 | +// }, 300); | |
| 134 | 141 | } |
| 135 | 142 | |
| 136 | 143 | }); | ... | ... |
controllets/expert-query-controllet/demo/index.html
0 → 100755
| 1 | +<html> | |
| 2 | + | |
| 3 | +<head> | |
| 4 | + <script src="../../shared_js/jquery-1.11.2.min.js"></script> | |
| 5 | + | |
| 6 | + <script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> | |
| 7 | + | |
| 8 | + <link rel="import" href="../expert-query-controllet.html"/> | |
| 9 | + | |
| 10 | + <script src="../../../locales/controllet_ln.js"></script> | |
| 11 | + | |
| 12 | + <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> | |
| 13 | + <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> | |
| 14 | +</head> | |
| 15 | + | |
| 16 | +<body> | |
| 17 | + | |
| 18 | + <style> | |
| 19 | + | |
| 20 | + .container { | |
| 21 | + height: 400px; | |
| 22 | + width: 1200px; | |
| 23 | + position: relative; | |
| 24 | + top: 100px; | |
| 25 | + left:300px; | |
| 26 | + } | |
| 27 | + | |
| 28 | + </style> | |
| 29 | + | |
| 30 | + <div class="container"> | |
| 31 | + <expert-query-controllet id="query"></expert-query-controllet> | |
| 32 | + </div> | |
| 33 | + | |
| 34 | + <script> | |
| 35 | + ln["localization"] = "en"; | |
| 36 | + | |
| 37 | + var fields = ["aaa","bbb", "ccc", "ddd", "eee", "fff"]; | |
| 38 | + var selectedFields = ["ccc","aaa", "eee"]; | |
| 39 | + | |
| 40 | +// query.setFields(fields); | |
| 41 | +// query.setSelectedFields(selectedFields); | |
| 42 | + </script> | |
| 43 | + | |
| 44 | +</body> | |
| 45 | + | |
| 46 | +</html> | |
| 0 | 47 | \ No newline at end of file | ... | ... |
controllets/expert-query-controllet/expert-query-controllet.html
0 → 100755
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | + | |
| 5 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html"> | |
| 6 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html"> | |
| 7 | + | |
| 8 | +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"> | |
| 9 | +<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> | |
| 10 | +<link rel="import" href="../../bower_components/neon-animation/neon-animations.html"> | |
| 11 | + | |
| 12 | +<link rel="import" href="../../bower_components/paper-tooltip/paper-tooltip.html"> | |
| 13 | + | |
| 14 | +<link rel="import" href="../filters-controllet/filters-controllet.html" /> | |
| 15 | +<link rel="import" href="../aggregators-controllet/aggregators-controllet.html" /> | |
| 16 | + | |
| 17 | +<script type="text/javascript" src="../../alasql-utility/alasql.min.js"></script> | |
| 18 | +<script type="text/javascript" src="../../alasql-utility/alasql-utility.js"></script> | |
| 19 | + | |
| 20 | +<dom-module id="expert-query-controllet"> | |
| 21 | + | |
| 22 | + <template> | |
| 23 | + | |
| 24 | + <style is="custom-style"> | |
| 25 | + | |
| 26 | + #expert_container { | |
| 27 | + display: none; | |
| 28 | + height: 100%; | |
| 29 | + width: 100%; | |
| 30 | + } | |
| 31 | + | |
| 32 | + #expert_container * { | |
| 33 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 34 | + font-size: 16px; | |
| 35 | + line-height: 24px; | |
| 36 | + } | |
| 37 | + | |
| 38 | + #expert_container #neon_container { | |
| 39 | + height: calc(100% - 48px); | |
| 40 | + width: 100%; | |
| 41 | + } | |
| 42 | + | |
| 43 | + #header_open { | |
| 44 | + display: flex; | |
| 45 | + /*background: #B6B6B6;*/ | |
| 46 | + /*border: 1px solid #b6b6b6;*/ | |
| 47 | + /*height: 46px;*/ | |
| 48 | + } | |
| 49 | + | |
| 50 | + #expert_container paper-tabs { | |
| 51 | + /*height: 46px;*/ | |
| 52 | + width: calc(100% - 48px); | |
| 53 | + } | |
| 54 | + | |
| 55 | + #expert_container #query_container { | |
| 56 | + padding: 28px 8px 0px 8px; | |
| 57 | + } | |
| 58 | + | |
| 59 | + #expert_container_close { | |
| 60 | + height: 48px; | |
| 61 | + width: 100%; | |
| 62 | + | |
| 63 | + display: flex; | |
| 64 | + } | |
| 65 | + | |
| 66 | + #expert_container_close * { | |
| 67 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 68 | + font-size: 16px; | |
| 69 | + line-height: 24px; | |
| 70 | + } | |
| 71 | + | |
| 72 | + #expert_container_close #header_close { | |
| 73 | + height: 24px; | |
| 74 | + width: calc(100% - 384px); | |
| 75 | + padding: 12px 0px; | |
| 76 | + text-align: center; | |
| 77 | + font-weight: 700; | |
| 78 | + | |
| 79 | + color: #00BCD4; | |
| 80 | + background: #FFFFFF; | |
| 81 | + cursor: pointer; | |
| 82 | + } | |
| 83 | + | |
| 84 | + #expert_container_close #space { | |
| 85 | + width: 192px; | |
| 86 | + } | |
| 87 | + | |
| 88 | + paper-tooltip { | |
| 89 | + --paper-tooltip-background: black; | |
| 90 | + } | |
| 91 | + | |
| 92 | + paper-tooltip p { | |
| 93 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 94 | + font-size: 16px; | |
| 95 | + line-height: 24px; | |
| 96 | + | |
| 97 | + margin: 0; | |
| 98 | + padding: 0; | |
| 99 | + } | |
| 100 | + | |
| 101 | + paper-icon-button { | |
| 102 | + height: 48px; | |
| 103 | + width: 48px; | |
| 104 | + padding: 8px; | |
| 105 | + color: #2196F3; | |
| 106 | + --paper-icon-button-ink-color: #2196F3; | |
| 107 | + } | |
| 108 | + | |
| 109 | + paper-icon-button.disabled{ | |
| 110 | + color: #B6B6B6; | |
| 111 | + } | |
| 112 | + | |
| 113 | + paper-icon-button[icon=fullscreen], | |
| 114 | + paper-icon-button[icon=fullscreen-exit] { | |
| 115 | + height: 48px; | |
| 116 | + width: 48px; | |
| 117 | + padding: 8px; | |
| 118 | + color: #00BCD4; | |
| 119 | + --paper-icon-button-ink-color: #00BCD4; | |
| 120 | + } | |
| 121 | + | |
| 122 | + paper-icon-button[icon=fullscreen] { | |
| 123 | + margin-left: 48px; | |
| 124 | + } | |
| 125 | + | |
| 126 | + paper-tabs { | |
| 127 | + background: #B6B6B6; | |
| 128 | + /*--paper-tabs-selection-bar-color: #00BCD4;*/ | |
| 129 | + } | |
| 130 | + | |
| 131 | + paper-tab { | |
| 132 | + font-weight: 700; | |
| 133 | + border-right: 2px solid #FFFFFF; | |
| 134 | + /*--paper-tab-ink: #2196F3;*/ | |
| 135 | + } | |
| 136 | + | |
| 137 | + paper-tab:nth-child(3) { | |
| 138 | + border-right: 0; | |
| 139 | + } | |
| 140 | + | |
| 141 | + paper-tab.iron-selected { | |
| 142 | + color: #FFFFFF; | |
| 143 | + background: #2196F3;; | |
| 144 | + } | |
| 145 | + | |
| 146 | + paper-tab:not(.iron-selected):hover { | |
| 147 | + color: #2196F3; | |
| 148 | + } | |
| 149 | + | |
| 150 | + </style> | |
| 151 | + | |
| 152 | + <paper-material id="expert_container_close" elevation="5"> | |
| 153 | + <div id="space"></div> | |
| 154 | + | |
| 155 | + <div id="header_close" on-click="_fullscreen"><span id="expert"></span></div> | |
| 156 | + | |
| 157 | + <paper-icon-button id="disable_filters" class=" disabled" icon="filter-list" on-click="_disableFilters"></paper-icon-button> | |
| 158 | + <paper-icon-button id="disable_aggregators" class=" disabled" icon="group-work" on-click="_disableAggregators"></paper-icon-button> | |
| 159 | + <paper-icon-button icon="fullscreen" on-click="_fullscreen"></paper-icon-button> | |
| 160 | + </paper-material> | |
| 161 | + | |
| 162 | + <paper-tooltip for="disable_filters" offset="12" position="top"><p><span id="tooltip_filters"></span></p></paper-tooltip> | |
| 163 | + <paper-tooltip for="disable_aggregators" offset="12" position="top"><p><span id="tooltip_aggregators"></span></p></paper-tooltip> | |
| 164 | + | |
| 165 | + <paper-material id="expert_container" elevation="5"> | |
| 166 | + | |
| 167 | + <div id="header_open"> | |
| 168 | + <paper-tabs selected="{{tabIndex}}" no-bar> | |
| 169 | + <paper-tab noink><span id="filtersTab"></span></paper-tab> | |
| 170 | + <paper-tab noink><span id="groupByTab"></span></paper-tab> | |
| 171 | + <paper-tab noink><span id="queryTab"></span></paper-tab> | |
| 172 | + </paper-tabs> | |
| 173 | + | |
| 174 | + <paper-icon-button icon="fullscreen-exit" on-click="_fullscreenExit"></paper-icon-button> | |
| 175 | + </div> | |
| 176 | + | |
| 177 | + <neon-animated-pages id="neon_container" selected="{{tabIndex}}" entry-animation="fade-in-animation" exit-animation="fade-out-animation"> | |
| 178 | + | |
| 179 | + <neon-animatable> | |
| 180 | + <filters-controllet id="filters"></filters-controllet> | |
| 181 | + </neon-animatable> | |
| 182 | + | |
| 183 | + <neon-animatable> | |
| 184 | + <aggregators-controllet id="aggregators"></aggregators-controllet> | |
| 185 | + </neon-animatable> | |
| 186 | + | |
| 187 | + <neon-animatable> | |
| 188 | + <div id="query_container"></div> | |
| 189 | + </neon-animatable> | |
| 190 | + | |
| 191 | + </neon-animated-pages> | |
| 192 | + | |
| 193 | + | |
| 194 | + </paper-material> | |
| 195 | + | |
| 196 | + </template> | |
| 197 | + | |
| 198 | + <script> | |
| 199 | + | |
| 200 | + Polymer({ | |
| 201 | + | |
| 202 | + is : 'expert-query-controllet', | |
| 203 | + | |
| 204 | + properties : { | |
| 205 | + | |
| 206 | + tabIndex: { | |
| 207 | + type: Number, | |
| 208 | + value: -1 | |
| 209 | + }, | |
| 210 | + | |
| 211 | + fields : { | |
| 212 | + type : Array, | |
| 213 | + value : [] | |
| 214 | + }, | |
| 215 | + | |
| 216 | + selectedFields : { | |
| 217 | + type : Array, | |
| 218 | + value : [] | |
| 219 | + }, | |
| 220 | + | |
| 221 | + filters : { | |
| 222 | + type : Array, | |
| 223 | + value : [] | |
| 224 | + }, | |
| 225 | + | |
| 226 | + aggregators : { | |
| 227 | + type : Array, | |
| 228 | + value : [] | |
| 229 | + } | |
| 230 | + | |
| 231 | + }, | |
| 232 | + | |
| 233 | + listeners: { | |
| 234 | + 'filters-controllet_filters': '_updateFilters', | |
| 235 | + 'aggregators-controllet_aggregators': '_updateAggregators' | |
| 236 | + }, | |
| 237 | + | |
| 238 | + ready : function() { | |
| 239 | + }, | |
| 240 | + | |
| 241 | + attached : function() { | |
| 242 | + this._translate(); | |
| 243 | + }, | |
| 244 | + | |
| 245 | + setFields : function(fields) { | |
| 246 | + this.fields = fields; | |
| 247 | + | |
| 248 | + this.$.filters.setFields(fields); | |
| 249 | + this.$.aggregators.setFields(fields); | |
| 250 | + }, | |
| 251 | + | |
| 252 | + setSelectedFields : function(selectedFields) { | |
| 253 | + this.selectedFields = selectedFields; | |
| 254 | + | |
| 255 | + this.$.filters.setSelectedFields(selectedFields); | |
| 256 | + this.$.aggregators.setSelectedFields(selectedFields); | |
| 257 | + | |
| 258 | + this._updateQuery(); | |
| 259 | + }, | |
| 260 | + | |
| 261 | + setFilters : function(filters) { | |
| 262 | + this.async(function() { | |
| 263 | + this.$.filters.setFilters(filters); | |
| 264 | + }, 0); | |
| 265 | + }, | |
| 266 | + | |
| 267 | + setAggregators : function(aggregators) { | |
| 268 | + this.async(function() { | |
| 269 | + this.$.aggregators.setAggregators(aggregators); | |
| 270 | + }, 0); | |
| 271 | + }, | |
| 272 | + | |
| 273 | + reset : function() { | |
| 274 | + this.$.filters.reset(); | |
| 275 | + this.$.aggregators.reset(); | |
| 276 | + this.fields = []; | |
| 277 | + this.selectedFields = []; | |
| 278 | + this.filters = []; | |
| 279 | + this.aggregators = []; | |
| 280 | +// this.query = ""; | |
| 281 | + }, | |
| 282 | + | |
| 283 | + _translate : function() { | |
| 284 | + this.$.expert.innerHTML = ln["expert_" + ln["localization"]]; | |
| 285 | + this.$.filtersTab.innerHTML = ln["filters_" + ln["localization"]]; | |
| 286 | + this.$.groupByTab.innerHTML = ln["groupBy_" + ln["localization"]]; | |
| 287 | + this.$.queryTab.innerHTML = ln["query_" + ln["localization"]]; | |
| 288 | + this.$.tooltip_filters.innerHTML = ln["enableFilters_" + ln["localization"]]; | |
| 289 | + this.$.tooltip_aggregators.innerHTML = ln["enableGroupBy_" + ln["localization"]]; | |
| 290 | + }, | |
| 291 | + | |
| 292 | + _fullscreen : function() { | |
| 293 | + this.$.expert_container_close.style.display = "none"; | |
| 294 | + this.$.expert_container.style.display = "block"; | |
| 295 | + | |
| 296 | + if(this.tabIndex == -1) | |
| 297 | + this.tabIndex = 0; | |
| 298 | + | |
| 299 | + this.fire('expert-controllet_show', {show: true}); | |
| 300 | + }, | |
| 301 | + | |
| 302 | + _fullscreenExit : function() { | |
| 303 | + this.$.expert_container_close.style.display = "flex"; | |
| 304 | + this.$.expert_container.style.display = "none"; | |
| 305 | + | |
| 306 | + this.fire('expert-controllet_show', {show: false}); | |
| 307 | + }, | |
| 308 | + | |
| 309 | + _updateFilters : function(e) { | |
| 310 | + this.filters = e.detail.filters; | |
| 311 | + this._updateQuery(); | |
| 312 | + this._disableFiltersIcon(e.detail.filters); | |
| 313 | + }, | |
| 314 | + | |
| 315 | + _disableFilters : function() { | |
| 316 | + this.$.filters._disableFilters(); | |
| 317 | + }, | |
| 318 | + | |
| 319 | + _disableFiltersIcon : function(filters) { | |
| 320 | + var classes = this.$.disable_filters.className; | |
| 321 | + if (filters.length > 1) { | |
| 322 | + this.$.disable_filters.className = classes.replace(" disabled", ""); | |
| 323 | + this.$.tooltip_filters.innerHTML = ln["disableFilters_" + ln["localization"]]; | |
| 324 | + } | |
| 325 | + else if (classes.indexOf("disabled") == -1) { | |
| 326 | + this.$.disable_filters.className = classes + " disabled"; | |
| 327 | + this.$.tooltip_filters.innerHTML = ln["enableFilters_" + ln["localization"]]; | |
| 328 | + } | |
| 329 | + }, | |
| 330 | + | |
| 331 | + _updateAggregators : function(e) { | |
| 332 | + this.aggregators = e.detail.aggregators; | |
| 333 | + this._updateQuery(); | |
| 334 | + this._disableAggregatorsIcon(e.detail.aggregators); | |
| 335 | + }, | |
| 336 | + | |
| 337 | + _disableAggregators : function() { | |
| 338 | + this.$.aggregators._disableAggregators(); | |
| 339 | + }, | |
| 340 | + | |
| 341 | + _disableAggregatorsIcon : function(aggregators) { | |
| 342 | + var classes = this.$.disable_aggregators.className; | |
| 343 | + if (aggregators.length > 0) { | |
| 344 | + this.$.disable_aggregators.className = classes.replace(" disabled", ""); | |
| 345 | + this.$.tooltip_aggregators.innerHTML = ln["disableGroupBy_" + ln["localization"]]; | |
| 346 | + } | |
| 347 | + else if (classes.indexOf("disabled") == -1) { | |
| 348 | + this.$.disable_aggregators.className = classes + " disabled"; | |
| 349 | + this.$.tooltip_aggregators.innerHTML = ln["enableGroupBy_" + ln["localization"]]; | |
| 350 | + } | |
| 351 | + }, | |
| 352 | + | |
| 353 | + _updateQuery : function() { | |
| 354 | + if(this.selectedFields.length) | |
| 355 | + this.$.query_container.innerHTML = alasql_QUERY_string(this.selectedFields, this.filters, this.aggregators, null) | |
| 356 | + .replace('SELECT', '<span style="color:#2196F3; font-weight: 700;">SELECT</span>') | |
| 357 | +// .replace('FROM ?', '<br><br><span style="color:#2196F3; font-weight: 700;">FROM</span> dataset') | |
| 358 | + .replace('FROM ?', '') | |
| 359 | + .replace('WHERE', '<br><br><span style="color:#2196F3; font-weight: 700;">WHERE</span>') | |
| 360 | + .replace('GROUP BY', '<br><br><span style="color:#2196F3; font-weight: 700;">GROUP BY</span>') | |
| 361 | + .replace(/\[/g, '') | |
| 362 | + .replace(/\]/g, ''); | |
| 363 | + else | |
| 364 | + this.$.query_container.innerHTML = ""; | |
| 365 | + } | |
| 366 | + | |
| 367 | + }); | |
| 368 | + | |
| 369 | + </script> | |
| 370 | + | |
| 371 | +</dom-module> | |
| 0 | 372 | \ No newline at end of file | ... | ... |
controllets/filters-controllet/filters-controllet.html
| 1 | 1 | <link rel="import" href="../../bower_components/polymer/polymer.html" /> |
| 2 | 2 | |
| 3 | -<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | - | |
| 5 | 3 | <link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> |
| 6 | 4 | <link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> |
| 7 | 5 | <link rel="import" href="../../bower_components/paper-item/paper-item.html"> |
| ... | ... | @@ -19,8 +17,9 @@ |
| 19 | 17 | <style is="custom-style"> |
| 20 | 18 | |
| 21 | 19 | #filters_container { |
| 22 | - height: 48px; | |
| 20 | + height: 100%; | |
| 23 | 21 | width: 100%; |
| 22 | + position: relative; | |
| 24 | 23 | } |
| 25 | 24 | |
| 26 | 25 | #filters_container * { |
| ... | ... | @@ -29,37 +28,6 @@ |
| 29 | 28 | line-height: 24px; |
| 30 | 29 | } |
| 31 | 30 | |
| 32 | - #filters_container #header { | |
| 33 | - height: 32px; | |
| 34 | - padding-top: 16px; | |
| 35 | - text-align: center; | |
| 36 | - font-weight: 700; | |
| 37 | - | |
| 38 | - background: #FFFFFF; | |
| 39 | - color: #00BCD4; | |
| 40 | - cursor: pointer; | |
| 41 | - } | |
| 42 | - | |
| 43 | - #filters_container #header.hide{ | |
| 44 | - color: #00BCD4; | |
| 45 | - background: #FFFFFF; | |
| 46 | - } | |
| 47 | - | |
| 48 | - /*#filters_container #header.hide:hover{*/ | |
| 49 | - /*}*/ | |
| 50 | - | |
| 51 | - #filters_container #header.show{ | |
| 52 | - color: #000000; | |
| 53 | - background: #B6B6B6; | |
| 54 | - } | |
| 55 | - | |
| 56 | - #filters_container #panel { | |
| 57 | - display: none; | |
| 58 | - position: relative; | |
| 59 | - height: calc(100% - 48px); | |
| 60 | - background: #FFFFFF; | |
| 61 | - } | |
| 62 | - | |
| 63 | 31 | paper-dropdown-menu { |
| 64 | 32 | width: 100%; |
| 65 | 33 | --paper-input-container-focus-color: #2196F3; |
| ... | ... | @@ -87,11 +55,34 @@ |
| 87 | 55 | } |
| 88 | 56 | |
| 89 | 57 | paper-button { |
| 90 | - margin: 0px; | |
| 91 | - height: 44px; | |
| 58 | + margin: 0; | |
| 59 | + height: 48px; | |
| 60 | + padding: 12px; | |
| 92 | 61 | color: #FFFFFF; |
| 93 | 62 | background: #2196F3; |
| 94 | 63 | font-weight: 700; |
| 64 | + | |
| 65 | + min-width: 96px; | |
| 66 | + } | |
| 67 | + | |
| 68 | + paper-button#disable_filters { | |
| 69 | + position: absolute; | |
| 70 | + bottom: 0; | |
| 71 | + right: 0; | |
| 72 | + margin: 0 8px 8px 0; | |
| 73 | + | |
| 74 | + min-width: 192px; | |
| 75 | + } | |
| 76 | + | |
| 77 | + paper-button#disable_filters.disabled { | |
| 78 | + background-color: #B6B6B6; | |
| 79 | + } | |
| 80 | + | |
| 81 | + iron-icon[icon=filter-list] { | |
| 82 | + height: 32px; | |
| 83 | + width: 32px; | |
| 84 | + color: #FFFFFF; | |
| 85 | + margin-top: -4px; | |
| 95 | 86 | } |
| 96 | 87 | |
| 97 | 88 | paper-button:hover { |
| ... | ... | @@ -138,7 +129,8 @@ |
| 138 | 129 | height: 44px; |
| 139 | 130 | width: calc(100% - 40px); |
| 140 | 131 | padding: 8px 0px; |
| 141 | - text-align: right; | |
| 132 | + /*text-align: right;*/ | |
| 133 | + text-align: center; | |
| 142 | 134 | } |
| 143 | 135 | |
| 144 | 136 | #filters_container .row2 { |
| ... | ... | @@ -147,7 +139,7 @@ |
| 147 | 139 | width: 100%; |
| 148 | 140 | } |
| 149 | 141 | |
| 150 | - #filters_container .row2 .highlighted { | |
| 142 | + .highlighted { | |
| 151 | 143 | color: #2196F3; |
| 152 | 144 | font-weight: 700; |
| 153 | 145 | } |
| ... | ... | @@ -162,16 +154,11 @@ |
| 162 | 154 | height: 40px; |
| 163 | 155 | width: 40px; |
| 164 | 156 | padding: 4px 8px; |
| 165 | - | |
| 166 | 157 | } |
| 167 | 158 | |
| 168 | 159 | </style> |
| 169 | 160 | |
| 170 | - <paper-material id="filters_container" elevation="5"> | |
| 171 | - | |
| 172 | - <div id="header" class="hide" on-click="_showFiltersPanel"><span id="filters"><span id="addFilters"></span></span></div> | |
| 173 | - | |
| 174 | - <div id="panel"> | |
| 161 | + <div id="filters_container"> | |
| 175 | 162 | |
| 176 | 163 | <div class="row"> |
| 177 | 164 | <div class="ddl_container"> |
| ... | ... | @@ -209,7 +196,7 @@ |
| 209 | 196 | <template is="dom-if" if="{{index}}"><!--excludes logicalOperator--> |
| 210 | 197 | <div class="row2"> |
| 211 | 198 | <div class="filter"> |
| 212 | - {{item.field}} <span class="highlighted">{{_getOperationlName(item.operation)}}</span> "{{item.value}}" <span class="highlighted">{{_getLogicalOperator(index)}}</span> | |
| 199 | + {{item.field}} <span class="highlighted">{{_getOperationlName(item.operation)}}</span> "{{item.value}}" <span class="highlighted">{{_getLogicalOperator(index)}}</span> | |
| 213 | 200 | </div> |
| 214 | 201 | <div class="remove_container"> |
| 215 | 202 | <paper-icon-button on-click="_deleteFilter" icon="cancel" class="cancel"></paper-icon-button> |
| ... | ... | @@ -218,9 +205,9 @@ |
| 218 | 205 | </template> |
| 219 | 206 | </template> |
| 220 | 207 | |
| 221 | - </div> | |
| 208 | + <paper-button id="disable_filters" raised on-click="_disableFilters"><iron-icon icon="filter-list"></iron-icon> <span id="disable_enable"></span></paper-button> | |
| 222 | 209 | |
| 223 | - </paper-material> | |
| 210 | + </div> | |
| 224 | 211 | |
| 225 | 212 | </template> |
| 226 | 213 | |
| ... | ... | @@ -245,18 +232,12 @@ |
| 245 | 232 | filters : { |
| 246 | 233 | type : Array, |
| 247 | 234 | value : [{logicalOperator: "AND"}] |
| 248 | - }, | |
| 249 | - | |
| 250 | - show : { | |
| 251 | - type : Boolean, | |
| 252 | - value : false | |
| 253 | 235 | } |
| 254 | 236 | |
| 255 | 237 | }, |
| 256 | 238 | |
| 257 | 239 | ready : function() { |
| 258 | - $(this.$.panel).perfectScrollbar(); | |
| 259 | -// this._showFiltersPanel();gi | |
| 240 | + $(this.$.filters_container).perfectScrollbar(); | |
| 260 | 241 | this.logicalOperator = "AND"; |
| 261 | 242 | }, |
| 262 | 243 | |
| ... | ... | @@ -266,7 +247,10 @@ |
| 266 | 247 | |
| 267 | 248 | setFields : function(fields) { |
| 268 | 249 | this.fields = this._copy(fields); |
| 269 | - this.fields = fields; | |
| 250 | + }, | |
| 251 | + | |
| 252 | + setSelectedFields : function(selectedFields) { | |
| 253 | + this.selectedFields = this._copy(selectedFields); | |
| 270 | 254 | }, |
| 271 | 255 | |
| 272 | 256 | setFilters : function(filters) { |
| ... | ... | @@ -283,43 +267,26 @@ |
| 283 | 267 | |
| 284 | 268 | reset : function() { |
| 285 | 269 | this.fields = []; |
| 270 | + this.selectedFields = []; | |
| 286 | 271 | this.filters = [{logicalOperator: "AND"}]; |
| 287 | 272 | }, |
| 288 | 273 | |
| 289 | 274 | _translate : function() { |
| 290 | - this.$.addFilters.innerHTML = ln["expertAddFilters_" + ln["localization"]]; | |
| 291 | 275 | this.$.filter_field.setAttribute("label", ln["filterField_" + ln["localization"]]); |
| 292 | 276 | this.$.filter_operation.setAttribute("label", ln["filterOperation_" + ln["localization"]]); |
| 293 | 277 | this.$.filter_value.setAttribute("label", ln["filterValue_" + ln["localization"]]); |
| 278 | + | |
| 279 | + this.$.disable_enable.innerHTML = ln["disableFilters_" + ln["localization"]]; | |
| 294 | 280 | }, |
| 295 | 281 | |
| 296 | 282 | _fieldName : function(field) { |
| 297 | 283 | return field.substring(field.lastIndexOf(",")+1, field.length); |
| 298 | 284 | }, |
| 299 | 285 | |
| 300 | - _showFiltersPanel : function() { | |
| 301 | -// ? filter class hiddend & hover: | |
| 302 | - | |
| 303 | - if(!this.show) { | |
| 304 | - this.$.filters_container.style.height = "100%"; | |
| 305 | - $(this.$.header).removeClass("hide"); | |
| 306 | - $(this.$.header).addClass("show"); | |
| 307 | - this.$.panel.style.display = "block"; | |
| 308 | - | |
| 309 | - } | |
| 310 | - else { | |
| 311 | - this.$.filters_container.style.height = "48px"; | |
| 312 | - $(this.$.header).removeClass("show"); | |
| 313 | - $(this.$.header).addClass("hide"); | |
| 314 | - this.$.panel.style.display = "none"; | |
| 315 | - } | |
| 316 | - | |
| 317 | - this.fire('filters-controllet_show', {show: this.show}); | |
| 318 | - | |
| 319 | - this.show = !this.show; | |
| 320 | - }, | |
| 321 | - | |
| 322 | 286 | _fire : function() { |
| 287 | + this.$.disable_enable.innerHTML = ln["disableFilters_" + ln["localization"]]; | |
| 288 | + this.$.disable_filters.className = this.$.disable_filters.className.replace(" disabled", ""); | |
| 289 | + | |
| 323 | 290 | if (this.filters.length > 1) |
| 324 | 291 | this.fire('filters-controllet_filters', {filters: this.filters}); |
| 325 | 292 | else |
| ... | ... | @@ -331,13 +298,8 @@ |
| 331 | 298 | var field = this.$.filter_field.value; |
| 332 | 299 | var id = this.$.filter_operation.selectedItem.id; |
| 333 | 300 | var operation = this.operations[id]; |
| 334 | -// var operation = this.$.filter_operation.value; | |
| 335 | 301 | var value = this.$.filter_value.value; |
| 336 | 302 | |
| 337 | -// var filters = this.filters; | |
| 338 | -// filters.push({"field": field, "operation": operation, "value": value}); | |
| 339 | -// this.filters = filters; | |
| 340 | - | |
| 341 | 303 | this.filters.push({"field": field, "operation": operation, "value": value}); |
| 342 | 304 | |
| 343 | 305 | this.$.filter_field_menu.select(-1); |
| ... | ... | @@ -353,10 +315,6 @@ |
| 353 | 315 | _deleteFilter : function(e) { |
| 354 | 316 | var index = e.model.index; |
| 355 | 317 | |
| 356 | -// var filters = this.filters; | |
| 357 | -// filters.splice(index, 1); | |
| 358 | -// this.filters = this._copy(filters); | |
| 359 | - | |
| 360 | 318 | this.filters.splice(index, 1); |
| 361 | 319 | |
| 362 | 320 | this._fire(); |
| ... | ... | @@ -366,28 +324,8 @@ |
| 366 | 324 | |
| 367 | 325 | _getOperationlName: function(operation) { |
| 368 | 326 | return ln[operation + "_" + ln["localization"]]; |
| 369 | -// if(operation.indexOf("not") > -1) | |
| 370 | -// return ln["notContains_" + ln["localization"]]; | |
| 371 | -// if(operation.indexOf("contains") > -1) | |
| 372 | -// return ln["contains_" + ln["localization"]]; | |
| 373 | -// if(operation.indexOf("start") > -1) | |
| 374 | -// return ln["start_" + ln["localization"]]; | |
| 375 | -// if(operation.indexOf("ends") > -1) | |
| 376 | -// return ln["ends_" + ln["localization"]]; | |
| 377 | -// return operation; | |
| 378 | 327 | }, |
| 379 | 328 | |
| 380 | -// _changeLogicalOperator : function() { | |
| 381 | -// if(this.logicalOperator == "AND") | |
| 382 | -// this.logicalOperator = "OR"; | |
| 383 | -// else | |
| 384 | -// this.logicalOperator = "AND"; | |
| 385 | -// | |
| 386 | -// this._fire(); | |
| 387 | -// | |
| 388 | -// this._renderFilters(); | |
| 389 | -// }, | |
| 390 | - | |
| 391 | 329 | _changeLogicalOperator : function() { |
| 392 | 330 | if(this.logicalOperator == "AND") |
| 393 | 331 | this.logicalOperator = "OR"; |
| ... | ... | @@ -416,6 +354,20 @@ |
| 416 | 354 | return this.filters[0].logicalOperator; |
| 417 | 355 | }, |
| 418 | 356 | |
| 357 | + _disableFilters : function() { | |
| 358 | + var classes = this.$.disable_filters.className; | |
| 359 | + if (classes.indexOf("disabled") > -1) { | |
| 360 | +// this.$.disable_enable.innerHTML = ln["disableFilters_" + ln["localization"]]; | |
| 361 | +// this.$.disable_filters.className = classes.replace(" disabled", ""); | |
| 362 | + this._fire(); | |
| 363 | + } | |
| 364 | + else { | |
| 365 | + this.$.disable_enable.innerHTML = ln["enableFilters_" + ln["localization"]]; | |
| 366 | + this.$.disable_filters.className = classes + " disabled"; | |
| 367 | + this.fire('filters-controllet_filters', {filters: []}); | |
| 368 | + } | |
| 369 | + }, | |
| 370 | + | |
| 419 | 371 | _copy : function(o) { |
| 420 | 372 | var out, v, key; |
| 421 | 373 | out = Array.isArray(o) ? [] : {}; | ... | ... |
controllets/filters-controllet/filters-controllet_old.html
0 → 100755
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | + | |
| 5 | +<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> | |
| 6 | +<link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> | |
| 7 | +<link rel="import" href="../../bower_components/paper-item/paper-item.html"> | |
| 8 | + | |
| 9 | +<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html"> | |
| 10 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> | |
| 11 | +<link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> | |
| 12 | + | |
| 13 | +<link rel="import" href="../../bower_components/paper-button/paper-button.html"> | |
| 14 | + | |
| 15 | +<dom-module id="filters-controllet"> | |
| 16 | + | |
| 17 | + <template> | |
| 18 | + | |
| 19 | + <style is="custom-style"> | |
| 20 | + | |
| 21 | + #filters_container { | |
| 22 | + height: 48px; | |
| 23 | + width: 100%; | |
| 24 | + } | |
| 25 | + | |
| 26 | + #filters_container * { | |
| 27 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 28 | + font-size: 16px; | |
| 29 | + line-height: 24px; | |
| 30 | + } | |
| 31 | + | |
| 32 | + #filters_container #header { | |
| 33 | + height: 32px; | |
| 34 | + padding-top: 16px; | |
| 35 | + text-align: center; | |
| 36 | + font-weight: 700; | |
| 37 | + | |
| 38 | + background: #FFFFFF; | |
| 39 | + color: #00BCD4; | |
| 40 | + cursor: pointer; | |
| 41 | + } | |
| 42 | + | |
| 43 | + #filters_container #header.hide{ | |
| 44 | + color: #00BCD4; | |
| 45 | + background: #FFFFFF; | |
| 46 | + } | |
| 47 | + | |
| 48 | + /*#filters_container #header.hide:hover{*/ | |
| 49 | + /*}*/ | |
| 50 | + | |
| 51 | + #filters_container #header.show{ | |
| 52 | + color: #000000; | |
| 53 | + background: #B6B6B6; | |
| 54 | + } | |
| 55 | + | |
| 56 | + #filters_container #panel { | |
| 57 | + display: none; | |
| 58 | + position: relative; | |
| 59 | + height: calc(100% - 48px); | |
| 60 | + background: #FFFFFF; | |
| 61 | + } | |
| 62 | + | |
| 63 | + paper-dropdown-menu { | |
| 64 | + width: 100%; | |
| 65 | + --paper-input-container-focus-color: #2196F3; | |
| 66 | + } | |
| 67 | + | |
| 68 | + :host { | |
| 69 | + --paper-dropdown-menu-icon: { | |
| 70 | + color: #2196F3; | |
| 71 | + }; | |
| 72 | + } | |
| 73 | + | |
| 74 | + paper-item { | |
| 75 | + min-width: 128px; | |
| 76 | + white-space: nowrap; | |
| 77 | + } | |
| 78 | + | |
| 79 | + paper-item.iron-selected { | |
| 80 | + background-color: #2196F3; | |
| 81 | + color: #FFFFFF; | |
| 82 | + } | |
| 83 | + | |
| 84 | + paper-input { | |
| 85 | + width: 100%; | |
| 86 | + --paper-input-container-focus-color: #2196F3; | |
| 87 | + } | |
| 88 | + | |
| 89 | + paper-button { | |
| 90 | + margin: 0px; | |
| 91 | + height: 44px; | |
| 92 | + color: #FFFFFF; | |
| 93 | + background: #2196F3; | |
| 94 | + font-weight: 700; | |
| 95 | + } | |
| 96 | + | |
| 97 | + paper-button:hover { | |
| 98 | + box-shadow: 0px 8px 12px #888; | |
| 99 | + -webkit-box-shadow: 0px 8px 12px #888; | |
| 100 | + -moz-box-shadow: 0px 8px 12px #888; | |
| 101 | + } | |
| 102 | + | |
| 103 | + paper-icon-button { | |
| 104 | + padding: 4px; | |
| 105 | + } | |
| 106 | + | |
| 107 | + paper-icon-button.add { | |
| 108 | + color: #2196F3; | |
| 109 | + --paper-icon-button-ink-color: #2196F3; | |
| 110 | + } | |
| 111 | + | |
| 112 | + paper-icon-button.cancel { | |
| 113 | + color: #F44336; | |
| 114 | + --paper-icon-button-ink-color: #F44336; | |
| 115 | + } | |
| 116 | + | |
| 117 | + #filters_container .row { | |
| 118 | + display: flex; | |
| 119 | + height: 60px; | |
| 120 | + width: 100%; | |
| 121 | + } | |
| 122 | + | |
| 123 | + #filters_container .ddl_container { | |
| 124 | + display: flex; | |
| 125 | + height: 60px; | |
| 126 | + width: 25%; | |
| 127 | + padding: 0px 8px; | |
| 128 | + } | |
| 129 | + | |
| 130 | + #filters_container .add_container { | |
| 131 | + height: 40px; | |
| 132 | + width: 40px; | |
| 133 | + padding: 10px 0px; | |
| 134 | + } | |
| 135 | + | |
| 136 | + #filters_container .andOr_container { | |
| 137 | + display: inline-block; | |
| 138 | + height: 44px; | |
| 139 | + width: calc(100% - 40px); | |
| 140 | + padding: 8px 0px; | |
| 141 | + text-align: right; | |
| 142 | + } | |
| 143 | + | |
| 144 | + #filters_container .row2 { | |
| 145 | + display: flex; | |
| 146 | + height: 48px; | |
| 147 | + width: 100%; | |
| 148 | + } | |
| 149 | + | |
| 150 | + #filters_container .row2 .highlighted { | |
| 151 | + color: #2196F3; | |
| 152 | + font-weight: 700; | |
| 153 | + } | |
| 154 | + | |
| 155 | + #filters_container .filter { | |
| 156 | + height: 24px; | |
| 157 | + width: calc(75% - 16px); | |
| 158 | + padding: 12px 8px; | |
| 159 | + } | |
| 160 | + | |
| 161 | + #filters_container .remove_container { | |
| 162 | + height: 40px; | |
| 163 | + width: 40px; | |
| 164 | + padding: 4px 8px; | |
| 165 | + | |
| 166 | + } | |
| 167 | + | |
| 168 | + </style> | |
| 169 | + | |
| 170 | + <paper-material id="filters_container" elevation="5"> | |
| 171 | + | |
| 172 | + <div id="header" class="hide" on-click="_showFiltersPanel"><span id="filters"><span id="addFilters"></span></span></div> | |
| 173 | + | |
| 174 | + <div id="panel"> | |
| 175 | + | |
| 176 | + <div class="row"> | |
| 177 | + <div class="ddl_container"> | |
| 178 | + <paper-dropdown-menu id="filter_field" label="Field"> | |
| 179 | + <paper-menu id="filter_field_menu" class="dropdown-content"> | |
| 180 | + <template is="dom-repeat" items={{fields}}> | |
| 181 | + <paper-item id={{index}}>{{_fieldName(item)}}</paper-item> | |
| 182 | + </template> | |
| 183 | + </paper-menu> | |
| 184 | + </paper-dropdown-menu> | |
| 185 | + </div> | |
| 186 | + <div class="ddl_container"> | |
| 187 | + <paper-dropdown-menu id="filter_operation" label="Operation"> | |
| 188 | + <paper-menu id="filter_operation_menu" class="dropdown-content"> | |
| 189 | + <template is="dom-repeat" items={{operations}}> | |
| 190 | + <paper-item id={{index}}>{{_getOperationlName(item)}}</paper-item> | |
| 191 | + </template> | |
| 192 | + </paper-menu> | |
| 193 | + </paper-dropdown-menu> | |
| 194 | + </div> | |
| 195 | + <div class="ddl_container"> | |
| 196 | + <paper-input id="filter_value" label="Value" class="base_input" maxlength="32" auto-validate pattern="^[.:,;+-_ a-zA-Z0-9]*" error-message="Invalid value!"></paper-input> | |
| 197 | + </div> | |
| 198 | + <div class="ddl_container"> | |
| 199 | + <div class="add_container"> | |
| 200 | + <paper-icon-button on-click="_addFilter" icon="add-circle" class="add"></paper-icon-button> | |
| 201 | + </div> | |
| 202 | + <div class="andOr_container"> | |
| 203 | + <paper-button raised on-click="_changeLogicalOperator"><span id="andOr">{{logicalOperator}}</span></paper-button> | |
| 204 | + </div> | |
| 205 | + </div> | |
| 206 | + </div> | |
| 207 | + | |
| 208 | + <template is="dom-repeat" items={{filters}}> | |
| 209 | + <template is="dom-if" if="{{index}}"><!--excludes logicalOperator--> | |
| 210 | + <div class="row2"> | |
| 211 | + <div class="filter"> | |
| 212 | + {{item.field}} <span class="highlighted">{{_getOperationlName(item.operation)}}</span> "{{item.value}}" <span class="highlighted">{{_getLogicalOperator(index)}}</span> | |
| 213 | + </div> | |
| 214 | + <div class="remove_container"> | |
| 215 | + <paper-icon-button on-click="_deleteFilter" icon="cancel" class="cancel"></paper-icon-button> | |
| 216 | + </div> | |
| 217 | + </div> | |
| 218 | + </template> | |
| 219 | + </template> | |
| 220 | + | |
| 221 | + </div> | |
| 222 | + | |
| 223 | + </paper-material> | |
| 224 | + | |
| 225 | + </template> | |
| 226 | + | |
| 227 | + <script> | |
| 228 | + | |
| 229 | + Polymer({ | |
| 230 | + | |
| 231 | + is : 'filters-controllet', | |
| 232 | + | |
| 233 | + properties : { | |
| 234 | + | |
| 235 | + fields : { | |
| 236 | + type : Array, | |
| 237 | + value : [] | |
| 238 | + }, | |
| 239 | + | |
| 240 | + operations : { | |
| 241 | + type : Array, | |
| 242 | + value : ["=", "!=", ">", ">=", "<", "<=", "contains", "notContains", "start", "ends"] | |
| 243 | + }, | |
| 244 | + | |
| 245 | + filters : { | |
| 246 | + type : Array, | |
| 247 | + value : [{logicalOperator: "AND"}] | |
| 248 | + }, | |
| 249 | + | |
| 250 | + show : { | |
| 251 | + type : Boolean, | |
| 252 | + value : false | |
| 253 | + } | |
| 254 | + | |
| 255 | + }, | |
| 256 | + | |
| 257 | + ready : function() { | |
| 258 | + $(this.$.panel).perfectScrollbar(); | |
| 259 | +// this._showFiltersPanel();gi | |
| 260 | + this.logicalOperator = "AND"; | |
| 261 | + }, | |
| 262 | + | |
| 263 | + attached : function() { | |
| 264 | + this._translate(); | |
| 265 | + }, | |
| 266 | + | |
| 267 | + setFields : function(fields) { | |
| 268 | + this.fields = this._copy(fields); | |
| 269 | + this.fields = fields; | |
| 270 | + }, | |
| 271 | + | |
| 272 | + setFilters : function(filters) { | |
| 273 | + if(filters && filters.length > 0) { | |
| 274 | + this.filters = this._copy(filters); | |
| 275 | + this.logicalOperator = this.filters[0].logicalOperator; | |
| 276 | + this._fire(); | |
| 277 | + } | |
| 278 | + }, | |
| 279 | + | |
| 280 | + getFilters : function() { | |
| 281 | + return this.filters; | |
| 282 | + }, | |
| 283 | + | |
| 284 | + reset : function() { | |
| 285 | + this.fields = []; | |
| 286 | + this.filters = [{logicalOperator: "AND"}]; | |
| 287 | + }, | |
| 288 | + | |
| 289 | + _translate : function() { | |
| 290 | + this.$.addFilters.innerHTML = ln["expertAddFilters_" + ln["localization"]]; | |
| 291 | + this.$.filter_field.setAttribute("label", ln["filterField_" + ln["localization"]]); | |
| 292 | + this.$.filter_operation.setAttribute("label", ln["filterOperation_" + ln["localization"]]); | |
| 293 | + this.$.filter_value.setAttribute("label", ln["filterValue_" + ln["localization"]]); | |
| 294 | + }, | |
| 295 | + | |
| 296 | + _fieldName : function(field) { | |
| 297 | + return field.substring(field.lastIndexOf(",")+1, field.length); | |
| 298 | + }, | |
| 299 | + | |
| 300 | + _showFiltersPanel : function() { | |
| 301 | +// ? filter class hiddend & hover: | |
| 302 | + | |
| 303 | + if(!this.show) { | |
| 304 | + this.$.filters_container.style.height = "100%"; | |
| 305 | + $(this.$.header).removeClass("hide"); | |
| 306 | + $(this.$.header).addClass("show"); | |
| 307 | + this.$.panel.style.display = "block"; | |
| 308 | + | |
| 309 | + } | |
| 310 | + else { | |
| 311 | + this.$.filters_container.style.height = "48px"; | |
| 312 | + $(this.$.header).removeClass("show"); | |
| 313 | + $(this.$.header).addClass("hide"); | |
| 314 | + this.$.panel.style.display = "none"; | |
| 315 | + } | |
| 316 | + | |
| 317 | + this.fire('filters-controllet_show', {show: this.show}); | |
| 318 | + | |
| 319 | + this.show = !this.show; | |
| 320 | + }, | |
| 321 | + | |
| 322 | + _fire : function() { | |
| 323 | + if (this.filters.length > 1) | |
| 324 | + this.fire('filters-controllet_filters', {filters: this.filters}); | |
| 325 | + else | |
| 326 | + this.fire('filters-controllet_filters', {filters: []}); | |
| 327 | + }, | |
| 328 | + | |
| 329 | + _addFilter : function() { | |
| 330 | + if (this.$.filter_field.selectedItem && this.$.filter_operation_menu.selectedItem && this.$.filter_value.value != "" && !this.$.filter_value.invalid) { | |
| 331 | + var field = this.$.filter_field.value; | |
| 332 | + var id = this.$.filter_operation.selectedItem.id; | |
| 333 | + var operation = this.operations[id]; | |
| 334 | +// var operation = this.$.filter_operation.value; | |
| 335 | + var value = this.$.filter_value.value; | |
| 336 | + | |
| 337 | +// var filters = this.filters; | |
| 338 | +// filters.push({"field": field, "operation": operation, "value": value}); | |
| 339 | +// this.filters = filters; | |
| 340 | + | |
| 341 | + this.filters.push({"field": field, "operation": operation, "value": value}); | |
| 342 | + | |
| 343 | + this.$.filter_field_menu.select(-1); | |
| 344 | + this.$.filter_operation_menu.select(-1); | |
| 345 | + this.$.filter_value.value = ""; | |
| 346 | + | |
| 347 | + this._fire(); | |
| 348 | + | |
| 349 | + this._renderFilters(); | |
| 350 | + } | |
| 351 | + }, | |
| 352 | + | |
| 353 | + _deleteFilter : function(e) { | |
| 354 | + var index = e.model.index; | |
| 355 | + | |
| 356 | +// var filters = this.filters; | |
| 357 | +// filters.splice(index, 1); | |
| 358 | +// this.filters = this._copy(filters); | |
| 359 | + | |
| 360 | + this.filters.splice(index, 1); | |
| 361 | + | |
| 362 | + this._fire(); | |
| 363 | + | |
| 364 | + this._renderFilters(); | |
| 365 | + }, | |
| 366 | + | |
| 367 | + _getOperationlName: function(operation) { | |
| 368 | + return ln[operation + "_" + ln["localization"]]; | |
| 369 | +// if(operation.indexOf("not") > -1) | |
| 370 | +// return ln["notContains_" + ln["localization"]]; | |
| 371 | +// if(operation.indexOf("contains") > -1) | |
| 372 | +// return ln["contains_" + ln["localization"]]; | |
| 373 | +// if(operation.indexOf("start") > -1) | |
| 374 | +// return ln["start_" + ln["localization"]]; | |
| 375 | +// if(operation.indexOf("ends") > -1) | |
| 376 | +// return ln["ends_" + ln["localization"]]; | |
| 377 | +// return operation; | |
| 378 | + }, | |
| 379 | + | |
| 380 | +// _changeLogicalOperator : function() { | |
| 381 | +// if(this.logicalOperator == "AND") | |
| 382 | +// this.logicalOperator = "OR"; | |
| 383 | +// else | |
| 384 | +// this.logicalOperator = "AND"; | |
| 385 | +// | |
| 386 | +// this._fire(); | |
| 387 | +// | |
| 388 | +// this._renderFilters(); | |
| 389 | +// }, | |
| 390 | + | |
| 391 | + _changeLogicalOperator : function() { | |
| 392 | + if(this.logicalOperator == "AND") | |
| 393 | + this.logicalOperator = "OR"; | |
| 394 | + else | |
| 395 | + this.logicalOperator = "AND"; | |
| 396 | + | |
| 397 | + this.filters[0] = {logicalOperator: this.logicalOperator} | |
| 398 | + | |
| 399 | + this._fire(); | |
| 400 | + | |
| 401 | + this._renderFilters(); | |
| 402 | + }, | |
| 403 | + | |
| 404 | + _renderFilters : function() { | |
| 405 | + var filters = this.filters.slice(); | |
| 406 | + this.filters = []; | |
| 407 | + this.async(function() { | |
| 408 | + this.filters = filters; | |
| 409 | + }, 0); | |
| 410 | + }, | |
| 411 | + | |
| 412 | + _getLogicalOperator : function(index) { | |
| 413 | + if(index == this.filters.length -1) | |
| 414 | + return ""; | |
| 415 | + else | |
| 416 | + return this.filters[0].logicalOperator; | |
| 417 | + }, | |
| 418 | + | |
| 419 | + _copy : function(o) { | |
| 420 | + var out, v, key; | |
| 421 | + out = Array.isArray(o) ? [] : {}; | |
| 422 | + for (key in o) { | |
| 423 | + v = o[key]; | |
| 424 | + out[key] = (typeof v === "object") ? this._copy(v) : v; | |
| 425 | + } | |
| 426 | + return out; | |
| 427 | + } | |
| 428 | + | |
| 429 | + }); | |
| 430 | + | |
| 431 | + </script> | |
| 432 | + | |
| 433 | +</dom-module> | |
| 0 | 434 | \ No newline at end of file | ... | ... |
controllets/items-vslider-controllet/demo/index.html
| ... | ... | @@ -8,12 +8,19 @@ |
| 8 | 8 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> |
| 9 | 9 | <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> |
| 10 | 10 | |
| 11 | + <script src="../../../locales/controllet_ln.js"></script> | |
| 12 | + | |
| 11 | 13 | <link rel="import" href="../items-vslider-controllet.html" /> |
| 12 | 14 | </head> |
| 13 | 15 | |
| 14 | 16 | <body> |
| 15 | 17 | |
| 16 | -<items-vslider-controllet datalets-list-url="http://172.16.15.89/DEEalerProvider/DEEP/datalets-list"></items-vslider-controllet> | |
| 18 | +<items-vslider-controllet id="ivs" datalets-list-url="http://172.16.15.38/DEEalerProvider/DEEP/datalets-list"></items-vslider-controllet> | |
| 19 | + | |
| 20 | +<script> | |
| 21 | + var ivs = document.getElementById('ivs'); | |
| 22 | + ivs.setEnabledDatalets(["TEXT", "TEXT"]); | |
| 23 | +</script> | |
| 17 | 24 | |
| 18 | 25 | </body> |
| 19 | 26 | ... | ... |
controllets/items-vslider-controllet/items-vslider-controllet.html
| ... | ... | @@ -10,13 +10,15 @@ |
| 10 | 10 | |
| 11 | 11 | <link rel="import" href="../../bower_components/paper-input/paper-input.html"> |
| 12 | 12 | |
| 13 | +<script type="text/javascript" src="../../bower_components/jsdatachecker/jsdatachecker.min.js"></script> | |
| 14 | + | |
| 13 | 15 | <dom-module id="items-vslider-controllet"> |
| 14 | 16 | |
| 15 | 17 | <template> |
| 16 | 18 | |
| 17 | 19 | <style is="custom-style"> |
| 18 | 20 | paper-icon-button{ |
| 19 | - color: #FFFFFF; | |
| 21 | + /*color: #FFFFFF;*/ | |
| 20 | 22 | height: 32px;/*48*/ |
| 21 | 23 | width: 32px;/*48*/ |
| 22 | 24 | padding: 0px; |
| ... | ... | @@ -58,6 +60,20 @@ |
| 58 | 60 | background-color: #FFFFFF; |
| 59 | 61 | } |
| 60 | 62 | |
| 63 | + .content-card-disabled{ | |
| 64 | + position: relative; | |
| 65 | + float: left;/*firefox*/ | |
| 66 | + margin : 16px 16px 0px 16px; | |
| 67 | + padding: 8px; | |
| 68 | + height: 124px; | |
| 69 | + width: 124px; | |
| 70 | + cursor: pointer; | |
| 71 | + background-color: #FFFFFF; | |
| 72 | + | |
| 73 | + opacity: 0.5; | |
| 74 | + pointer-events:none; | |
| 75 | + } | |
| 76 | + | |
| 61 | 77 | img{ |
| 62 | 78 | width: 100%; |
| 63 | 79 | } |
| ... | ... | @@ -70,7 +86,8 @@ |
| 70 | 86 | width: 124px; |
| 71 | 87 | color: #000000; |
| 72 | 88 | background-color: rgba(158, 158, 158, 0.8);/*9E*/ |
| 73 | - /*background-color: rgba(182, 182, 182, 0.9);/!*B&*!/*/ | |
| 89 | + /*background-color: #B6B6B6;*/ | |
| 90 | + /*opacity: 0.9;*/ | |
| 74 | 91 | z-index: 1; |
| 75 | 92 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
| 76 | 93 | font-size: 16px; |
| ... | ... | @@ -79,10 +96,12 @@ |
| 79 | 96 | } |
| 80 | 97 | |
| 81 | 98 | .legend.selected { |
| 82 | - background-color: #2196F3; | |
| 83 | - /*background-color: rgba(33, 150, 243, 0.8);*/ | |
| 84 | 99 | color: #FFFFFF; |
| 100 | + background-color: #2196F3; | |
| 101 | + opacity: 0.9; | |
| 85 | 102 | |
| 103 | + /*background: black;*/ | |
| 104 | + /*color: #2196F3;*/ | |
| 86 | 105 | } |
| 87 | 106 | |
| 88 | 107 | #items_vslider_search{ |
| ... | ... | @@ -94,7 +113,7 @@ |
| 94 | 113 | } |
| 95 | 114 | |
| 96 | 115 | .search{ |
| 97 | - color: #FFFFFF | |
| 116 | + /*color: #FFFFFF*/ | |
| 98 | 117 | } |
| 99 | 118 | |
| 100 | 119 | .clear { |
| ... | ... | @@ -121,7 +140,7 @@ |
| 121 | 140 | |
| 122 | 141 | <div id="div_datalets_container" class="flex"> |
| 123 | 142 | <template is="dom-repeat" items="{{filteredDatalets}}"> |
| 124 | - <paper-material id={{item.imageName}} elevation="1" class='content-card' on-click="_selectDatalet"> | |
| 143 | + <paper-material id={{item.imageName}} elevation="1" class$="{{item.class}}" on-click="_selectDatalet"> | |
| 125 | 144 | <div class="legend">{{_getChartName(item.imageName)}}</div> |
| 126 | 145 | <div><img src={{item.imageUrl}}></div> |
| 127 | 146 | </paper-material> |
| ... | ... | @@ -174,6 +193,7 @@ |
| 174 | 193 | value : "", |
| 175 | 194 | observer : '_filterDatalets' |
| 176 | 195 | } |
| 196 | + | |
| 177 | 197 | }, |
| 178 | 198 | |
| 179 | 199 | listeners: { |
| ... | ... | @@ -185,15 +205,34 @@ |
| 185 | 205 | }, |
| 186 | 206 | |
| 187 | 207 | attached : function() { |
| 188 | -// if(this.preselectedDatalet){ | |
| 208 | +// if(this.preselectedDatalet) | |
| 189 | 209 | // this._preselectDatalet(); |
| 190 | -// this.preselectedDatalet = undefined; | |
| 191 | -// } | |
| 192 | 210 | |
| 193 | 211 | this._translate(); |
| 194 | 212 | }, |
| 195 | 213 | |
| 196 | - _reset : function() { | |
| 214 | +// _preselectDatalet : function(){ | |
| 215 | +// this.async(function() { | |
| 216 | +// var dataletCard = document.getElementById(this.preselectedDatalet); | |
| 217 | +// dataletCard.elevation = "5"; | |
| 218 | +// dataletCard.getElementsByClassName("legend")[0].className = dataletCard.getElementsByClassName("legend")[0].className + " selected"; | |
| 219 | +// this.selectedDatalet = this.preselectedDatalet; | |
| 220 | +// | |
| 221 | +// this.fire('items-vslider-controllet_selected-datalet', {datalet: this.selectedDatalet}); | |
| 222 | +// this.preselectedDatalet = undefined; | |
| 223 | +// }, 300); | |
| 224 | +// }, | |
| 225 | + | |
| 226 | + preselectDatalet : function(preselectedDatalet){ | |
| 227 | + var dataletCard = document.getElementById(preselectedDatalet); | |
| 228 | + dataletCard.elevation = "5"; | |
| 229 | + dataletCard.getElementsByClassName("legend")[0].className = dataletCard.getElementsByClassName("legend")[0].className + " selected"; | |
| 230 | + this.selectedDatalet = preselectedDatalet; | |
| 231 | + | |
| 232 | + this.fire('items-vslider-controllet_selected-datalet', {datalet: this.selectedDatalet}); | |
| 233 | + }, | |
| 234 | + | |
| 235 | + reset : function() { | |
| 197 | 236 | if(this.selectedDatalet != undefined && (document.getElementById(this.selectedDatalet) != null)){ |
| 198 | 237 | var dataletCard = document.getElementById(this.selectedDatalet); |
| 199 | 238 | dataletCard.elevation = "1"; |
| ... | ... | @@ -216,27 +255,85 @@ |
| 216 | 255 | _getDatalets : function(e){ |
| 217 | 256 | var datalets = new Array(); |
| 218 | 257 | for(var i=0; i < e.detail.response.length; i++){ |
| 219 | - var datalet = { imageName : e.detail.response[i].name.replace("-datalet", ""), imageUrl : e.detail.response[i].url + e.detail.response[i].name + ".png" }; | |
| 258 | + var datalet = { | |
| 259 | + imageName : e.detail.response[i].name.replace("-datalet", ""), | |
| 260 | + imageUrl : e.detail.response[i].url + e.detail.response[i].name + ".png", | |
| 261 | + inputTypes : this._getInputTypes(e.detail.response[i].idm.inputs.input), | |
| 262 | + class : "content-card" | |
| 263 | + }; | |
| 264 | + | |
| 220 | 265 | if(e.detail.response[i].type != "hidden") |
| 221 | 266 | datalets.push(datalet); |
| 222 | 267 | } |
| 223 | 268 | |
| 224 | 269 | this.datalets = datalets; |
| 225 | - this.filteredDatalets = datalets; | |
| 270 | + /**/this.filteredDatalets = datalets; | |
| 271 | + }, | |
| 272 | + | |
| 273 | + _getInputTypes : function(inputs){ | |
| 274 | + var inputTypes = []; | |
| 275 | + for(var i=0; i < inputs.length; i++) { | |
| 276 | + if(inputs[i].selection != "?" /*&& inputs[i].selection != "*"*/) | |
| 277 | + inputTypes.push(inputs[i].type); | |
| 278 | + } | |
| 279 | + return inputTypes; | |
| 280 | + }, | |
| 281 | + | |
| 282 | + setEnabledDatalets : function(fields){ | |
| 283 | + var dataTypes = []; | |
| 284 | + for(var i=0; i < fields.length; i++) | |
| 285 | + dataTypes.push(fields[i].type); | |
| 286 | + | |
| 287 | + this.async(function() { | |
| 288 | +// console.log(DataTypeHierarchy.canConvert("TEXT", "NUMBER")); | |
| 289 | +// console.log(DataTypeHierarchy.canConvert("NUMBER", "TEXT")); | |
| 290 | + | |
| 291 | + for(var i=0; i < this.datalets.length; i++) { | |
| 292 | + if(!this._enebled(this.datalets[i].inputTypes, dataTypes)) | |
| 293 | + this.datalets[i]["class"] = "content-card-disabled"; | |
| 294 | + else | |
| 295 | + this.datalets[i]["class"] = "content-card"; | |
| 296 | + } | |
| 297 | + | |
| 298 | + this._filterDatalets(); | |
| 299 | + }, 1);//remove async | |
| 300 | + }, | |
| 301 | + | |
| 302 | + _enebled : function(inputTypes, dataTypes){ | |
| 303 | + if((inputTypes.indexOf("NUMBER") > -1) && !(dataTypes.indexOf("NUMBER") > -1)) | |
| 304 | + return false; | |
| 305 | + return true; | |
| 226 | 306 | }, |
| 227 | 307 | |
| 308 | +// _enebled : function(dataTypes, inputTypes){ | |
| 309 | +// var enabled = true; | |
| 310 | +// for(var i=0; i < inputTypes.length; i++) { | |
| 311 | +// var canConvert = false; | |
| 312 | +// for(var j=0; j < dataTypes.length; j++) { | |
| 313 | +// if(DataTypeHierarchy.canConvert(dataTypes[j], inputTypes[i])) { | |
| 314 | +// canConvert = true; | |
| 315 | +// break; | |
| 316 | +// } | |
| 317 | +// } | |
| 318 | +// if(!canConvert) | |
| 319 | +// enabled = false; | |
| 320 | +// } | |
| 321 | +// return enabled; | |
| 322 | +// }, | |
| 323 | + | |
| 228 | 324 | _filterDatalets : function(){ |
| 229 | 325 | var datalets = new Array(); |
| 230 | 326 | for(var i=0; i < this.datalets.length; i++){ |
| 231 | 327 | var datalet = this.datalets[i]; |
| 232 | 328 | var imageName = this._getChartName(datalet.imageName).toLowerCase(); |
| 233 | -// console.log(imageName); | |
| 234 | -// console.log(this.filter); | |
| 235 | 329 | if(imageName.indexOf(this.filter.toLowerCase()) > -1) |
| 236 | 330 | datalets.push(datalet); |
| 237 | 331 | } |
| 238 | 332 | |
| 239 | - this.filteredDatalets = datalets; | |
| 333 | + this.filteredDatalets = []; | |
| 334 | + this.async(function() { | |
| 335 | + this.filteredDatalets = datalets; | |
| 336 | + }, 0); | |
| 240 | 337 | |
| 241 | 338 | $("#div_datalets_container").animate({ scrollTop: 0}, 0); |
| 242 | 339 | }, |
| ... | ... | @@ -278,32 +375,13 @@ |
| 278 | 375 | this.fire('items-vslider-controllet_selected-datalet', {datalet: this.selectedDatalet}); |
| 279 | 376 | }, |
| 280 | 377 | |
| 281 | - _preselectDatalet : function(){ | |
| 282 | -// this.async(function() { | |
| 283 | - var dataletCard = document.getElementById(this.preselectedDatalet); | |
| 284 | -// console.log(dataletCard); | |
| 285 | -// console.log(this.preselectedDatalet); | |
| 286 | -// var id = "#"+this.preselectedDatalet; | |
| 287 | -// var dataletCard = $(id); | |
| 288 | -// var dataletCard = this.$$("#datatable"); | |
| 289 | -// console.log(dataletCard); | |
| 290 | 378 | |
| 291 | - dataletCard.elevation = "5"; | |
| 292 | - dataletCard.getElementsByClassName("legend")[0].className = dataletCard.getElementsByClassName("legend")[0].className + " selected"; | |
| 293 | - | |
| 294 | -// dataletCard.find(".legend")[0].className += " selected"; | |
| 295 | - this.selectedDatalet = this.preselectedDatalet; | |
| 296 | - | |
| 297 | - this.fire('items-vslider-controllet_selected-datalet', {datalet: this.selectedDatalet}); | |
| 298 | -// }, 500); | |
| 299 | - }, | |
| 300 | 379 | |
| 301 | 380 | _getImageUrl : function(index){ |
| 302 | 381 | return this.datalets[index].imageUrl; |
| 303 | 382 | }, |
| 304 | 383 | |
| 305 | 384 | _onPrevClick : function() { |
| 306 | - | |
| 307 | 385 | var container = $("#div_datalets_container"); |
| 308 | 386 | var h = container.height(); |
| 309 | 387 | var dataletPerPage = parseInt(h/156); | ... | ... |
controllets/page-slider-controllet/page-slider-controllet.html
| ... | ... | @@ -8,6 +8,8 @@ |
| 8 | 8 | <link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> |
| 9 | 9 | <link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> |
| 10 | 10 | |
| 11 | +<link rel="import" href="../../bower_components/paper-tooltip/paper-tooltip.html"> | |
| 12 | + | |
| 11 | 13 | <dom-module id="page-slider-controllet"> |
| 12 | 14 | |
| 13 | 15 | <template> |
| ... | ... | @@ -30,6 +32,19 @@ |
| 30 | 32 | color: #B6B6B6; |
| 31 | 33 | } |
| 32 | 34 | |
| 35 | + paper-tooltip { | |
| 36 | + --paper-tooltip-background: black; | |
| 37 | + } | |
| 38 | + | |
| 39 | + paper-tooltip p { | |
| 40 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 41 | + font-size: 16px; | |
| 42 | + line-height: 24px; | |
| 43 | + | |
| 44 | + margin: 0; | |
| 45 | + padding: 0; | |
| 46 | + } | |
| 47 | + | |
| 33 | 48 | .header{ |
| 34 | 49 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
| 35 | 50 | width: 100%; |
| ... | ... | @@ -96,6 +111,9 @@ |
| 96 | 111 | </div> |
| 97 | 112 | </div> |
| 98 | 113 | |
| 114 | + <paper-tooltip for="slider_chevron_left" position="right" offset="0"><p><span id="back"></span></p></paper-tooltip> | |
| 115 | + <paper-tooltip for="slider_chevron_right" position="left" offset="-16"><p><span id="forward"></span></p></paper-tooltip> | |
| 116 | + | |
| 99 | 117 | <neon-animated-pages on-neon-animation-finish="_onNeonAnimationFinish" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> |
| 100 | 118 | <content></content> |
| 101 | 119 | </neon-animated-pages> |
| ... | ... | @@ -160,8 +178,11 @@ |
| 160 | 178 | attached : function() { |
| 161 | 179 | this.fire('page-slider-controllet_selected', {selected : this.selected}); |
| 162 | 180 | |
| 163 | - this.$.slider_chevron_left.setAttribute("title", ln["back_" + ln["localization"]]); | |
| 164 | - this.$.slider_chevron_right.setAttribute("title", ln["forward_" + ln["localization"]]); | |
| 181 | +// this.$.slider_chevron_left.setAttribute("title", ln["back_" + ln["localization"]]); | |
| 182 | +// this.$.slider_chevron_right.setAttribute("title", ln["forward_" + ln["localization"]]); | |
| 183 | + | |
| 184 | + this.$.back.innerHTML = ln["back_" + ln["localization"]]; | |
| 185 | + this.$.forward.innerHTML = ln["forward_" + ln["localization"]]; | |
| 165 | 186 | }, |
| 166 | 187 | |
| 167 | 188 | setTitle : function(title, subtitle) { | ... | ... |
controllets/search-panel-controllet/search-panel-controllet.html
| ... | ... | @@ -36,6 +36,7 @@ |
| 36 | 36 | <link rel="import" href="../../bower_components/neon-animation/neon-animated-pages.html"> |
| 37 | 37 | <link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> |
| 38 | 38 | <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html"> |
| 39 | +<link rel="import" href="../../bower_components/paper-fab/paper-fab.html"> | |
| 39 | 40 | |
| 40 | 41 | <!-- |
| 41 | 42 | `text-element-controllet` is a text area with heading. It fires an event when the text value is modified. This event can be useful when you have to monitor many af this elements. |
| ... | ... | @@ -62,14 +63,19 @@ Example: |
| 62 | 63 | <style is="custom-style"> |
| 63 | 64 | |
| 64 | 65 | paper-input.search-text{ |
| 65 | - --paper-input-container-input-color: #ffffff; | |
| 66 | - --paper-input-container-focus-color: #ffffff; | |
| 67 | - --paper-input-container-color: #ffffff; | |
| 66 | + --paper-input-container-input-color: var(--search-box-container-color,#ffffff); | |
| 67 | + --paper-input-container-focus-color: var(--search-box-container-color,#ffffff); | |
| 68 | + --paper-input-container-color: var(--search-box-container-color,#ffffff); | |
| 68 | 69 | position: absolute; |
| 69 | 70 | width: 340px; |
| 70 | 71 | margin-left: -5px; |
| 71 | 72 | } |
| 72 | 73 | |
| 74 | + paper-fab#search_button{ | |
| 75 | + height: 40px; | |
| 76 | + width: 40px; | |
| 77 | + } | |
| 78 | + | |
| 73 | 79 | paper-icon-button |
| 74 | 80 | { |
| 75 | 81 | } |
| ... | ... | @@ -80,6 +86,10 @@ Example: |
| 80 | 86 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> |
| 81 | 87 | </template> |
| 82 | 88 | |
| 89 | + <template is="dom-if" if="{{paperfab}}"> | |
| 90 | + <paper-fab id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-fab> | |
| 91 | + </template> | |
| 92 | + | |
| 83 | 93 | <neon-animated-pages selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> |
| 84 | 94 | <neon-animatable></neon-animatable> |
| 85 | 95 | <neon-animatable> |
| ... | ... | @@ -91,6 +101,7 @@ Example: |
| 91 | 101 | <template is="dom-if" if="{{rightDirection}}"> |
| 92 | 102 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> |
| 93 | 103 | </template> |
| 104 | + | |
| 94 | 105 | </div> |
| 95 | 106 | |
| 96 | 107 | </template> |
| ... | ... | @@ -137,6 +148,10 @@ Example: |
| 137 | 148 | rightDirection: { |
| 138 | 149 | type: String, |
| 139 | 150 | value: undefined |
| 151 | + }, | |
| 152 | + paperfab: { | |
| 153 | + type: Boolean, | |
| 154 | + value: false | |
| 140 | 155 | } |
| 141 | 156 | }, |
| 142 | 157 | |
| ... | ... | @@ -146,7 +161,8 @@ Example: |
| 146 | 161 | this.$.search_text.style.left = '5px'; |
| 147 | 162 | }else if(this.rightDirection != undefined){ |
| 148 | 163 | this.$.search_text.style.right = '5px'; |
| 149 | - } | |
| 164 | + }else if(this.paperfab != undefined) | |
| 165 | + this.$.search_text.style.right = '45px'; | |
| 150 | 166 | |
| 151 | 167 | }, |
| 152 | 168 | _toggleClick: function(e){ |
| ... | ... | @@ -170,7 +186,9 @@ Example: |
| 170 | 186 | _valueChanged : function(oldvalue, newValue){ |
| 171 | 187 | var t = this; |
| 172 | 188 | clearTimeout(this.timer); |
| 173 | - this.timer = setTimeout(function(){t.fire('search-panel-controllet_content-changed', {searchKey: t.searchKey, id : t.id})}, 0); | |
| 189 | + this.timer = setTimeout(function(){ | |
| 190 | + t.fire('search-panel-controllet_content-changed', {searchKey: t.searchKey, id : t.id}) | |
| 191 | + }, 0); | |
| 174 | 192 | }, |
| 175 | 193 | /** |
| 176 | 194 | * It returns the value in text area | ... | ... |
controllets/select-data-controllet/select-data-controllet.html
| ... | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | |
| 3 | 3 | <link rel="import" href="../select-fields-controllet/select-fields-controllet.html" /> |
| 4 | 4 | <link rel="import" href="../data-table-controllet/data-table-controllet.html" /> |
| 5 | -<link rel="import" href="../filters-controllet/filters-controllet.html" /> | |
| 5 | +<link rel="import" href="../expert-query-controllet/expert-query-controllet.html" /> | |
| 6 | 6 | |
| 7 | 7 | <link rel="import" href="../providers-utility-controllet/providers-utility-controllet.html" /> |
| 8 | 8 | |
| ... | ... | @@ -44,7 +44,7 @@ |
| 44 | 44 | width: 100%; |
| 45 | 45 | } |
| 46 | 46 | |
| 47 | - #select_data_controllet_container #filters_container { | |
| 47 | + #select_data_controllet_container #expert_container { | |
| 48 | 48 | height: 48px; |
| 49 | 49 | width: 100%; |
| 50 | 50 | margin-top: 24px; |
| ... | ... | @@ -64,8 +64,8 @@ |
| 64 | 64 | <div id="table_container"> |
| 65 | 65 | <data-table-controllet id="data_table"></data-table-controllet> |
| 66 | 66 | </div> |
| 67 | - <div id="filters_container"> | |
| 68 | - <filters-controllet id="filters"></filters-controllet> | |
| 67 | + <div id="expert_container"> | |
| 68 | + <expert-query-controllet id="expert"></expert-query-controllet> | |
| 69 | 69 | </div> |
| 70 | 70 | </div> |
| 71 | 71 | </div> |
| ... | ... | @@ -83,7 +83,6 @@ |
| 83 | 83 | dataUrl : { |
| 84 | 84 | type : String, |
| 85 | 85 | value : undefined |
| 86 | -// observer : '_init' | |
| 87 | 86 | }, |
| 88 | 87 | |
| 89 | 88 | data : { |
| ... | ... | @@ -96,6 +95,11 @@ |
| 96 | 95 | value : [] |
| 97 | 96 | }, |
| 98 | 97 | |
| 98 | + aggregators : { | |
| 99 | + type : Array, | |
| 100 | + value : [] | |
| 101 | + }, | |
| 102 | + | |
| 99 | 103 | selectedFields : { |
| 100 | 104 | type : Array, |
| 101 | 105 | value : [] |
| ... | ... | @@ -104,13 +108,13 @@ |
| 104 | 108 | }, |
| 105 | 109 | |
| 106 | 110 | listeners: { |
| 107 | - 'filters-controllet_show': '_resizeFilters', | |
| 111 | + 'expert-controllet_show': '_resizeExpertWindow', | |
| 108 | 112 | 'select-fields-controllet_selected-fields': '_updateFields', |
| 109 | - 'filters-controllet_filters': '_updateFilters' | |
| 113 | + 'filters-controllet_filters': '_updateFilters', | |
| 114 | + 'aggregators-controllet_aggregators': '_updateAggregators' | |
| 110 | 115 | }, |
| 111 | 116 | |
| 112 | 117 | ready : function() { |
| 113 | - this.showFilter = false; | |
| 114 | 118 | }, |
| 115 | 119 | |
| 116 | 120 | attached : function(){ |
| ... | ... | @@ -119,23 +123,47 @@ |
| 119 | 123 | window.addEventListener("resize", function() { that._resize(); }); |
| 120 | 124 | }, |
| 121 | 125 | |
| 126 | + getFields : function() { | |
| 127 | + if(this.aggregators && this.aggregators.length) { | |
| 128 | + var selectedFields = []; | |
| 129 | + for (var i = 0; i < this.aggregators.length; i++) { | |
| 130 | + if(this.aggregators[i]["operation"] == "GROUP BY") | |
| 131 | + selectedFields.push(this.aggregators[i]["field"]); | |
| 132 | + else | |
| 133 | + selectedFields.push(this.aggregators[i]["operation"] + "(" + this.aggregators[i]["field"] + ")"); | |
| 134 | + } | |
| 135 | + return selectedFields; | |
| 136 | + } | |
| 137 | + return this.selectedFields; | |
| 138 | + }, | |
| 139 | + | |
| 122 | 140 | getSelectedFields : function() { |
| 123 | - return utility_getSelectedFields(this.fields, this.selectedFields);; | |
| 141 | + return this.selectedFields; | |
| 124 | 142 | }, |
| 125 | 143 | |
| 126 | 144 | getFilters : function() { |
| 127 | 145 | return this.filters; |
| 128 | 146 | }, |
| 129 | 147 | |
| 148 | + getAggregators : function() { | |
| 149 | + return this.aggregators; | |
| 150 | + }, | |
| 151 | + | |
| 130 | 152 | getData : function() { |
| 131 | - //return datatable.getData | |
| 132 | - //this.fields = "*" | |
| 133 | - var data = alasql_QUERY(this.data, this.fields, this.filters, null, null); | |
| 134 | 153 | var converter = new DataTypeConverter(); |
| 154 | + | |
| 155 | + var data = alasql_QUERY(this.data, this.selectedFields, this.filters, null, null); | |
| 135 | 156 | var result = converter.inferJsonDataType(data, ["*"]); |
| 136 | 157 | result = converter.cast(result); |
| 137 | 158 | data = result.dataset; |
| 138 | 159 | |
| 160 | + if(this.aggregators && this.aggregators.length) { | |
| 161 | + data = alasql_QUERY(data, this.selectedFields, null, this.aggregators, null); | |
| 162 | + result = converter.inferJsonDataType(data, ["*"]); | |
| 163 | + result = converter.cast(result); | |
| 164 | + data = result.dataset; | |
| 165 | + } | |
| 166 | + | |
| 139 | 167 | return data; |
| 140 | 168 | }, |
| 141 | 169 | |
| ... | ... | @@ -147,38 +175,42 @@ |
| 147 | 175 | }, |
| 148 | 176 | |
| 149 | 177 | setFilters : function(filters) { |
| 150 | - this.async(function() { | |
| 151 | - this.$.filters.setFilters(filters); | |
| 152 | - }, 0); | |
| 178 | + this.$.expert.setFilters(filters); | |
| 153 | 179 | }, |
| 154 | 180 | |
| 155 | - _resizeFilters : function() { | |
| 156 | - if(!this.showFilter) { | |
| 181 | + setAggregators : function(aggregators) { | |
| 182 | + this.$.expert.setAggregators(aggregators); | |
| 183 | + }, | |
| 184 | + | |
| 185 | + _resizeExpertWindow : function(e) { | |
| 186 | + if(e.detail.show) { | |
| 157 | 187 | this.$.table_container.style.height = "calc(50% - 12px)"; |
| 158 | - this.$.filters_container.style.height = "calc(50% - 12px)"; | |
| 188 | + this.$.expert_container.style.height = "calc(50% - 12px)"; | |
| 159 | 189 | } |
| 160 | 190 | else { |
| 161 | 191 | this.$.table_container.style.height = "calc(100% - 72px)"; |
| 162 | - this.$.filters_container.style.height = "48px"; | |
| 192 | + this.$.expert_container.style.height = "48px"; | |
| 163 | 193 | } |
| 164 | 194 | |
| 165 | 195 | this.$.data_table._resize(); |
| 166 | - | |
| 167 | - this.showFilter = !this.showFilter; | |
| 168 | 196 | }, |
| 169 | 197 | |
| 170 | 198 | _updateFields : function(e) { |
| 171 | - this.selectedFields = e.detail.selectedFields; | |
| 172 | - var fields = utility_getSelectedFields(this.fields, this.selectedFields); | |
| 173 | - var data = alasql_QUERY(this.data, fields, this.filters, null, null); | |
| 174 | - this.$.data_table.setData(data); | |
| 199 | + var selectedFields = e.detail.selectedFields; | |
| 200 | + this.selectedFields = utility_getSelectedFields(this.fields, selectedFields); | |
| 201 | + this.$.data_table.setData(this.getData()); | |
| 202 | + | |
| 203 | + this.$.expert.setSelectedFields(this.selectedFields); | |
| 175 | 204 | }, |
| 176 | 205 | |
| 177 | 206 | _updateFilters : function(e) { |
| 178 | 207 | this.filters = e.detail.filters; |
| 179 | - var fields = utility_getSelectedFields(this.fields, this.selectedFields); | |
| 180 | - var data = alasql_QUERY(this.data, fields, this.filters, null, null); | |
| 181 | - this.$.data_table.setData(data); | |
| 208 | + this.$.data_table.setData(this.getData()); | |
| 209 | + }, | |
| 210 | + | |
| 211 | + _updateAggregators : function(e) { | |
| 212 | + this.aggregators = e.detail.aggregators; | |
| 213 | + this.$.data_table.setData(this.getData()); | |
| 182 | 214 | }, |
| 183 | 215 | |
| 184 | 216 | init : function() { |
| ... | ... | @@ -204,7 +236,8 @@ |
| 204 | 236 | that.data = alasql_QUERY(data, that.fields, null, null, null); |
| 205 | 237 | |
| 206 | 238 | that.$.select_fields.setFields(that.fields); |
| 207 | - that.$.filters.setFields(that.fields); | |
| 239 | + that.$.expert.setFields(that.fields); | |
| 240 | +// that.$.expert.setSelectedFields(that.selectedFields); | |
| 208 | 241 | |
| 209 | 242 | that.fire('data-ready', {ready : true}); |
| 210 | 243 | }, |
| ... | ... | @@ -225,16 +258,18 @@ |
| 225 | 258 | this.data = alasql_QUERY(data, this.fields, null, null, null); |
| 226 | 259 | |
| 227 | 260 | this.$.select_fields.setFields(this.fields); |
| 228 | - this.$.filters.setFields(this.fields); | |
| 261 | + this.$.expert.setFields(this.fields); | |
| 262 | +// this.$.expert.setSelectedFields(this.selectedFields); | |
| 229 | 263 | } |
| 230 | 264 | }, |
| 231 | 265 | |
| 232 | 266 | reset : function() { |
| 233 | 267 | this.filters = []; |
| 268 | + this.aggregators = []; | |
| 234 | 269 | this.selectedFields = []; |
| 235 | 270 | this.$.select_fields.reset(); |
| 236 | 271 | this.$.data_table.reset(); |
| 237 | - this.$.filters.reset(); | |
| 272 | + this.$.expert.reset(); | |
| 238 | 273 | }, |
| 239 | 274 | |
| 240 | 275 | _resize : function(){ | ... | ... |
controllets/select-data-controllet/select-data-controllet_old.html
0 → 100755
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../select-fields-controllet/select-fields-controllet.html" /> | |
| 4 | +<link rel="import" href="../data-table-controllet/data-table-controllet.html" /> | |
| 5 | +<link rel="import" href="../filters-controllet/filters-controllet.html" /> | |
| 6 | + | |
| 7 | +<link rel="import" href="../providers-utility-controllet/providers-utility-controllet.html" /> | |
| 8 | + | |
| 9 | +<script type="text/javascript" src="../../alasql-utility/alasql.min.js"></script> | |
| 10 | +<script type="text/javascript" src="../../alasql-utility/alasql-utility.js"></script> | |
| 11 | + | |
| 12 | +<script type="text/javascript" src="../../bower_components/jsdatachecker/jsdatachecker.min.js"></script> | |
| 13 | + | |
| 14 | +<dom-module id="select-data-controllet"> | |
| 15 | + | |
| 16 | + <style is="custom-style"> | |
| 17 | + | |
| 18 | + #select_data_controllet_container { | |
| 19 | + display: flex; | |
| 20 | + flex-direction: row; | |
| 21 | + margin-top: 8px; | |
| 22 | + } | |
| 23 | + | |
| 24 | + #select_data_controllet_container * { | |
| 25 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 26 | + font-size: 16px; | |
| 27 | + line-height: 24px; | |
| 28 | + } | |
| 29 | + | |
| 30 | + #select_data_controllet_container #fields_container { | |
| 31 | + height: 100%; | |
| 32 | + width: 20%; | |
| 33 | + min-width: 192px; | |
| 34 | + } | |
| 35 | + | |
| 36 | + #select_data_controllet_container #right_container { | |
| 37 | + height: 100%; | |
| 38 | + width: calc(80% - 24px); | |
| 39 | + margin-left: 24px; | |
| 40 | + } | |
| 41 | + | |
| 42 | + #select_data_controllet_container #table_container { | |
| 43 | + height: calc(100% - 72px); | |
| 44 | + width: 100%; | |
| 45 | + } | |
| 46 | + | |
| 47 | + #select_data_controllet_container #filters_container { | |
| 48 | + height: 48px; | |
| 49 | + width: 100%; | |
| 50 | + margin-top: 24px; | |
| 51 | + } | |
| 52 | + | |
| 53 | + </style> | |
| 54 | + | |
| 55 | + <template> | |
| 56 | + | |
| 57 | + <providers-utility-controllet></providers-utility-controllet> | |
| 58 | + | |
| 59 | + <div id="select_data_controllet_container"> | |
| 60 | + <div id="fields_container"> | |
| 61 | + <select-fields-controllet id="select_fields"></select-fields-controllet> | |
| 62 | + </div> | |
| 63 | + <div id="right_container"> | |
| 64 | + <div id="table_container"> | |
| 65 | + <data-table-controllet id="data_table"></data-table-controllet> | |
| 66 | + </div> | |
| 67 | + <div id="filters_container"> | |
| 68 | + <filters-controllet id="filters"></filters-controllet> | |
| 69 | + </div> | |
| 70 | + </div> | |
| 71 | + </div> | |
| 72 | + | |
| 73 | + | |
| 74 | + </template> | |
| 75 | + | |
| 76 | + <script> | |
| 77 | + Polymer({ | |
| 78 | + | |
| 79 | + is : 'select-data-controllet', | |
| 80 | + | |
| 81 | + properties : { | |
| 82 | + | |
| 83 | + dataUrl : { | |
| 84 | + type : String, | |
| 85 | + value : undefined | |
| 86 | +// observer : '_init' | |
| 87 | + }, | |
| 88 | + | |
| 89 | + data : { | |
| 90 | + type : Object, | |
| 91 | + value : undefined | |
| 92 | + }, | |
| 93 | + | |
| 94 | + filters : { | |
| 95 | + type : Array, | |
| 96 | + value : [] | |
| 97 | + }, | |
| 98 | + | |
| 99 | + selectedFields : { | |
| 100 | + type : Array, | |
| 101 | + value : [] | |
| 102 | + } | |
| 103 | + | |
| 104 | + }, | |
| 105 | + | |
| 106 | + listeners: { | |
| 107 | + 'filters-controllet_show': '_resizeFilters', | |
| 108 | + 'select-fields-controllet_selected-fields': '_updateFields', | |
| 109 | + 'filters-controllet_filters': '_updateFilters' | |
| 110 | + }, | |
| 111 | + | |
| 112 | + ready : function() { | |
| 113 | + this.showFilter = false; | |
| 114 | + }, | |
| 115 | + | |
| 116 | + attached : function(){ | |
| 117 | + this._resize(); | |
| 118 | + var that = this; | |
| 119 | + window.addEventListener("resize", function() { that._resize(); }); | |
| 120 | + }, | |
| 121 | + | |
| 122 | + getSelectedFields : function() { | |
| 123 | + return utility_getSelectedFields(this.fields, this.selectedFields);; | |
| 124 | + }, | |
| 125 | + | |
| 126 | + getFilters : function() { | |
| 127 | + return this.filters; | |
| 128 | + }, | |
| 129 | + | |
| 130 | + getData : function() { | |
| 131 | + //return datatable.getData | |
| 132 | + //this.fields = "*" | |
| 133 | + var data = alasql_QUERY(this.data, this.fields, this.filters, null, null); | |
| 134 | + var converter = new DataTypeConverter(); | |
| 135 | + var result = converter.inferJsonDataType(data, ["*"]); | |
| 136 | + result = converter.cast(result); | |
| 137 | + data = result.dataset; | |
| 138 | + | |
| 139 | + return data; | |
| 140 | + }, | |
| 141 | + | |
| 142 | + setSelectedFields : function(selectedFields) { | |
| 143 | + this.async(function() { | |
| 144 | + var selectedIndices = utility_getSelectedIndices(this.fields, selectedFields); | |
| 145 | + this.$.select_fields.setSelectFields(selectedIndices); | |
| 146 | + }, 0); | |
| 147 | + }, | |
| 148 | + | |
| 149 | + setFilters : function(filters) { | |
| 150 | + this.async(function() { | |
| 151 | + this.$.filters.setFilters(filters); | |
| 152 | + }, 0); | |
| 153 | + }, | |
| 154 | + | |
| 155 | + _resizeFilters : function() { | |
| 156 | + if(!this.showFilter) { | |
| 157 | + this.$.table_container.style.height = "calc(50% - 12px)"; | |
| 158 | + this.$.filters_container.style.height = "calc(50% - 12px)"; | |
| 159 | + } | |
| 160 | + else { | |
| 161 | + this.$.table_container.style.height = "calc(100% - 72px)"; | |
| 162 | + this.$.filters_container.style.height = "48px"; | |
| 163 | + } | |
| 164 | + | |
| 165 | + this.$.data_table._resize(); | |
| 166 | + | |
| 167 | + this.showFilter = !this.showFilter; | |
| 168 | + }, | |
| 169 | + | |
| 170 | + _updateFields : function(e) { | |
| 171 | + this.selectedFields = e.detail.selectedFields; | |
| 172 | + var fields = utility_getSelectedFields(this.fields, this.selectedFields); | |
| 173 | + var data = alasql_QUERY(this.data, fields, this.filters, null, null); | |
| 174 | + this.$.data_table.setData(data); | |
| 175 | + }, | |
| 176 | + | |
| 177 | + _updateFilters : function(e) { | |
| 178 | + this.filters = e.detail.filters; | |
| 179 | + var fields = utility_getSelectedFields(this.fields, this.selectedFields); | |
| 180 | + var data = alasql_QUERY(this.data, fields, this.filters, null, null); | |
| 181 | + this.$.data_table.setData(data); | |
| 182 | + }, | |
| 183 | + | |
| 184 | + init : function() { | |
| 185 | + if(this.dataUrl) { | |
| 186 | + | |
| 187 | + var that = this; | |
| 188 | + | |
| 189 | + $.ajax({ | |
| 190 | + url: this.dataUrl, | |
| 191 | + dataType: "json", | |
| 192 | + success: function(data){ | |
| 193 | + that.reset(); | |
| 194 | + | |
| 195 | + var f = Object.create(providerFactory); | |
| 196 | + var provider = f.getProvider(that.dataUrl); | |
| 197 | + data = provider.selectData(data); | |
| 198 | + | |
| 199 | + var converter = new DataTypeConverter(); | |
| 200 | + var result = converter.inferJsonDataType(data, ["*"]); | |
| 201 | + result = converter.cast(result); | |
| 202 | + that.fields = utility_getFields(result.types); | |
| 203 | + data = result.dataset; | |
| 204 | + that.data = alasql_QUERY(data, that.fields, null, null, null); | |
| 205 | + | |
| 206 | + that.$.select_fields.setFields(that.fields); | |
| 207 | + that.$.filters.setFields(that.fields); | |
| 208 | + | |
| 209 | + that.fire('data-ready', {ready : true}); | |
| 210 | + }, | |
| 211 | + error: function(){ | |
| 212 | + that.fire('data-ready', {ready : false}); | |
| 213 | + } | |
| 214 | + }); | |
| 215 | + } | |
| 216 | + | |
| 217 | + else { | |
| 218 | + this.reset(); | |
| 219 | + | |
| 220 | + var converter = new DataTypeConverter(); | |
| 221 | + var result = converter.inferJsonDataType(this.data, ["*"]); | |
| 222 | + result = converter.cast(result); | |
| 223 | + this.fields = utility_getFields(result.types); | |
| 224 | + data = result.dataset; | |
| 225 | + this.data = alasql_QUERY(data, this.fields, null, null, null); | |
| 226 | + | |
| 227 | + this.$.select_fields.setFields(this.fields); | |
| 228 | + this.$.filters.setFields(this.fields); | |
| 229 | + } | |
| 230 | + }, | |
| 231 | + | |
| 232 | + reset : function() { | |
| 233 | + this.filters = []; | |
| 234 | + this.selectedFields = []; | |
| 235 | + this.$.select_fields.reset(); | |
| 236 | + this.$.data_table.reset(); | |
| 237 | + this.$.filters.reset(); | |
| 238 | + }, | |
| 239 | + | |
| 240 | + _resize : function(){ | |
| 241 | + var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; | |
| 242 | + h = h - 64 - 8; //height with page scroller + margin-top | |
| 243 | + $("#select_data_controllet_container").height(h); | |
| 244 | + } | |
| 245 | + | |
| 246 | + }); | |
| 247 | + | |
| 248 | + </script> | |
| 249 | + | |
| 250 | +</dom-module> | |
| 0 | 251 | \ No newline at end of file | ... | ... |
controllets/select-fields-controllet/select-fields-controllet.html
| ... | ... | @@ -28,6 +28,10 @@ |
| 28 | 28 | cursor: pointer; |
| 29 | 29 | } |
| 30 | 30 | |
| 31 | + #select_fields_controllet_container #header:hover { | |
| 32 | + color: #2196F3; | |
| 33 | + } | |
| 34 | + | |
| 31 | 35 | #select_fields_controllet_container #menu_container { |
| 32 | 36 | position: relative; |
| 33 | 37 | height: calc(100% - 48px); |
| ... | ... | @@ -42,6 +46,14 @@ |
| 42 | 46 | cursor: pointer; |
| 43 | 47 | color: #000000; |
| 44 | 48 | margin: 4px; |
| 49 | + padding: 0px 12px; | |
| 50 | + } | |
| 51 | + | |
| 52 | + paper-item span { | |
| 53 | + width: 100%; | |
| 54 | + overflow: hidden; | |
| 55 | + white-space: nowrap; | |
| 56 | + text-overflow: ellipsis; | |
| 45 | 57 | } |
| 46 | 58 | |
| 47 | 59 | paper-item.iron-selected { |
| ... | ... | @@ -73,7 +85,7 @@ |
| 73 | 85 | <div id="menu_container"> |
| 74 | 86 | <paper-menu id="menu" multi> |
| 75 | 87 | <template is="dom-repeat" items="{{fields}}"> |
| 76 | - <paper-item>{{item}}</paper-item> | |
| 88 | + <paper-item title="{{item}}"><span>{{item}}</span></paper-item> | |
| 77 | 89 | </template> |
| 78 | 90 | </paper-menu> |
| 79 | 91 | </div> |
| ... | ... | @@ -92,12 +104,8 @@ |
| 92 | 104 | fields : { |
| 93 | 105 | type : Array, |
| 94 | 106 | value : [] |
| 95 | - }, | |
| 107 | + } | |
| 96 | 108 | |
| 97 | -// preselectedFields : { | |
| 98 | -// type : Array, | |
| 99 | -// value : [] | |
| 100 | -// } | |
| 101 | 109 | }, |
| 102 | 110 | |
| 103 | 111 | listeners: { |
| ... | ... | @@ -110,13 +118,13 @@ |
| 110 | 118 | |
| 111 | 119 | attached : function() { |
| 112 | 120 | this._translate(); |
| 113 | - | |
| 114 | -// if (this.preselectedFields.length > 0) | |
| 115 | -// this._preselectFields(); | |
| 116 | 121 | }, |
| 117 | 122 | |
| 118 | 123 | setFields : function(fields) { |
| 119 | - this.fields = fields; | |
| 124 | + var index = fields.indexOf("_id"); | |
| 125 | + if(index > -1) | |
| 126 | + fields.splice(index, 1);//providers_utility _copy | |
| 127 | + this.fields = fields.sort(); | |
| 120 | 128 | }, |
| 121 | 129 | |
| 122 | 130 | setSelectFields : function(selectFields) { |
| ... | ... | @@ -134,12 +142,6 @@ |
| 134 | 142 | this.$.fields.innerHTML = ln["fields_" + ln["localization"]]; |
| 135 | 143 | }, |
| 136 | 144 | |
| 137 | -// _preselectFields : function() { | |
| 138 | -// for(var i=0; i<this.preselectedFields.length; i++) | |
| 139 | -// this.$.menu.select(this.preselectedFields[i]); | |
| 140 | -// this._fireSelectedFields(); | |
| 141 | -// }, | |
| 142 | - | |
| 143 | 145 | _fireSelectedFields : function() { |
| 144 | 146 | this.debounce('_fireSelectedFields', function () { |
| 145 | 147 | this.fire('select-fields-controllet_selected-fields', {selectedFields: this.$.menu.selectedValues}); | ... | ... |
controllets/select-inputs-controllet/demo/index.html
0 → 100644
| 1 | +<!DOCTYPE html> | |
| 2 | +<html lang="en"> | |
| 3 | +<head> | |
| 4 | + <meta charset="UTF-8"> | |
| 5 | + <title></title> | |
| 6 | +</head> | |
| 7 | +<body> | |
| 8 | + | |
| 9 | +</body> | |
| 10 | +</html> | |
| 11 | + | |
| 12 | +// value : [{field: "x", type: "NUMBER"}, {field: "cat", type: "TEXT"}, {field: "testo", type: "TEXT"}, {field: "y", type: "NUMBER"}, {field: "testo", type: "TEXT"}, {field: "testo", type: "TEXT"}] | |
| 0 | 13 | \ No newline at end of file | ... | ... |
controllets/select-inputs-controllet/select-inputs-controllet.html
0 → 100644
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | + | |
| 5 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html"> | |
| 6 | +<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html"> | |
| 7 | + | |
| 8 | +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"> | |
| 9 | +<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> | |
| 10 | +<link rel="import" href="../../bower_components/neon-animation/neon-animations.html"> | |
| 11 | + | |
| 12 | +<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> | |
| 13 | +<link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> | |
| 14 | +<link rel="import" href="../../bower_components/paper-item/paper-item.html"> | |
| 15 | + | |
| 16 | +<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html"> | |
| 17 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> | |
| 18 | +<link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> | |
| 19 | + | |
| 20 | +<link rel="import" href="../../bower_components/paper-tooltip/paper-tooltip.html"> | |
| 21 | + | |
| 22 | +<dom-module id="select-inputs-controllet"> | |
| 23 | + | |
| 24 | + <template> | |
| 25 | + | |
| 26 | + <style is="custom-style"> | |
| 27 | + :host { | |
| 28 | + --paper-dropdown-menu-icon: { | |
| 29 | + color: #2196F3; | |
| 30 | + }; | |
| 31 | + } | |
| 32 | + | |
| 33 | + #inputs_container { | |
| 34 | + height: 100%; | |
| 35 | + width: 100%; | |
| 36 | + } | |
| 37 | + | |
| 38 | + #inputs_container * { | |
| 39 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 40 | + font-size: 16px; | |
| 41 | + line-height: 24px; | |
| 42 | + } | |
| 43 | + | |
| 44 | + #inputs_container #neon_container { | |
| 45 | + height: calc(100% - 48px - 120px - 48px); | |
| 46 | + width: 100%; | |
| 47 | + } | |
| 48 | + | |
| 49 | + #inputs_container #inputs_list, #inputs_container #options_list { | |
| 50 | + position: relative; | |
| 51 | + height: 100%; | |
| 52 | + width: 100%; | |
| 53 | + } | |
| 54 | + | |
| 55 | + #inputs_container .header { | |
| 56 | + height: 24px; | |
| 57 | + padding: 12px; | |
| 58 | + text-align: center; | |
| 59 | + font-weight: 700; | |
| 60 | + background-color: #B6B6B6; | |
| 61 | + } | |
| 62 | + | |
| 63 | + #inputs_container .inputs{ | |
| 64 | + display: flex; | |
| 65 | + } | |
| 66 | + | |
| 67 | + #inputs_container br { | |
| 68 | + display: block; | |
| 69 | + margin-top: 8px; | |
| 70 | + content: " "; | |
| 71 | + } | |
| 72 | + | |
| 73 | + #inputs_container p { | |
| 74 | + margin: 0; | |
| 75 | + padding: 0; | |
| 76 | + } | |
| 77 | + | |
| 78 | + #inputs_container p .title{ | |
| 79 | + font-weight: 700; | |
| 80 | + color: #2196F3; | |
| 81 | + white-space: nowrap; | |
| 82 | + } | |
| 83 | + | |
| 84 | + #inputs_container p .description{ | |
| 85 | + } | |
| 86 | + | |
| 87 | + #inputs_container .info_button { | |
| 88 | + height: 40px; | |
| 89 | + width: 40px; | |
| 90 | + padding: 10px; | |
| 91 | + } | |
| 92 | + | |
| 93 | + #inputs_container .order_button { | |
| 94 | + height: 40px; | |
| 95 | + width: 40px; | |
| 96 | + padding: 10px 0 10px 10px; | |
| 97 | + } | |
| 98 | + | |
| 99 | + #inputs_container #base_description_info { | |
| 100 | + margin-top: -4px; | |
| 101 | + } | |
| 102 | + | |
| 103 | + paper-input { | |
| 104 | + width: calc(100% - 24px - 48px); | |
| 105 | + margin-left: 12px; | |
| 106 | + --paper-input-container-focus-color: #2196F3; | |
| 107 | + } | |
| 108 | + | |
| 109 | + paper-input#description{ | |
| 110 | + margin-top: -4px; | |
| 111 | + } | |
| 112 | + | |
| 113 | + #inputs_list paper-dropdown-menu { | |
| 114 | + width: calc(100% - 24px - 48px - 50px); | |
| 115 | + margin-left: 12px; | |
| 116 | + --paper-input-container-focus-color: #2196F3; | |
| 117 | + } | |
| 118 | + | |
| 119 | + #options_list paper-dropdown-menu { | |
| 120 | + width: calc(100% - 24px - 48px); | |
| 121 | + margin-left: 12px; | |
| 122 | + --paper-input-container-focus-color: #2196F3; | |
| 123 | + } | |
| 124 | + | |
| 125 | + paper-item { | |
| 126 | + min-width: 128px; | |
| 127 | + white-space: nowrap; | |
| 128 | + } | |
| 129 | + | |
| 130 | + paper-item.iron-selected { | |
| 131 | + background-color: #2196F3; | |
| 132 | + color: #FFFFFF; | |
| 133 | + } | |
| 134 | + | |
| 135 | + paper-icon-button { | |
| 136 | + height: 40px; | |
| 137 | + width: 40px; | |
| 138 | + padding: 4px; | |
| 139 | + color: #2196F3; | |
| 140 | + --paper-icon-button-ink-color: #2196F3; | |
| 141 | + } | |
| 142 | + | |
| 143 | + paper-icon-button[icon="info-outline"] { | |
| 144 | + cursor: help; | |
| 145 | + } | |
| 146 | + | |
| 147 | + paper-tooltip { | |
| 148 | + min-width: 400px; | |
| 149 | + --paper-tooltip-background: black; | |
| 150 | + } | |
| 151 | + | |
| 152 | + paper-tooltip.order { | |
| 153 | + min-width: 0; | |
| 154 | + white-space: nowrap; | |
| 155 | + } | |
| 156 | + | |
| 157 | + paper-tabs { | |
| 158 | + background: #B6B6B6; | |
| 159 | + /*--paper-tabs-selection-bar-color: #00BCD4;*/ | |
| 160 | + } | |
| 161 | + | |
| 162 | + paper-tab { | |
| 163 | + font-weight: 700; | |
| 164 | + border-right: 2px solid #FFFFFF; | |
| 165 | + /*--paper-tab-ink: #2196F3;*/ | |
| 166 | + } | |
| 167 | + | |
| 168 | + paper-tab:nth-child(2) { | |
| 169 | + border-right: 0; | |
| 170 | + } | |
| 171 | + | |
| 172 | + paper-tab.iron-selected { | |
| 173 | + color: #FFFFFF; | |
| 174 | + background: #2196F3;; | |
| 175 | + } | |
| 176 | + | |
| 177 | + paper-tab:not(.iron-selected):hover { | |
| 178 | + color: #2196F3; | |
| 179 | + } | |
| 180 | + | |
| 181 | + </style> | |
| 182 | + | |
| 183 | + <paper-material id="inputs_container" elevation="5"> | |
| 184 | + | |
| 185 | + <div class="header"><span id="baseInfo"></span></div> | |
| 186 | + | |
| 187 | + <div class="inputs"> | |
| 188 | + <paper-input id="title" maxlength="32" on-change="_addOption"></paper-input> | |
| 189 | + <div class="info_button"> | |
| 190 | + <paper-icon-button id="base_title_info" icon="info-outline" noink></paper-icon-button> | |
| 191 | + </div> | |
| 192 | + <paper-tooltip for="base_title_info" position="right" offset="22"> | |
| 193 | + <p> | |
| 194 | + <span class="title">{{_getInputName('TITLE')}}</span> | |
| 195 | + <br> | |
| 196 | + <span class="description">{{_getInputDescription('TITLE')}}</span> | |
| 197 | + </p> | |
| 198 | + </paper-tooltip> | |
| 199 | + </div> | |
| 200 | + | |
| 201 | + <div class="inputs"> | |
| 202 | + <paper-input id="description" maxlength="128" on-change="_addOption"></paper-input> | |
| 203 | + <div class="info_button"> | |
| 204 | + <paper-icon-button id="base_description_info" icon="info-outline" noink></paper-icon-button> | |
| 205 | + </div> | |
| 206 | + <paper-tooltip for="base_description_info" position="right" offset="22"> | |
| 207 | + <p> | |
| 208 | + <span class="title">{{_getInputName('DESCRIPTION')}}</span> | |
| 209 | + <br> | |
| 210 | + <span class="description">{{_getInputDescription('DESCRIPTION')}}</span> | |
| 211 | + </p> | |
| 212 | + </paper-tooltip> | |
| 213 | + </div> | |
| 214 | + | |
| 215 | + <paper-tabs selected="{{tabIndex}}" no-bar> | |
| 216 | + <paper-tab noink><span id="inputsTab"></span></paper-tab> | |
| 217 | + <paper-tab noink><span id="optionsTab"></span></paper-tab> | |
| 218 | + </paper-tabs> | |
| 219 | + | |
| 220 | + <neon-animated-pages id="neon_container" selected="{{_getNeonIndex(tabIndex)}}" entry-animation="fade-in-animation" exit-animation="fade-out-animation"> | |
| 221 | + | |
| 222 | + <neon-animatable> | |
| 223 | + | |
| 224 | + <div id="inputs_list"> | |
| 225 | + <template is="dom-repeat" items="{{inputs}}" index-as="input_index"> | |
| 226 | + <div class="inputs"> | |
| 227 | + <paper-dropdown-menu id="{{input_index}}" label="{{_getInputRichName(item)}}"> | |
| 228 | + <paper-menu class="dropdown-content"> | |
| 229 | + <paper-item on-tap="_removeInput"></paper-item> | |
| 230 | + <template is="dom-repeat" items={{_getFieldsByType(item.type)}}> | |
| 231 | + <paper-item id="{{index}}" on-tap="_addInput">{{item.name}}</paper-item> | |
| 232 | + </template> | |
| 233 | + </paper-menu> | |
| 234 | + </paper-dropdown-menu> | |
| 235 | + <div class="order_button"> | |
| 236 | + <paper-icon-button id="order_input_{{input_index}}" icon="unfold-more" on-click="_addOrder" disabled></paper-icon-button> | |
| 237 | + </div> | |
| 238 | + <div class="info_button"> | |
| 239 | + <paper-icon-button id="info_input_{{input_index}}" icon="info-outline" noink></paper-icon-button> | |
| 240 | + </div> | |
| 241 | + </div> | |
| 242 | + </template> | |
| 243 | + </div> | |
| 244 | + | |
| 245 | + <template is="dom-repeat" items="{{inputs}}"> | |
| 246 | + <paper-tooltip for="{{_getInputInfoId(index)}}" position="right" offset="22"> | |
| 247 | + <p> | |
| 248 | + <span class="title">{{_getInputRichName(item)}}</span> | |
| 249 | + <br> | |
| 250 | + <span class="description">{{_getInputDescription(item.name)}}</span> | |
| 251 | + </p> | |
| 252 | + </paper-tooltip> | |
| 253 | + | |
| 254 | + <paper-tooltip class="order" for="{{_getInputOrderId(index)}}" position="right" offset="22"> | |
| 255 | + <p> | |
| 256 | + <span id="order_{{index}}">{{_getInputOrder(index)}}</span> | |
| 257 | + </p> | |
| 258 | + </paper-tooltip> | |
| 259 | + </template> | |
| 260 | + | |
| 261 | + </neon-animatable> | |
| 262 | + | |
| 263 | + <neon-animatable> | |
| 264 | + | |
| 265 | + <div id="options_list"> | |
| 266 | + <template is="dom-repeat" items={{options}} index-as="option_index"> | |
| 267 | + <div class="inputs"> | |
| 268 | + <template is="dom-if" if="{{_checkType(item.type, 'TEXT')}}"> | |
| 269 | + <paper-input id="{{item.name}}" label={{_getInputName(item.name)}} on-change="_addOption"></paper-input> | |
| 270 | + </template> | |
| 271 | + | |
| 272 | + <template is="dom-if" if="{{_checkType(item.type, 'LIST')}}"> | |
| 273 | + <paper-dropdown-menu id="{{option_index}}" label={{_getInputName(item.name)}}> | |
| 274 | + <paper-menu class="dropdown-content" selected="0"> | |
| 275 | + <template is="dom-repeat" items={{item.list.item}}> | |
| 276 | + <paper-item id="{{item}}" on-tap="_addOption">{{_getInputName(item)}}</paper-item> | |
| 277 | + </template> | |
| 278 | + </paper-menu> | |
| 279 | + </paper-dropdown-menu> | |
| 280 | + </template> | |
| 281 | + | |
| 282 | + <div class="info_button"> | |
| 283 | + <paper-icon-button id="info_option_{{option_index}}" icon="info-outline" noink></paper-icon-button> | |
| 284 | + </div> | |
| 285 | + </div> | |
| 286 | + </template> | |
| 287 | + </div> | |
| 288 | + | |
| 289 | + <template is="dom-repeat" items="{{options}}"> | |
| 290 | + <paper-tooltip for="{{_getOptionInfoId(index)}}" position="right" offset="22"> | |
| 291 | + <p> | |
| 292 | + <span class="title">{{_getInputName(item.name)}}</span> | |
| 293 | + <br> | |
| 294 | + <span class="description">{{_getInputDescription(item.name)}}</span> | |
| 295 | + </p> | |
| 296 | + </paper-tooltip> | |
| 297 | + </template> | |
| 298 | + | |
| 299 | + </neon-animatable> | |
| 300 | + | |
| 301 | + </neon-animated-pages> | |
| 302 | + | |
| 303 | + </paper-material> | |
| 304 | + | |
| 305 | + | |
| 306 | + </template> | |
| 307 | + | |
| 308 | + <script> | |
| 309 | + | |
| 310 | + Polymer({ | |
| 311 | + | |
| 312 | + is : 'select-inputs-controllet', | |
| 313 | + | |
| 314 | + properties : { | |
| 315 | + | |
| 316 | + tabIndex: { | |
| 317 | + type: Number, | |
| 318 | + value: 0 | |
| 319 | + }, | |
| 320 | + | |
| 321 | + inputs : { | |
| 322 | + type : Array, | |
| 323 | + value : [] | |
| 324 | + }, | |
| 325 | + | |
| 326 | + options : { | |
| 327 | + type : Array, | |
| 328 | + value : [] | |
| 329 | + }, | |
| 330 | + | |
| 331 | + selectedInputs : { | |
| 332 | + type : Array, | |
| 333 | + value : [] | |
| 334 | + }, | |
| 335 | + | |
| 336 | + selectedOptions : { | |
| 337 | + type : Array, | |
| 338 | + value : [] | |
| 339 | + }, | |
| 340 | + | |
| 341 | + orders : { | |
| 342 | + type : Array, | |
| 343 | + value : [] | |
| 344 | + }, | |
| 345 | + | |
| 346 | + fields : { | |
| 347 | + type : Array, | |
| 348 | + value : [] | |
| 349 | + } | |
| 350 | + | |
| 351 | + }, | |
| 352 | + | |
| 353 | + ready : function() { | |
| 354 | + $(this.$.inputs_list).perfectScrollbar(); | |
| 355 | + $(this.$.options_list).perfectScrollbar(); | |
| 356 | + }, | |
| 357 | + | |
| 358 | + attached : function() { | |
| 359 | + this._translate(); | |
| 360 | + }, | |
| 361 | + | |
| 362 | + getSelectedInputs : function () { | |
| 363 | + return this.selectedInputs; | |
| 364 | + }, | |
| 365 | + | |
| 366 | + getSelectedOptions : function () { | |
| 367 | + return this.selectedOptions; | |
| 368 | + }, | |
| 369 | + | |
| 370 | + getOrders : function () { | |
| 371 | + return this.orders; | |
| 372 | + }, | |
| 373 | + | |
| 374 | + setFields : function(fields) { | |
| 375 | + this.fields = this._copy(fields); | |
| 376 | + }, | |
| 377 | + | |
| 378 | + setInputs : function(idm) { | |
| 379 | + var inputs = this._copy(idm.inputs.input); | |
| 380 | + var options = []; | |
| 381 | + if(idm.inputs.layouts) | |
| 382 | + options = this._copy(idm.inputs.layouts.input); | |
| 383 | + | |
| 384 | + if(!(inputs instanceof Array)) | |
| 385 | + inputs = [inputs]; | |
| 386 | + | |
| 387 | + if(!(options instanceof Array)) | |
| 388 | + options = [options]; | |
| 389 | + | |
| 390 | + var mandatory = 0; | |
| 391 | + var multi = -1; | |
| 392 | + var opt = 0; | |
| 393 | + for (var i = 0; i < inputs.length; i++){ | |
| 394 | + switch(inputs[i].selection) { | |
| 395 | + case "*": | |
| 396 | + multi = i; | |
| 397 | + break; | |
| 398 | + case "?": | |
| 399 | + opt++; | |
| 400 | + break; | |
| 401 | + default: | |
| 402 | + mandatory++; | |
| 403 | + } | |
| 404 | + } | |
| 405 | + if(multi > -1) { | |
| 406 | + var input = inputs[multi]; | |
| 407 | + for (var i = 0; i < this.fields.length - mandatory - 1; i++) | |
| 408 | + inputs.splice(multi, 0, input); | |
| 409 | + } | |
| 410 | + | |
| 411 | + this.tabIndex = -1; | |
| 412 | + this._reset(); | |
| 413 | + | |
| 414 | + this.async(function () { | |
| 415 | + this.inputs = inputs; | |
| 416 | + this.options = options; | |
| 417 | + }, 0); | |
| 418 | + | |
| 419 | + this.selectedInputs = new Array(inputs.length).fill(null); | |
| 420 | + for (var i = 0; i < options.length; i++) { | |
| 421 | + if(options[i].type != "LIST") | |
| 422 | + this.selectedOptions[options[i].name] = ""; | |
| 423 | + else | |
| 424 | + this.selectedOptions[options[i].name] = options[i].list.item[0]; | |
| 425 | + } | |
| 426 | + }, | |
| 427 | + | |
| 428 | + _translate : function(){ | |
| 429 | + this.$.baseInfo.innerHTML = ln["baseInfo_" + ln["localization"]]; | |
| 430 | + this.$.inputsTab.innerHTML = ln["inputs_" + ln["localization"]]; | |
| 431 | + this.$.optionsTab.innerHTML = ln["options_" + ln["localization"]]; | |
| 432 | + | |
| 433 | + this.$.title.label = ln["title_" + ln["localization"]]; | |
| 434 | + this.$.description.label = ln["description_" + ln["localization"]]; | |
| 435 | + }, | |
| 436 | + | |
| 437 | + _preselectInputs : function(dataletPreset) { | |
| 438 | + this.selectedInputs = JSON.parse(dataletPreset.selectedfields); | |
| 439 | + var ddls = this.$.inputs_list.querySelectorAll("paper-dropdown-menu"); | |
| 440 | + | |
| 441 | + for (var i = 0; i < ddls.length; i++) | |
| 442 | + if(this.selectedInputs[i]) { | |
| 443 | + $(ddls[i]).find("paper-menu")[0].select(this.selectedInputs[i].index); | |
| 444 | + var icon = this.$.inputs_list.querySelectorAll("paper-icon-button")[ddls[i].id * 2]; | |
| 445 | + icon.setAttribute("icon", "unfold-more"); //wrong | |
| 446 | + icon.removeAttribute("disabled"); | |
| 447 | + } | |
| 448 | + | |
| 449 | + this.orders = JSON.parse(dataletPreset.orders); | |
| 450 | + | |
| 451 | + var selectedOptions = []; | |
| 452 | + var inputs = this.$.options_list.querySelectorAll("paper-input"); | |
| 453 | + | |
| 454 | + for (var i = 0; i < inputs.length; i++) { | |
| 455 | + if (dataletPreset[this.options[i].name]) { | |
| 456 | + inputs[i].value = dataletPreset[this.options[i].name]; | |
| 457 | + selectedOptions[this.options[i].name] = dataletPreset[this.options[i].name]; | |
| 458 | + } | |
| 459 | + } | |
| 460 | + if(dataletPreset["title"]) { | |
| 461 | + this.$.title.value = dataletPreset["title"]; | |
| 462 | + selectedOptions["title"] = dataletPreset["title"]; | |
| 463 | + } | |
| 464 | + if(dataletPreset["description"]) { | |
| 465 | + this.$.description.value = dataletPreset["description"]; | |
| 466 | + selectedOptions["description"] = dataletPreset["description"]; | |
| 467 | + } | |
| 468 | + | |
| 469 | + this.selectedOptions = this._copy(selectedOptions); | |
| 470 | + | |
| 471 | + this._fire(); | |
| 472 | + }, | |
| 473 | + | |
| 474 | + _reset : function() { | |
| 475 | + this.tabIndex = 0; | |
| 476 | + this.inputs = []; | |
| 477 | + this.options = []; | |
| 478 | + this.selectedInputs = []; | |
| 479 | + this.selectedOptions = []; | |
| 480 | + this.orders = []; | |
| 481 | + }, | |
| 482 | + | |
| 483 | + _addInput : function(e) { | |
| 484 | + var inputIndex = $(e.target).parents("paper-dropdown-menu")[0].id; | |
| 485 | + var fields = this._getFieldsByType(this.inputs[inputIndex].type); | |
| 486 | + var fieldIndex = e.target.id; | |
| 487 | + this.selectedInputs[inputIndex] = {field: this.inputs[inputIndex].name, value : fields[fieldIndex].name, index : parseInt(fieldIndex) + 1}; | |
| 488 | + | |
| 489 | + var icon = this.$.inputs_list.querySelectorAll("paper-icon-button")[inputIndex * 2]; | |
| 490 | + //this.orders = this.orders.filter(function (el) { return el.field !== field???; }); | |
| 491 | + icon.setAttribute("icon", "unfold-more"); | |
| 492 | + icon.removeAttribute("disabled"); | |
| 493 | + | |
| 494 | + this._fire(); | |
| 495 | + }, | |
| 496 | + | |
| 497 | + _removeInput : function(e) { | |
| 498 | + var inputIndex = $(e.target).parents("paper-dropdown-menu")[0].id; | |
| 499 | + this.selectedInputs[inputIndex] = null; | |
| 500 | + | |
| 501 | + var icon = this.$.inputs_list.querySelectorAll("paper-icon-button")[inputIndex * 2]; | |
| 502 | + //this.orders = this.orders.filter(function (el) { return el.field !== field???; }); | |
| 503 | + icon.setAttribute("icon", "unfold-more"); | |
| 504 | + icon.setAttribute("disabled", true); | |
| 505 | + | |
| 506 | + this._fire(); | |
| 507 | + }, | |
| 508 | + | |
| 509 | + _addOrder : function(e) { | |
| 510 | + var t = e.target; | |
| 511 | + if(t.tagName.indexOf("IRON-ICON") > -1) | |
| 512 | + t = $(e.target).parents("paper-icon-button")[0]; | |
| 513 | + | |
| 514 | + var icon = t.getAttribute("icon"); | |
| 515 | + var id = t.getAttribute("id").replace("order_input_", ""); | |
| 516 | + var field = this.selectedInputs[id].value; | |
| 517 | + var tooltip = $("#order_"+id)[0]; | |
| 518 | + | |
| 519 | + this.orders = this.orders.filter(function (el) { return el.field !== field; }); | |
| 520 | + | |
| 521 | + if(icon.indexOf("unfold-more") > -1){ | |
| 522 | + t.setAttribute("icon", "expand-less"); | |
| 523 | + tooltip.innerHTML = ln["sortAscending_" +ln["localization"]]; | |
| 524 | + this.orders.unshift({"field": field, "operation": "ASC"}); | |
| 525 | + } | |
| 526 | + else if(icon.indexOf("expand-less") > -1){ | |
| 527 | + t.setAttribute("icon", "expand-more"); | |
| 528 | + tooltip.innerHTML = ln["sortDescending_" +ln["localization"]]; | |
| 529 | + this.orders.unshift({"field": field, "operation": "DESC"}); | |
| 530 | + } | |
| 531 | + else if(icon.indexOf("expand-more") > -1){ | |
| 532 | + tooltip.innerHTML = ln["unsort_" +ln["localization"]]; | |
| 533 | + t.setAttribute("icon", "unfold-more"); | |
| 534 | + } | |
| 535 | + | |
| 536 | + this._fire(); | |
| 537 | + }, | |
| 538 | + | |
| 539 | + _addOption : function(e) { | |
| 540 | + if(e.target.nodeName == "PAPER-ITEM") { | |
| 541 | + var optionIndex = $(e.target).parents("paper-dropdown-menu")[0].id; | |
| 542 | + this.selectedOptions[this.options[optionIndex].name] = e.target.id; | |
| 543 | + } | |
| 544 | + else if(e.target.nodeName == "INPUT") { | |
| 545 | + var option = $(e.target).parents("paper-input")[0].id; | |
| 546 | + this.selectedOptions[option] = e.target.value; | |
| 547 | + } | |
| 548 | + this._fire(); | |
| 549 | + }, | |
| 550 | + | |
| 551 | + _fire : function() { | |
| 552 | + if(this._isReady()) | |
| 553 | + this.fire('select-inputs_isReady', {isReady: true}); | |
| 554 | + else | |
| 555 | + this.fire('select-inputs_isReady', {isReady: false}); | |
| 556 | + }, | |
| 557 | + | |
| 558 | + _isReady : function() { | |
| 559 | + var fire = true; | |
| 560 | + for(var i = 0; i < this.inputs.length; i++) { | |
| 561 | + if(this.inputs[i].selection != "*" && this.inputs[i].selection != "?" && !this.selectedInputs[i]) | |
| 562 | + return false; | |
| 563 | + if(this.inputs[i].selection == "*") | |
| 564 | + fire = false; | |
| 565 | + } | |
| 566 | + | |
| 567 | + if(this.inputs[0].name == "Latitude" || this.inputs[0].name == "GEOJSON")//wrong | |
| 568 | + return true; | |
| 569 | + | |
| 570 | + if(!fire) | |
| 571 | + for(var i = 0; i < this.inputs.length; i++) | |
| 572 | + if(this.inputs[i].selection == "*" && this.selectedInputs[i]) | |
| 573 | + return true; | |
| 574 | + | |
| 575 | + return fire; | |
| 576 | + }, | |
| 577 | + | |
| 578 | + _getFieldsByType: function(type) { | |
| 579 | + if(type == "NUMBER") { | |
| 580 | + var fields = []; | |
| 581 | + for(var i = 0; i < this.fields.length; i++) | |
| 582 | + if(this.fields[i].type == type) | |
| 583 | + fields.push(this.fields[i]); | |
| 584 | + return fields; | |
| 585 | + } | |
| 586 | + | |
| 587 | + return this.fields; | |
| 588 | + }, | |
| 589 | + | |
| 590 | + _getInputRichName : function(item) { | |
| 591 | + var name = ln[item.name + "_" +ln["localization"]]; | |
| 592 | + if(item.type != "TEXT") | |
| 593 | + name += " [" + item.type + "]"; | |
| 594 | + if(item.selection == "?") | |
| 595 | + name += " [OPT]"; | |
| 596 | + return name; | |
| 597 | + }, | |
| 598 | + | |
| 599 | + _getInputName : function(name) { | |
| 600 | + return ln[name + "_" +ln["localization"]]; | |
| 601 | + }, | |
| 602 | + | |
| 603 | + _getInputDescription : function(name) { | |
| 604 | + return ln[name + "Description_" +ln["localization"]]; | |
| 605 | + }, | |
| 606 | + | |
| 607 | + _getInputInfoId : function(index) { | |
| 608 | + return "info_input_" + index; | |
| 609 | + }, | |
| 610 | + | |
| 611 | + _getInputOrderId : function(index) { | |
| 612 | + return "order_input_" + index; | |
| 613 | + }, | |
| 614 | + | |
| 615 | + _getInputOrder : function(index) { | |
| 616 | + return ln["unsort_" +ln["localization"]]; | |
| 617 | + }, | |
| 618 | + | |
| 619 | + _getOptionInfoId : function(index) { | |
| 620 | + return "info_option_" + index; | |
| 621 | + }, | |
| 622 | + | |
| 623 | + _checkType : function(type, check){ | |
| 624 | + return (type == check); | |
| 625 | + }, | |
| 626 | + | |
| 627 | + _getNeonIndex : function(tabIndex){ | |
| 628 | + if(tabIndex == -1) | |
| 629 | + return 0; | |
| 630 | + return tabIndex; | |
| 631 | + }, | |
| 632 | + | |
| 633 | + _copy : function(o) { | |
| 634 | + var out, v, key; | |
| 635 | + out = Array.isArray(o) ? new Array(o.length) : {}; | |
| 636 | + for (key in o) { | |
| 637 | + v = o[key]; | |
| 638 | + out[key] = (typeof v === "object") ? this._copy(v) : v; | |
| 639 | + } | |
| 640 | + return out; | |
| 641 | + } | |
| 642 | + | |
| 643 | + }); | |
| 644 | + | |
| 645 | + </script> | |
| 646 | + | |
| 647 | +</dom-module> | |
| 0 | 648 | \ No newline at end of file | ... | ... |
controllets/select-marker-map-controllet/select-marker-map-controllet.html
0 → 100644
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html"/> | |
| 2 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html"/> | |
| 3 | +<link rel="import" href="../../bower_components/paper-fab/paper-fab.html"/> | |
| 4 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"/> | |
| 5 | +<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"/> | |
| 6 | +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"/> | |
| 7 | +<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"/> | |
| 8 | +<link rel="import" href="../../bower_components/paper-listbox/paper-listbox.html"/> | |
| 9 | +<link rel="import" href="../../bower_components/paper-item/paper-item.html"/> | |
| 10 | + | |
| 11 | +<script src="../../locales/paper_card_controllet_ln.js"></script> | |
| 12 | + | |
| 13 | +<dom-module id="select-marker-map-controllet"> | |
| 14 | + | |
| 15 | + <template> | |
| 16 | + <style is="custom-style"> | |
| 17 | + #map_tootlbar{ | |
| 18 | + background: #ffffff; | |
| 19 | + border: 1px solid #ccc; | |
| 20 | + position: absolute; | |
| 21 | + top: 2%; | |
| 22 | + right: 1%; | |
| 23 | + z-index: 1; | |
| 24 | + padding: 4px; | |
| 25 | + } | |
| 26 | + | |
| 27 | + div.ol3-geocoder-container{ | |
| 28 | + position: absolute; | |
| 29 | + top: 26%; | |
| 30 | + left: .5em; | |
| 31 | + box-sizing: border-box; | |
| 32 | + } | |
| 33 | + </style> | |
| 34 | + <link href="http://cdn.jsdelivr.net/openlayers.geocoder/latest/ol3-geocoder.min.css" rel="stylesheet"> | |
| 35 | + | |
| 36 | + | |
| 37 | + <div id="map_tootlbar"> | |
| 38 | + <paper-dropdown-menu label="Interaction" id="interaction_box"> | |
| 39 | + <paper-listbox id="interaction_box" class="dropdown-content" selected={{selected_interaction}}> | |
| 40 | + <paper-item>Marker</paper-item> | |
| 41 | + <paper-item>LineString</paper-item> | |
| 42 | + <paper-item>Polygon</paper-item> | |
| 43 | + <paper-item disabled>Circle</paper-item> | |
| 44 | + <paper-item>Square</paper-item> | |
| 45 | + <paper-item>Box</paper-item> | |
| 46 | + <paper-item>Text</paper-item> | |
| 47 | + </paper-listbox> | |
| 48 | + </paper-dropdown-menu> | |
| 49 | + | |
| 50 | + <!--<paper-input id="shape_label" label="Shape label" maxlenght="30" value="{{label}}"></paper-input>--> | |
| 51 | + | |
| 52 | + </div> | |
| 53 | + | |
| 54 | + <div id="map" tabindex="0" style="height: 100%; width: 100%"></div> | |
| 55 | + <div id="popup" class="ol-popup"> | |
| 56 | + <a href="#" id="popup-closer" class="ol-popup-closer"></a> | |
| 57 | + <div id="popup_content"></div> | |
| 58 | + </div> | |
| 59 | + </template> | |
| 60 | + | |
| 61 | + <script src="http://openlayers.org/en/v3.17.1/build/ol.js"></script> | |
| 62 | + <script src="http://cdn.jsdelivr.net/openlayers.geocoder/latest/ol3-geocoder.js"></script> | |
| 63 | + <script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js"></script> | |
| 64 | + | |
| 65 | + <script> | |
| 66 | + | |
| 67 | + _this = null; | |
| 68 | + Polymer({ | |
| 69 | + is: "select-marker-map-controllet", | |
| 70 | + | |
| 71 | + listeners : { | |
| 72 | + 'iron-select' : '_changeInteraction' | |
| 73 | + }, | |
| 74 | + | |
| 75 | + properties: { | |
| 76 | + lang:{ | |
| 77 | + type: String, | |
| 78 | + value: navigator.language | |
| 79 | + }, | |
| 80 | + map:{ | |
| 81 | + type: Object | |
| 82 | + }, | |
| 83 | + | |
| 84 | + olview:{ | |
| 85 | + type: Object | |
| 86 | + }, | |
| 87 | + | |
| 88 | + geocoder:{ | |
| 89 | + type: Object | |
| 90 | + }, | |
| 91 | + | |
| 92 | + overlay:{ | |
| 93 | + type: Object | |
| 94 | + }, | |
| 95 | + | |
| 96 | + iconStyle:{ | |
| 97 | + type : Object | |
| 98 | + }, | |
| 99 | + | |
| 100 | + vectorSource:{ | |
| 101 | + type: Object | |
| 102 | + }, | |
| 103 | + | |
| 104 | + coordinate: { | |
| 105 | + type: Array, | |
| 106 | + value: [] | |
| 107 | + }, | |
| 108 | + | |
| 109 | + interaction:{ | |
| 110 | + type: String, | |
| 111 | + value: "marker"//marker - geojson | |
| 112 | + }, | |
| 113 | + | |
| 114 | + selected_interaction:{ | |
| 115 | + type: Number, | |
| 116 | + value: 0 | |
| 117 | + }, | |
| 118 | + | |
| 119 | + draw_layer:{ | |
| 120 | + type: Object | |
| 121 | + }, | |
| 122 | + | |
| 123 | + source: { | |
| 124 | + type: Object | |
| 125 | + }, | |
| 126 | + | |
| 127 | + draw:{ | |
| 128 | + type: Object | |
| 129 | + }, | |
| 130 | + | |
| 131 | + textStyle:{ | |
| 132 | + type: Object | |
| 133 | + }, | |
| 134 | + | |
| 135 | + geoStyle:{ | |
| 136 | + type: Object | |
| 137 | + }, | |
| 138 | + | |
| 139 | + label: { | |
| 140 | + type: String, | |
| 141 | + value: "" | |
| 142 | + } | |
| 143 | + }, | |
| 144 | + | |
| 145 | + ready : function(){ | |
| 146 | + _this = this; | |
| 147 | + this.olview = new ol.View({ | |
| 148 | + center: [0, 0], | |
| 149 | + projection: "EPSG:4326", | |
| 150 | + zoom: 3, | |
| 151 | + minZoom: 2, | |
| 152 | + maxZoom: 20 | |
| 153 | + }); | |
| 154 | + | |
| 155 | + var baseLayer = new ol.layer.Tile({ | |
| 156 | + source: new ol.source.OSM() | |
| 157 | + }); | |
| 158 | + | |
| 159 | + //marker layer | |
| 160 | + this.iconStyle = new ol.style.Style({ | |
| 161 | + image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({ | |
| 162 | + anchor: [0.5, 46], | |
| 163 | + anchorXUnits: 'fraction', | |
| 164 | + anchorYUnits: 'pixels', | |
| 165 | + opacity: 0.75, | |
| 166 | + src: 'http://services.routetopa.eu/DEEalerProvider/COMPONENTS/datalets/leafletjs-datalet/leafletsjs/images/marker-icon.png' | |
| 167 | + })) | |
| 168 | + }); | |
| 169 | + | |
| 170 | + this.vectorSource = new ol.source.Vector({}); | |
| 171 | + | |
| 172 | + //draw layer | |
| 173 | + this.source = new ol.source.Vector({wrapX: false}); | |
| 174 | + | |
| 175 | + this.draw_layer = new ol.layer.Vector({ | |
| 176 | + source: this.source, | |
| 177 | + style: new ol.style.Style({ | |
| 178 | + fill: new ol.style.Fill({ | |
| 179 | + color: 'rgba(255, 255, 255, 0.6)' | |
| 180 | + }), | |
| 181 | + stroke: new ol.style.Stroke({ | |
| 182 | + color: '#ffff00', | |
| 183 | + width: 4 | |
| 184 | + }), | |
| 185 | + image: new ol.style.Circle({ | |
| 186 | + radius: 7, | |
| 187 | + fill: new ol.style.Fill({ | |
| 188 | + color: '#ffff00' | |
| 189 | + }) | |
| 190 | + }) | |
| 191 | + }) | |
| 192 | + }); | |
| 193 | + | |
| 194 | + this.map = new ol.Map({ | |
| 195 | + target:'map', | |
| 196 | + view: this.olview, | |
| 197 | + controls: ol.control.defaults({ | |
| 198 | + attributionOptions: /** @type {olx.control.AttributionOptions} */ ({ | |
| 199 | + collapsible: false | |
| 200 | + })}), | |
| 201 | + loadTilesWhileAnimating: true, | |
| 202 | + loadTilesWhileInteracting: true, | |
| 203 | + layers: [baseLayer, | |
| 204 | + new ol.layer.Vector({ | |
| 205 | + source: this.vectorSource | |
| 206 | + }), | |
| 207 | + this.draw_layer | |
| 208 | + ] | |
| 209 | + }); | |
| 210 | + | |
| 211 | + //Instantiate with some options and add the Control | |
| 212 | + this.geocoder = new Geocoder('nominatim', { | |
| 213 | + provider: 'photon', | |
| 214 | + lang: 'en', | |
| 215 | + placeholder: 'Search for ...', | |
| 216 | + limit: 5, | |
| 217 | + keepOpen: true, | |
| 218 | + preventDefault : true | |
| 219 | + }); | |
| 220 | + | |
| 221 | + this.overlay = new ol.Overlay({ | |
| 222 | + element: document.getElementById('popup'), | |
| 223 | + offset: [0, -40] | |
| 224 | + }); | |
| 225 | + | |
| 226 | + this.map.addControl(this.geocoder); | |
| 227 | + | |
| 228 | + //Listen when an address is chosen | |
| 229 | + this.geocoder.on('addresschosen', function(evt){ | |
| 230 | + _this.olview.setCenter(evt.coordinate); | |
| 231 | + _this.olview.setZoom(16); | |
| 232 | + if(_this.selected_interaction == 0) { | |
| 233 | + _this.setMarker(evt.coordinate); | |
| 234 | + } | |
| 235 | + | |
| 236 | + //_this.$.popup_content.innerHTML = '<p>'+ evt.address.formatted +'</p>'; | |
| 237 | + //_this.overlay.setPosition(coord); | |
| 238 | + }); | |
| 239 | + | |
| 240 | + this.map.on('click', function(evt) { | |
| 241 | + if(_this.selected_interaction == 0) { | |
| 242 | + _this.setMarker(evt.coordinate); | |
| 243 | + } | |
| 244 | + }); | |
| 245 | + | |
| 246 | + this.async(function(){this.resize($(document).height(), $(document).width())}, 100); | |
| 247 | + }, | |
| 248 | + | |
| 249 | + setMarker: function(coordinate){ | |
| 250 | + var iconFeature = new ol.Feature({ | |
| 251 | + geometry: new ol.geom.Point(coordinate), | |
| 252 | + name: 'New Point' | |
| 253 | + }); | |
| 254 | + | |
| 255 | + iconFeature.setStyle(_this.iconStyle); | |
| 256 | + | |
| 257 | + this.vectorSource.clear(true); | |
| 258 | + this.vectorSource.addFeature( iconFeature ); | |
| 259 | + | |
| 260 | + //this.coordinate = ol.proj.transform([coordinate[1],coordinate[0]], "EPSG:900913", "EPSG:4326"); | |
| 261 | + this.coordinate = [coordinate[1],coordinate[0]]; | |
| 262 | + }, | |
| 263 | + | |
| 264 | + addInteraction : function() { | |
| 265 | + this.map.removeInteraction(this.draw); | |
| 266 | + var geometryFunction, maxPoints, interaction_type; | |
| 267 | + switch(this.selected_interaction){ | |
| 268 | + case 0: | |
| 269 | + //this.map.addInteraction(ol.interaction.default()); | |
| 270 | + break; | |
| 271 | + case 1: | |
| 272 | + interaction_type = "LineString"; | |
| 273 | + break; | |
| 274 | + case 2: | |
| 275 | + interaction_type = "Polygon"; | |
| 276 | + break; | |
| 277 | + case 3: | |
| 278 | + interaction_type = "Circle"; | |
| 279 | + alert("Circle is not supported by GeoJSON"); | |
| 280 | + return; | |
| 281 | + break; | |
| 282 | + case 4: | |
| 283 | + interaction_type = "Circle"; | |
| 284 | + geometryFunction = ol.interaction.Draw.createRegularPolygon(4); | |
| 285 | + break; | |
| 286 | + case 5: | |
| 287 | + interaction_type = "LineString"; | |
| 288 | + maxPoints = 2; | |
| 289 | + geometryFunction = function(coordinates, geometry) { | |
| 290 | + if (!geometry) { | |
| 291 | + geometry = new ol.geom.Polygon(null); | |
| 292 | + } | |
| 293 | + var start = coordinates[0]; | |
| 294 | + var end = coordinates[1]; | |
| 295 | + geometry.setCoordinates([ | |
| 296 | + [start, [start[0], end[1]], end, [end[0], start[1]], start] | |
| 297 | + ]); | |
| 298 | + return geometry; | |
| 299 | + }; | |
| 300 | + } | |
| 301 | + | |
| 302 | + if(this.selected_interaction != 0) { | |
| 303 | + this.draw = new ol.interaction.Draw({ | |
| 304 | + source: this.source, | |
| 305 | + type: /** @type {ol.geom.GeometryType} */ (interaction_type), | |
| 306 | + geometryFunction: geometryFunction, | |
| 307 | + maxPoints: maxPoints, | |
| 308 | + style : this.getTextStyle(-12) | |
| 309 | + }); | |
| 310 | + | |
| 311 | + this.map.addInteraction(this.draw); | |
| 312 | + | |
| 313 | + this.draw.on('drawend', function(e) { | |
| 314 | + e.feature.setStyle(_this.getTextStyle(-12)); | |
| 315 | + }); | |
| 316 | + } | |
| 317 | + }, | |
| 318 | + | |
| 319 | + getGeoJSON: function(){ | |
| 320 | + var allFeatures = this.draw_layer.getSource().getFeatures(); | |
| 321 | + var format = new ol.format.GeoJSON(); | |
| 322 | + return format.writeFeatures(allFeatures); | |
| 323 | + }, | |
| 324 | + | |
| 325 | + _changeInteraction: function(e){ | |
| 326 | + this.addInteraction(); | |
| 327 | + }, | |
| 328 | + | |
| 329 | + getTextStyle: function(offsetX) { | |
| 330 | + return new ol.style.Style({ | |
| 331 | + fill: new ol.style.Fill({ | |
| 332 | + color: 'rgba(255, 255, 255, 0.6)' | |
| 333 | + }), | |
| 334 | + stroke: new ol.style.Stroke({ | |
| 335 | + color: '#ffff00', | |
| 336 | + width: 4 | |
| 337 | + }), | |
| 338 | + text : new ol.style.Text({ | |
| 339 | + fill : new ol.style.Fill({ | |
| 340 | + color : '#000' | |
| 341 | + }), | |
| 342 | + stroke : new ol.style.Stroke({ | |
| 343 | + color : '#fff', | |
| 344 | + width : 4 | |
| 345 | + }), | |
| 346 | + text : this.label, | |
| 347 | + font : '20px Verdana', | |
| 348 | + offsetX : offsetX ? offsetX : 0, | |
| 349 | + offsetY : 12 | |
| 350 | + }) | |
| 351 | + }); | |
| 352 | + }, | |
| 353 | + | |
| 354 | + resize : function(h,w){ | |
| 355 | + this.$.map.style.height = h + "px"; | |
| 356 | + this.$.map.style.width = w + "px"; | |
| 357 | + $("#OpenLayers_Map_2_OpenLayers_ViewPort").css('height',($(document).height() + "px")); | |
| 358 | + $("#OpenLayers_Map_2_OpenLayers_ViewPort").css('width',($(document).width() + "px")); | |
| 359 | + this.map.updateSize(); | |
| 360 | + } | |
| 361 | + }) | |
| 362 | + </script> | |
| 363 | + | |
| 364 | +</dom-module> | |
| 0 | 365 | \ No newline at end of file | ... | ... |
controllets/select-marker-map-controllet/select-marker-map-controllet_.html
0 → 100644
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html"/> | |
| 2 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html"/> | |
| 3 | +<link rel="import" href="../../bower_components/paper-fab/paper-fab.html"/> | |
| 4 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"/> | |
| 5 | +<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"/> | |
| 6 | +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"/> | |
| 7 | + | |
| 8 | +<script src="../../locales/paper_card_controllet_ln.js"></script> | |
| 9 | + | |
| 10 | +<dom-module id="select-marker-map-controllet"> | |
| 11 | + | |
| 12 | + <template> | |
| 13 | + <link href="http://cdn.jsdelivr.net/openlayers.geocoder/latest/ol3-geocoder.min.css" rel="stylesheet"> | |
| 14 | + | |
| 15 | + <div id="map" tabindex="0" style="height: 100%; width: 100%"></div> | |
| 16 | + <div id="popup" class="ol-popup"> | |
| 17 | + <a href="#" id="popup-closer" class="ol-popup-closer"></a> | |
| 18 | + <div id="popup_content"></div> | |
| 19 | + </div> | |
| 20 | + </template> | |
| 21 | + | |
| 22 | + <script src="http://openlayers.org/en/v3.17.1/build/ol.js"></script> | |
| 23 | + <script src="http://cdn.jsdelivr.net/openlayers.geocoder/latest/ol3-geocoder.js"></script> | |
| 24 | + <script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js"></script> | |
| 25 | + | |
| 26 | + <script> | |
| 27 | + | |
| 28 | + _this = null; | |
| 29 | + Polymer({ | |
| 30 | + is: "select-marker-map-controllet", | |
| 31 | + properties: { | |
| 32 | + lang:{ | |
| 33 | + type: String, | |
| 34 | + value: navigator.language | |
| 35 | + }, | |
| 36 | + map:{ | |
| 37 | + type: Object | |
| 38 | + }, | |
| 39 | + | |
| 40 | + olview:{ | |
| 41 | + type: Object | |
| 42 | + }, | |
| 43 | + | |
| 44 | + geocoder:{ | |
| 45 | + type: Object | |
| 46 | + }, | |
| 47 | + | |
| 48 | + overlay:{ | |
| 49 | + type: Object | |
| 50 | + }, | |
| 51 | + | |
| 52 | + iconStyle:{ | |
| 53 | + type : Object | |
| 54 | + }, | |
| 55 | + | |
| 56 | + vectorSource:{ | |
| 57 | + type: Object | |
| 58 | + }, | |
| 59 | + | |
| 60 | + coordinate: { | |
| 61 | + type: Array, | |
| 62 | + value: [] | |
| 63 | + } | |
| 64 | + | |
| 65 | + }, | |
| 66 | + | |
| 67 | + ready : function(){ | |
| 68 | + _this = this; | |
| 69 | + | |
| 70 | + this.olview = new ol.View({ | |
| 71 | + center: [0, 0], | |
| 72 | + zoom: 3, | |
| 73 | + minZoom: 2, | |
| 74 | + maxZoom: 20 | |
| 75 | + }); | |
| 76 | + | |
| 77 | + var baseLayer = new ol.layer.Tile({ | |
| 78 | + source: new ol.source.OSM() | |
| 79 | + }); | |
| 80 | + | |
| 81 | + this.iconStyle = new ol.style.Style({ | |
| 82 | + image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({ | |
| 83 | + anchor: [0.5, 46], | |
| 84 | + anchorXUnits: 'fraction', | |
| 85 | + anchorYUnits: 'pixels', | |
| 86 | + opacity: 0.75, | |
| 87 | + src: 'http://services.routetopa.eu/DEEalerProvider/COMPONENTS/datalets/leafletjs-datalet/leafletsjs/images/marker-icon.png' | |
| 88 | + })) | |
| 89 | + }); | |
| 90 | + | |
| 91 | + this.vectorSource = new ol.source.Vector({}); | |
| 92 | + | |
| 93 | + this.map = new ol.Map({ | |
| 94 | + target:'map', | |
| 95 | + view: this.olview, | |
| 96 | + controls: ol.control.defaults({ | |
| 97 | + attributionOptions: /** @type {olx.control.AttributionOptions} */ ({ | |
| 98 | + collapsible: false | |
| 99 | + })}), | |
| 100 | + loadTilesWhileAnimating: true, | |
| 101 | + loadTilesWhileInteracting: true, | |
| 102 | + layers: [baseLayer, | |
| 103 | + new ol.layer.Vector({ | |
| 104 | + source: this.vectorSource | |
| 105 | + }) | |
| 106 | + ] | |
| 107 | + }); | |
| 108 | + | |
| 109 | + //Instantiate with some options and add the Control | |
| 110 | + this.geocoder = new Geocoder('nominatim', { | |
| 111 | + provider: 'photon', | |
| 112 | + lang: 'en', | |
| 113 | + placeholder: 'Search for ...', | |
| 114 | + limit: 5, | |
| 115 | + keepOpen: true, | |
| 116 | + preventDefault : true | |
| 117 | + }); | |
| 118 | + | |
| 119 | + this.overlay = new ol.Overlay({ | |
| 120 | + element: document.getElementById('popup'), | |
| 121 | + offset: [0, -40] | |
| 122 | + }); | |
| 123 | + | |
| 124 | + this.map.addControl(this.geocoder); | |
| 125 | + | |
| 126 | + //Listen when an address is chosen | |
| 127 | + this.geocoder.on('addresschosen', function(evt){ | |
| 128 | + _this.setMarker(evt.coordinate); | |
| 129 | + _this.olview.setCenter(evt.coordinate); | |
| 130 | + _this.olview.setZoom(16); | |
| 131 | + | |
| 132 | + //_this.$.popup_content.innerHTML = '<p>'+ evt.address.formatted +'</p>'; | |
| 133 | + //_this.overlay.setPosition(coord); | |
| 134 | + }); | |
| 135 | + | |
| 136 | + this.map.on('click', function(evt) { | |
| 137 | + _this.setMarker(evt.coordinate); | |
| 138 | + }); | |
| 139 | + }, | |
| 140 | + | |
| 141 | + setMarker: function(coordinate){ | |
| 142 | + var iconFeature = new ol.Feature({ | |
| 143 | + geometry: new ol.geom.Point(coordinate), | |
| 144 | + name: 'Null Island', | |
| 145 | + population: 4000, | |
| 146 | + rainfall: 500 | |
| 147 | + }); | |
| 148 | + | |
| 149 | + iconFeature.setStyle(_this.iconStyle); | |
| 150 | + | |
| 151 | + this.vectorSource.clear(true); | |
| 152 | + this.vectorSource.addFeature( iconFeature ); | |
| 153 | + | |
| 154 | + this.coordinate = ol.proj.transform([coordinate[1],coordinate[0]], "EPSG:900913", "EPSG:4326"); | |
| 155 | + }, | |
| 156 | + | |
| 157 | + resize : function(h,w){ | |
| 158 | + this.$.map.style.height = h + "px"; | |
| 159 | + this.$.map.style.width = w + "px"; | |
| 160 | + this.map.updateSize(); | |
| 161 | + }, | |
| 162 | + | |
| 163 | + | |
| 164 | + }) | |
| 165 | + </script> | |
| 166 | + | |
| 167 | +</dom-module> | |
| 0 | 168 | \ No newline at end of file | ... | ... |
controllets/select-visualization-controllet/demo/index.html
| ... | ... | @@ -13,6 +13,8 @@ |
| 13 | 13 | <script type="text/javascript" src="../../../alasql-utility/alasql.min.js"></script> |
| 14 | 14 | <script type="text/javascript" src="../../../alasql-utility/alasql-utility.js"></script> |
| 15 | 15 | |
| 16 | + <script type="text/javascript" src="../../../bower_components/jsdatachecker/jsdatachecker.min.js"></script> | |
| 17 | + | |
| 16 | 18 | <script> |
| 17 | 19 | ln["localization"] = "en"; |
| 18 | 20 | </script> | ... | ... |
controllets/select-visualization-controllet/select-datalet-inputs.html
| ... | ... | @@ -317,6 +317,18 @@ |
| 317 | 317 | temp.push({name: name + " " +(i-1), description: description, selection: selection}); |
| 318 | 318 | } |
| 319 | 319 | |
| 320 | + else if (inputs.length == 3 && inputs[1].selection == "*") {// | |
| 321 | + name = inputs[1].name; | |
| 322 | + description = inputs[1].description; | |
| 323 | + selection = inputs[1].selection; | |
| 324 | + temp = [inputs[0]]; | |
| 325 | + temp.push({name: name + " 1", description: description, selection: selection}); | |
| 326 | + for (var i = 3; i < this.fields.length; i++) | |
| 327 | + temp.push({name: name + " " +(i-1), description: description, selection: selection}); | |
| 328 | + | |
| 329 | + temp.push(inputs[2]); | |
| 330 | + } | |
| 331 | + | |
| 320 | 332 | this.inputs = this._copy(temp); |
| 321 | 333 | |
| 322 | 334 | this.selectedFields = new Array(temp.length); | ... | ... |
controllets/select-visualization-controllet/select-visualization-controllet.html
| ... | ... | @@ -5,9 +5,10 @@ |
| 5 | 5 | <link rel="import" href="../../bower_components/paper-button/paper-button.html"> |
| 6 | 6 | |
| 7 | 7 | <link rel="import" href="../items-vslider-controllet/items-vslider-controllet.html" /> |
| 8 | -<link rel="import" href="select-datalet-inputs_series.html" /> | |
| 9 | -<link rel="import" href="select-datalet-inputs.html" /> | |
| 10 | -<link rel="import" href="select-datalet-options.html" /> | |
| 8 | +<link rel="import" href="../select-inputs-controllet/select-inputs-controllet.html" /> | |
| 9 | +<link rel="import" href="../datalet-preview-controllet/datalet-preview-controllet.html" /> | |
| 10 | + | |
| 11 | +<script type="text/javascript" src="../../bower_components/jsdatachecker/jsdatachecker.min.js"></script> | |
| 11 | 12 | |
| 12 | 13 | <script src="../../../DEEPCLIENT/js/deepClient.js"></script> |
| 13 | 14 | |
| ... | ... | @@ -18,63 +19,61 @@ |
| 18 | 19 | <style is="custom-style"> |
| 19 | 20 | #select_visualization_container { |
| 20 | 21 | display: flex; |
| 21 | - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 22 | - font-size: 16px; | |
| 23 | 22 | margin-top: 8px; |
| 24 | 23 | } |
| 25 | 24 | |
| 26 | - #items_vslider_controllet { | |
| 27 | - position: relative; | |
| 28 | - min-width: 172px; | |
| 25 | + #select_visualization_container * { | |
| 26 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 27 | + font-size: 16px; | |
| 28 | + line-height: 24px; | |
| 29 | 29 | } |
| 30 | 30 | |
| 31 | - #datalet_selection_inputs { | |
| 31 | + #items_vslider_container { | |
| 32 | 32 | position: relative; |
| 33 | - margin-left: 32px; | |
| 34 | - min-width: 258px; | |
| 33 | + width: 172px; | |
| 35 | 34 | } |
| 36 | 35 | |
| 37 | - #datalet_selection_options { | |
| 36 | + #select_inputs_container { | |
| 38 | 37 | position: relative; |
| 39 | - margin-left: 32px; | |
| 38 | + width: calc(50% - 12px - 172px - 24px); | |
| 40 | 39 | min-width: 258px; |
| 40 | + margin-left: 24px; | |
| 41 | 41 | } |
| 42 | 42 | |
| 43 | 43 | #datalet_preview_container { |
| 44 | 44 | position: relative; |
| 45 | - width: 100%; | |
| 46 | - margin-left: 32px; | |
| 47 | - } | |
| 48 | - | |
| 49 | - #datalet_selection_datalet { | |
| 50 | - position: relative; | |
| 51 | - height: 100vh; | |
| 52 | - width: 100%; | |
| 45 | + width: calc(50% - 12px); | |
| 46 | + margin-left: 24px; | |
| 53 | 47 | } |
| 54 | 48 | |
| 55 | - #datalet_selection_datalet_placeholder { | |
| 56 | - padding: 16px; | |
| 57 | - } | |
| 49 | + /*#datalet_placeholder {*/ | |
| 50 | + /*width: calc(100% - 32px);*/ | |
| 51 | + /*height: calc(100% - 48px - 32px);*/ | |
| 52 | + /*padding: 16px;*/ | |
| 53 | + /*}*/ | |
| 58 | 54 | |
| 59 | - .input_header { | |
| 60 | - height: 32px; | |
| 61 | - padding-top: 16px; | |
| 62 | - text-align: center; | |
| 63 | - font-weight: 700; | |
| 64 | - background-color: #B6B6B6; | |
| 65 | - } | |
| 55 | + /*.header {*/ | |
| 56 | + /*height: 24px;*/ | |
| 57 | + /*padding: 12px;*/ | |
| 58 | + /*text-align: center;*/ | |
| 59 | + /*font-weight: 700;*/ | |
| 60 | + /*background-color: #B6B6B6;*/ | |
| 61 | + /*}*/ | |
| 66 | 62 | |
| 67 | 63 | paper-button { |
| 68 | 64 | position: absolute; |
| 69 | - bottom: 16px; | |
| 70 | - right: 11px; | |
| 71 | - | |
| 72 | 65 | height: 48px; |
| 73 | 66 | width: 172px; |
| 74 | - background-color: #00BCD4; | |
| 75 | - color: white; | |
| 67 | + padding: 12px; | |
| 68 | + background: #00BCD4; | |
| 69 | + color: #FFFFFF; | |
| 76 | 70 | font-weight: 700; |
| 77 | - padding: 16px; | |
| 71 | + | |
| 72 | + /*bottom: 16px;*/ | |
| 73 | + /*right: 11px;*/ | |
| 74 | + top: -56px; | |
| 75 | + right: 0; | |
| 76 | + margin: 0 16px; | |
| 78 | 77 | } |
| 79 | 78 | |
| 80 | 79 | paper-button:hover { |
| ... | ... | @@ -94,36 +93,26 @@ |
| 94 | 93 | |
| 95 | 94 | <div id="select_visualization_container"> |
| 96 | 95 | |
| 97 | - <div id="items_vslider_controllet"> | |
| 98 | - <items-vslider-controllet id="vslider" datalets-list-url={{dataletsListUrl}} preselected-datalet={{preselectedDatalet}}></items-vslider-controllet> | |
| 96 | + <div id="items_vslider_container"> | |
| 97 | + <items-vslider-controllet id="vslider" datalets-list-url="{{dataletsListUrl}}"></items-vslider-controllet> | |
| 99 | 98 | </div> |
| 100 | 99 | |
| 101 | - <div id="datalet_selection_inputs"> | |
| 102 | - <template is="dom-if" if="{{_checkType(type, 'multiseries')}}"> | |
| 103 | - <select-datalet-inputs_series id="inputs_series"></select-datalet-inputs_series> | |
| 104 | - </template> | |
| 105 | - <template is="dom-if" if="{{_checkType(type, 'default')}}"> | |
| 106 | - <select-datalet-inputs id="inputs"></select-datalet-inputs> | |
| 107 | - </template> | |
| 108 | - <template is="dom-if" if="{{_checkType(type, '')}}"> | |
| 109 | - <select-datalet-inputs></select-datalet-inputs> | |
| 110 | - </template> | |
| 100 | + <div id="select_inputs_container"> | |
| 101 | + <select-inputs-controllet id="inputs"></select-inputs-controllet> | |
| 111 | 102 | </div> |
| 112 | 103 | |
| 113 | - <div id="datalet_selection_options"> | |
| 114 | - <select-datalet-options id="options"></select-datalet-options> | |
| 104 | + <div id="datalet_preview_container"> | |
| 105 | + <datalet-preview-controllet id="preview" deep-url="{{deepUrl}}" datalets-list-url="{{dataletsListUrl}}"></datalet-preview-controllet> | |
| 115 | 106 | </div> |
| 116 | 107 | |
| 117 | - <div id="datalet_preview_container"> | |
| 108 | + <paper-button id="add_button" disabled raised on-click="_addDatalet"></paper-button> | |
| 118 | 109 | |
| 119 | - <paper-material id="datalet_selection_datalet" elevation="5"> | |
| 120 | - <div class="input_header"><span id="dataletPreview"></span></div> | |
| 121 | - <div id="datalet_selection_datalet_placeholder"></div> | |
| 122 | - </paper-material> | |
| 110 | + <!--<paper-material id="datalet_preview_container" elevation="5">--> | |
| 111 | + <!--<div class="header"><span id="dataletPreview"></span></div>--> | |
| 123 | 112 | |
| 124 | - <paper-button id="add_button" disabled raised on-click="_addDatalet"></paper-button> | |
| 113 | + <!--<div id="datalet_placeholder"></div>--> | |
| 125 | 114 | |
| 126 | - </div> | |
| 115 | + <!--</paper-material>--> | |
| 127 | 116 | |
| 128 | 117 | </div> |
| 129 | 118 | |
| ... | ... | @@ -147,72 +136,64 @@ |
| 147 | 136 | value : undefined |
| 148 | 137 | }, |
| 149 | 138 | |
| 150 | - selectedDatalet : { | |
| 139 | + dataUrl : { | |
| 151 | 140 | type : String, |
| 152 | 141 | value : undefined |
| 153 | 142 | }, |
| 154 | 143 | |
| 155 | - preselectedDatalet : { | |
| 156 | - type : String, | |
| 144 | + data : { | |
| 145 | + type : Object, | |
| 157 | 146 | value : undefined |
| 158 | 147 | }, |
| 159 | 148 | |
| 160 | - type : { | |
| 161 | - type : String, | |
| 162 | - value : "" | |
| 163 | - }, | |
| 164 | - | |
| 165 | - filters : { | |
| 149 | + selectedFields : { | |
| 166 | 150 | type : Array, |
| 167 | 151 | value : [] |
| 168 | 152 | }, |
| 169 | 153 | |
| 170 | - fields : { | |
| 154 | + filters : { | |
| 171 | 155 | type : Array, |
| 172 | 156 | value : [] |
| 173 | 157 | }, |
| 174 | 158 | |
| 175 | - selectedFields : { | |
| 159 | + aggregators : { | |
| 176 | 160 | type : Array, |
| 177 | 161 | value : [] |
| 178 | 162 | }, |
| 179 | 163 | |
| 180 | - dataletPreset : { | |
| 181 | - type : Object, | |
| 182 | - value : [] | |
| 183 | - }, | |
| 164 | +// orders : { | |
| 165 | +// type : Array, | |
| 166 | +// value : [] | |
| 167 | +// }, | |
| 184 | 168 | |
| 185 | - dataUrl : { | |
| 169 | + selectedDatalet : { | |
| 186 | 170 | type : String, |
| 187 | 171 | value : undefined |
| 188 | 172 | }, |
| 189 | 173 | |
| 190 | - params:{ | |
| 191 | - type: Object, | |
| 192 | - value: undefined | |
| 174 | + dataletType : { | |
| 175 | + type : String, | |
| 176 | + value : undefined | |
| 193 | 177 | }, |
| 194 | 178 | |
| 195 | - data : { | |
| 196 | - type : Object, | |
| 179 | + preselectedDatalet : { | |
| 180 | + type : String, | |
| 197 | 181 | value : undefined |
| 198 | 182 | }, |
| 199 | 183 | |
| 184 | + dataletPreset : { | |
| 185 | + type : Object, | |
| 186 | + value : [] | |
| 187 | + } | |
| 188 | + | |
| 200 | 189 | }, |
| 201 | 190 | |
| 202 | 191 | listeners: { |
| 203 | -// 'select-fields-controllet_selected-fields': '_updateFields', | |
| 204 | -// 'filters-controllet_filters': '_updateFilters', | |
| 205 | 192 | 'items-vslider-controllet_selected-datalet': '_selectDatalet', |
| 206 | - 'select_visualization_inputs_ready': '_loadDatalet', | |
| 207 | - 'select_visualization_options_changed': '_tryLoadDatalet' | |
| 193 | + 'select-inputs_isReady': '_loadDatalet' | |
| 208 | 194 | }, |
| 209 | 195 | |
| 210 | 196 | ready : function() { |
| 211 | - this._resize(); | |
| 212 | - | |
| 213 | - $(this.$.datalet_selection_datalet).perfectScrollbar(); | |
| 214 | - | |
| 215 | -// this.params = {'data-url' : this.dataUrl};//not here | |
| 216 | 197 | }, |
| 217 | 198 | |
| 218 | 199 | attached : function() { |
| ... | ... | @@ -227,34 +208,31 @@ |
| 227 | 208 | this.filters = this._copy(filters); |
| 228 | 209 | }, |
| 229 | 210 | |
| 230 | - setFields : function(fields) { | |
| 231 | -// if (this.fields.length > 0 && JSON.stringify(this.fields) != JSON.stringify(fields)) | |
| 232 | -// this.init(); | |
| 211 | + setAggregators : function(aggregators) { | |
| 212 | + this.aggregators = this._copy(aggregators); | |
| 213 | + }, | |
| 233 | 214 | |
| 234 | - this.fields = this._copy(fields); | |
| 215 | +// setOrders : function(orders) { | |
| 216 | +// this.orders = this._copy(orders); | |
| 217 | +// }, | |
| 235 | 218 | |
| 236 | - var inputs = this._getInputs(); | |
| 237 | - if (inputs) | |
| 238 | - inputs.setFields(this.fields); | |
| 219 | + setSelectedFields : function(selectedFields) { | |
| 220 | + this.selectedFields = this._copy(selectedFields); | |
| 239 | 221 | }, |
| 240 | 222 | |
| 241 | 223 | setData : function(data) { |
| 242 | 224 | this.data = this._copy(data); |
| 243 | - }, | |
| 244 | 225 | |
| 245 | - init : function() { | |
| 246 | - this.$.vslider._reset(); | |
| 226 | + var converter = new DataTypeConverter(); | |
| 227 | + var result = converter.inferJsonDataType(data, ["*"]); | |
| 228 | + result = converter.cast(result); | |
| 229 | + this.$.inputs.setFields(ArrayUtils.toFieldsArray(result.types)); | |
| 230 | + this.$.vslider.setEnabledDatalets(ArrayUtils.toFieldsArray(result.types)); | |
| 247 | 231 | }, |
| 248 | 232 | |
| 249 | - show : function() {//show --> preselect | |
| 250 | -// if(this.preselectedDatalet) | |
| 251 | - if(this.dataletPreset) | |
| 252 | - this._preselectDatalet(); | |
| 253 | - | |
| 254 | -// if (this.$.datalet_selection_datalet_placeholder.innerHTML == "") { | |
| 255 | -// var inputs = this._getInputs(); | |
| 256 | -// inputs.fireReady(); | |
| 257 | -// } | |
| 233 | + init : function() { | |
| 234 | + if(this.selectedDatalet !== undefined) | |
| 235 | + this.$.vslider.reset();// fire _selectDatalet undefined | |
| 258 | 236 | }, |
| 259 | 237 | |
| 260 | 238 | _translate : function(){ |
| ... | ... | @@ -262,111 +240,82 @@ |
| 262 | 240 | this.$.add_button.innerHTML = ln["modifyDatalet_" + ln["localization"]]; |
| 263 | 241 | else |
| 264 | 242 | this.$.add_button.innerHTML = ln["addDatalet_" + ln["localization"]]; |
| 265 | - | |
| 266 | - this.$.dataletPreview.innerHTML = ln["dataletPreview_" + ln["localization"]]; | |
| 267 | 243 | }, |
| 268 | 244 | |
| 269 | 245 | _selectDatalet : function(e){ |
| 270 | - | |
| 271 | - this.$.add_button.setAttribute("disabled", "true"); | |
| 272 | - | |
| 273 | 246 | this.selectedDatalet = e.detail.datalet; |
| 274 | 247 | |
| 275 | - this.$.datalet_selection_datalet_placeholder.innerHTML = ""; | |
| 248 | + this.$.add_button.setAttribute("disabled", "true"); | |
| 249 | + this.$.preview.eraseDatalet(); | |
| 250 | + this.$.preview.eraseInfo(); | |
| 276 | 251 | |
| 277 | - if(!this.selectedDatalet){ | |
| 278 | - this.type = ""; | |
| 279 | - this.$.options.setOptions([]); | |
| 280 | - } | |
| 281 | - else{ | |
| 252 | + if(this.selectedDatalet) { | |
| 282 | 253 | this.$.selectedDatalet_request.url = this.deepUrl + e.detail.datalet + "-datalet"; |
| 283 | 254 | this.$.selectedDatalet_request.generateRequest(); |
| 284 | 255 | } |
| 256 | + else { | |
| 257 | + this.dataletType = undefined; | |
| 258 | + this.$.inputs._reset(); | |
| 259 | + } | |
| 285 | 260 | }, |
| 286 | 261 | |
| 287 | 262 | _handleSelectedDatalet : function(e){ |
| 263 | + this.$.preview.loadInfo(e.detail.response); | |
| 288 | 264 | |
| 289 | - if(this.type != e.detail.response.type) { | |
| 290 | - | |
| 291 | - this.type = e.detail.response.type; | |
| 292 | - | |
| 293 | - this.async(function () { | |
| 294 | - var inputs = this._getInputs(); | |
| 295 | - inputs.setFields(this.fields); | |
| 296 | - inputs.setInputs(e.detail.response.idm.inputs.input);// Cannot read property '0' of undefined | |
| 297 | - }, 0); | |
| 298 | - | |
| 299 | - this.$.options.setOptions(e.detail.response.idm.inputs.layouts.input); | |
| 265 | + if(this.dataletType != e.detail.response.type) { | |
| 266 | + this.dataletType = e.detail.response.type; | |
| 267 | + this.$.inputs.setInputs(e.detail.response.idm); | |
| 300 | 268 | } |
| 301 | 269 | else { |
| 302 | - this.$.options.checkOptions(e.detail.response.idm.inputs.layouts.input); | |
| 270 | + this.$.inputs._fire(); | |
| 303 | 271 | } |
| 304 | - | |
| 305 | - this.async(function () { | |
| 306 | - var inputs = this._getInputs(); | |
| 307 | - inputs.fireReady(); | |
| 308 | - }, 0); | |
| 309 | - | |
| 310 | -// this.async(function () { | |
| 311 | -// if(this.preselectedDatalet) | |
| 312 | -// this._preselectDatalet(); | |
| 313 | -// }, 1); | |
| 314 | - }, | |
| 315 | - | |
| 316 | - _preselectDatalet : function() { | |
| 317 | - this.$.vslider._preselectDatalet(); | |
| 318 | - | |
| 319 | - this.async(function () { | |
| 320 | - this.$.options._preselectOptions(this.dataletPreset); | |
| 321 | - }, 100); | |
| 322 | - | |
| 323 | - this.async(function () { | |
| 324 | - var inputs = this._getInputs(); | |
| 325 | - inputs._preselectInputs(this.fields, this.dataletPreset["aggregators"], this.dataletPreset["orders"]); | |
| 326 | - this.dataletPreset = undefined; | |
| 327 | - }, 200); | |
| 328 | 272 | }, |
| 329 | 273 | |
| 330 | - _tryLoadDatalet : function(){ | |
| 331 | - var inputs = this._getInputs(); | |
| 332 | - inputs.fireReady(); | |
| 274 | + preselect : function() { | |
| 275 | + if(this.preselectedDatalet) { | |
| 276 | + this.$.vslider.preselectDatalet(this.preselectedDatalet); | |
| 277 | + this.async(function () { | |
| 278 | + this.$.inputs._preselectInputs(this.dataletPreset); | |
| 279 | + this.preselectedDatalet = undefined; | |
| 280 | + }, 100); | |
| 281 | + } | |
| 333 | 282 | }, |
| 334 | 283 | |
| 335 | 284 | _loadDatalet : function(e){ |
| 336 | 285 | if(!e.detail.isReady) { |
| 337 | - this.$.datalet_selection_datalet_placeholder.innerHTML = ""; | |
| 286 | + this.$.preview.eraseDatalet(); | |
| 338 | 287 | return; |
| 339 | 288 | } |
| 340 | 289 | |
| 341 | - var inputs = this._getInputs(); | |
| 342 | - | |
| 343 | - this.selectedFields = inputs.getSelectedFields(); | |
| 344 | - | |
| 345 | -// console.log(inputs.getFields()); | |
| 346 | - | |
| 347 | - this.params = {'data-url' : this.dataUrl};//?????????????????? | |
| 348 | -// this.params = {}; | |
| 290 | + this.params = {'data-url' : this.dataUrl};/*???*/ | |
| 349 | 291 | |
| 350 | - this.params["selectedFields"] = JSON.stringify(inputs.getFields()); | |
| 292 | +// this.selectedFields = ["pippi", "baudo"]; | |
| 351 | 293 | |
| 294 | + this.params["selectedfields"] = JSON.stringify(this.$.inputs.getSelectedInputs()); | |
| 352 | 295 | this.params["filters"] = JSON.stringify(this.filters); |
| 353 | - this.params["aggregators"] = JSON.stringify(inputs.getAggregators()); | |
| 354 | - this.params["orders"] = JSON.stringify(inputs.getOrders()); | |
| 296 | + this.params["aggregators"] = JSON.stringify(this.aggregators); | |
| 297 | + this.params["orders"] = JSON.stringify(this.$.inputs.getOrders()); | |
| 355 | 298 | |
| 356 | 299 | this.params["export_menu"] = "0"; |
| 357 | 300 | |
| 358 | - var params = this.$.options.getParams(); | |
| 301 | + var params = this.$.inputs.getSelectedOptions(); | |
| 359 | 302 | for (var key in params) { this.params[key] = params[key]; } |
| 360 | 303 | |
| 361 | 304 | //use cache |
| 362 | - var data = alasql_QUERY(this.data, this.selectedFields, null, inputs.getAggregators(), inputs.getOrders()); | |
| 305 | + var selectedFields = this.$.inputs.getSelectedInputs(); | |
| 306 | + var fields = []; | |
| 307 | + for (var i=0; i < selectedFields.length; i++) | |
| 308 | + if (selectedFields[i]) | |
| 309 | + fields.push(selectedFields[i].value); | |
| 363 | 310 | |
| 364 | 311 | var converter = new DataTypeConverter(); |
| 312 | + | |
| 313 | + var data = alasql_QUERY(this.data, fields, null, null, this.$.inputs.getOrders()); | |
| 365 | 314 | var result = converter.inferJsonDataType(data, ["*"]); |
| 366 | 315 | result = converter.cast(result); |
| 367 | 316 | data = result.dataset; |
| 368 | 317 | |
| 369 | - data = alasql_transformData(data, this.selectedFields, true); | |
| 318 | + data = alasql_transformData(data, fields, true); | |
| 370 | 319 | |
| 371 | 320 | this.params["data"] = JSON.stringify(data).replace(/'/g, "'"); |
| 372 | 321 | // |
| ... | ... | @@ -374,45 +323,35 @@ |
| 374 | 323 | var dataletParams ={ |
| 375 | 324 | component: this.selectedDatalet+"-datalet", |
| 376 | 325 | fields: this.selectedFields, |
| 377 | - params: this.params, | |
| 378 | - placeHolder: this.$.datalet_selection_datalet_placeholder, | |
| 326 | + params: this.params | |
| 327 | +// placeHolder: this.$.datalet_placeholder | |
| 379 | 328 | }; |
| 380 | 329 | |
| 381 | - ComponentService.deep_url = this.deepUrl; | |
| 382 | - ComponentService.getComponent(dataletParams); | |
| 330 | +// ComponentService.deep_url = this.deepUrl; | |
| 331 | +// ComponentService.getComponent(dataletParams); | |
| 332 | + | |
| 333 | + this.$.preview.loadDatalet(dataletParams); | |
| 383 | 334 | |
| 384 | 335 | this.$.add_button.removeAttribute("disabled"); |
| 385 | 336 | }, |
| 386 | 337 | |
| 387 | 338 | _addDatalet : function(){ |
| 388 | - delete this.params["export_menu"]; | |
| 339 | + var staticData = this.params["data"]; | |
| 340 | + | |
| 389 | 341 | delete this.params["data"]; |
| 342 | + delete this.params["export_menu"]; | |
| 390 | 343 | |
| 391 | 344 | var data = { |
| 392 | 345 | dataUrl: this.dataUrl, |
| 393 | 346 | datalet: this.selectedDatalet+"-datalet", |
| 394 | 347 | fields: this.selectedFields, |
| 395 | 348 | params: this.params, |
| 396 | - staticData: JSON.stringify(this.$.datalet_selection_datalet_placeholder.children[1].behavior.data) | |
| 349 | + staticData: staticData | |
| 397 | 350 | } |
| 398 | 351 | |
| 399 | 352 | this.fire('data-sevc-controllet.dataletCreated', {data : data}); |
| 400 | 353 | }, |
| 401 | 354 | |
| 402 | - _checkType: function(type, check){ | |
| 403 | - if (type == "multiseries" || type == "") | |
| 404 | - return (type == check); | |
| 405 | - else if(check == "default") | |
| 406 | - return true; | |
| 407 | - return false; | |
| 408 | - }, | |
| 409 | - | |
| 410 | - _getInputs : function(){ | |
| 411 | - if(this.type == "multiseries") | |
| 412 | - return this.$$("#inputs_series") | |
| 413 | - return this.$$("#inputs"); | |
| 414 | - }, | |
| 415 | - | |
| 416 | 355 | _copy : function(o) { |
| 417 | 356 | var out, v, key; |
| 418 | 357 | out = Array.isArray(o) ? new Array(o.length) : {}; |
| ... | ... | @@ -427,11 +366,9 @@ |
| 427 | 366 | var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; |
| 428 | 367 | h = h - 64 - 8; //height with page scroller |
| 429 | 368 | |
| 430 | - $("#items_vslider_controllet").height(h);//vslider controllet | |
| 431 | - $("#datalet_selection_inputs").height(h); | |
| 432 | - $("#datalet_selection_options").height(h); | |
| 433 | - | |
| 434 | - $("#datalet_selection_datalet").height(h); | |
| 369 | + $("#items_vslider_container").height(h); | |
| 370 | + $("#select_inputs_container").height(h); | |
| 371 | + $("#datalet_preview_container").height(h); | |
| 435 | 372 | } |
| 436 | 373 | |
| 437 | 374 | }); | ... | ... |
controllets/select-visualization-controllet/select-visualization-controllet_old.html
0 → 100755
| 1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
| 2 | + | |
| 3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
| 4 | + | |
| 5 | +<link rel="import" href="../../bower_components/paper-button/paper-button.html"> | |
| 6 | + | |
| 7 | +<link rel="import" href="../items-vslider-controllet/items-vslider-controllet.html" /> | |
| 8 | +<link rel="import" href="select-datalet-inputs_series.html" /> | |
| 9 | +<link rel="import" href="select-datalet-inputs.html" /> | |
| 10 | +<link rel="import" href="select-datalet-options.html" /> | |
| 11 | + | |
| 12 | +<script src="../../../DEEPCLIENT/js/deepClient.js"></script> | |
| 13 | + | |
| 14 | +<dom-module id="select-visualization-controllet"> | |
| 15 | + | |
| 16 | + <template> | |
| 17 | + | |
| 18 | + <style is="custom-style"> | |
| 19 | + #select_visualization_container { | |
| 20 | + display: flex; | |
| 21 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| 22 | + font-size: 16px; | |
| 23 | + margin-top: 8px; | |
| 24 | + } | |
| 25 | + | |
| 26 | + #items_vslider_controllet { | |
| 27 | + position: relative; | |
| 28 | + min-width: 172px; | |
| 29 | + } | |
| 30 | + | |
| 31 | + #datalet_selection_inputs { | |
| 32 | + position: relative; | |
| 33 | + margin-left: 32px; | |
| 34 | + min-width: 258px; | |
| 35 | + } | |
| 36 | + | |
| 37 | + #datalet_selection_options { | |
| 38 | + position: relative; | |
| 39 | + margin-left: 32px; | |
| 40 | + min-width: 258px; | |
| 41 | + } | |
| 42 | + | |
| 43 | + #datalet_preview_container { | |
| 44 | + position: relative; | |
| 45 | + width: 100%; | |
| 46 | + margin-left: 32px; | |
| 47 | + } | |
| 48 | + | |
| 49 | + #datalet_selection_datalet { | |
| 50 | + position: relative; | |
| 51 | + height: 100vh; | |
| 52 | + width: 100%; | |
| 53 | + } | |
| 54 | + | |
| 55 | + #datalet_selection_datalet_placeholder { | |
| 56 | + padding: 16px; | |
| 57 | + } | |
| 58 | + | |
| 59 | + .input_header { | |
| 60 | + height: 32px; | |
| 61 | + padding-top: 16px; | |
| 62 | + text-align: center; | |
| 63 | + font-weight: 700; | |
| 64 | + background-color: #B6B6B6; | |
| 65 | + } | |
| 66 | + | |
| 67 | + paper-button { | |
| 68 | + position: absolute; | |
| 69 | + bottom: 16px; | |
| 70 | + right: 11px; | |
| 71 | + | |
| 72 | + height: 48px; | |
| 73 | + width: 172px; | |
| 74 | + background-color: #00BCD4; | |
| 75 | + color: white; | |
| 76 | + font-weight: 700; | |
| 77 | + padding: 16px; | |
| 78 | + } | |
| 79 | + | |
| 80 | + paper-button:hover { | |
| 81 | + background-color: #00AABF; | |
| 82 | + | |
| 83 | + box-shadow: 0px 8px 12px #888; | |
| 84 | + -webkit-box-shadow: 0px 8px 12px #888; | |
| 85 | + -moz-box-shadow: 0px 8px 12px #888; | |
| 86 | + } | |
| 87 | + | |
| 88 | + paper-button[disabled] { | |
| 89 | + background-color: #B6B6B6; | |
| 90 | + } | |
| 91 | + </style> | |
| 92 | + | |
| 93 | + <iron-ajax id="selectedDatalet_request" on-response="_handleSelectedDatalet"></iron-ajax> | |
| 94 | + | |
| 95 | + <div id="select_visualization_container"> | |
| 96 | + | |
| 97 | + <div id="items_vslider_controllet"> | |
| 98 | + <items-vslider-controllet id="vslider" datalets-list-url={{dataletsListUrl}} preselected-datalet={{preselectedDatalet}}></items-vslider-controllet> | |
| 99 | + </div> | |
| 100 | + | |
| 101 | + <div id="datalet_selection_inputs"> | |
| 102 | + <template is="dom-if" if="{{_checkType(type, 'multiseries')}}"> | |
| 103 | + <select-datalet-inputs_series id="inputs_series"></select-datalet-inputs_series> | |
| 104 | + </template> | |
| 105 | + <template is="dom-if" if="{{_checkType(type, 'default')}}"> | |
| 106 | + <select-datalet-inputs id="inputs"></select-datalet-inputs> | |
| 107 | + </template> | |
| 108 | + <template is="dom-if" if="{{_checkType(type, '')}}"> | |
| 109 | + <select-datalet-inputs></select-datalet-inputs> | |
| 110 | + </template> | |
| 111 | + </div> | |
| 112 | + | |
| 113 | + <div id="datalet_selection_options"> | |
| 114 | + <select-datalet-options id="options"></select-datalet-options> | |
| 115 | + </div> | |
| 116 | + | |
| 117 | + <div id="datalet_preview_container"> | |
| 118 | + | |
| 119 | + <paper-material id="datalet_selection_datalet" elevation="5"> | |
| 120 | + <div class="input_header"><span id="dataletPreview"></span></div> | |
| 121 | + <div id="datalet_selection_datalet_placeholder"></div> | |
| 122 | + </paper-material> | |
| 123 | + | |
| 124 | + <paper-button id="add_button" disabled raised on-click="_addDatalet"></paper-button> | |
| 125 | + | |
| 126 | + </div> | |
| 127 | + | |
| 128 | + </div> | |
| 129 | + | |
| 130 | + </template> | |
| 131 | + | |
| 132 | + <script> | |
| 133 | + | |
| 134 | + Polymer({ | |
| 135 | + | |
| 136 | + is : 'select-visualization-controllet', | |
| 137 | + | |
| 138 | + properties : { | |
| 139 | + | |
| 140 | + deepUrl : { | |
| 141 | + type : String, | |
| 142 | + value : undefined | |
| 143 | + }, | |
| 144 | + | |
| 145 | + dataletsListUrl : { | |
| 146 | + type : String, | |
| 147 | + value : undefined | |
| 148 | + }, | |
| 149 | + | |
| 150 | + selectedDatalet : { | |
| 151 | + type : String, | |
| 152 | + value : undefined | |
| 153 | + }, | |
| 154 | + | |
| 155 | + preselectedDatalet : { | |
| 156 | + type : String, | |
| 157 | + value : undefined | |
| 158 | + }, | |
| 159 | + | |
| 160 | + type : { | |
| 161 | + type : String, | |
| 162 | + value : "" | |
| 163 | + }, | |
| 164 | + | |
| 165 | + filters : { | |
| 166 | + type : Array, | |
| 167 | + value : [] | |
| 168 | + }, | |
| 169 | + | |
| 170 | + fields : { | |
| 171 | + type : Array, | |
| 172 | + value : [] | |
| 173 | + }, | |
| 174 | + | |
| 175 | + selectedFields : { | |
| 176 | + type : Array, | |
| 177 | + value : [] | |
| 178 | + }, | |
| 179 | + | |
| 180 | + dataletPreset : { | |
| 181 | + type : Object, | |
| 182 | + value : [] | |
| 183 | + }, | |
| 184 | + | |
| 185 | + dataUrl : { | |
| 186 | + type : String, | |
| 187 | + value : undefined | |
| 188 | + }, | |
| 189 | + | |
| 190 | + params:{ | |
| 191 | + type: Object, | |
| 192 | + value: undefined | |
| 193 | + }, | |
| 194 | + | |
| 195 | + data : { | |
| 196 | + type : Object, | |
| 197 | + value : undefined | |
| 198 | + }, | |
| 199 | + | |
| 200 | + }, | |
| 201 | + | |
| 202 | + listeners: { | |
| 203 | +// 'select-fields-controllet_selected-fields': '_updateFields', | |
| 204 | +// 'filters-controllet_filters': '_updateFilters', | |
| 205 | + 'items-vslider-controllet_selected-datalet': '_selectDatalet', | |
| 206 | + 'select_visualization_inputs_ready': '_loadDatalet', | |
| 207 | + 'select_visualization_options_changed': '_tryLoadDatalet' | |
| 208 | + }, | |
| 209 | + | |
| 210 | + ready : function() { | |
| 211 | + this._resize(); | |
| 212 | + | |
| 213 | + $(this.$.datalet_selection_datalet).perfectScrollbar(); | |
| 214 | + | |
| 215 | +// this.params = {'data-url' : this.dataUrl};//not here | |
| 216 | + }, | |
| 217 | + | |
| 218 | + attached : function() { | |
| 219 | + this._resize(); | |
| 220 | + var that = this; | |
| 221 | + window.addEventListener("resize", function() { that._resize(); }); | |
| 222 | + | |
| 223 | + this._translate(); | |
| 224 | + }, | |
| 225 | + | |
| 226 | + setFilters : function(filters) { | |
| 227 | + this.filters = this._copy(filters); | |
| 228 | + }, | |
| 229 | + | |
| 230 | + setFields : function(fields) { | |
| 231 | +// if (this.fields.length > 0 && JSON.stringify(this.fields) != JSON.stringify(fields)) | |
| 232 | +// this.init(); | |
| 233 | + | |
| 234 | + this.fields = this._copy(fields); | |
| 235 | + | |
| 236 | + var inputs = this._getInputs(); | |
| 237 | + if (inputs) | |
| 238 | + inputs.setFields(this.fields); | |
| 239 | + }, | |
| 240 | + | |
| 241 | + setData : function(data) { | |
| 242 | + this.data = this._copy(data); | |
| 243 | + }, | |
| 244 | + | |
| 245 | + init : function() { | |
| 246 | + this.$.vslider._reset(); | |
| 247 | + }, | |
| 248 | + | |
| 249 | + show : function() {//show --> preselect | |
| 250 | +// if(this.preselectedDatalet) | |
| 251 | + if(this.dataletPreset) | |
| 252 | + this._preselectDatalet(); | |
| 253 | + | |
| 254 | +// if (this.$.datalet_selection_datalet_placeholder.innerHTML == "") { | |
| 255 | +// var inputs = this._getInputs(); | |
| 256 | +// inputs.fireReady(); | |
| 257 | +// } | |
| 258 | + }, | |
| 259 | + | |
| 260 | + _translate : function(){ | |
| 261 | + if(this.preselectedDatalet) | |
| 262 | + this.$.add_button.innerHTML = ln["modifyDatalet_" + ln["localization"]]; | |
| 263 | + else | |
| 264 | + this.$.add_button.innerHTML = ln["addDatalet_" + ln["localization"]]; | |
| 265 | + | |
| 266 | + this.$.dataletPreview.innerHTML = ln["dataletPreview_" + ln["localization"]]; | |
| 267 | + }, | |
| 268 | + | |
| 269 | + _selectDatalet : function(e){ | |
| 270 | + | |
| 271 | + this.$.add_button.setAttribute("disabled", "true"); | |
| 272 | + | |
| 273 | + this.selectedDatalet = e.detail.datalet; | |
| 274 | + | |
| 275 | + this.$.datalet_selection_datalet_placeholder.innerHTML = ""; | |
| 276 | + | |
| 277 | + if(!this.selectedDatalet){ | |
| 278 | + this.type = ""; | |
| 279 | + this.$.options.setOptions([]); | |
| 280 | + } | |
| 281 | + else{ | |
| 282 | + this.$.selectedDatalet_request.url = this.deepUrl + e.detail.datalet + "-datalet"; | |
| 283 | + this.$.selectedDatalet_request.generateRequest(); | |
| 284 | + } | |
| 285 | + }, | |
| 286 | + | |
| 287 | + _handleSelectedDatalet : function(e){ | |
| 288 | + | |
| 289 | + if(this.type != e.detail.response.type) { | |
| 290 | + | |
| 291 | + this.type = e.detail.response.type; | |
| 292 | + | |
| 293 | + this.async(function () { | |
| 294 | + var inputs = this._getInputs(); | |
| 295 | + inputs.setFields(this.fields); | |
| 296 | + inputs.setInputs(e.detail.response.idm.inputs.input);// Cannot read property '0' of undefined | |
| 297 | + }, 0); | |
| 298 | + | |
| 299 | + this.$.options.setOptions(e.detail.response.idm.inputs.layouts.input); | |
| 300 | + } | |
| 301 | + else { | |
| 302 | + this.$.options.checkOptions(e.detail.response.idm.inputs.layouts.input); | |
| 303 | + } | |
| 304 | + | |
| 305 | + this.async(function () { | |
| 306 | + var inputs = this._getInputs(); | |
| 307 | + inputs.fireReady(); | |
| 308 | + }, 0); | |
| 309 | + | |
| 310 | +// this.async(function () { | |
| 311 | +// if(this.preselectedDatalet) | |
| 312 | +// this._preselectDatalet(); | |
| 313 | +// }, 1); | |
| 314 | + }, | |
| 315 | + | |
| 316 | + _preselectDatalet : function() { | |
| 317 | + this.$.vslider._preselectDatalet(); | |
| 318 | + | |
| 319 | + this.async(function () { | |
| 320 | + this.$.options._preselectOptions(this.dataletPreset); | |
| 321 | + }, 100); | |
| 322 | + | |
| 323 | + this.async(function () { | |
| 324 | + var inputs = this._getInputs(); | |
| 325 | + inputs._preselectInputs(this.fields, this.dataletPreset["aggregators"], this.dataletPreset["orders"]); | |
| 326 | + this.dataletPreset = undefined; | |
| 327 | + }, 200); | |
| 328 | + }, | |
| 329 | + | |
| 330 | + _tryLoadDatalet : function(){ | |
| 331 | + var inputs = this._getInputs(); | |
| 332 | + inputs.fireReady(); | |
| 333 | + }, | |
| 334 | + | |
| 335 | + _loadDatalet : function(e){ | |
| 336 | + if(!e.detail.isReady) { | |
| 337 | + this.$.datalet_selection_datalet_placeholder.innerHTML = ""; | |
| 338 | + return; | |
| 339 | + } | |
| 340 | + | |
| 341 | + var inputs = this._getInputs(); | |
| 342 | + | |
| 343 | + this.selectedFields = inputs.getSelectedFields(); | |
| 344 | + | |
| 345 | +// console.log(inputs.getFields()); | |
| 346 | + | |
| 347 | + this.params = {'data-url' : this.dataUrl};//?????????????????? | |
| 348 | +// this.params = {}; | |
| 349 | + | |
| 350 | + this.params["selectedfields"] = JSON.stringify(inputs.getFields()); | |
| 351 | + | |
| 352 | + this.params["filters"] = JSON.stringify(this.filters); | |
| 353 | + this.params["aggregators"] = JSON.stringify(inputs.getAggregators()); | |
| 354 | + this.params["orders"] = JSON.stringify(inputs.getOrders()); | |
| 355 | + | |
| 356 | + this.params["export_menu"] = "0"; | |
| 357 | + | |
| 358 | + var params = this.$.options.getParams(); | |
| 359 | + for (var key in params) { this.params[key] = params[key]; } | |
| 360 | + | |
| 361 | + //use cache | |
| 362 | + var data = alasql_QUERY(this.data, this.selectedFields, null, inputs.getAggregators(), inputs.getOrders()); | |
| 363 | + | |
| 364 | + var converter = new DataTypeConverter(); | |
| 365 | + var result = converter.inferJsonDataType(data, ["*"]); | |
| 366 | + result = converter.cast(result); | |
| 367 | + data = result.dataset; | |
| 368 | + | |
| 369 | + data = alasql_transformData(data, this.selectedFields, true); | |
| 370 | + | |
| 371 | + this.params["data"] = JSON.stringify(data).replace(/'/g, "'"); | |
| 372 | + // | |
| 373 | + | |
| 374 | + var dataletParams ={ | |
| 375 | + component: this.selectedDatalet+"-datalet", | |
| 376 | + fields: this.selectedFields, | |
| 377 | + params: this.params, | |
| 378 | + placeHolder: this.$.datalet_selection_datalet_placeholder, | |
| 379 | + }; | |
| 380 | + | |
| 381 | + ComponentService.deep_url = this.deepUrl; | |
| 382 | + ComponentService.getComponent(dataletParams); | |
| 383 | + | |
| 384 | + this.$.add_button.removeAttribute("disabled"); | |
| 385 | + }, | |
| 386 | + | |
| 387 | + _addDatalet : function(){ | |
| 388 | + delete this.params["export_menu"]; | |
| 389 | + delete this.params["data"]; | |
| 390 | + | |
| 391 | + var data = { | |
| 392 | + dataUrl: this.dataUrl, | |
| 393 | + datalet: this.selectedDatalet+"-datalet", | |
| 394 | + fields: this.selectedFields, | |
| 395 | + params: this.params, | |
| 396 | + staticData: JSON.stringify(this.$.datalet_selection_datalet_placeholder.children[1].behavior.data) | |
| 397 | + } | |
| 398 | + | |
| 399 | + this.fire('data-sevc-controllet.dataletCreated', {data : data}); | |
| 400 | + }, | |
| 401 | + | |
| 402 | + _checkType: function(type, check){ | |
| 403 | + if (type == "multiseries" || type == "") | |
| 404 | + return (type == check); | |
| 405 | + else if(check == "default") | |
| 406 | + return true; | |
| 407 | + return false; | |
| 408 | + }, | |
| 409 | + | |
| 410 | + _getInputs : function(){ | |
| 411 | + if(this.type == "multiseries") | |
| 412 | + return this.$$("#inputs_series") | |
| 413 | + return this.$$("#inputs"); | |
| 414 | + }, | |
| 415 | + | |
| 416 | + _copy : function(o) { | |
| 417 | + var out, v, key; | |
| 418 | + out = Array.isArray(o) ? new Array(o.length) : {}; | |
| 419 | + for (key in o) { | |
| 420 | + v = o[key]; | |
| 421 | + out[key] = (typeof v === "object") ? this._copy(v) : v; | |
| 422 | + } | |
| 423 | + return out; | |
| 424 | + }, | |
| 425 | + | |
| 426 | + _resize : function(){ | |
| 427 | + var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; | |
| 428 | + h = h - 64 - 8; //height with page scroller | |
| 429 | + | |
| 430 | + $("#items_vslider_controllet").height(h);//vslider controllet | |
| 431 | + $("#datalet_selection_inputs").height(h); | |
| 432 | + $("#datalet_selection_options").height(h); | |
| 433 | + | |
| 434 | + $("#datalet_selection_datalet").height(h); | |
| 435 | + } | |
| 436 | + | |
| 437 | + }); | |
| 438 | + | |
| 439 | + </script> | |
| 440 | + | |
| 441 | +</dom-module> | |
| 0 | 442 | \ No newline at end of file | ... | ... |
datalets/areachart-datalet/areachart-datalet.html
| ... | ... | @@ -71,7 +71,7 @@ Example: |
| 71 | 71 | text: this._component.title |
| 72 | 72 | }, |
| 73 | 73 | xAxis: { |
| 74 | - categories: this.properties.categories.value,//this._component.categories, | |
| 74 | + categories: this.properties.categories.value, | |
| 75 | 75 | title: { |
| 76 | 76 | text: this._component.xAxisLabel |
| 77 | 77 | } |
| ... | ... | @@ -86,7 +86,13 @@ Example: |
| 86 | 86 | valueSuffix: ' ' + this._component.suffix |
| 87 | 87 | }, |
| 88 | 88 | plotOptions: { |
| 89 | + series: { | |
| 90 | + stacking: this._component.stack | |
| 91 | + }, | |
| 89 | 92 | area: { |
| 93 | + dataLabels: { | |
| 94 | + enabled: this._component.dataLabels | |
| 95 | + }, | |
| 90 | 96 | marker: { |
| 91 | 97 | enabled: false, |
| 92 | 98 | symbol: 'circle', |
| ... | ... | @@ -99,17 +105,6 @@ Example: |
| 99 | 105 | } |
| 100 | 106 | } |
| 101 | 107 | }, |
| 102 | - legend: { | |
| 103 | - layout: 'vertical', | |
| 104 | - align: 'right', | |
| 105 | - verticalAlign: 'top', | |
| 106 | - x: -40, | |
| 107 | - y: 80, | |
| 108 | - floating: true, | |
| 109 | - borderWidth: 1, | |
| 110 | - backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 111 | - shadow: true | |
| 112 | - }, | |
| 113 | 108 | credits: { |
| 114 | 109 | enabled: false |
| 115 | 110 | }, |
| ... | ... | @@ -119,6 +114,27 @@ Example: |
| 119 | 114 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 120 | 115 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 121 | 116 | |
| 117 | + if(this._component.legend == "topRight") | |
| 118 | + options.legend = { | |
| 119 | + layout: 'vertical', | |
| 120 | + verticalAlign: 'top', | |
| 121 | + align: 'right', | |
| 122 | + x: -4, | |
| 123 | + y: 4, | |
| 124 | + floating: true, | |
| 125 | + borderWidth: 1, | |
| 126 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 127 | + shadow: true | |
| 128 | + }; | |
| 129 | + else if(this._component.legend == "bottom") | |
| 130 | + options.legend = { | |
| 131 | + enabled: true | |
| 132 | + }; | |
| 133 | + else | |
| 134 | + options.legend ={ | |
| 135 | + enabled: false | |
| 136 | + }; | |
| 137 | + | |
| 122 | 138 | $(this._component.$.charts.$.container).highcharts(options); |
| 123 | 139 | } |
| 124 | 140 | }; |
| ... | ... | @@ -132,50 +148,34 @@ Example: |
| 132 | 148 | type: Array, |
| 133 | 149 | value: undefined |
| 134 | 150 | }, |
| 135 | - /** | |
| 136 | - * It's the label for X axis | |
| 137 | - * | |
| 138 | - * @attribute xAxisLabel | |
| 139 | - * @type String | |
| 140 | - * @default '' | |
| 141 | - */ | |
| 142 | 151 | xAxisLabel: { |
| 143 | 152 | type: String, |
| 144 | 153 | value: "" |
| 145 | 154 | }, |
| 146 | - /** | |
| 147 | - * It's the label for Y axis | |
| 148 | - * | |
| 149 | - * @attribute yAxisLabel | |
| 150 | - * @type String | |
| 151 | - * @default '' | |
| 152 | - */ | |
| 153 | 155 | yAxisLabel: { |
| 154 | 156 | type: String, |
| 155 | 157 | value: "" |
| 156 | 158 | }, |
| 157 | - /** | |
| 158 | - * It's the values suffix | |
| 159 | - * | |
| 160 | - * @attribute suffix | |
| 161 | - * @type Strig | |
| 162 | - * @default 'units' | |
| 163 | - */ | |
| 164 | 159 | suffix : { |
| 165 | 160 | type : String, |
| 166 | - value : "units" | |
| 161 | + value : "" | |
| 162 | + }, | |
| 163 | + legend : { | |
| 164 | + type : Object, | |
| 165 | + value : "topRight" | |
| 166 | + }, | |
| 167 | + dataLabels : { | |
| 168 | + type : Object, | |
| 169 | + value : true | |
| 170 | + }, | |
| 171 | + stack : { | |
| 172 | + type : Object, | |
| 173 | + value : false | |
| 167 | 174 | }, |
| 168 | 175 | theme : { |
| 169 | 176 | type : String, |
| 170 | 177 | value : "" |
| 171 | 178 | }, |
| 172 | - /** | |
| 173 | - * It's the component behavior | |
| 174 | - * | |
| 175 | - * @attribute behavior | |
| 176 | - * @type Object | |
| 177 | - * @default {} | |
| 178 | - */ | |
| 179 | 179 | behavior : { |
| 180 | 180 | type : Object, |
| 181 | 181 | value : {} | ... | ... |
datalets/areachart-datalet/areachart-datalet.png
datalets/areachart-datalet/areachart-datalet2.png
0 → 100644
607 Bytes
datalets/barchart-datalet/barchart-datalet.html
| ... | ... | @@ -88,21 +88,13 @@ Example: |
| 88 | 88 | plotOptions: { |
| 89 | 89 | bar: { |
| 90 | 90 | dataLabels: { |
| 91 | - enabled: true | |
| 91 | + enabled: this._component.dataLabels | |
| 92 | 92 | } |
| 93 | + }, | |
| 94 | + series: { | |
| 95 | + stacking: this._component.stack | |
| 93 | 96 | } |
| 94 | 97 | }, |
| 95 | - legend: { | |
| 96 | - layout: 'vertical', | |
| 97 | - align: 'right', | |
| 98 | - verticalAlign: 'top', | |
| 99 | - x: -40, | |
| 100 | - y: 80, | |
| 101 | - floating: true, | |
| 102 | - borderWidth: 1, | |
| 103 | - backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 104 | - shadow: true | |
| 105 | - }, | |
| 106 | 98 | credits: { |
| 107 | 99 | enabled: false |
| 108 | 100 | }, |
| ... | ... | @@ -112,6 +104,27 @@ Example: |
| 112 | 104 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 113 | 105 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 114 | 106 | |
| 107 | + if(this._component.legend == "topRight") | |
| 108 | + options.legend = { | |
| 109 | + layout: 'vertical', | |
| 110 | + verticalAlign: 'top', | |
| 111 | + align: 'right', | |
| 112 | + x: -4, | |
| 113 | + y: 4, | |
| 114 | + floating: true, | |
| 115 | + borderWidth: 1, | |
| 116 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 117 | + shadow: true | |
| 118 | + }; | |
| 119 | + else if(this._component.legend == "bottom") | |
| 120 | + options.legend = { | |
| 121 | + enabled: true | |
| 122 | + }; | |
| 123 | + else | |
| 124 | + options.legend ={ | |
| 125 | + enabled: false | |
| 126 | + }; | |
| 127 | + | |
| 115 | 128 | $(this._component.$.charts.$.container).highcharts(options); |
| 116 | 129 | } |
| 117 | 130 | }; |
| ... | ... | @@ -136,6 +149,18 @@ Example: |
| 136 | 149 | type : String, |
| 137 | 150 | value : "" |
| 138 | 151 | }, |
| 152 | + legend : { | |
| 153 | + type : Object, | |
| 154 | + value : "topRight" | |
| 155 | + }, | |
| 156 | + dataLabels : { | |
| 157 | + type : Object, | |
| 158 | + value : true | |
| 159 | + }, | |
| 160 | + stack : { | |
| 161 | + type : Object, | |
| 162 | + value : false | |
| 163 | + }, | |
| 139 | 164 | theme : { |
| 140 | 165 | type : String, |
| 141 | 166 | value : "" | ... | ... |
datalets/base-ajax-json-alasql-datalet/static/js/AjaxJsonAlasqlBehavior.js
| ... | ... | @@ -95,12 +95,21 @@ var AjaxJsonAlasqlBehavior = { |
| 95 | 95 | }, |
| 96 | 96 | |
| 97 | 97 | filterData : function() { |
| 98 | - var fields = this._component.fields = JSON.parse(this._component.fields); | |
| 99 | - | |
| 98 | + var selectedFields = JSON.parse(this._component.getAttribute("selectedfields")); | |
| 100 | 99 | var filters = JSON.parse(this._component.getAttribute("filters")); |
| 101 | 100 | var aggregators = JSON.parse(this._component.getAttribute("aggregators")); |
| 102 | 101 | var orders = JSON.parse(this._component.getAttribute("orders")); |
| 103 | 102 | |
| 103 | + this._component.fields = JSON.parse(this._component.fields); /*deprecated*/ | |
| 104 | + if(selectedFields) { /*if deprecated*/ | |
| 105 | + this._component.fields = []; /*deprecated*/ | |
| 106 | + for (var i=0; i < selectedFields.length; i++) | |
| 107 | + if (selectedFields[i]) | |
| 108 | + this._component.fields.push(selectedFields[i].value); | |
| 109 | + } | |
| 110 | + | |
| 111 | + var fields = this._component.fields; | |
| 112 | + | |
| 104 | 113 | //preview my space ? |
| 105 | 114 | if(filters && filters[0] && filters[0].constructor == Array){ |
| 106 | 115 | filters = filters[0]; |
| ... | ... | @@ -109,14 +118,22 @@ var AjaxJsonAlasqlBehavior = { |
| 109 | 118 | } |
| 110 | 119 | |
| 111 | 120 | var converter = new DataTypeConverter(); |
| 112 | - | |
| 113 | - var data = alasql_QUERY(this.data, fields, filters, null, orders); | |
| 114 | - var result = converter.inferJsonDataType(data, ["*"]); | |
| 115 | - result = converter.cast(result); | |
| 116 | - data = result.dataset; | |
| 121 | + var data = []; | |
| 122 | + var result = []; | |
| 117 | 123 | |
| 118 | 124 | if(aggregators && aggregators.length) { |
| 119 | - data = alasql_QUERY(data, fields, null, aggregators, orders); | |
| 125 | + data = alasql_QUERY(this.data, "*", filters, null, orders); | |
| 126 | + result = converter.inferJsonDataType(data, ["*"]); | |
| 127 | + result = converter.cast(result); | |
| 128 | + data = result.dataset; | |
| 129 | + | |
| 130 | + data = alasql_QUERY(data, null, null, aggregators, orders); | |
| 131 | + result = converter.inferJsonDataType(data, ["*"]); | |
| 132 | + result = converter.cast(result); | |
| 133 | + data = result.dataset; | |
| 134 | + } | |
| 135 | + else { | |
| 136 | + data = alasql_QUERY(this.data, fields, filters, null, orders); | |
| 120 | 137 | result = converter.inferJsonDataType(data, ["*"]); |
| 121 | 138 | result = converter.cast(result); |
| 122 | 139 | data = result.dataset; |
| ... | ... | @@ -125,16 +142,4 @@ var AjaxJsonAlasqlBehavior = { |
| 125 | 142 | this.data = alasql_transformData(data, fields, true); |
| 126 | 143 | } |
| 127 | 144 | |
| 128 | - //var selectedFields = JSON.parse(this._component.getAttribute("selectedFields")); | |
| 129 | - //if(selectedFields) { | |
| 130 | - // fields = []; | |
| 131 | - // var inputs = []; | |
| 132 | - // for (var i=0; i < selectedFields.length; i++) { | |
| 133 | - // if (selectedFields[i]) { | |
| 134 | - // fields.push(selectedFields[i].field); | |
| 135 | - // inputs.push(selectedFields[i].input); | |
| 136 | - // } | |
| 137 | - // } | |
| 138 | - //} | |
| 139 | - | |
| 140 | 145 | }; |
| 141 | 146 | \ No newline at end of file | ... | ... |
datalets/base-datalet/base-datalet.html
datalets/base-datalet/static/js/BaseDataletBehavior.js
datalets/bubblechart-datalet/bubblechart-datalet.html
| ... | ... | @@ -93,7 +93,7 @@ Examples: |
| 93 | 93 | } |
| 94 | 94 | |
| 95 | 95 | this.properties.series = bubbleSeries; |
| 96 | - this._component.legend = true; | |
| 96 | +// this._component.legend = true; | |
| 97 | 97 | } |
| 98 | 98 | else {// == 4 |
| 99 | 99 | var bubbleSeries = []; |
| ... | ... | @@ -108,7 +108,7 @@ Examples: |
| 108 | 108 | bubbleSeries.push({data: series}); |
| 109 | 109 | |
| 110 | 110 | this.properties.series = bubbleSeries; |
| 111 | - this._component.legend = false; | |
| 111 | +// this._component.legend = false; | |
| 112 | 112 | } |
| 113 | 113 | |
| 114 | 114 | options = { |
| ... | ... | @@ -120,9 +120,6 @@ Examples: |
| 120 | 120 | title: { |
| 121 | 121 | text: this._component.title |
| 122 | 122 | }, |
| 123 | -// subtitle: { | |
| 124 | -// text: this._component.description | |
| 125 | -// }, | |
| 126 | 123 | xAxis: { |
| 127 | 124 | title: { |
| 128 | 125 | text: this._component.xAxisLabel |
| ... | ... | @@ -133,10 +130,12 @@ Examples: |
| 133 | 130 | text: this._component.yAxisLabel, |
| 134 | 131 | } |
| 135 | 132 | }, |
| 136 | - legend: { | |
| 137 | - enabled: this._component.legend, | |
| 138 | - }, | |
| 139 | 133 | plotOptions: { |
| 134 | + bubble: { | |
| 135 | + dataLabels: { | |
| 136 | + enabled: this._component.dataLabels | |
| 137 | + } | |
| 138 | + }, | |
| 140 | 139 | series: { |
| 141 | 140 | dataLabels: { |
| 142 | 141 | enabled: true, |
| ... | ... | @@ -153,6 +152,27 @@ Examples: |
| 153 | 152 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 154 | 153 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 155 | 154 | |
| 155 | + if(this._component.legend == "topRight") | |
| 156 | + options.legend = { | |
| 157 | + layout: 'vertical', | |
| 158 | + verticalAlign: 'top', | |
| 159 | + align: 'right', | |
| 160 | + x: -4, | |
| 161 | + y: 4, | |
| 162 | + floating: true, | |
| 163 | + borderWidth: 1, | |
| 164 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 165 | + shadow: true | |
| 166 | + }; | |
| 167 | + else if(this._component.legend == "bottom") | |
| 168 | + options.legend = { | |
| 169 | + enabled: true | |
| 170 | + }; | |
| 171 | + else | |
| 172 | + options.legend ={ | |
| 173 | + enabled: false | |
| 174 | + }; | |
| 175 | + | |
| 156 | 176 | $(this._component.$.charts.$.container).highcharts(options); |
| 157 | 177 | } |
| 158 | 178 | }; |
| ... | ... | @@ -178,6 +198,10 @@ Examples: |
| 178 | 198 | type : String, |
| 179 | 199 | value : "" |
| 180 | 200 | }, |
| 201 | + legend : { | |
| 202 | + type : Object, | |
| 203 | + value : "topRight" | |
| 204 | + }, | |
| 181 | 205 | behavior : { |
| 182 | 206 | type : Object, |
| 183 | 207 | value : {} | ... | ... |
datalets/columnchart-datalet/columnchart-datalet.html
| ... | ... | @@ -66,7 +66,7 @@ Example: |
| 66 | 66 | options = { |
| 67 | 67 | chart: { |
| 68 | 68 | type: 'column', |
| 69 | - zoomType: 'xy', | |
| 69 | + zoomType: 'xy' | |
| 70 | 70 | }, |
| 71 | 71 | title: { |
| 72 | 72 | text: this._component.title |
| ... | ... | @@ -75,8 +75,7 @@ Example: |
| 75 | 75 | categories: this.properties.categories.value, |
| 76 | 76 | title: { |
| 77 | 77 | text: this._component.xAxisLabel |
| 78 | - }, | |
| 79 | -// crosshair: true | |
| 78 | + } | |
| 80 | 79 | }, |
| 81 | 80 | yAxis: { |
| 82 | 81 | min: 0, |
| ... | ... | @@ -84,41 +83,19 @@ Example: |
| 84 | 83 | text: this._component.yAxisLabel, |
| 85 | 84 | } |
| 86 | 85 | }, |
| 87 | -// tooltip: { | |
| 88 | -// headerFormat: '<span style="font-size:16px; font-weight: bold">{point.key}</span><table style="font-size:16px; white-space: nowrap ">', | |
| 89 | -// pointFormat: '<tr style="color:{series.color}"><td>{series.name}: </td>' + | |
| 90 | -// '<td>{point.y} ' + this._component.suffix + '</span></td></tr>', | |
| 91 | -// footerFormat: '</table>', | |
| 92 | -// shared: true, | |
| 93 | -// useHTML: true | |
| 94 | -// }, | |
| 95 | -// plotOptions: { | |
| 96 | -// column: { | |
| 97 | -// pointPadding: 0.2, | |
| 98 | -// borderWidth: 0 | |
| 99 | -// } | |
| 100 | -// }, | |
| 101 | 86 | tooltip: { |
| 102 | 87 | valueSuffix: ' ' + this._component.suffix |
| 103 | 88 | }, |
| 104 | 89 | plotOptions: { |
| 105 | 90 | column: { |
| 106 | 91 | dataLabels: { |
| 107 | - enabled: true | |
| 92 | + enabled: this._component.dataLabels | |
| 108 | 93 | } |
| 94 | + }, | |
| 95 | + series: { | |
| 96 | + stacking: this._component.stack | |
| 109 | 97 | } |
| 110 | 98 | }, |
| 111 | - legend: { | |
| 112 | - layout: 'vertical', | |
| 113 | - align: 'right', | |
| 114 | - verticalAlign: 'top', | |
| 115 | - x: -40, | |
| 116 | - y: 80, | |
| 117 | - floating: true, | |
| 118 | - borderWidth: 1, | |
| 119 | - backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 120 | - shadow: true | |
| 121 | - }, | |
| 122 | 99 | credits: { |
| 123 | 100 | enabled: false |
| 124 | 101 | }, |
| ... | ... | @@ -128,6 +105,27 @@ Example: |
| 128 | 105 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 129 | 106 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 130 | 107 | |
| 108 | + if(this._component.legend == "topRight") | |
| 109 | + options.legend = { | |
| 110 | + layout: 'vertical', | |
| 111 | + verticalAlign: 'top', | |
| 112 | + align: 'right', | |
| 113 | + x: -4, | |
| 114 | + y: 4, | |
| 115 | + floating: true, | |
| 116 | + borderWidth: 1, | |
| 117 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 118 | + shadow: true | |
| 119 | + }; | |
| 120 | + else if(this._component.legend == "bottom") | |
| 121 | + options.legend = { | |
| 122 | + enabled: true | |
| 123 | + }; | |
| 124 | + else | |
| 125 | + options.legend ={ | |
| 126 | + enabled: false | |
| 127 | + }; | |
| 128 | + | |
| 131 | 129 | $(this._component.$.charts.$.container).highcharts(options); |
| 132 | 130 | } |
| 133 | 131 | }; |
| ... | ... | @@ -140,51 +138,34 @@ Example: |
| 140 | 138 | type: Array, |
| 141 | 139 | value: undefined |
| 142 | 140 | }, |
| 143 | - /** | |
| 144 | - * It's the label for X axis | |
| 145 | - * | |
| 146 | - * @attribute xAxisLabel | |
| 147 | - * @type String | |
| 148 | - * @default '' | |
| 149 | - */ | |
| 150 | 141 | xAxisLabel: { |
| 151 | 142 | type: String, |
| 152 | 143 | value: "" |
| 153 | 144 | }, |
| 154 | - /** | |
| 155 | - * It's the label for Y axis | |
| 156 | - * | |
| 157 | - * @attribute yAxisLabel | |
| 158 | - * @type String | |
| 159 | - * @default '' | |
| 160 | - */ | |
| 161 | 145 | yAxisLabel: { |
| 162 | 146 | type: String, |
| 163 | 147 | value: "" |
| 164 | 148 | }, |
| 165 | - /** | |
| 166 | - * It's the values suffix | |
| 167 | - * | |
| 168 | - * @attribute suffix | |
| 169 | - * @type Strig | |
| 170 | - * @default 'units' | |
| 171 | - */ | |
| 172 | 149 | suffix : { |
| 173 | 150 | type : String, |
| 174 | 151 | value : "" |
| 175 | 152 | }, |
| 176 | - | |
| 153 | + legend : { | |
| 154 | + type : Object, | |
| 155 | + value : "topRight" | |
| 156 | + }, | |
| 157 | + dataLabels : { | |
| 158 | + type : Object, | |
| 159 | + value : true | |
| 160 | + }, | |
| 161 | + stack : { | |
| 162 | + type : Object, | |
| 163 | + value : false | |
| 164 | + }, | |
| 177 | 165 | theme : { |
| 178 | 166 | type : String, |
| 179 | 167 | value : "" |
| 180 | 168 | }, |
| 181 | - /** | |
| 182 | - * It's the component behavior | |
| 183 | - * | |
| 184 | - * @attribute behavior | |
| 185 | - * @type Object | |
| 186 | - * @default {} | |
| 187 | - */ | |
| 188 | 169 | behavior : { |
| 189 | 170 | type : Object, |
| 190 | 171 | value : {} | ... | ... |
datalets/graph-datalet/demo/demo-clustering-2.html
| ... | ... | @@ -3,32 +3,44 @@ |
| 3 | 3 | <head> |
| 4 | 4 | <meta charset="UTF-8"> |
| 5 | 5 | <title>Demo Graph with node clustering</title> |
| 6 | - <link rel="import" href="../graph-clustering-datalet.html"> | |
| 6 | + <link rel="import" href="../graph-with-clustering-extend-datalet.html"> | |
| 7 | + <link rel="import" href="../graph-datalet.html"> | |
| 7 | 8 | <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> |
| 8 | - <script> | |
| 9 | - function loadDoc() { | |
| 10 | - var xhttp = new XMLHttpRequest(); | |
| 11 | - xhttp.onreadystatechange = function() { | |
| 12 | - if (xhttp.readyState == 4 && xhttp.status == 200) { | |
| 13 | - document.getElementById("graph-placeholder").innerHTML = '<graph-clustering-datalet width="1000" height="700" graph=\'' + JSON.parse(xhttp.responseText).graph + | |
| 14 | - '\'></graph-clustering-datalet>'; | |
| 15 | - } | |
| 16 | - }; | |
| 17 | - xhttp.open("GET", "http://192.168.164.128/public_room/ajax/get-graph?id=1&type=comments", true); | |
| 18 | - xhttp.send(); | |
| 19 | - } | |
| 9 | +</head> | |
| 10 | +<script> | |
| 11 | + function loadDoc() { | |
| 12 | + debugger; | |
| 13 | + var xhttp = new XMLHttpRequest(); | |
| 14 | + xhttp.onreadystatechange = function() { | |
| 15 | + if (xhttp.readyState == 4 && xhttp.status == 200) { | |
| 16 | + /* document.getElementById("graph-placeholder").innerHTML = '<graph-with-clustering-extend-datalet width="1000" height="700" graph=\'' + JSON.parse(xhttp.responseText).graph + | |
| 17 | + '\'></graph-with-clustering-extend-datalet>';*/ | |
| 18 | + | |
| 19 | + document.getElementById("graph-placeholder").innerHTML = '<graph-with-clustering-extend-datalet width="' + $("#graph-placeholder").width() + '" height="' + $("#graph-placeholder").height() + '" id="dgraph"></graph-with-clustering-extend-datalet>'; | |
| 20 | + | |
| 21 | + var g = document.getElementById('dgraph'); | |
| 22 | + g.graph = JSON.parse(xhttp.responseText).graph; | |
| 23 | + g.buildGraph(); | |
| 24 | + g.init(); | |
| 25 | + } | |
| 26 | + }; | |
| 27 | + xhttp.open("GET", "http://spod.databenc.it/spodpublic/ajax/get-graph/?id=41&type=comments", true); | |
| 28 | + xhttp.send(); | |
| 29 | + } | |
| 20 | 30 | |
| 31 | + $(document).ready(function(){ | |
| 21 | 32 | loadDoc(); |
| 33 | + }); | |
| 22 | 34 | |
| 23 | - </script> | |
| 24 | -</head> | |
| 35 | + loadDoc(); | |
| 36 | + | |
| 37 | +</script> | |
| 25 | 38 | <body> |
| 26 | 39 | <h1>Graph with clustering</h1> |
| 27 | -<div id="graph-placeholder"></div> | |
| 28 | -<!--<graph-clustering-datalet width="1000" | |
| 29 | - height="700" | |
| 30 | - graph='{"nodes":[{"name":"Myriel","group":1},{"name":"Napoleon","group":1},{"name":"Mlle.Baptistine","group":1},{"name":"Mme.Magloire","group":1},{"name":"CountessdeLo","group":1},{"name":"Geborand","group":1},{"name":"Champtercier","group":1},{"name":"Cravatte","group":1},{"name":"Count","group":1},{"name":"OldMan","group":1},{"name":"Labarre","group":2},{"name":"Valjean","group":2},{"name":"Marguerite","group":3},{"name":"Mme.deR","group":2},{"name":"Isabeau","group":2},{"name":"Gervais","group":2},{"name":"Tholomyes","group":3},{"name":"Listolier","group":3},{"name":"Fameuil","group":3},{"name":"Blacheville","group":3},{"name":"Favourite","group":3},{"name":"Dahlia","group":3},{"name":"Zephine","group":3},{"name":"Fantine","group":3},{"name":"Mme.Thenardier","group":4},{"name":"Thenardier","group":4},{"name":"Cosette","group":5},{"name":"Javert","group":4},{"name":"Fauchelevent","group":0},{"name":"Bamatabois","group":2},{"name":"Perpetue","group":3},{"name":"Simplice","group":2},{"name":"Scaufflaire","group":2},{"name":"Woman1","group":2},{"name":"Judge","group":2},{"name":"Champmathieu","group":2},{"name":"Brevet","group":2},{"name":"Chenildieu","group":2},{"name":"Cochepaille","group":2},{"name":"Pontmercy","group":4},{"name":"Boulatruelle","group":6},{"name":"Eponine","group":4},{"name":"Anzelma","group":4},{"name":"Woman2","group":5},{"name":"MotherInnocent","group":0},{"name":"Gribier","group":0},{"name":"Jondrette","group":7},{"name":"Mme.Burgon","group":7},{"name":"Gavroche","group":8},{"name":"Gillenormand","group":5},{"name":"Magnon","group":5},{"name":"Mlle.Gillenormand","group":5},{"name":"Mme.Pontmercy","group":5},{"name":"Mlle.Vaubois","group":5},{"name":"Lt.Gillenormand","group":5},{"name":"Marius","group":8},{"name":"BaronessT","group":5},{"name":"Mabeuf","group":8},{"name":"Enjolras","group":8},{"name":"Combeferre","group":8},{"name":"Prouvaire","group":8},{"name":"Feuilly","group":8},{"name":"Courfeyrac","group":8},{"name":"Bahorel","group":8},{"name":"Bossuet","group":8},{"name":"Joly","group":8},{"name":"Grantaire","group":8},{"name":"MotherPlutarch","group":9},{"name":"Gueulemer","group":4},{"name":"Babet","group":4},{"name":"Claquesous","group":4},{"name":"Montparnasse","group":4},{"name":"Toussaint","group":5},{"name":"Child1","group":10},{"name":"Child2","group":10},{"name":"Brujon","group":4},{"name":"Mme.Hucheloup","group":8}],"links":[{"source":1,"target":0,"value":1},{"source":2,"target":0,"value":8},{"source":3,"target":0,"value":10},{"source":3,"target":2,"value":6},{"source":4,"target":0,"value":1},{"source":5,"target":0,"value":1},{"source":6,"target":0,"value":1},{"source":7,"target":0,"value":1},{"source":8,"target":0,"value":2},{"source":9,"target":0,"value":1},{"source":11,"target":10,"value":1},{"source":11,"target":3,"value":3},{"source":11,"target":2,"value":3},{"source":11,"target":0,"value":5},{"source":12,"target":11,"value":1},{"source":13,"target":11,"value":1},{"source":14,"target":11,"value":1},{"source":15,"target":11,"value":1},{"source":17,"target":16,"value":4},{"source":18,"target":16,"value":4},{"source":18,"target":17,"value":4},{"source":19,"target":16,"value":4},{"source":19,"target":17,"value":4},{"source":19,"target":18,"value":4},{"source":20,"target":16,"value":3},{"source":20,"target":17,"value":3},{"source":20,"target":18,"value":3},{"source":20,"target":19,"value":4},{"source":21,"target":16,"value":3},{"source":21,"target":17,"value":3},{"source":21,"target":18,"value":3},{"source":21,"target":19,"value":3},{"source":21,"target":20,"value":5},{"source":22,"target":16,"value":3},{"source":22,"target":17,"value":3},{"source":22,"target":18,"value":3},{"source":22,"target":19,"value":3},{"source":22,"target":20,"value":4},{"source":22,"target":21,"value":4},{"source":23,"target":16,"value":3},{"source":23,"target":17,"value":3},{"source":23,"target":18,"value":3},{"source":23,"target":19,"value":3},{"source":23,"target":20,"value":4},{"source":23,"target":21,"value":4},{"source":23,"target":22,"value":4},{"source":23,"target":12,"value":2},{"source":23,"target":11,"value":9},{"source":24,"target":23,"value":2},{"source":24,"target":11,"value":7},{"source":25,"target":24,"value":13},{"source":25,"target":23,"value":1},{"source":25,"target":11,"value":12},{"source":26,"target":24,"value":4},{"source":26,"target":11,"value":31},{"source":26,"target":16,"value":1},{"source":26,"target":25,"value":1},{"source":27,"target":11,"value":17},{"source":27,"target":23,"value":5},{"source":27,"target":25,"value":5},{"source":27,"target":24,"value":1},{"source":27,"target":26,"value":1},{"source":28,"target":11,"value":8},{"source":28,"target":27,"value":1},{"source":29,"target":23,"value":1},{"source":29,"target":27,"value":1},{"source":29,"target":11,"value":2},{"source":30,"target":23,"value":1},{"source":31,"target":30,"value":2},{"source":31,"target":11,"value":3},{"source":31,"target":23,"value":2},{"source":31,"target":27,"value":1},{"source":32,"target":11,"value":1},{"source":33,"target":11,"value":2},{"source":33,"target":27,"value":1},{"source":34,"target":11,"value":3},{"source":34,"target":29,"value":2},{"source":35,"target":11,"value":3},{"source":35,"target":34,"value":3},{"source":35,"target":29,"value":2},{"source":36,"target":34,"value":2},{"source":36,"target":35,"value":2},{"source":36,"target":11,"value":2},{"source":36,"target":29,"value":1},{"source":37,"target":34,"value":2},{"source":37,"target":35,"value":2},{"source":37,"target":36,"value":2},{"source":37,"target":11,"value":2},{"source":37,"target":29,"value":1},{"source":38,"target":34,"value":2},{"source":38,"target":35,"value":2},{"source":38,"target":36,"value":2},{"source":38,"target":37,"value":2},{"source":38,"target":11,"value":2},{"source":38,"target":29,"value":1},{"source":39,"target":25,"value":1},{"source":40,"target":25,"value":1},{"source":41,"target":24,"value":2},{"source":41,"target":25,"value":3},{"source":42,"target":41,"value":2},{"source":42,"target":25,"value":2},{"source":42,"target":24,"value":1},{"source":43,"target":11,"value":3},{"source":43,"target":26,"value":1},{"source":43,"target":27,"value":1},{"source":44,"target":28,"value":3},{"source":44,"target":11,"value":1},{"source":45,"target":28,"value":2},{"source":47,"target":46,"value":1},{"source":48,"target":47,"value":2},{"source":48,"target":25,"value":1},{"source":48,"target":27,"value":1},{"source":48,"target":11,"value":1},{"source":49,"target":26,"value":3},{"source":49,"target":11,"value":2},{"source":50,"target":49,"value":1},{"source":50,"target":24,"value":1},{"source":51,"target":49,"value":9},{"source":51,"target":26,"value":2},{"source":51,"target":11,"value":2},{"source":52,"target":51,"value":1},{"source":52,"target":39,"value":1},{"source":53,"target":51,"value":1},{"source":54,"target":51,"value":2},{"source":54,"target":49,"value":1},{"source":54,"target":26,"value":1},{"source":55,"target":51,"value":6},{"source":55,"target":49,"value":12},{"source":55,"target":39,"value":1},{"source":55,"target":54,"value":1},{"source":55,"target":26,"value":21},{"source":55,"target":11,"value":19},{"source":55,"target":16,"value":1},{"source":55,"target":25,"value":2},{"source":55,"target":41,"value":5},{"source":55,"target":48,"value":4},{"source":56,"target":49,"value":1},{"source":56,"target":55,"value":1},{"source":57,"target":55,"value":1},{"source":57,"target":41,"value":1},{"source":57,"target":48,"value":1},{"source":58,"target":55,"value":7},{"source":58,"target":48,"value":7},{"source":58,"target":27,"value":6},{"source":58,"target":57,"value":1},{"source":58,"target":11,"value":4},{"source":59,"target":58,"value":15},{"source":59,"target":55,"value":5},{"source":59,"target":48,"value":6},{"source":59,"target":57,"value":2},{"source":60,"target":48,"value":1},{"source":60,"target":58,"value":4},{"source":60,"target":59,"value":2},{"source":61,"target":48,"value":2},{"source":61,"target":58,"value":6},{"source":61,"target":60,"value":2},{"source":61,"target":59,"value":5},{"source":61,"target":57,"value":1},{"source":61,"target":55,"value":1},{"source":62,"target":55,"value":9},{"source":62,"target":58,"value":17},{"source":62,"target":59,"value":13},{"source":62,"target":48,"value":7},{"source":62,"target":57,"value":2},{"source":62,"target":41,"value":1},{"source":62,"target":61,"value":6},{"source":62,"target":60,"value":3},{"source":63,"target":59,"value":5},{"source":63,"target":48,"value":5},{"source":63,"target":62,"value":6},{"source":63,"target":57,"value":2},{"source":63,"target":58,"value":4},{"source":63,"target":61,"value":3},{"source":63,"target":60,"value":2},{"source":63,"target":55,"value":1},{"source":64,"target":55,"value":5},{"source":64,"target":62,"value":12},{"source":64,"target":48,"value":5},{"source":64,"target":63,"value":4},{"source":64,"target":58,"value":10},{"source":64,"target":61,"value":6},{"source":64,"target":60,"value":2},{"source":64,"target":59,"value":9},{"source":64,"target":57,"value":1},{"source":64,"target":11,"value":1},{"source":65,"target":63,"value":5},{"source":65,"target":64,"value":7},{"source":65,"target":48,"value":3},{"source":65,"target":62,"value":5},{"source":65,"target":58,"value":5},{"source":65,"target":61,"value":5},{"source":65,"target":60,"value":2},{"source":65,"target":59,"value":5},{"source":65,"target":57,"value":1},{"source":65,"target":55,"value":2},{"source":66,"target":64,"value":3},{"source":66,"target":58,"value":3},{"source":66,"target":59,"value":1},{"source":66,"target":62,"value":2},{"source":66,"target":65,"value":2},{"source":66,"target":48,"value":1},{"source":66,"target":63,"value":1},{"source":66,"target":61,"value":1},{"source":66,"target":60,"value":1},{"source":67,"target":57,"value":3},{"source":68,"target":25,"value":5},{"source":68,"target":11,"value":1},{"source":68,"target":24,"value":1},{"source":68,"target":27,"value":1},{"source":68,"target":48,"value":1},{"source":68,"target":41,"value":1},{"source":69,"target":25,"value":6},{"source":69,"target":68,"value":6},{"source":69,"target":11,"value":1},{"source":69,"target":24,"value":1},{"source":69,"target":27,"value":2},{"source":69,"target":48,"value":1},{"source":69,"target":41,"value":1},{"source":70,"target":25,"value":4},{"source":70,"target":69,"value":4},{"source":70,"target":68,"value":4},{"source":70,"target":11,"value":1},{"source":70,"target":24,"value":1},{"source":70,"target":27,"value":1},{"source":70,"target":41,"value":1},{"source":70,"target":58,"value":1},{"source":71,"target":27,"value":1},{"source":71,"target":69,"value":2},{"source":71,"target":68,"value":2},{"source":71,"target":70,"value":2},{"source":71,"target":11,"value":1},{"source":71,"target":48,"value":1},{"source":71,"target":41,"value":1},{"source":71,"target":25,"value":1},{"source":72,"target":26,"value":2},{"source":72,"target":27,"value":1},{"source":72,"target":11,"value":1},{"source":73,"target":48,"value":2},{"source":74,"target":48,"value":2},{"source":74,"target":73,"value":3},{"source":75,"target":69,"value":3},{"source":75,"target":68,"value":3},{"source":75,"target":25,"value":3},{"source":75,"target":48,"value":1},{"source":75,"target":41,"value":1},{"source":75,"target":70,"value":1},{"source":75,"target":71,"value":1},{"source":76,"target":64,"value":1},{"source":76,"target":65,"value":1},{"source":76,"target":66,"value":1},{"source":76,"target":63,"value":1},{"source":76,"target":62,"value":1},{"source":76,"target":48,"value":1},{"source":76,"target":58,"value":1}]}' | |
| 31 | - ></graph-clustering-datalet>--> | |
| 40 | +<!-- | |
| 41 | +graph='{"nodes":[{"name":"Myriel","group":1},{"name":"Napoleon","group":1},{"name":"Mlle.Baptistine","group":1},{"name":"Mme.Magloire","group":1},{"name":"CountessdeLo","group":1},{"name":"Geborand","group":1},{"name":"Champtercier","group":1},{"name":"Cravatte","group":1},{"name":"Count","group":1},{"name":"OldMan","group":1},{"name":"Labarre","group":2},{"name":"Valjean","group":2},{"name":"Marguerite","group":3},{"name":"Mme.deR","group":2},{"name":"Isabeau","group":2},{"name":"Gervais","group":2},{"name":"Tholomyes","group":3},{"name":"Listolier","group":3},{"name":"Fameuil","group":3},{"name":"Blacheville","group":3},{"name":"Favourite","group":3},{"name":"Dahlia","group":3},{"name":"Zephine","group":3},{"name":"Fantine","group":3},{"name":"Mme.Thenardier","group":4},{"name":"Thenardier","group":4},{"name":"Cosette","group":5},{"name":"Javert","group":4},{"name":"Fauchelevent","group":0},{"name":"Bamatabois","group":2},{"name":"Perpetue","group":3},{"name":"Simplice","group":2},{"name":"Scaufflaire","group":2},{"name":"Woman1","group":2},{"name":"Judge","group":2},{"name":"Champmathieu","group":2},{"name":"Brevet","group":2},{"name":"Chenildieu","group":2},{"name":"Cochepaille","group":2},{"name":"Pontmercy","group":4},{"name":"Boulatruelle","group":6},{"name":"Eponine","group":4},{"name":"Anzelma","group":4},{"name":"Woman2","group":5},{"name":"MotherInnocent","group":0},{"name":"Gribier","group":0},{"name":"Jondrette","group":7},{"name":"Mme.Burgon","group":7},{"name":"Gavroche","group":8},{"name":"Gillenormand","group":5},{"name":"Magnon","group":5},{"name":"Mlle.Gillenormand","group":5},{"name":"Mme.Pontmercy","group":5},{"name":"Mlle.Vaubois","group":5},{"name":"Lt.Gillenormand","group":5},{"name":"Marius","group":8},{"name":"BaronessT","group":5},{"name":"Mabeuf","group":8},{"name":"Enjolras","group":8},{"name":"Combeferre","group":8},{"name":"Prouvaire","group":8},{"name":"Feuilly","group":8},{"name":"Courfeyrac","group":8},{"name":"Bahorel","group":8},{"name":"Bossuet","group":8},{"name":"Joly","group":8},{"name":"Grantaire","group":8},{"name":"MotherPlutarch","group":9},{"name":"Gueulemer","group":4},{"name":"Babet","group":4},{"name":"Claquesous","group":4},{"name":"Montparnasse","group":4},{"name":"Toussaint","group":5},{"name":"Child1","group":10},{"name":"Child2","group":10},{"name":"Brujon","group":4},{"name":"Mme.Hucheloup","group":8}],"links":[{"source":1,"target":0,"value":1},{"source":2,"target":0,"value":8},{"source":3,"target":0,"value":10},{"source":3,"target":2,"value":6},{"source":4,"target":0,"value":1},{"source":5,"target":0,"value":1},{"source":6,"target":0,"value":1},{"source":7,"target":0,"value":1},{"source":8,"target":0,"value":2},{"source":9,"target":0,"value":1},{"source":11,"target":10,"value":1},{"source":11,"target":3,"value":3},{"source":11,"target":2,"value":3},{"source":11,"target":0,"value":5},{"source":12,"target":11,"value":1},{"source":13,"target":11,"value":1},{"source":14,"target":11,"value":1},{"source":15,"target":11,"value":1},{"source":17,"target":16,"value":4},{"source":18,"target":16,"value":4},{"source":18,"target":17,"value":4},{"source":19,"target":16,"value":4},{"source":19,"target":17,"value":4},{"source":19,"target":18,"value":4},{"source":20,"target":16,"value":3},{"source":20,"target":17,"value":3},{"source":20,"target":18,"value":3},{"source":20,"target":19,"value":4},{"source":21,"target":16,"value":3},{"source":21,"target":17,"value":3},{"source":21,"target":18,"value":3},{"source":21,"target":19,"value":3},{"source":21,"target":20,"value":5},{"source":22,"target":16,"value":3},{"source":22,"target":17,"value":3},{"source":22,"target":18,"value":3},{"source":22,"target":19,"value":3},{"source":22,"target":20,"value":4},{"source":22,"target":21,"value":4},{"source":23,"target":16,"value":3},{"source":23,"target":17,"value":3},{"source":23,"target":18,"value":3},{"source":23,"target":19,"value":3},{"source":23,"target":20,"value":4},{"source":23,"target":21,"value":4},{"source":23,"target":22,"value":4},{"source":23,"target":12,"value":2},{"source":23,"target":11,"value":9},{"source":24,"target":23,"value":2},{"source":24,"target":11,"value":7},{"source":25,"target":24,"value":13},{"source":25,"target":23,"value":1},{"source":25,"target":11,"value":12},{"source":26,"target":24,"value":4},{"source":26,"target":11,"value":31},{"source":26,"target":16,"value":1},{"source":26,"target":25,"value":1},{"source":27,"target":11,"value":17},{"source":27,"target":23,"value":5},{"source":27,"target":25,"value":5},{"source":27,"target":24,"value":1},{"source":27,"target":26,"value":1},{"source":28,"target":11,"value":8},{"source":28,"target":27,"value":1},{"source":29,"target":23,"value":1},{"source":29,"target":27,"value":1},{"source":29,"target":11,"value":2},{"source":30,"target":23,"value":1},{"source":31,"target":30,"value":2},{"source":31,"target":11,"value":3},{"source":31,"target":23,"value":2},{"source":31,"target":27,"value":1},{"source":32,"target":11,"value":1},{"source":33,"target":11,"value":2},{"source":33,"target":27,"value":1},{"source":34,"target":11,"value":3},{"source":34,"target":29,"value":2},{"source":35,"target":11,"value":3},{"source":35,"target":34,"value":3},{"source":35,"target":29,"value":2},{"source":36,"target":34,"value":2},{"source":36,"target":35,"value":2},{"source":36,"target":11,"value":2},{"source":36,"target":29,"value":1},{"source":37,"target":34,"value":2},{"source":37,"target":35,"value":2},{"source":37,"target":36,"value":2},{"source":37,"target":11,"value":2},{"source":37,"target":29,"value":1},{"source":38,"target":34,"value":2},{"source":38,"target":35,"value":2},{"source":38,"target":36,"value":2},{"source":38,"target":37,"value":2},{"source":38,"target":11,"value":2},{"source":38,"target":29,"value":1},{"source":39,"target":25,"value":1},{"source":40,"target":25,"value":1},{"source":41,"target":24,"value":2},{"source":41,"target":25,"value":3},{"source":42,"target":41,"value":2},{"source":42,"target":25,"value":2},{"source":42,"target":24,"value":1},{"source":43,"target":11,"value":3},{"source":43,"target":26,"value":1},{"source":43,"target":27,"value":1},{"source":44,"target":28,"value":3},{"source":44,"target":11,"value":1},{"source":45,"target":28,"value":2},{"source":47,"target":46,"value":1},{"source":48,"target":47,"value":2},{"source":48,"target":25,"value":1},{"source":48,"target":27,"value":1},{"source":48,"target":11,"value":1},{"source":49,"target":26,"value":3},{"source":49,"target":11,"value":2},{"source":50,"target":49,"value":1},{"source":50,"target":24,"value":1},{"source":51,"target":49,"value":9},{"source":51,"target":26,"value":2},{"source":51,"target":11,"value":2},{"source":52,"target":51,"value":1},{"source":52,"target":39,"value":1},{"source":53,"target":51,"value":1},{"source":54,"target":51,"value":2},{"source":54,"target":49,"value":1},{"source":54,"target":26,"value":1},{"source":55,"target":51,"value":6},{"source":55,"target":49,"value":12},{"source":55,"target":39,"value":1},{"source":55,"target":54,"value":1},{"source":55,"target":26,"value":21},{"source":55,"target":11,"value":19},{"source":55,"target":16,"value":1},{"source":55,"target":25,"value":2},{"source":55,"target":41,"value":5},{"source":55,"target":48,"value":4},{"source":56,"target":49,"value":1},{"source":56,"target":55,"value":1},{"source":57,"target":55,"value":1},{"source":57,"target":41,"value":1},{"source":57,"target":48,"value":1},{"source":58,"target":55,"value":7},{"source":58,"target":48,"value":7},{"source":58,"target":27,"value":6},{"source":58,"target":57,"value":1},{"source":58,"target":11,"value":4},{"source":59,"target":58,"value":15},{"source":59,"target":55,"value":5},{"source":59,"target":48,"value":6},{"source":59,"target":57,"value":2},{"source":60,"target":48,"value":1},{"source":60,"target":58,"value":4},{"source":60,"target":59,"value":2},{"source":61,"target":48,"value":2},{"source":61,"target":58,"value":6},{"source":61,"target":60,"value":2},{"source":61,"target":59,"value":5},{"source":61,"target":57,"value":1},{"source":61,"target":55,"value":1},{"source":62,"target":55,"value":9},{"source":62,"target":58,"value":17},{"source":62,"target":59,"value":13},{"source":62,"target":48,"value":7},{"source":62,"target":57,"value":2},{"source":62,"target":41,"value":1},{"source":62,"target":61,"value":6},{"source":62,"target":60,"value":3},{"source":63,"target":59,"value":5},{"source":63,"target":48,"value":5},{"source":63,"target":62,"value":6},{"source":63,"target":57,"value":2},{"source":63,"target":58,"value":4},{"source":63,"target":61,"value":3},{"source":63,"target":60,"value":2},{"source":63,"target":55,"value":1},{"source":64,"target":55,"value":5},{"source":64,"target":62,"value":12},{"source":64,"target":48,"value":5},{"source":64,"target":63,"value":4},{"source":64,"target":58,"value":10},{"source":64,"target":61,"value":6},{"source":64,"target":60,"value":2},{"source":64,"target":59,"value":9},{"source":64,"target":57,"value":1},{"source":64,"target":11,"value":1},{"source":65,"target":63,"value":5},{"source":65,"target":64,"value":7},{"source":65,"target":48,"value":3},{"source":65,"target":62,"value":5},{"source":65,"target":58,"value":5},{"source":65,"target":61,"value":5},{"source":65,"target":60,"value":2},{"source":65,"target":59,"value":5},{"source":65,"target":57,"value":1},{"source":65,"target":55,"value":2},{"source":66,"target":64,"value":3},{"source":66,"target":58,"value":3},{"source":66,"target":59,"value":1},{"source":66,"target":62,"value":2},{"source":66,"target":65,"value":2},{"source":66,"target":48,"value":1},{"source":66,"target":63,"value":1},{"source":66,"target":61,"value":1},{"source":66,"target":60,"value":1},{"source":67,"target":57,"value":3},{"source":68,"target":25,"value":5},{"source":68,"target":11,"value":1},{"source":68,"target":24,"value":1},{"source":68,"target":27,"value":1},{"source":68,"target":48,"value":1},{"source":68,"target":41,"value":1},{"source":69,"target":25,"value":6},{"source":69,"target":68,"value":6},{"source":69,"target":11,"value":1},{"source":69,"target":24,"value":1},{"source":69,"target":27,"value":2},{"source":69,"target":48,"value":1},{"source":69,"target":41,"value":1},{"source":70,"target":25,"value":4},{"source":70,"target":69,"value":4},{"source":70,"target":68,"value":4},{"source":70,"target":11,"value":1},{"source":70,"target":24,"value":1},{"source":70,"target":27,"value":1},{"source":70,"target":41,"value":1},{"source":70,"target":58,"value":1},{"source":71,"target":27,"value":1},{"source":71,"target":69,"value":2},{"source":71,"target":68,"value":2},{"source":71,"target":70,"value":2},{"source":71,"target":11,"value":1},{"source":71,"target":48,"value":1},{"source":71,"target":41,"value":1},{"source":71,"target":25,"value":1},{"source":72,"target":26,"value":2},{"source":72,"target":27,"value":1},{"source":72,"target":11,"value":1},{"source":73,"target":48,"value":2},{"source":74,"target":48,"value":2},{"source":74,"target":73,"value":3},{"source":75,"target":69,"value":3},{"source":75,"target":68,"value":3},{"source":75,"target":25,"value":3},{"source":75,"target":48,"value":1},{"source":75,"target":41,"value":1},{"source":75,"target":70,"value":1},{"source":75,"target":71,"value":1},{"source":76,"target":64,"value":1},{"source":76,"target":65,"value":1},{"source":76,"target":66,"value":1},{"source":76,"target":63,"value":1},{"source":76,"target":62,"value":1},{"source":76,"target":48,"value":1},{"source":76,"target":58,"value":1}]}' | |
| 42 | +--> | |
| 43 | +<div id="graph-placeholder" style="width: 100vw; height: 100vh;"></div> | |
| 32 | 44 | |
| 33 | 45 | </body> |
| 34 | 46 | </html> |
| 35 | 47 | \ No newline at end of file | ... | ... |
datalets/graph-datalet/demo/demo-clustering.html
| ... | ... | @@ -4,21 +4,33 @@ |
| 4 | 4 | <meta charset="UTF-8"> |
| 5 | 5 | <title>Demo Graph with node clustering</title> |
| 6 | 6 | <link rel="import" href="../graph-with-clustering-extend-datalet.html"> |
| 7 | + <link rel="import" href="../graph-datalet.html"> | |
| 7 | 8 | <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> |
| 8 | 9 | </head> |
| 9 | 10 | <script> |
| 10 | 11 | function loadDoc() { |
| 12 | + debugger; | |
| 11 | 13 | var xhttp = new XMLHttpRequest(); |
| 12 | 14 | xhttp.onreadystatechange = function() { |
| 13 | 15 | if (xhttp.readyState == 4 && xhttp.status == 200) { |
| 14 | - document.getElementById("graph-placeholder").innerHTML = '<graph-with-clustering-extend-datalet width="1000" height="700" graph=\'' + JSON.parse(xhttp.responseText).graph + | |
| 15 | - '\'></graph-with-clustering-extend-datalet>'; | |
| 16 | + /*document.getElementById("graph-placeholder").innerHTML = '<graph-with-clustering-extend-datalet width="1000" height="700" graph=\'' + JSON.parse(xhttp.responseText).graph + | |
| 17 | + '\'></graph-with-clustering-extend-datalet>';*/ | |
| 18 | + | |
| 19 | + document.getElementById("graph-placeholder").innerHTML = '<graph-datalet width="' + $("#graph-placeholder").width() + '" height="' + $("#graph-placeholder").height() * 2 + '" id="dgraph"></graph-datalet>'; | |
| 20 | + | |
| 21 | + var g = document.getElementById('dgraph'); | |
| 22 | + g.graph = JSON.parse(xhttp.responseText).graph; | |
| 23 | + g.init(); | |
| 16 | 24 | } |
| 17 | 25 | }; |
| 18 | - xhttp.open("GET", "http://192.168.164.128/public_room/ajax/get-graph?id=8&type=comments", true); | |
| 26 | + xhttp.open("GET", "http://spod.databenc.it/spodpublic/ajax/get-graph/?id=41&type=comments", true); | |
| 19 | 27 | xhttp.send(); |
| 20 | 28 | } |
| 21 | 29 | |
| 30 | + $(document).ready(function(){ | |
| 31 | + loadDoc(); | |
| 32 | + }); | |
| 33 | + | |
| 22 | 34 | loadDoc(); |
| 23 | 35 | |
| 24 | 36 | </script> |
| ... | ... | @@ -27,7 +39,7 @@ |
| 27 | 39 | <!-- |
| 28 | 40 | graph='{"nodes":[{"name":"Myriel","group":1},{"name":"Napoleon","group":1},{"name":"Mlle.Baptistine","group":1},{"name":"Mme.Magloire","group":1},{"name":"CountessdeLo","group":1},{"name":"Geborand","group":1},{"name":"Champtercier","group":1},{"name":"Cravatte","group":1},{"name":"Count","group":1},{"name":"OldMan","group":1},{"name":"Labarre","group":2},{"name":"Valjean","group":2},{"name":"Marguerite","group":3},{"name":"Mme.deR","group":2},{"name":"Isabeau","group":2},{"name":"Gervais","group":2},{"name":"Tholomyes","group":3},{"name":"Listolier","group":3},{"name":"Fameuil","group":3},{"name":"Blacheville","group":3},{"name":"Favourite","group":3},{"name":"Dahlia","group":3},{"name":"Zephine","group":3},{"name":"Fantine","group":3},{"name":"Mme.Thenardier","group":4},{"name":"Thenardier","group":4},{"name":"Cosette","group":5},{"name":"Javert","group":4},{"name":"Fauchelevent","group":0},{"name":"Bamatabois","group":2},{"name":"Perpetue","group":3},{"name":"Simplice","group":2},{"name":"Scaufflaire","group":2},{"name":"Woman1","group":2},{"name":"Judge","group":2},{"name":"Champmathieu","group":2},{"name":"Brevet","group":2},{"name":"Chenildieu","group":2},{"name":"Cochepaille","group":2},{"name":"Pontmercy","group":4},{"name":"Boulatruelle","group":6},{"name":"Eponine","group":4},{"name":"Anzelma","group":4},{"name":"Woman2","group":5},{"name":"MotherInnocent","group":0},{"name":"Gribier","group":0},{"name":"Jondrette","group":7},{"name":"Mme.Burgon","group":7},{"name":"Gavroche","group":8},{"name":"Gillenormand","group":5},{"name":"Magnon","group":5},{"name":"Mlle.Gillenormand","group":5},{"name":"Mme.Pontmercy","group":5},{"name":"Mlle.Vaubois","group":5},{"name":"Lt.Gillenormand","group":5},{"name":"Marius","group":8},{"name":"BaronessT","group":5},{"name":"Mabeuf","group":8},{"name":"Enjolras","group":8},{"name":"Combeferre","group":8},{"name":"Prouvaire","group":8},{"name":"Feuilly","group":8},{"name":"Courfeyrac","group":8},{"name":"Bahorel","group":8},{"name":"Bossuet","group":8},{"name":"Joly","group":8},{"name":"Grantaire","group":8},{"name":"MotherPlutarch","group":9},{"name":"Gueulemer","group":4},{"name":"Babet","group":4},{"name":"Claquesous","group":4},{"name":"Montparnasse","group":4},{"name":"Toussaint","group":5},{"name":"Child1","group":10},{"name":"Child2","group":10},{"name":"Brujon","group":4},{"name":"Mme.Hucheloup","group":8}],"links":[{"source":1,"target":0,"value":1},{"source":2,"target":0,"value":8},{"source":3,"target":0,"value":10},{"source":3,"target":2,"value":6},{"source":4,"target":0,"value":1},{"source":5,"target":0,"value":1},{"source":6,"target":0,"value":1},{"source":7,"target":0,"value":1},{"source":8,"target":0,"value":2},{"source":9,"target":0,"value":1},{"source":11,"target":10,"value":1},{"source":11,"target":3,"value":3},{"source":11,"target":2,"value":3},{"source":11,"target":0,"value":5},{"source":12,"target":11,"value":1},{"source":13,"target":11,"value":1},{"source":14,"target":11,"value":1},{"source":15,"target":11,"value":1},{"source":17,"target":16,"value":4},{"source":18,"target":16,"value":4},{"source":18,"target":17,"value":4},{"source":19,"target":16,"value":4},{"source":19,"target":17,"value":4},{"source":19,"target":18,"value":4},{"source":20,"target":16,"value":3},{"source":20,"target":17,"value":3},{"source":20,"target":18,"value":3},{"source":20,"target":19,"value":4},{"source":21,"target":16,"value":3},{"source":21,"target":17,"value":3},{"source":21,"target":18,"value":3},{"source":21,"target":19,"value":3},{"source":21,"target":20,"value":5},{"source":22,"target":16,"value":3},{"source":22,"target":17,"value":3},{"source":22,"target":18,"value":3},{"source":22,"target":19,"value":3},{"source":22,"target":20,"value":4},{"source":22,"target":21,"value":4},{"source":23,"target":16,"value":3},{"source":23,"target":17,"value":3},{"source":23,"target":18,"value":3},{"source":23,"target":19,"value":3},{"source":23,"target":20,"value":4},{"source":23,"target":21,"value":4},{"source":23,"target":22,"value":4},{"source":23,"target":12,"value":2},{"source":23,"target":11,"value":9},{"source":24,"target":23,"value":2},{"source":24,"target":11,"value":7},{"source":25,"target":24,"value":13},{"source":25,"target":23,"value":1},{"source":25,"target":11,"value":12},{"source":26,"target":24,"value":4},{"source":26,"target":11,"value":31},{"source":26,"target":16,"value":1},{"source":26,"target":25,"value":1},{"source":27,"target":11,"value":17},{"source":27,"target":23,"value":5},{"source":27,"target":25,"value":5},{"source":27,"target":24,"value":1},{"source":27,"target":26,"value":1},{"source":28,"target":11,"value":8},{"source":28,"target":27,"value":1},{"source":29,"target":23,"value":1},{"source":29,"target":27,"value":1},{"source":29,"target":11,"value":2},{"source":30,"target":23,"value":1},{"source":31,"target":30,"value":2},{"source":31,"target":11,"value":3},{"source":31,"target":23,"value":2},{"source":31,"target":27,"value":1},{"source":32,"target":11,"value":1},{"source":33,"target":11,"value":2},{"source":33,"target":27,"value":1},{"source":34,"target":11,"value":3},{"source":34,"target":29,"value":2},{"source":35,"target":11,"value":3},{"source":35,"target":34,"value":3},{"source":35,"target":29,"value":2},{"source":36,"target":34,"value":2},{"source":36,"target":35,"value":2},{"source":36,"target":11,"value":2},{"source":36,"target":29,"value":1},{"source":37,"target":34,"value":2},{"source":37,"target":35,"value":2},{"source":37,"target":36,"value":2},{"source":37,"target":11,"value":2},{"source":37,"target":29,"value":1},{"source":38,"target":34,"value":2},{"source":38,"target":35,"value":2},{"source":38,"target":36,"value":2},{"source":38,"target":37,"value":2},{"source":38,"target":11,"value":2},{"source":38,"target":29,"value":1},{"source":39,"target":25,"value":1},{"source":40,"target":25,"value":1},{"source":41,"target":24,"value":2},{"source":41,"target":25,"value":3},{"source":42,"target":41,"value":2},{"source":42,"target":25,"value":2},{"source":42,"target":24,"value":1},{"source":43,"target":11,"value":3},{"source":43,"target":26,"value":1},{"source":43,"target":27,"value":1},{"source":44,"target":28,"value":3},{"source":44,"target":11,"value":1},{"source":45,"target":28,"value":2},{"source":47,"target":46,"value":1},{"source":48,"target":47,"value":2},{"source":48,"target":25,"value":1},{"source":48,"target":27,"value":1},{"source":48,"target":11,"value":1},{"source":49,"target":26,"value":3},{"source":49,"target":11,"value":2},{"source":50,"target":49,"value":1},{"source":50,"target":24,"value":1},{"source":51,"target":49,"value":9},{"source":51,"target":26,"value":2},{"source":51,"target":11,"value":2},{"source":52,"target":51,"value":1},{"source":52,"target":39,"value":1},{"source":53,"target":51,"value":1},{"source":54,"target":51,"value":2},{"source":54,"target":49,"value":1},{"source":54,"target":26,"value":1},{"source":55,"target":51,"value":6},{"source":55,"target":49,"value":12},{"source":55,"target":39,"value":1},{"source":55,"target":54,"value":1},{"source":55,"target":26,"value":21},{"source":55,"target":11,"value":19},{"source":55,"target":16,"value":1},{"source":55,"target":25,"value":2},{"source":55,"target":41,"value":5},{"source":55,"target":48,"value":4},{"source":56,"target":49,"value":1},{"source":56,"target":55,"value":1},{"source":57,"target":55,"value":1},{"source":57,"target":41,"value":1},{"source":57,"target":48,"value":1},{"source":58,"target":55,"value":7},{"source":58,"target":48,"value":7},{"source":58,"target":27,"value":6},{"source":58,"target":57,"value":1},{"source":58,"target":11,"value":4},{"source":59,"target":58,"value":15},{"source":59,"target":55,"value":5},{"source":59,"target":48,"value":6},{"source":59,"target":57,"value":2},{"source":60,"target":48,"value":1},{"source":60,"target":58,"value":4},{"source":60,"target":59,"value":2},{"source":61,"target":48,"value":2},{"source":61,"target":58,"value":6},{"source":61,"target":60,"value":2},{"source":61,"target":59,"value":5},{"source":61,"target":57,"value":1},{"source":61,"target":55,"value":1},{"source":62,"target":55,"value":9},{"source":62,"target":58,"value":17},{"source":62,"target":59,"value":13},{"source":62,"target":48,"value":7},{"source":62,"target":57,"value":2},{"source":62,"target":41,"value":1},{"source":62,"target":61,"value":6},{"source":62,"target":60,"value":3},{"source":63,"target":59,"value":5},{"source":63,"target":48,"value":5},{"source":63,"target":62,"value":6},{"source":63,"target":57,"value":2},{"source":63,"target":58,"value":4},{"source":63,"target":61,"value":3},{"source":63,"target":60,"value":2},{"source":63,"target":55,"value":1},{"source":64,"target":55,"value":5},{"source":64,"target":62,"value":12},{"source":64,"target":48,"value":5},{"source":64,"target":63,"value":4},{"source":64,"target":58,"value":10},{"source":64,"target":61,"value":6},{"source":64,"target":60,"value":2},{"source":64,"target":59,"value":9},{"source":64,"target":57,"value":1},{"source":64,"target":11,"value":1},{"source":65,"target":63,"value":5},{"source":65,"target":64,"value":7},{"source":65,"target":48,"value":3},{"source":65,"target":62,"value":5},{"source":65,"target":58,"value":5},{"source":65,"target":61,"value":5},{"source":65,"target":60,"value":2},{"source":65,"target":59,"value":5},{"source":65,"target":57,"value":1},{"source":65,"target":55,"value":2},{"source":66,"target":64,"value":3},{"source":66,"target":58,"value":3},{"source":66,"target":59,"value":1},{"source":66,"target":62,"value":2},{"source":66,"target":65,"value":2},{"source":66,"target":48,"value":1},{"source":66,"target":63,"value":1},{"source":66,"target":61,"value":1},{"source":66,"target":60,"value":1},{"source":67,"target":57,"value":3},{"source":68,"target":25,"value":5},{"source":68,"target":11,"value":1},{"source":68,"target":24,"value":1},{"source":68,"target":27,"value":1},{"source":68,"target":48,"value":1},{"source":68,"target":41,"value":1},{"source":69,"target":25,"value":6},{"source":69,"target":68,"value":6},{"source":69,"target":11,"value":1},{"source":69,"target":24,"value":1},{"source":69,"target":27,"value":2},{"source":69,"target":48,"value":1},{"source":69,"target":41,"value":1},{"source":70,"target":25,"value":4},{"source":70,"target":69,"value":4},{"source":70,"target":68,"value":4},{"source":70,"target":11,"value":1},{"source":70,"target":24,"value":1},{"source":70,"target":27,"value":1},{"source":70,"target":41,"value":1},{"source":70,"target":58,"value":1},{"source":71,"target":27,"value":1},{"source":71,"target":69,"value":2},{"source":71,"target":68,"value":2},{"source":71,"target":70,"value":2},{"source":71,"target":11,"value":1},{"source":71,"target":48,"value":1},{"source":71,"target":41,"value":1},{"source":71,"target":25,"value":1},{"source":72,"target":26,"value":2},{"source":72,"target":27,"value":1},{"source":72,"target":11,"value":1},{"source":73,"target":48,"value":2},{"source":74,"target":48,"value":2},{"source":74,"target":73,"value":3},{"source":75,"target":69,"value":3},{"source":75,"target":68,"value":3},{"source":75,"target":25,"value":3},{"source":75,"target":48,"value":1},{"source":75,"target":41,"value":1},{"source":75,"target":70,"value":1},{"source":75,"target":71,"value":1},{"source":76,"target":64,"value":1},{"source":76,"target":65,"value":1},{"source":76,"target":66,"value":1},{"source":76,"target":63,"value":1},{"source":76,"target":62,"value":1},{"source":76,"target":48,"value":1},{"source":76,"target":58,"value":1}]}' |
| 29 | 41 | --> |
| 30 | -<div id="graph-placeholder"></div> | |
| 42 | +<div id="graph-placeholder" style="width: 100vw; height: 100vh;"></div> | |
| 31 | 43 | |
| 32 | 44 | </body> |
| 33 | 45 | </html> |
| 34 | 46 | \ No newline at end of file | ... | ... |
datalets/graph-datalet/graph-datalet.html
| ... | ... | @@ -288,7 +288,7 @@ Example: |
| 288 | 288 | _this.gnodes.attr("cx", function (t) { |
| 289 | 289 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) |
| 290 | 290 | }).attr("cy", function (t) { |
| 291 | - return t.y = Math.max(8, Math.min(600, t.y)) | |
| 291 | + return t.y = Math.max(8, Math.min(_this.height, t.y)) | |
| 292 | 292 | }); |
| 293 | 293 | |
| 294 | 294 | _this.glinks.attr("x1", function (t) { | ... | ... |
datalets/graph-datalet/graph-with-clustering-datalet.html
| ... | ... | @@ -463,7 +463,7 @@ Example: |
| 463 | 463 | _this.svgNodes.attr("cx", function (t) { |
| 464 | 464 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) |
| 465 | 465 | }).attr("cy", function (t) { |
| 466 | - return t.y = Math.max(8, Math.min(600, t.y)) | |
| 466 | + return t.y = Math.max(8, Math.min(_this.height, t.y)) | |
| 467 | 467 | }); |
| 468 | 468 | |
| 469 | 469 | _this.svgLinks.attr("x1", function (t) { | ... | ... |
datalets/heatmap-datalet/heatmap-datalet.html
| ... | ... | @@ -76,47 +76,35 @@ Example: |
| 76 | 76 | options = { |
| 77 | 77 | chart: { |
| 78 | 78 | type: 'heatmap', |
| 79 | - marginTop: 40, | |
| 79 | + zoomType: 'xy', | |
| 80 | +// marginTop: 40, | |
| 80 | 81 | // marginBottom: 80, |
| 81 | 82 | plotBorderWidth: 1 |
| 82 | 83 | }, |
| 83 | - | |
| 84 | 84 | title: { |
| 85 | 85 | text: this._component.title |
| 86 | 86 | }, |
| 87 | - | |
| 88 | 87 | xAxis: { |
| 89 | 88 | categories: Xcategories, |
| 90 | 89 | title: { |
| 91 | 90 | text: this._component.xAxisLabel |
| 92 | 91 | } |
| 93 | 92 | }, |
| 94 | - | |
| 95 | 93 | yAxis: { |
| 96 | 94 | categories: Ycategories, |
| 97 | 95 | title: { |
| 98 | 96 | text: this._component.yAxisLabel |
| 99 | 97 | } |
| 100 | 98 | }, |
| 101 | - | |
| 99 | + tooltip: { | |
| 100 | + valueSuffix: ' ' + this._component.suffix | |
| 101 | + }, | |
| 102 | 102 | colorAxis: { |
| 103 | 103 | min: 0, |
| 104 | 104 | minColor: '#FFFFFF', |
| 105 | 105 | maxColor: Highcharts.getOptions().colors[0] |
| 106 | 106 | }, |
| 107 | 107 | |
| 108 | - legend: { | |
| 109 | - align: 'right', | |
| 110 | - layout: 'vertical', | |
| 111 | - margin: 0, | |
| 112 | - verticalAlign: 'top', | |
| 113 | - y: 25, | |
| 114 | - symbolHeight: 280 | |
| 115 | - }, | |
| 116 | - tooltip: { | |
| 117 | - valueSuffix: ' ' + this._component.suffix | |
| 118 | - }, | |
| 119 | - | |
| 120 | 108 | credits: { |
| 121 | 109 | enabled: false |
| 122 | 110 | }, |
| ... | ... | @@ -124,15 +112,36 @@ Example: |
| 124 | 112 | borderWidth: 1, |
| 125 | 113 | data: series, |
| 126 | 114 | dataLabels: { |
| 127 | - enabled: true, | |
| 115 | + enabled: this._component.dataLabels, | |
| 128 | 116 | color: '#000000' |
| 129 | - } | |
| 117 | + }, | |
| 130 | 118 | }] |
| 131 | 119 | }; |
| 132 | 120 | |
| 133 | 121 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 134 | 122 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 135 | 123 | |
| 124 | + if(this._component.legend == "topRight") | |
| 125 | + options.legend = { | |
| 126 | + layout: 'vertical', | |
| 127 | + verticalAlign: 'top', | |
| 128 | + align: 'right', | |
| 129 | + x: -4, | |
| 130 | + y: 4, | |
| 131 | + floating: true, | |
| 132 | + borderWidth: 1, | |
| 133 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 134 | + shadow: true, | |
| 135 | + }; | |
| 136 | + else if(this._component.legend == "bottom") | |
| 137 | + options.legend = { | |
| 138 | + enabled: true | |
| 139 | + }; | |
| 140 | + else | |
| 141 | + options.legend ={ | |
| 142 | + enabled: false | |
| 143 | + }; | |
| 144 | + | |
| 136 | 145 | $(this._component.$.charts.$.container).highcharts(options); |
| 137 | 146 | } |
| 138 | 147 | }; |
| ... | ... | @@ -146,50 +155,34 @@ Example: |
| 146 | 155 | type: Array, |
| 147 | 156 | value: undefined |
| 148 | 157 | }, |
| 149 | - /** | |
| 150 | - * It's the label for X axis | |
| 151 | - * | |
| 152 | - * @attribute xAxisLabel | |
| 153 | - * @type String | |
| 154 | - * @default '' | |
| 155 | - */ | |
| 156 | 158 | xAxisLabel: { |
| 157 | 159 | type: String, |
| 158 | 160 | value: "" |
| 159 | 161 | }, |
| 160 | - /** | |
| 161 | - * It's the label for Y axis | |
| 162 | - * | |
| 163 | - * @attribute yAxisLabel | |
| 164 | - * @type String | |
| 165 | - * @default '' | |
| 166 | - */ | |
| 167 | 162 | yAxisLabel: { |
| 168 | 163 | type: String, |
| 169 | 164 | value: "" |
| 170 | 165 | }, |
| 171 | - /** | |
| 172 | - * It's the values suffix | |
| 173 | - * | |
| 174 | - * @attribute suffix | |
| 175 | - * @type String | |
| 176 | - * @default 'units' | |
| 177 | - */ | |
| 178 | 166 | suffix : { |
| 179 | 167 | type : String, |
| 180 | 168 | value : "" |
| 181 | 169 | }, |
| 170 | + legend : { | |
| 171 | + type : Object, | |
| 172 | + value : "topRight" | |
| 173 | + }, | |
| 174 | + dataLabels : { | |
| 175 | + type : Object, | |
| 176 | + value : true | |
| 177 | + }, | |
| 178 | + stack : { | |
| 179 | + type : Object, | |
| 180 | + value : false | |
| 181 | + }, | |
| 182 | 182 | theme : { |
| 183 | 183 | type : String, |
| 184 | 184 | value : "" |
| 185 | 185 | }, |
| 186 | - /** | |
| 187 | - * It's the component behavior | |
| 188 | - * | |
| 189 | - * @attribute behavior | |
| 190 | - * @type Object | |
| 191 | - * @default {} | |
| 192 | - */ | |
| 193 | 186 | behavior : { |
| 194 | 187 | type : Object, |
| 195 | 188 | value : {} | ... | ... |
datalets/highcharts-datalet/highcharts-datalet.html
| ... | ... | @@ -79,31 +79,41 @@ Example : |
| 79 | 79 | }, |
| 80 | 80 | |
| 81 | 81 | transformData: function () { |
| 82 | - var selectedFields = JSON.parse(this._component.getAttribute("selectedFields")); | |
| 83 | - | |
| 84 | 82 | if(this.data.length == 0) |
| 85 | 83 | return; |
| 86 | 84 | |
| 87 | - categories = this.data[0].data; | |
| 88 | - series = []; | |
| 89 | - for(var i = 1; i < this.data.length; i++) | |
| 90 | - series.push(this.data[i]); | |
| 85 | + var selectedFields = JSON.parse(this._component.getAttribute("selectedfields")); | |
| 86 | + | |
| 87 | + var inputs = []; | |
| 88 | + if(selectedFields) { /*if deprecated*/ | |
| 89 | + for (var i=0; i < selectedFields.length; i++) | |
| 90 | + if (selectedFields[i]) | |
| 91 | + inputs.push(selectedFields[i].field); | |
| 92 | + } | |
| 93 | + | |
| 94 | + var cat_index = inputs.indexOf("Categories"); | |
| 91 | 95 | |
| 92 | - this.properties.categories.value = categories; | |
| 93 | - this.properties.series.value = series; | |
| 96 | + if(cat_index == -1) { | |
| 97 | + categories = this.data[0].data; | |
| 98 | + series = []; | |
| 99 | + for (var i = 1; i < this.data.length; i++) | |
| 100 | + series.push(this.data[i]); | |
| 94 | 101 | |
| 95 | - if(this.data.length == 3 && !selectedFields){//split cat | |
| 102 | + this.properties.categories.value = categories; | |
| 103 | + this.properties.series.value = series; | |
| 104 | + } | |
| 105 | + else { | |
| 96 | 106 | var x = this.data[0]["data"]; |
| 97 | - var gb = this.data[1]["data"]; | |
| 98 | - var y = this.data[2]["data"]; | |
| 107 | + var y = this.data[1]["data"]; | |
| 108 | + var cat = this.data[cat_index]["data"]; | |
| 99 | 109 | |
| 100 | 110 | var categories = x.filter(function(item, pos) { |
| 101 | 111 | return x.indexOf(item) == pos; |
| 102 | - }) | |
| 112 | + }); | |
| 103 | 113 | |
| 104 | - var s = gb.filter(function(item, pos) { | |
| 105 | - return gb.indexOf(item) == pos; | |
| 106 | - }) | |
| 114 | + var s = cat.filter(function(item, pos) { | |
| 115 | + return cat.indexOf(item) == pos; | |
| 116 | + }); | |
| 107 | 117 | |
| 108 | 118 | var series = []; |
| 109 | 119 | for(var i = 0; i < s.length; i++) { |
| ... | ... | @@ -113,7 +123,7 @@ Example : |
| 113 | 123 | for(var i = 0; i < y.length; i++){ |
| 114 | 124 | var index = categories.indexOf(x[i]); |
| 115 | 125 | var s = series.filter(function( obj ) { |
| 116 | - return obj.name == gb[i]; | |
| 126 | + return obj.name == cat[i]; | |
| 117 | 127 | }); |
| 118 | 128 | s[0]["data"][index] = y[i]; |
| 119 | 129 | } |
| ... | ... | @@ -121,7 +131,6 @@ Example : |
| 121 | 131 | this.properties.categories.value = categories; |
| 122 | 132 | this.properties.series.value = series; |
| 123 | 133 | } |
| 124 | - | |
| 125 | 134 | }, |
| 126 | 135 | |
| 127 | 136 | redraw: function () { | ... | ... |
datalets/leafletjs-datalet/leafletjs-datalet.html
| ... | ... | @@ -99,6 +99,14 @@ Example: |
| 99 | 99 | if(!isNaN(t.data[0].data[i][0]) && !isNaN(t.data[0].data[i][1])) |
| 100 | 100 | coordinates.push([parseFloat(t.data[0].data[i][0]), parseFloat(t.data[0].data[i][1])]); |
| 101 | 101 | else |
| 102 | + continue; | |
| 103 | + } | |
| 104 | + else if(typeof t.data[0].data[i] == 'string' && t.data[0].data[i].indexOf(",")) | |
| 105 | + { | |
| 106 | + var coords = t.data[0].data[i].split(","); | |
| 107 | + if(!isNaN(coords[0]) && !isNaN(coords[1])) | |
| 108 | + coordinates.push([parseFloat(coords[0]), parseFloat(coords[1])]); | |
| 109 | + else | |
| 102 | 110 | continue; |
| 103 | 111 | } |
| 104 | 112 | else |
| ... | ... | @@ -206,5 +214,4 @@ Example: |
| 206 | 214 | } |
| 207 | 215 | }); |
| 208 | 216 | </script> |
| 209 | -</dom-module> | |
| 210 | - | |
| 217 | +</dom-module> | |
| 211 | 218 | \ No newline at end of file | ... | ... |
datalets/leafletjs-geojson-datalet/leafletjs-geojson-datalet.html
| ... | ... | @@ -93,6 +93,11 @@ Example: |
| 93 | 93 | |
| 94 | 94 | for (var i = 0; i < t.data[0].data.length; i++) |
| 95 | 95 | { |
| 96 | + try{ | |
| 97 | + if(typeof t.data[0].data[i] != 'object') | |
| 98 | + t.data[0].data[i] = JSON.parse(t.data[0].data[i]); | |
| 99 | + }catch(e){} | |
| 100 | + | |
| 96 | 101 | var geoJsonLayer = L.geoJson(t.data[0].data[i]).addTo(t._component.map); |
| 97 | 102 | |
| 98 | 103 | if(t.data.length > 1) | ... | ... |
datalets/leafletjs-geojson-datalet/leafletjs-geojson-datalet.png
datalets/linechart-datalet/linechart-datalet.html
| ... | ... | @@ -70,7 +70,7 @@ Example: |
| 70 | 70 | text: this._component.title |
| 71 | 71 | }, |
| 72 | 72 | xAxis: { |
| 73 | - categories: this.properties.categories.value,//this._component.categories, | |
| 73 | + categories: this.properties.categories.value, | |
| 74 | 74 | title: { |
| 75 | 75 | text: this._component.xAxisLabel |
| 76 | 76 | } |
| ... | ... | @@ -84,16 +84,15 @@ Example: |
| 84 | 84 | tooltip: { |
| 85 | 85 | valueSuffix: ' ' + this._component.suffix |
| 86 | 86 | }, |
| 87 | - legend: { | |
| 88 | - layout: 'vertical', | |
| 89 | - align: 'right', | |
| 90 | - verticalAlign: 'top', | |
| 91 | - x: -40, | |
| 92 | - y: 80, | |
| 93 | - floating: true, | |
| 94 | - borderWidth: 1, | |
| 95 | - backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 96 | - shadow: true | |
| 87 | + plotOptions: { | |
| 88 | + line: { | |
| 89 | + dataLabels: { | |
| 90 | + enabled: this._component.dataLabels | |
| 91 | + } | |
| 92 | + }, | |
| 93 | + series: { | |
| 94 | + stacking: this._component.stack | |
| 95 | + } | |
| 97 | 96 | }, |
| 98 | 97 | credits: { |
| 99 | 98 | enabled: false |
| ... | ... | @@ -104,6 +103,27 @@ Example: |
| 104 | 103 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 105 | 104 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 106 | 105 | |
| 106 | + if(this._component.legend == "topRight") | |
| 107 | + options.legend = { | |
| 108 | + layout: 'vertical', | |
| 109 | + verticalAlign: 'top', | |
| 110 | + align: 'right', | |
| 111 | + x: -4, | |
| 112 | + y: 4, | |
| 113 | + floating: true, | |
| 114 | + borderWidth: 1, | |
| 115 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 116 | + shadow: true | |
| 117 | + }; | |
| 118 | + else if(this._component.legend == "bottom") | |
| 119 | + options.legend = { | |
| 120 | + enabled: true | |
| 121 | + }; | |
| 122 | + else | |
| 123 | + options.legend ={ | |
| 124 | + enabled: false | |
| 125 | + }; | |
| 126 | + | |
| 107 | 127 | $(this._component.$.charts.$.container).highcharts(options); |
| 108 | 128 | } |
| 109 | 129 | }; |
| ... | ... | @@ -117,50 +137,34 @@ Example: |
| 117 | 137 | type: Array, |
| 118 | 138 | value: undefined |
| 119 | 139 | }, |
| 120 | - /** | |
| 121 | - * It's the label for X axis | |
| 122 | - * | |
| 123 | - * @attribute xAxisLabel | |
| 124 | - * @type String | |
| 125 | - * @default '' | |
| 126 | - */ | |
| 127 | 140 | xAxisLabel: { |
| 128 | 141 | type: String, |
| 129 | 142 | value: "" |
| 130 | 143 | }, |
| 131 | - /** | |
| 132 | - * It's the label for Y axis | |
| 133 | - * | |
| 134 | - * @attribute yAxisLabel | |
| 135 | - * @type String | |
| 136 | - * @default '' | |
| 137 | - */ | |
| 138 | 144 | yAxisLabel: { |
| 139 | 145 | type: String, |
| 140 | 146 | value: "" |
| 141 | 147 | }, |
| 142 | - /** | |
| 143 | - * It's the values suffix | |
| 144 | - * | |
| 145 | - * @attribute suffix | |
| 146 | - * @type Strig | |
| 147 | - * @default 'units' | |
| 148 | - */ | |
| 149 | 148 | suffix : { |
| 150 | 149 | type : String, |
| 151 | - value : "units" | |
| 150 | + value : "" | |
| 151 | + }, | |
| 152 | + legend : { | |
| 153 | + type : Object, | |
| 154 | + value : "topRight" | |
| 155 | + }, | |
| 156 | + dataLabels : { | |
| 157 | + type : Object, | |
| 158 | + value : true | |
| 159 | + }, | |
| 160 | + stack : { | |
| 161 | + type : Object, | |
| 162 | + value : false | |
| 152 | 163 | }, |
| 153 | 164 | theme : { |
| 154 | 165 | type : String, |
| 155 | 166 | value : "" |
| 156 | 167 | }, |
| 157 | - /** | |
| 158 | - * It's the component behavior | |
| 159 | - * | |
| 160 | - * @attribute behavior | |
| 161 | - * @type Object | |
| 162 | - * @default {} | |
| 163 | - */ | |
| 164 | 168 | behavior : { |
| 165 | 169 | type : Object, |
| 166 | 170 | value : {} | ... | ... |
datalets/piechart-datalet/piechart-datalet.html
| ... | ... | @@ -100,7 +100,7 @@ Example: |
| 100 | 100 | allowPointSelect: true, |
| 101 | 101 | cursor: 'pointer', |
| 102 | 102 | dataLabels: { |
| 103 | - enabled: true, | |
| 103 | + enabled: this._component.dataLabels, | |
| 104 | 104 | format: '<b>{point.name}</b>: {point.percentage:.1f} %', |
| 105 | 105 | style: { |
| 106 | 106 | color: (Highcharts[this._component.theme] && Highcharts[this._component.theme].contrastTextColor) || 'black' |
| ... | ... | @@ -117,6 +117,31 @@ Example: |
| 117 | 117 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 118 | 118 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 119 | 119 | |
| 120 | + if(this._component.legend == "topRight") { | |
| 121 | + options.legend = { | |
| 122 | + layout: 'vertical', | |
| 123 | + verticalAlign: 'top', | |
| 124 | + align: 'right', | |
| 125 | + x: -4, | |
| 126 | + y: 4, | |
| 127 | + floating: true, | |
| 128 | + borderWidth: 1, | |
| 129 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 130 | + shadow: true | |
| 131 | + }; | |
| 132 | + options.plotOptions.pie.showInLegend = true; | |
| 133 | + } | |
| 134 | + else if(this._component.legend == "bottom") { | |
| 135 | + options.legend = { | |
| 136 | + enabled: true | |
| 137 | + }; | |
| 138 | + options.plotOptions.pie.showInLegend = true; | |
| 139 | + } | |
| 140 | + else | |
| 141 | + options.legend ={ | |
| 142 | + enabled: false | |
| 143 | + }; | |
| 144 | + | |
| 120 | 145 | $(this._component.$.charts.$.container).highcharts(options); |
| 121 | 146 | } |
| 122 | 147 | }; |
| ... | ... | @@ -134,14 +159,22 @@ Example: |
| 134 | 159 | type : String, |
| 135 | 160 | value : "" |
| 136 | 161 | }, |
| 137 | - theme : { | |
| 138 | - type : String, | |
| 139 | - value : "" | |
| 162 | + legend : { | |
| 163 | + type : Object, | |
| 164 | + value : "topRight" | |
| 165 | + }, | |
| 166 | + dataLabels : { | |
| 167 | + type : Object, | |
| 168 | + value : true | |
| 140 | 169 | }, |
| 141 | 170 | donut : { |
| 142 | 171 | type : String, |
| 143 | 172 | value : "false" |
| 144 | 173 | }, |
| 174 | + theme : { | |
| 175 | + type : String, | |
| 176 | + value : "" | |
| 177 | + }, | |
| 145 | 178 | behavior : { |
| 146 | 179 | type : Object, |
| 147 | 180 | value : {} | ... | ... |
datalets/scatterchart-datalet/scatterchart-datalet.html
| ... | ... | @@ -85,7 +85,7 @@ Example: |
| 85 | 85 | } |
| 86 | 86 | |
| 87 | 87 | this.properties.series = scatterSeries; |
| 88 | - this._component.legend = true; | |
| 88 | +// this._component.legend = true; | |
| 89 | 89 | } |
| 90 | 90 | else {// == 2 |
| 91 | 91 | var scatterSeries = []; |
| ... | ... | @@ -100,7 +100,7 @@ Example: |
| 100 | 100 | scatterSeries.push({data: series}); |
| 101 | 101 | |
| 102 | 102 | this.properties.series = scatterSeries; |
| 103 | - this._component.legend = false; | |
| 103 | +// this._component.legend = false; | |
| 104 | 104 | } |
| 105 | 105 | |
| 106 | 106 | options = { |
| ... | ... | @@ -121,8 +121,12 @@ Example: |
| 121 | 121 | text: this._component.yAxisLabel, |
| 122 | 122 | } |
| 123 | 123 | }, |
| 124 | - legend: { | |
| 125 | - enabled: this._component.legend, | |
| 124 | + plotOptions: { | |
| 125 | + scatter: { | |
| 126 | + dataLabels: { | |
| 127 | + enabled: this._component.dataLabels | |
| 128 | + } | |
| 129 | + }, | |
| 126 | 130 | }, |
| 127 | 131 | credits: { |
| 128 | 132 | enabled: false |
| ... | ... | @@ -133,6 +137,27 @@ Example: |
| 133 | 137 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 134 | 138 | jQuery.extend(true, options, Highcharts[this._component.theme]); |
| 135 | 139 | |
| 140 | + if(this._component.legend == "topRight") | |
| 141 | + options.legend = { | |
| 142 | + layout: 'vertical', | |
| 143 | + verticalAlign: 'top', | |
| 144 | + align: 'right', | |
| 145 | + x: -4, | |
| 146 | + y: 4, | |
| 147 | + floating: true, | |
| 148 | + borderWidth: 1, | |
| 149 | + backgroundColor: ((Highcharts[this._component.theme] && Highcharts[this._component.theme].legendBackgroundColor) || '#FFFFFF'), | |
| 150 | + shadow: true | |
| 151 | + }; | |
| 152 | + else if(this._component.legend == "bottom") | |
| 153 | + options.legend = { | |
| 154 | + enabled: true | |
| 155 | + }; | |
| 156 | + else | |
| 157 | + options.legend ={ | |
| 158 | + enabled: false | |
| 159 | + }; | |
| 160 | + | |
| 136 | 161 | $(this._component.$.charts.$.container).highcharts(options); |
| 137 | 162 | } |
| 138 | 163 | }; |
| ... | ... | @@ -153,14 +178,18 @@ Example: |
| 153 | 178 | type: String, |
| 154 | 179 | value: "" |
| 155 | 180 | }, |
| 156 | - suffix : { | |
| 157 | - type : String, | |
| 158 | - value : "" | |
| 159 | - }, | |
| 160 | 181 | theme : { |
| 161 | 182 | type : String, |
| 162 | 183 | value : "" |
| 163 | 184 | }, |
| 185 | + legend : { | |
| 186 | + type : Object, | |
| 187 | + value : "topRight" | |
| 188 | + }, | |
| 189 | + dataLabels : { | |
| 190 | + type : Object, | |
| 191 | + value : true | |
| 192 | + }, | |
| 164 | 193 | behavior : { |
| 165 | 194 | type : Object, |
| 166 | 195 | value : {} | ... | ... |
locales/controllet_ln.js
| ... | ... | @@ -5,16 +5,18 @@ ln["localization"] = "en"; |
| 5 | 5 | /******** EN ********/ |
| 6 | 6 | |
| 7 | 7 | //PAGE SLIDER |
| 8 | + | |
| 8 | 9 | ln["slide1Title_en"] = "SELECT DATASET"; |
| 9 | 10 | ln["slide1Subtitle_en"] = "Select a dataset from the list or copy and paste the url of dataset."; |
| 10 | 11 | ln["slide2Title_en"] = "SELECT DATA"; |
| 11 | 12 | ln["slide2Subtitle_en"] = "Select the fields on the left. The table will show the values related to the selected fields."; |
| 12 | 13 | ln["slide3Title_en"] = "SELECT VISUALIZATION"; |
| 13 | -ln["slide3Subtitle_en"] = "Select a visualization, fill out inputs and labels (optional)."; | |
| 14 | -ln["back_en"] = "Back"; | |
| 15 | -ln["forward_en"] = "Forward"; | |
| 14 | +ln["slide3Subtitle_en"] = "Select a visualization, fill out inputs and options."; | |
| 15 | +ln["back_en"] = "BACK TO THE FUTURE"; | |
| 16 | +ln["forward_en"] = "FORWARD"; | |
| 16 | 17 | |
| 17 | 18 | //SELECT DATASET |
| 19 | + | |
| 18 | 20 | ln["listView_en"] = "LIST VIEW"; |
| 19 | 21 | ln["treeMapView_en"] = "TREE MAP VIEW"; |
| 20 | 22 | ln["extendedSearch_en"] = "EXTENDED SEARCH"; |
| ... | ... | @@ -23,516 +25,795 @@ ln["showing_en"] = "Showing"; |
| 23 | 25 | ln["to_en"] = "to"; |
| 24 | 26 | ln["of_en"] = "of"; |
| 25 | 27 | ln["datasets_en"] = "datasets"; |
| 26 | -//ln["availableDatasets_en"] = "Available datasets"; | |
| 27 | 28 | ln["suggestedDatasets_en"] = "Suggested datasets"; |
| 28 | 29 | ln["selectedUrl_en"] = "Selected url"; |
| 29 | 30 | ln["wrongUrl_en"] = "Invalid url or data provider not supported yet."; |
| 30 | 31 | |
| 31 | 32 | //SELECT DATA |
| 32 | -ln["expertAddFilters_en"] = "EXPERT : ADD FILTERS"; | |
| 33 | 33 | |
| 34 | 34 | //select-fields |
| 35 | 35 | ln["fields_en"] = "FIELDS"; |
| 36 | 36 | |
| 37 | 37 | //data-table |
| 38 | 38 | ln["selectedData_en"] = "SELECTED DATA"; |
| 39 | -//ln["showing_en"] = "Showing"; | |
| 40 | -//ln["to_en"] = "to"; | |
| 41 | -//ln["of_en"] = "of"; | |
| 39 | +ln["showing_en"] = "Showing"; | |
| 40 | +ln["to_en"] = "to"; | |
| 41 | +ln["of_en"] = "of"; | |
| 42 | 42 | ln["rows_en"] = "rows"; |
| 43 | 43 | ln["type_en"] = "TYPE"; |
| 44 | 44 | ln["warning_en"] = "WARNING"; |
| 45 | 45 | |
| 46 | +//expert | |
| 47 | +ln["expert_en"] = "EXPERT MODE"; | |
| 48 | +ln["filters_en"] = "FILTERS"; | |
| 49 | +ln["groupBy_en"] = "GROUP BY"; | |
| 50 | +ln["query_en"] = "QUERY"; | |
| 51 | + | |
| 46 | 52 | //filters |
| 47 | 53 | ln["filterField_en"] = "Field"; |
| 48 | 54 | ln["filterOperation_en"] = "Operation"; |
| 49 | 55 | ln["filterValue_en"] = "Value"; |
| 50 | 56 | |
| 51 | -ln["=_en"] = "is equal to"; | |
| 52 | -ln["!=_en"] = "is different from"; | |
| 53 | -ln[">_en"] = "is greater than"; | |
| 54 | -ln[">=_en"] = "is greater than or equal to"; | |
| 55 | -ln["<_en"] = "is less than"; | |
| 56 | -ln["<=_en"] = "is less than or equal to"; | |
| 57 | +ln["disableFilters_en"] = "DISABLE FILTERS"; | |
| 58 | +ln["enableFilters_en"] = "ENABLE FILTERS"; | |
| 59 | + | |
| 60 | +ln["=_en"] = "="; //is equal to | |
| 61 | +ln["!=_en"] = "not ="; //is not equal to | |
| 62 | +ln[">_en"] = ">"; //is greater than | |
| 63 | +ln[">=_en"] = ">="; //is greater than or equal to | |
| 64 | +ln["<_en"] = "<"; //is less than | |
| 65 | +ln["<=_en"] = "<="; //is less than or equal to | |
| 57 | 66 | ln["contains_en"] = "contains"; |
| 58 | 67 | ln["notContains_en"] = "not contains"; |
| 59 | 68 | ln["start_en"] = "start with"; |
| 60 | 69 | ln["ends_en"] = "ends with"; |
| 61 | 70 | |
| 71 | +//aggregators | |
| 72 | +ln["GROUP BY_en"] = "GROUP BY"; | |
| 73 | +ln["CALCULATE_en"] = "CALCULATE"; | |
| 74 | +ln["Calculate_en"] = "Calculate"; | |
| 75 | +ln["aggregatorField_en"] = "Field"; | |
| 76 | + | |
| 77 | +ln["disableGroupBy_en"] = "DISABLE GROUP BY"; | |
| 78 | +ln["enableGroupBy_en"] = "ENABLE GROUP BY"; | |
| 79 | + | |
| 80 | +ln["COUNT_en"] = "COUNT of"; | |
| 81 | +ln["SUM_en"] = "SUM of"; | |
| 82 | +ln["MIN_en"] = "MIN of"; | |
| 83 | +ln["MAX_en"] = "MAX of"; | |
| 84 | +ln["AVG_en"] = "AVG of"; | |
| 85 | +ln["FIRST_en"] = "FIRST of"; | |
| 86 | +ln["LAST_en"] = "LAST of"; | |
| 87 | + | |
| 62 | 88 | //SELECT VISUALIZATION |
| 63 | -ln["inputs_en"] = "INPUTS"; | |
| 64 | -ln["baseInfo_en"] = "BASE INFO"; | |
| 65 | -ln["layouts_en"] = "LABELS / OPTIONS"; | |
| 66 | -ln["dataletPreview_en"] = "DATALET PREVIEW"; | |
| 89 | + | |
| 67 | 90 | ln["addDatalet_en"] = "ADD"; |
| 68 | 91 | ln["modifyDatalet_en"] = "MODIFY"; |
| 69 | 92 | |
| 93 | +//datalet-preview | |
| 94 | +ln["previewTab_en"] = "DATALET PREVIEW"; | |
| 95 | +ln["infoTab_en"] = "DATALET INFO"; | |
| 96 | + | |
| 97 | +//select-inputs | |
| 98 | +ln["baseInfo_en"] = "BASE INFO"; | |
| 99 | +ln["inputs_en"] = "INPUTS"; | |
| 100 | +ln["options_en"] = "OPTIONS"; | |
| 101 | + | |
| 70 | 102 | //vslider |
| 71 | 103 | ln["search_en"] = "Search"; |
| 72 | 104 | |
| 73 | 105 | ln["datatable_en"] = "Table"; |
| 74 | -ln["barchart_en"] = "Bar"; | |
| 75 | -ln["columnchart_en"] = "Column"; | |
| 76 | -ln["areachart_en"] = "Area"; | |
| 77 | -ln["linechart_en"] = "Line"; | |
| 106 | +ln["barchart_en"] = "Bar Chart"; | |
| 107 | +ln["columnchart_en"] = "Column Chart"; | |
| 108 | +ln["areachart_en"] = "Area Chart"; | |
| 109 | +ln["linechart_en"] = "Line Chart"; | |
| 78 | 110 | ln["heatmap_en"] = "Heat Map"; |
| 79 | -ln["barchart_stacked_en"] = "Stacked Bar"; | |
| 80 | -ln["columnchart_stacked_en"] = "Stacked Column"; | |
| 81 | -ln["areachart_stacked_en"] = "Stacked Area"; | |
| 82 | -ln["piechart_en"] = "Pie"; | |
| 83 | -ln["scatterchart_en"] = "Scatter"; | |
| 84 | -ln["bubblechart_en"] = "Bubble"; | |
| 111 | +ln["piechart_en"] = "Pie Chart"; | |
| 112 | +ln["scatterchart_en"] = "Scatter Chart"; | |
| 113 | +ln["bubblechart_en"] = "Bubble Chart"; | |
| 85 | 114 | ln["treemap_en"] = "Tree Map"; |
| 86 | 115 | ln["leafletjs_en"] = "Map"; |
| 87 | -ln["leafletjs-geojson_en"] = "Map Geojson"; | |
| 116 | +ln["leafletjs-geojson_en"] = "Geojson Map"; | |
| 117 | + | |
| 118 | +ln["datatableDescription_en"] = "A table is a means of arranging data in rows and columns."; | |
| 119 | +ln["barchartDescription_en"] = "A bar chart is a chart that presents grouped data with rectangular bars plotted horizontally with lengths proportional to the values that they represent."; | |
| 120 | +ln["columnchartDescription_en"] = "A column chart is a chart that presents grouped data with rectangular bars plotted vertically with lengths proportional to the values that they represent."; | |
| 121 | +ln["areachartDescription_en"] = "An area chart is a chart which displays graphically quantitive data. The area between axis and line are emphasized with colors and textures. Commonly one compares with the area chart two or more quantities."; | |
| 122 | +ln["linechartDescription_en"] = "A line chart is chart which displays information as a series of data points called 'markers' connected by straight line segments. A line chart is often used to visualize a trend in data over intervals of time."; | |
| 123 | +ln["heatmapDescription_en"] = "A heat map is a graphical representation of data where the individual values contained in a matrix are represented as colors."; | |
| 124 | +ln["piechartDescription_en"] = "A pie chart is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In the pie chart, the arc length of each slice, and consequently its central angle and area, is proportional to the quantity it represents."; | |
| 125 | +ln["scatterchartDescription_en"] = "A scatter chart is a type of plot or mathematical diagram using Cartesian coordinates to display values for typically two variables for a set of data. The data is displayed as a collection of points, each having the value of one variable determining the position on the horizontal axis and the value of the other variable determining the position on the vertical axis."; | |
| 126 | +ln["bubblechartDescription_en"] = "A bubble chart is a type of chart that displays three dimensions of data. Each entity with its triplet (v1, v2, v3) of associated data is plotted as a disk that expresses two of the vi values through the disk's xy location and the third through its size."; | |
| 127 | +ln["treemapDescription_en"] = "A tree map is a chart for displaying hierarchical data by using nested rectangles."; | |
| 128 | +ln["leafletjsDescription_en"] = ""; | |
| 129 | +ln["leafletjs-geojsonDescription_en"] = ""; | |
| 88 | 130 | |
| 89 | 131 | //inputs |
| 90 | -ln["expertGroupBy_en"] = "EXPERT : GROUP BY"; | |
| 91 | - | |
| 92 | -ln["sortAscending_en"] = "sorted ascending"; | |
| 93 | -ln["sortDescending_en"] = "sorted descending"; | |
| 94 | -ln["unsort_en"] = "unsorted"; | |
| 95 | - | |
| 96 | -ln["groupBy_en"] = "GROUP BY"; | |
| 97 | -ln["calculate_en"] = "CALCULATE"; | |
| 98 | - | |
| 99 | -ln["COUNT_en"] = "COUNT of"; | |
| 100 | -ln["SUM_en"] = "SUM of"; | |
| 101 | -ln["MIN_en"] = "MIN of"; | |
| 102 | -ln["MAX_en"] = "MAX of"; | |
| 103 | -ln["AVG_en"] = "AVG of"; | |
| 104 | -ln["FIRST_en"] = "FIRST of"; | |
| 105 | -ln["LAST_en"] = "LAST of"; | |
| 132 | +ln["title_en"] = "Title" | |
| 133 | +ln["description_en"] = "Description"; | |
| 106 | 134 | |
| 107 | -ln["XAxis_en"] = "X AXIS"; | |
| 108 | -ln["YAxis_en"] = "Y AXIS"; | |
| 109 | -ln["NumericXAxis_en"] = "X AXIS [num]"; | |
| 110 | -ln["NumericYAxis_en"] = "Y AXIS [num]"; | |
| 135 | +ln["sortAscending_en"] = "SORTED ASCENDING"; | |
| 136 | +ln["sortDescending_en"] = "SORTED DESCENDING"; | |
| 137 | +ln["unsort_en"] = "UNSORTED"; | |
| 138 | + | |
| 139 | +//--> "_" not allowed! | |
| 140 | +ln["TITLE_en"] = "TITLE"; | |
| 141 | +ln["DESCRIPTION_en"] = "DESCRIPTION"; | |
| 142 | +ln["XAxis_en"] = "X-AXIS"; | |
| 143 | +ln["YAxis_en"] = "Y-AXIS"; | |
| 144 | +ln["NumericXAxis_en"] = "X-AXIS"; | |
| 145 | +ln["NumericYAxis_en"] = "Y-AXIS"; | |
| 111 | 146 | ln["Column_en"] = "COLUMN"; |
| 112 | 147 | ln["Level_en"] = "LEVEL"; |
| 113 | 148 | ln["SliceLabels_en"] = "LABEL"; |
| 114 | -ln["SliceSizes_en"] = "SIZE [num]"; | |
| 149 | +ln["SliceSizes_en"] = "SIZE"; | |
| 115 | 150 | ln["Latitude_en"] = "LATITUDE"; |
| 116 | 151 | ln["Longitude_en"] = "LONGITUDE"; |
| 117 | -ln["BalloonContent_en"] = "BALLOON CONTENT";// [opt] | |
| 152 | +ln["BalloonContent_en"] = "BALLOON CONTENT"; | |
| 118 | 153 | ln["GEOJSON_en"] = "GEOJSON"; |
| 154 | +ln["GEOJSONContent_en"] = "GEOJSON CONTENT"; | |
| 119 | 155 | ln["BubbleContent_en"] = "BUBBLE CONTENT"; |
| 120 | -ln["BubbleSize_en"] = "BUBBLE SIZE [num]"; | |
| 121 | -ln["Categories_en"] = "CATEGORY [opt]"; | |
| 156 | +ln["BubbleSize_en"] = "BUBBLE SIZE"; | |
| 157 | +ln["Categories_en"] = "CATEGORY"; | |
| 158 | + | |
| 159 | +ln["TITLEDescription_en"] = "The datalet title."; | |
| 160 | +ln["DESCRIPTIONDescription_en"] = "The datalet description."; | |
| 161 | +ln["XAxisDescription_en"] = "The x-axis."; | |
| 162 | +ln["YAxisDescription_en"] = "The y-axis."; | |
| 163 | +ln["NumericXAxisDescription_en"] = "The x-axis."; | |
| 164 | +ln["NumericYAxisDescription_en"] = "The y-axis."; | |
| 165 | +ln["ColumnDescription_en"] = "The column of the table."; | |
| 166 | +ln["LevelDescription_en"] = "The level of the tree map."; | |
| 167 | +ln["SliceLabelsDescription_en"] = "The label of the slices."; | |
| 168 | +ln["SliceSizesDescription_en"] = "The size of the slices."; | |
| 169 | +ln["LatitudeDescription_en"] = "The latitude of locations."; | |
| 170 | +ln["LongitudeDescription_en"] = "The longitude of locations."; | |
| 171 | +ln["BalloonContentDescription_en"] = "The content of balloons."; | |
| 172 | +ln["GEOJSONDescription_en"] = "The GeoJSON data."; | |
| 173 | +ln["GEOJSONContentDescription_en"] = "The content of GeoJSON."; | |
| 174 | +ln["BubbleContentDescription_en"] = "The content of bubbles."; | |
| 175 | +ln["BubbleSizeDescription_en"] = "The size of bubbles."; | |
| 176 | +ln["CategoriesDescription_en"] = "The category that splits the y-axis values. If selected only the first selected y-axis will be considered."; | |
| 122 | 177 | |
| 123 | 178 | //options |
| 124 | -ln["title_en"] = "Title" | |
| 125 | -ln["description_en"] = "Description"; | |
| 126 | - | |
| 127 | 179 | ln["x-axis-label_en"] = "X Axis Label"; |
| 128 | 180 | ln["y-axis-label_en"] = "Y Axis Label"; |
| 129 | 181 | ln["suffix_en"] = "Tooltip Suffix"; |
| 130 | -ln["theme_en"] = "Theme"; | |
| 182 | +ln["legend_en"] = "Leged"; | |
| 183 | +ln["data-labels_en"] = "Show Data Labels"; | |
| 131 | 184 | ln["stack_en"] = "Stack"; |
| 185 | +ln["theme_en"] = "Theme"; | |
| 132 | 186 | ln["donut_en"] = "Donut"; |
| 133 | 187 | |
| 134 | -ln["x-axis-label_description_en"] = "The label shown on the X axis"; | |
| 135 | -ln["y-axis-label_description_en"] = "The label shown on the Y axis"; | |
| 136 | -ln["suffix_description_en"] = "The suffix added to values ($,%, Kg, ...)"; | |
| 137 | -ln["theme_description_en"] = "The theme affects the appearance and colors of the graph"; | |
| 138 | -ln["stack_description_en"] = "If 'percent' normalization to 100 will be applied"; | |
| 139 | -ln["donut_description_en"] = "If 'true' Pie will become Donut! :)"; | |
| 188 | +ln["true_en"] = "Yes"; | |
| 189 | +ln["false_en"] = "No"; | |
| 190 | +ln["bottom_en"] = "Yes: Bottom"; | |
| 191 | +ln["topRight_en"] = "Yes: Top Right"; | |
| 192 | +ln["normal_en"] = "Yes: Normal"; | |
| 193 | +ln["percent_en"] = "Yes: Percent"; | |
| 194 | +ln["themeBase_en"] = "Base"; | |
| 195 | +ln["themeDarkUnika_en"] = "Dark Unika"; | |
| 196 | +ln["themeSandSignika_en"] = "Sand Signika"; | |
| 197 | +ln["themeGridLight_en"] = "Grid Light"; | |
| 198 | +ln["themeSpod_en"] = "Spod"; | |
| 199 | + | |
| 200 | +ln["x-axis-labelDescription_en"] = "The x-axis label."; | |
| 201 | +ln["y-axis-labelDescription_en"] = "The y-axis label."; | |
| 202 | +ln["suffixDescription_en"] = "The suffix added to data labels in the tooltip."; | |
| 203 | +ln["legendDescription_en"] = "The leged position."; | |
| 204 | +ln["data-labelsDescription_en"] = "Show/hide data labels."; | |
| 205 | +ln["themeDescription_en"] = "The theme affects the appearance and colors of the chart."; | |
| 206 | +ln["stackDescription_en"] = "The stack type."; | |
| 207 | +ln["donutDescription_en"] = "Pie will become Donut! :) (or viceversa)."; | |
| 140 | 208 | |
| 141 | 209 | /******** IT ********/ |
| 142 | 210 | |
| 143 | 211 | //PAGE SLIDER |
| 144 | -ln["slide1Title_it"] = "SELEZIONA IL DATASET"; | |
| 145 | -ln["slide1Subtitle_it"] = "Seleziona il dataset dalla lista o copia e incolla la url del dataset."; | |
| 146 | -ln["slide2Title_it"] = "SELEZIONA I DATI"; | |
| 147 | -ln["slide2Subtitle_it"] = "Seleziona i campi sulla sinistra. Nella tabella saranno mostrati i valori dei campi selezionati."; | |
| 148 | -ln["slide3Title_it"] = "SELEZIONA LA VISUALIZZAZIONE"; | |
| 149 | -ln["slide3Subtitle_it"] = "Seleziona una visualizzazione, inserisci dati di input ed etichette (opzionale)."; | |
| 150 | -ln["back_it"] = "Indietro"; | |
| 151 | -ln["forward_it"] = "Avanti"; | |
| 212 | + | |
| 213 | +ln["slide1Title_it"] = "SELECT DATASET"; | |
| 214 | +ln["slide1Subtitle_it"] = "Select a dataset from the list or copy and paste the url of dataset."; | |
| 215 | +ln["slide2Title_it"] = "SELECT DATA"; | |
| 216 | +ln["slide2Subtitle_it"] = "Select the fields on the left. The table will show the values related to the selected fields."; | |
| 217 | +ln["slide3Title_it"] = "SELECT VISUALIZATION"; | |
| 218 | +ln["slide3Subtitle_it"] = "Select a visualization, fill out inputs and options."; | |
| 219 | +ln["back_it"] = "BACK TO THE FUTURE"; | |
| 220 | +ln["forward_it"] = "FORWARD"; | |
| 152 | 221 | |
| 153 | 222 | //SELECT DATASET |
| 154 | -ln["listView_it"] = "ELENCO"; | |
| 155 | -ln["treeMapView_it"] = "GRAFICO AD ALBERO"; | |
| 156 | -ln["extendedSearch_it"] = "RICERCA ESTESA"; | |
| 223 | + | |
| 224 | +ln["listView_it"] = "LIST VIEW"; | |
| 225 | +ln["treeMapView_it"] = "TREE MAP VIEW"; | |
| 226 | +ln["extendedSearch_it"] = "EXTENDED SEARCH"; | |
| 157 | 227 | ln["provider_it"] = "Provider"; |
| 158 | -ln["showing_it"] = "Visualizzati"; | |
| 159 | -ln["to_it"] = "a"; | |
| 160 | -ln["of_it"] = "di"; | |
| 228 | +ln["showing_it"] = "Showing"; | |
| 229 | +ln["to_it"] = "to"; | |
| 230 | +ln["of_it"] = "of"; | |
| 161 | 231 | ln["datasets_it"] = "datasets"; |
| 162 | -//ln["availableDatasets_it"] = "Dataset disponibili"; | |
| 163 | -ln["suggestedDatasets_it"] = "Dataset suggeriti"; | |
| 164 | -ln["selectedUrl_it"] = "Url selezionata"; | |
| 165 | -ln["wrongUrl_it"] = "Url invalido o data provider non ancora supportato."; | |
| 232 | +ln["suggestedDatasets_it"] = "Suggested datasets"; | |
| 233 | +ln["selectedUrl_it"] = "Selected url"; | |
| 234 | +ln["wrongUrl_it"] = "Invalid url or data provider not supported yet."; | |
| 166 | 235 | |
| 167 | 236 | //SELECT DATA |
| 168 | -ln["expertAddFilters_it"] = "ESPERTO : AGGIUNGI FILTRI"; | |
| 169 | 237 | |
| 170 | 238 | //select-fields |
| 171 | -ln["fields_it"] = "CAMPI"; | |
| 239 | +ln["fields_it"] = "FIELDS"; | |
| 172 | 240 | |
| 173 | 241 | //data-table |
| 174 | -ln["selectedData_it"] = "DATI SELEZIONATI"; | |
| 175 | -ln["rows_it"] = "righe"; | |
| 176 | -ln["type_it"] = "TIPO"; | |
| 177 | -ln["warning_it"] = "ATTENZIONE"; | |
| 242 | +ln["selectedData_it"] = "SELECTED DATA"; | |
| 243 | +ln["showing_it"] = "Showing"; | |
| 244 | +ln["to_it"] = "to"; | |
| 245 | +ln["of_it"] = "of"; | |
| 246 | +ln["rows_it"] = "rows"; | |
| 247 | +ln["type_it"] = "TYPE"; | |
| 248 | +ln["warning_it"] = "WARNING"; | |
| 249 | + | |
| 250 | +//expert | |
| 251 | +ln["expert_it"] = "EXPERT MODE"; | |
| 252 | +ln["filters_it"] = "FILTERS"; | |
| 253 | +ln["groupBy_it"] = "GROUP BY"; | |
| 254 | +ln["query_it"] = "QUERY"; | |
| 178 | 255 | |
| 179 | 256 | //filters |
| 180 | -ln["filterField_it"] = "Campo"; | |
| 181 | -ln["filterOperation_it"] = "Operazione"; | |
| 182 | -ln["filterValue_it"] = "Valore"; | |
| 183 | - | |
| 184 | -ln["=_it"] = "è uguale a"; | |
| 185 | -ln["!=_it"] = "è diverso da"; | |
| 186 | -ln[">_it"] = "è maggiore di"; | |
| 187 | -ln[">=_it"] = "è maggiore uguale di"; | |
| 188 | -ln["<_it"] = "è minore di"; | |
| 189 | -ln["<=_it"] = "è minore uguale di"; | |
| 190 | -ln["contains_it"] = "contiene"; | |
| 191 | -ln["notContains_it"] = "non contiene"; | |
| 192 | -ln["start_it"] = "inizia con"; | |
| 193 | -ln["ends_it"] = "finisce con"; | |
| 257 | +ln["filterField_it"] = "Field"; | |
| 258 | +ln["filterOperation_it"] = "Operation"; | |
| 259 | +ln["filterValue_it"] = "Value"; | |
| 260 | + | |
| 261 | +ln["disableFilters_it"] = "DISABLE FILTERS"; | |
| 262 | +ln["enableFilters_it"] = "ENABLE FILTERS"; | |
| 263 | + | |
| 264 | +ln["=_it"] = "="; //is equal to | |
| 265 | +ln["!=_it"] = "not ="; //is not equal to | |
| 266 | +ln[">_it"] = ">"; //is greater than | |
| 267 | +ln[">=_it"] = ">="; //is greater than or equal to | |
| 268 | +ln["<_it"] = "<"; //is less than | |
| 269 | +ln["<=_it"] = "<="; //is less than or equal to | |
| 270 | +ln["contains_it"] = "contains"; | |
| 271 | +ln["notContains_it"] = "not contains"; | |
| 272 | +ln["start_it"] = "start with"; | |
| 273 | +ln["ends_it"] = "ends with"; | |
| 274 | + | |
| 275 | +//aggregators | |
| 276 | +ln["GROUP BY_it"] = "GROUP BY"; | |
| 277 | +ln["CALCULATE_it"] = "CALCULATE"; | |
| 278 | +ln["Calculate_it"] = "Calculate"; | |
| 279 | +ln["aggregatorField_it"] = "Field"; | |
| 280 | + | |
| 281 | +ln["disableGroupBy_it"] = "DISABLE GROUP BY"; | |
| 282 | +ln["enableGroupBy_it"] = "ENABLE GROUP BY"; | |
| 283 | + | |
| 284 | +ln["COUNT_it"] = "COUNT of"; | |
| 285 | +ln["SUM_it"] = "SUM of"; | |
| 286 | +ln["MIN_it"] = "MIN of"; | |
| 287 | +ln["MAX_it"] = "MAX of"; | |
| 288 | +ln["AVG_it"] = "AVG of"; | |
| 289 | +ln["FIRST_it"] = "FIRST of"; | |
| 290 | +ln["LAST_it"] = "LAST of"; | |
| 194 | 291 | |
| 195 | 292 | //SELECT VISUALIZATION |
| 196 | -ln["inputs_it"] = "DATI DI INPUT"; | |
| 197 | -ln["baseInfo_it"] = "INFORMAZIONI DI BASE"; | |
| 198 | -ln["layouts_it"] = "ETICHETTE / OPZIONI"; | |
| 199 | -ln["dataletPreview_it"] = "ANTEPRIMA DELLA DATALET"; | |
| 200 | -ln["addDatalet_it"] = "AGGIUNGI"; | |
| 201 | -ln["modifyDatalet_it"] = "MODIFICA"; | |
| 293 | + | |
| 294 | +ln["addDatalet_it"] = "ADD"; | |
| 295 | +ln["modifyDatalet_it"] = "MODIFY"; | |
| 296 | + | |
| 297 | +//datalet-preview | |
| 298 | +ln["previewTab_it"] = "DATALET PREVIEW"; | |
| 299 | +ln["infoTab_it"] = "DATALET INFO"; | |
| 300 | + | |
| 301 | +//select-inputs | |
| 302 | +ln["baseInfo_it"] = "BASE INFO"; | |
| 303 | +ln["inputs_it"] = "INPUTS"; | |
| 304 | +ln["options_it"] = "OPTIONS"; | |
| 202 | 305 | |
| 203 | 306 | //vslider |
| 204 | -ln["search_it"] = "Cerca"; | |
| 205 | - | |
| 206 | -ln["datatable_it"] = "Tabella"; | |
| 207 | -ln["barchart_it"] = "Grafico a barre"; | |
| 208 | -ln["columnchart_it"] = "Grafico a colonne"; | |
| 209 | -ln["areachart_it"] = "Grafico ad area"; | |
| 210 | -ln["linechart_it"] = "Grafico a linee"; | |
| 211 | -ln["heatmap_it"] = "Mappa termica"; | |
| 212 | -ln["barchart_stacked_it"] = "Grafico a barre in pila"; | |
| 213 | -ln["columnchart_stacked_it"] = "Grafico a colonne in pila"; | |
| 214 | -ln["areachart_stacked_it"] = "Grafico ad area in pila"; | |
| 215 | -ln["piechart_it"] = "Grafico a torta"; | |
| 216 | -ln["scatterchart_it"] = "Grafico a dispersione"; | |
| 217 | -ln["bubblechart_it"] = "Grafico a bolle"; | |
| 218 | -ln["treemap_it"] = "Grafico ad albero"; | |
| 219 | -ln["leafletjs_it"] = "Mappa"; | |
| 220 | -ln["leafletjs-geojson_it"] = "Mappa geojson"; | |
| 307 | +ln["search_it"] = "Search"; | |
| 308 | + | |
| 309 | +ln["datatable_it"] = "Table"; | |
| 310 | +ln["barchart_it"] = "Bar Chart"; | |
| 311 | +ln["columnchart_it"] = "Column Chart"; | |
| 312 | +ln["areachart_it"] = "Area Chart"; | |
| 313 | +ln["linechart_it"] = "Line Chart"; | |
| 314 | +ln["heatmap_it"] = "Heat Map"; | |
| 315 | +ln["piechart_it"] = "Pie Chart"; | |
| 316 | +ln["scatterchart_it"] = "Scatter Chart"; | |
| 317 | +ln["bubblechart_it"] = "Bubble Chart"; | |
| 318 | +ln["treemap_it"] = "Tree Map"; | |
| 319 | +ln["leafletjs_it"] = "Map"; | |
| 320 | +ln["leafletjs-geojson_it"] = "Geojson Map"; | |
| 321 | + | |
| 322 | +ln["datatableDescription_it"] = "A table is a means of arranging data in rows and columns."; | |
| 323 | +ln["barchartDescription_it"] = "A bar chart is a chart that presents grouped data with rectangular bars plotted horizontally with lengths proportional to the values that they represent."; | |
| 324 | +ln["columnchartDescription_it"] = "A column chart is a chart that presents grouped data with rectangular bars plotted vertically with lengths proportional to the values that they represent."; | |
| 325 | +ln["areachartDescription_it"] = "An area chart is a chart which displays graphically quantitive data. The area between axis and line are emphasized with colors and textures. Commonly one compares with the area chart two or more quantities."; | |
| 326 | +ln["linechartDescription_it"] = "A line chart is chart which displays information as a series of data points called 'markers' connected by straight line segments. A line chart is often used to visualize a trend in data over intervals of time."; | |
| 327 | +ln["heatmapDescription_it"] = "A heat map is a graphical representation of data where the individual values contained in a matrix are represented as colors."; | |
| 328 | +ln["piechartDescription_it"] = "A pie chart is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In the pie chart, the arc length of each slice, and consequently its central angle and area, is proportional to the quantity it represents."; | |
| 329 | +ln["scatterchartDescription_it"] = "A scatter chart is a type of plot or mathematical diagram using Cartesian coordinates to display values for typically two variables for a set of data. The data is displayed as a collection of points, each having the value of one variable determining the position on the horizontal axis and the value of the other variable determining the position on the vertical axis."; | |
| 330 | +ln["bubblechartDescription_it"] = "A bubble chart is a type of chart that displays three dimensions of data. Each entity with its triplet (v1, v2, v3) of associated data is plotted as a disk that expresses two of the vi values through the disk's xy location and the third through its size."; | |
| 331 | +ln["treemapDescription_it"] = "A tree map is a chart for displaying hierarchical data by using nested rectangles."; | |
| 332 | +ln["leafletjsDescription_it"] = ""; | |
| 333 | +ln["leafletjs-geojsonDescription_it"] = ""; | |
| 221 | 334 | |
| 222 | 335 | //inputs |
| 223 | -ln["expertGroupBy_it"] = "ESPERTO : RAGGRUPPA"; | |
| 224 | - | |
| 225 | -ln["sortAscending_it"] = "ordinamento crescente"; | |
| 226 | -ln["sortDescending_it"] = "ordinamento decrescente"; | |
| 227 | -ln["unsort_it"] = "non ordinato"; | |
| 228 | - | |
| 229 | -ln["groupBy_it"] = "RAGGRUPPA"; | |
| 230 | -ln["calculate_it"] = "CALCOLA"; | |
| 231 | - | |
| 232 | -ln["COUNT_it"] = "CONTEGGIO di"; | |
| 233 | -ln["SUM_it"] = "SOMMA di"; | |
| 234 | -ln["MIN_it"] = "MINIMO di"; | |
| 235 | -ln["MAX_it"] = "MASSIMO di"; | |
| 236 | -ln["AVG_it"] = "MEDIA di"; | |
| 237 | -ln["FIRST_it"] = "PRIMO di"; | |
| 238 | -ln["LAST_it"] = "ULTIMO di"; | |
| 239 | - | |
| 240 | -ln["XAxis_it"] = "ASSE X"; | |
| 241 | -ln["YAxis_it"] = "ASSE Y"; | |
| 242 | -ln["NumericXAxis_it"] = "ASSE X [num]"; | |
| 243 | -ln["NumericYAxis_it"] = "ASSE Y [num]"; | |
| 244 | -ln["Column_it"] = "COLONNA"; | |
| 245 | -ln["Level_it"] = "LIVELLO"; | |
| 246 | -ln["SliceLabels_it"] = "ETICHETTA"; | |
| 247 | -ln["SliceSizes_it"] = "DIMENSIONE [num]"; | |
| 248 | -ln["Latitude_it"] = "LATITUDINE"; | |
| 249 | -ln["Longitude_it"] = "LONGITUDINE"; | |
| 250 | -ln["BalloonContent_it"] = "CONTENUTO"; | |
| 336 | +ln["title_it"] = "Title" | |
| 337 | +ln["description_it"] = "Description"; | |
| 338 | + | |
| 339 | +ln["sortAscending_it"] = "SORTED ASCENDING"; | |
| 340 | +ln["sortDescending_it"] = "SORTED DESCENDING"; | |
| 341 | +ln["unsort_it"] = "UNSORTED"; | |
| 342 | + | |
| 343 | +//--> "_" not allowed! | |
| 344 | +ln["TITLE_it"] = "TITLE"; | |
| 345 | +ln["DESCRIPTION_it"] = "DESCRIPTION"; | |
| 346 | +ln["XAxis_it"] = "X-AXIS"; | |
| 347 | +ln["YAxis_it"] = "Y-AXIS"; | |
| 348 | +ln["NumericXAxis_it"] = "X-AXIS"; | |
| 349 | +ln["NumericYAxis_it"] = "Y-AXIS"; | |
| 350 | +ln["Column_it"] = "COLUMN"; | |
| 351 | +ln["Level_it"] = "LEVEL"; | |
| 352 | +ln["SliceLabels_it"] = "LABEL"; | |
| 353 | +ln["SliceSizes_it"] = "SIZE"; | |
| 354 | +ln["Latitude_it"] = "LATITUDE"; | |
| 355 | +ln["Longitude_it"] = "LONGITUDE"; | |
| 356 | +ln["BalloonContent_it"] = "BALLOON CONTENT"; | |
| 251 | 357 | ln["GEOJSON_it"] = "GEOJSON"; |
| 252 | -ln["BubbleContent_it"] = "CONTENUTO BOLLA"; | |
| 253 | -ln["BubbleSize_it"] = "DIMENSIONE BOLLA [num]"; | |
| 254 | -ln["Categories_it"] = "CATEGORIA [opt]"; | |
| 358 | +ln["GEOJSONContent_it"] = "GEOJSON CONTENT"; | |
| 359 | +ln["BubbleContent_it"] = "BUBBLE CONTENT"; | |
| 360 | +ln["BubbleSize_it"] = "BUBBLE SIZE"; | |
| 361 | +ln["Categories_it"] = "CATEGORY"; | |
| 362 | + | |
| 363 | +ln["TITLEDescription_it"] = "The datalet title."; | |
| 364 | +ln["DESCRIPTIONDescription_it"] = "The datalet description."; | |
| 365 | +ln["XAxisDescription_it"] = "The x-axis."; | |
| 366 | +ln["YAxisDescription_it"] = "The y-axis."; | |
| 367 | +ln["NumericXAxisDescription_it"] = "The x-axis."; | |
| 368 | +ln["NumericYAxisDescription_it"] = "The y-axis."; | |
| 369 | +ln["ColumnDescription_it"] = "The column of the table."; | |
| 370 | +ln["LevelDescription_it"] = "The level of the tree map."; | |
| 371 | +ln["SliceLabelsDescription_it"] = "The label of the slices."; | |
| 372 | +ln["SliceSizesDescription_it"] = "The size of the slices."; | |
| 373 | +ln["LatitudeDescription_it"] = "The latitude of locations."; | |
| 374 | +ln["LongitudeDescription_it"] = "The longitude of locations."; | |
| 375 | +ln["BalloonContentDescription_it"] = "The content of balloons."; | |
| 376 | +ln["GEOJSONDescription_it"] = "The GeoJSON data."; | |
| 377 | +ln["GEOJSONContentDescription_it"] = "The content of GeoJSON."; | |
| 378 | +ln["BubbleContentDescription_it"] = "The content of bubbles."; | |
| 379 | +ln["BubbleSizeDescription_it"] = "The size of bubbles."; | |
| 380 | +ln["CategoriesDescription_it"] = "The category that splits the y-axis values. If selected only the first selected y-axis will be considered."; | |
| 255 | 381 | |
| 256 | 382 | //options |
| 257 | -ln["title_it"] = "Titolo" | |
| 258 | -ln["description_it"] = "Descrizione"; | |
| 259 | - | |
| 260 | -ln["x-axis-label_it"] = "Etichetta asse X"; | |
| 261 | -ln["y-axis-label_it"] = "Etichetta asse Y"; | |
| 262 | -ln["suffix_it"] = "Suffisso tooltip"; | |
| 263 | -ln["theme_it"] = "Tema"; | |
| 383 | +ln["x-axis-label_it"] = "X Axis Label"; | |
| 384 | +ln["y-axis-label_it"] = "Y Axis Label"; | |
| 385 | +ln["suffix_it"] = "Tooltip Suffix"; | |
| 386 | +ln["legend_it"] = "Leged"; | |
| 387 | +ln["data-labels_it"] = "Show Data Labels"; | |
| 264 | 388 | ln["stack_it"] = "Stack"; |
| 265 | -ln["donut_it"] = "Ciambella"; | |
| 266 | - | |
| 267 | -ln["x-axis-label_description_it"] = "L'etichetta che verrà visualizzata sull'asse delle X"; | |
| 268 | -ln["y-axis-label_description_it"] = "L'etichetta che verrà visualizzata sull'asse delle Y"; | |
| 269 | -ln["suffix_description_it"] = "Il suffisso che verrà aggiunto ai valori ($, %, Kg, ...)"; | |
| 270 | -ln["theme_description_it"] = "Il tema influenza l'estetica e i colori del grafico"; | |
| 271 | -ln["stack_description_it"] = "Se 'percent' sarà applicata la normalizzazione a 100"; | |
| 272 | -ln["donut_description_it"] = "Se 'true' il grafico a torta diventerà a ciambella! :)"; | |
| 389 | +ln["theme_it"] = "Theme"; | |
| 390 | +ln["donut_it"] = "Donut"; | |
| 391 | + | |
| 392 | +ln["true_it"] = "Yes"; | |
| 393 | +ln["false_it"] = "No"; | |
| 394 | +ln["bottom_it"] = "Yes: Bottom"; | |
| 395 | +ln["topRight_it"] = "Yes: Top Right"; | |
| 396 | +ln["normal_it"] = "Yes: Normal"; | |
| 397 | +ln["percent_it"] = "Yes: Percent"; | |
| 398 | +ln["themeBase_it"] = "Base"; | |
| 399 | +ln["themeDarkUnika_it"] = "Dark Unika"; | |
| 400 | +ln["themeSandSignika_it"] = "Sand Signika"; | |
| 401 | +ln["themeGridLight_it"] = "Grid Light"; | |
| 402 | +ln["themeSpod_it"] = "Spod"; | |
| 403 | + | |
| 404 | +ln["x-axis-labelDescription_it"] = "The x-axis label."; | |
| 405 | +ln["y-axis-labelDescription_it"] = "The y-axis label."; | |
| 406 | +ln["suffixDescription_it"] = "The suffix added to data labels in the tooltip."; | |
| 407 | +ln["legendDescription_it"] = "The leged position."; | |
| 408 | +ln["data-labelsDescription_it"] = "Show/hide data labels."; | |
| 409 | +ln["themeDescription_it"] = "The theme affects the appearance and colors of the chart."; | |
| 410 | +ln["stackDescription_it"] = "The stack type."; | |
| 411 | +ln["donutDescription_it"] = "Pie will become Donut! :) (or viceversa)."; | |
| 273 | 412 | |
| 274 | 413 | /******** FR ********/ |
| 275 | 414 | |
| 276 | 415 | //PAGE SLIDER |
| 277 | -ln["slide1Title_fr"] = "SELECTIONNER UN JEU DE DONNEES"; | |
| 278 | -ln["slide1Subtitle_fr"] = "Rechercher ou copier/coller l’url du jeu de données."; | |
| 279 | -ln["slide2Title_fr"] = "SELECTIONNER DONNEES"; | |
| 280 | -ln["slide2Subtitle_fr"] = "Sélectionner les champs à partir de l’arborescence. Une fenêtre vous indiquera les valeurs relatives aux champs sélectionnés."; | |
| 281 | -ln["slide3Title_fr"] = "SELECTIONNER UN MODE DE VISUALISATION"; | |
| 282 | -ln["slide3Subtitle_fr"] = "Sélectionner un mode de visualisation, remplir les entrées et les vignettes (optionnel)."; | |
| 283 | -ln["back_fr"] = "RETOUR"; | |
| 284 | -ln["forward_fr"] = "AVANT"; | |
| 416 | + | |
| 417 | +ln["slide1Title_fr"] = "SELECT DATASET"; | |
| 418 | +ln["slide1Subtitle_fr"] = "Select a dataset from the list or copy and paste the url of dataset."; | |
| 419 | +ln["slide2Title_fr"] = "SELECT DATA"; | |
| 420 | +ln["slide2Subtitle_fr"] = "Select the fields on the left. The table will show the values related to the selected fields."; | |
| 421 | +ln["slide3Title_fr"] = "SELECT VISUALIZATION"; | |
| 422 | +ln["slide3Subtitle_fr"] = "Select a visualization, fill out inputs and options."; | |
| 423 | +ln["back_fr"] = "BACK TO THE FUTURE"; | |
| 424 | +ln["forward_fr"] = "FORWARD"; | |
| 285 | 425 | |
| 286 | 426 | //SELECT DATASET |
| 287 | -ln["listView_fr"] = "VUE EN LISTE"; | |
| 288 | -ln["treeMapView_fr"] = "VUE EN ARBORESCENCE"; | |
| 427 | + | |
| 428 | +ln["listView_fr"] = "LIST VIEW"; | |
| 429 | +ln["treeMapView_fr"] = "TREE MAP VIEW"; | |
| 289 | 430 | ln["extendedSearch_fr"] = "EXTENDED SEARCH"; |
| 290 | 431 | ln["provider_fr"] = "Provider"; |
| 291 | 432 | ln["showing_fr"] = "Showing"; |
| 292 | 433 | ln["to_fr"] = "to"; |
| 293 | 434 | ln["of_fr"] = "of"; |
| 294 | 435 | ln["datasets_fr"] = "datasets"; |
| 295 | -//ln["availableDatasets_fr"] = "Jeux de données disponibles"; | |
| 296 | -ln["suggestedDatasets_fr"] = "Jeux de données suggérés"; | |
| 297 | -ln["selectedUrl_fr"] = "Sélectionner URL"; | |
| 436 | +ln["suggestedDatasets_fr"] = "Suggested datasets"; | |
| 437 | +ln["selectedUrl_fr"] = "Selected url"; | |
| 298 | 438 | ln["wrongUrl_fr"] = "Invalid url or data provider not supported yet."; |
| 299 | 439 | |
| 300 | 440 | //SELECT DATA |
| 301 | -ln["expertAddFilters_fr"] = "EXPERT : ADD FILTERS"; | |
| 302 | 441 | |
| 303 | 442 | //select-fields |
| 304 | 443 | ln["fields_fr"] = "FIELDS"; |
| 305 | 444 | |
| 306 | 445 | //data-table |
| 307 | 446 | ln["selectedData_fr"] = "SELECTED DATA"; |
| 447 | +ln["showing_fr"] = "Showing"; | |
| 448 | +ln["to_fr"] = "to"; | |
| 449 | +ln["of_fr"] = "of"; | |
| 308 | 450 | ln["rows_fr"] = "rows"; |
| 309 | 451 | ln["type_fr"] = "TYPE"; |
| 310 | 452 | ln["warning_fr"] = "WARNING"; |
| 311 | 453 | |
| 454 | +//expert | |
| 455 | +ln["expert_fr"] = "EXPERT MODE"; | |
| 456 | +ln["filters_fr"] = "FILTERS"; | |
| 457 | +ln["groupBy_fr"] = "GROUP BY"; | |
| 458 | +ln["query_fr"] = "QUERY"; | |
| 459 | + | |
| 312 | 460 | //filters |
| 313 | 461 | ln["filterField_fr"] = "Field"; |
| 314 | 462 | ln["filterOperation_fr"] = "Operation"; |
| 315 | 463 | ln["filterValue_fr"] = "Value"; |
| 316 | 464 | |
| 317 | -ln["=_fr"] = "is equal to"; | |
| 318 | -ln["!=_fr"] = "is different from"; | |
| 319 | -ln[">_fr"] = "is greater than"; | |
| 320 | -ln[">=_fr"] = "is greater than or equal to"; | |
| 321 | -ln["<_fr"] = "is less than"; | |
| 322 | -ln["<=_fr"] = "is less than or equal to"; | |
| 465 | +ln["disableFilters_fr"] = "DISABLE FILTERS"; | |
| 466 | +ln["enableFilters_fr"] = "ENABLE FILTERS"; | |
| 467 | + | |
| 468 | +ln["=_fr"] = "="; //is equal to | |
| 469 | +ln["!=_fr"] = "not ="; //is not equal to | |
| 470 | +ln[">_fr"] = ">"; //is greater than | |
| 471 | +ln[">=_fr"] = ">="; //is greater than or equal to | |
| 472 | +ln["<_fr"] = "<"; //is less than | |
| 473 | +ln["<=_fr"] = "<="; //is less than or equal to | |
| 323 | 474 | ln["contains_fr"] = "contains"; |
| 324 | 475 | ln["notContains_fr"] = "not contains"; |
| 325 | 476 | ln["start_fr"] = "start with"; |
| 326 | 477 | ln["ends_fr"] = "ends with"; |
| 327 | 478 | |
| 479 | +//aggregators | |
| 480 | +ln["GROUP BY_fr"] = "GROUP BY"; | |
| 481 | +ln["CALCULATE_fr"] = "CALCULATE"; | |
| 482 | +ln["Calculate_fr"] = "Calculate"; | |
| 483 | +ln["aggregatorField_fr"] = "Field"; | |
| 484 | + | |
| 485 | +ln["disableGroupBy_fr"] = "DISABLE GROUP BY"; | |
| 486 | +ln["enableGroupBy_fr"] = "ENABLE GROUP BY"; | |
| 487 | + | |
| 488 | +ln["COUNT_fr"] = "COUNT of"; | |
| 489 | +ln["SUM_fr"] = "SUM of"; | |
| 490 | +ln["MIN_fr"] = "MIN of"; | |
| 491 | +ln["MAX_fr"] = "MAX of"; | |
| 492 | +ln["AVG_fr"] = "AVG of"; | |
| 493 | +ln["FIRST_fr"] = "FIRST of"; | |
| 494 | +ln["LAST_fr"] = "LAST of"; | |
| 495 | + | |
| 328 | 496 | //SELECT VISUALIZATION |
| 329 | -ln["inputs_fr"] = "SORTIES"; | |
| 330 | -ln["baseInfo_fr"] = "INFORMATION DE BASE"; | |
| 331 | -ln["layouts_fr"] = "VIGNETTES/OPTIONSs"; | |
| 332 | -ln["dataletPreview_fr"] = "PREVISUALISATION"; | |
| 333 | -ln["addDatalet_fr"] = "AJOUTER"; | |
| 334 | -ln["modifyDatalet_fr"] = "MODIFIER"; | |
| 497 | + | |
| 498 | +ln["addDatalet_fr"] = "ADD"; | |
| 499 | +ln["modifyDatalet_fr"] = "MODIFY"; | |
| 500 | + | |
| 501 | +//datalet-preview | |
| 502 | +ln["previewTab_fr"] = "DATALET PREVIEW"; | |
| 503 | +ln["infoTab_fr"] = "DATALET INFO"; | |
| 504 | + | |
| 505 | +//select-inputs | |
| 506 | +ln["baseInfo_fr"] = "BASE INFO"; | |
| 507 | +ln["inputs_fr"] = "INPUTS"; | |
| 508 | +ln["options_fr"] = "OPTIONS"; | |
| 335 | 509 | |
| 336 | 510 | //vslider |
| 337 | 511 | ln["search_fr"] = "Search"; |
| 338 | 512 | |
| 339 | 513 | ln["datatable_fr"] = "Table"; |
| 340 | -ln["barchart_fr"] = "Bar"; | |
| 341 | -ln["columnchart_fr"] = "Column"; | |
| 342 | -ln["areachart_fr"] = "Area"; | |
| 343 | -ln["linechart_fr"] = "Line"; | |
| 514 | +ln["barchart_fr"] = "Bar Chart"; | |
| 515 | +ln["columnchart_fr"] = "Column Chart"; | |
| 516 | +ln["areachart_fr"] = "Area Chart"; | |
| 517 | +ln["linechart_fr"] = "Line Chart"; | |
| 344 | 518 | ln["heatmap_fr"] = "Heat Map"; |
| 345 | -ln["barchart_stacked_fr"] = "Stacked Bar"; | |
| 346 | -ln["columnchart_stacked_fr"] = "Stacked Column"; | |
| 347 | -ln["areachart_stacked_fr"] = "Stacked Area"; | |
| 348 | -ln["piechart_fr"] = "Pie"; | |
| 349 | -ln["scatterchart_fr"] = "Scatter"; | |
| 350 | -ln["bubblechart_fr"] = "Bubble"; | |
| 519 | +ln["piechart_fr"] = "Pie Chart"; | |
| 520 | +ln["scatterchart_fr"] = "Scatter Chart"; | |
| 521 | +ln["bubblechart_fr"] = "Bubble Chart"; | |
| 351 | 522 | ln["treemap_fr"] = "Tree Map"; |
| 352 | 523 | ln["leafletjs_fr"] = "Map"; |
| 353 | -ln["leafletjs-geojson_fr"] = "Map Geojson"; | |
| 524 | +ln["leafletjs-geojson_fr"] = "Geojson Map"; | |
| 525 | + | |
| 526 | +ln["datatableDescription_fr"] = "A table is a means of arranging data in rows and columns."; | |
| 527 | +ln["barchartDescription_fr"] = "A bar chart is a chart that presents grouped data with rectangular bars plotted horizontally with lengths proportional to the values that they represent."; | |
| 528 | +ln["columnchartDescription_fr"] = "A column chart is a chart that presents grouped data with rectangular bars plotted vertically with lengths proportional to the values that they represent."; | |
| 529 | +ln["areachartDescription_fr"] = "An area chart is a chart which displays graphically quantitive data. The area between axis and line are emphasized with colors and textures. Commonly one compares with the area chart two or more quantities."; | |
| 530 | +ln["linechartDescription_fr"] = "A line chart is chart which displays information as a series of data points called 'markers' connected by straight line segments. A line chart is often used to visualize a trend in data over intervals of time."; | |
| 531 | +ln["heatmapDescription_fr"] = "A heat map is a graphical representation of data where the individual values contained in a matrix are represented as colors."; | |
| 532 | +ln["piechartDescription_fr"] = "A pie chart is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In the pie chart, the arc length of each slice, and consequently its central angle and area, is proportional to the quantity it represents."; | |
| 533 | +ln["scatterchartDescription_fr"] = "A scatter chart is a type of plot or mathematical diagram using Cartesian coordinates to display values for typically two variables for a set of data. The data is displayed as a collection of points, each having the value of one variable determining the position on the horizontal axis and the value of the other variable determining the position on the vertical axis."; | |
| 534 | +ln["bubblechartDescription_fr"] = "A bubble chart is a type of chart that displays three dimensions of data. Each entity with its triplet (v1, v2, v3) of associated data is plotted as a disk that expresses two of the vi values through the disk's xy location and the third through its size."; | |
| 535 | +ln["treemapDescription_fr"] = "A tree map is a chart for displaying hierarchical data by using nested rectangles."; | |
| 536 | +ln["leafletjsDescription_fr"] = ""; | |
| 537 | +ln["leafletjs-geojsonDescription_fr"] = ""; | |
| 354 | 538 | |
| 355 | 539 | //inputs |
| 356 | -ln["expertGroupBy_fr"] = "EXPERT : GROUP BY"; | |
| 357 | - | |
| 358 | -ln["sortAscending_fr"] = "sorted ascending"; | |
| 359 | -ln["sortDescending_fr"] = "sorted descending"; | |
| 360 | -ln["unsort_fr"] = "unsorted"; | |
| 361 | - | |
| 362 | -ln["groupBy_fr"] = "GROUP BY"; | |
| 363 | -ln["calculate_fr"] = "CALCULATE"; | |
| 364 | - | |
| 365 | -ln["COUNT_fr"] = "COUNT of"; | |
| 366 | -ln["SUM_fr"] = "SUM of"; | |
| 367 | -ln["MIN_fr"] = "MIN of"; | |
| 368 | -ln["MAX_fr"] = "MAX of"; | |
| 369 | -ln["AVG_fr"] = "AVG of"; | |
| 370 | -ln["FIRST_fr"] = "FIRST of"; | |
| 371 | -ln["LAST_fr"] = "LAST of"; | |
| 540 | +ln["title_fr"] = "Title" | |
| 541 | +ln["description_fr"] = "Description"; | |
| 372 | 542 | |
| 373 | -ln["XAxis_fr"] = "X AXIS"; | |
| 374 | -ln["YAxis_fr"] = "Y AXIS"; | |
| 375 | -ln["NumericXAxis_fr"] = "X AXIS [num]"; | |
| 376 | -ln["NumericYAxis_fr"] = "Y AXIS [num]"; | |
| 543 | +ln["sortAscending_fr"] = "SORTED ASCENDING"; | |
| 544 | +ln["sortDescending_fr"] = "SORTED DESCENDING"; | |
| 545 | +ln["unsort_fr"] = "UNSORTED"; | |
| 546 | + | |
| 547 | +//--> "_" not allowed! | |
| 548 | +ln["TITLE_fr"] = "TITLE"; | |
| 549 | +ln["DESCRIPTION_fr"] = "DESCRIPTION"; | |
| 550 | +ln["XAxis_fr"] = "X-AXIS"; | |
| 551 | +ln["YAxis_fr"] = "Y-AXIS"; | |
| 552 | +ln["NumericXAxis_fr"] = "X-AXIS"; | |
| 553 | +ln["NumericYAxis_fr"] = "Y-AXIS"; | |
| 377 | 554 | ln["Column_fr"] = "COLUMN"; |
| 378 | 555 | ln["Level_fr"] = "LEVEL"; |
| 379 | 556 | ln["SliceLabels_fr"] = "LABEL"; |
| 380 | -ln["SliceSizes_fr"] = "SIZE [num]"; | |
| 557 | +ln["SliceSizes_fr"] = "SIZE"; | |
| 381 | 558 | ln["Latitude_fr"] = "LATITUDE"; |
| 382 | 559 | ln["Longitude_fr"] = "LONGITUDE"; |
| 383 | -ln["BalloonContent_fr"] = "BALLOON CONTENT";// [opt] | |
| 560 | +ln["BalloonContent_fr"] = "BALLOON CONTENT"; | |
| 384 | 561 | ln["GEOJSON_fr"] = "GEOJSON"; |
| 562 | +ln["GEOJSONContent_fr"] = "GEOJSON CONTENT"; | |
| 385 | 563 | ln["BubbleContent_fr"] = "BUBBLE CONTENT"; |
| 386 | -ln["BubbleSize_fr"] = "BUBBLE SIZE [num]"; | |
| 387 | -ln["Categories_fr"] = "CATEGORY [opt]"; | |
| 564 | +ln["BubbleSize_fr"] = "BUBBLE SIZE"; | |
| 565 | +ln["Categories_fr"] = "CATEGORY"; | |
| 566 | + | |
| 567 | +ln["TITLEDescription_fr"] = "The datalet title."; | |
| 568 | +ln["DESCRIPTIONDescription_fr"] = "The datalet description."; | |
| 569 | +ln["XAxisDescription_fr"] = "The x-axis."; | |
| 570 | +ln["YAxisDescription_fr"] = "The y-axis."; | |
| 571 | +ln["NumericXAxisDescription_fr"] = "The x-axis."; | |
| 572 | +ln["NumericYAxisDescription_fr"] = "The y-axis."; | |
| 573 | +ln["ColumnDescription_fr"] = "The column of the table."; | |
| 574 | +ln["LevelDescription_fr"] = "The level of the tree map."; | |
| 575 | +ln["SliceLabelsDescription_fr"] = "The label of the slices."; | |
| 576 | +ln["SliceSizesDescription_fr"] = "The size of the slices."; | |
| 577 | +ln["LatitudeDescription_fr"] = "The latitude of locations."; | |
| 578 | +ln["LongitudeDescription_fr"] = "The longitude of locations."; | |
| 579 | +ln["BalloonContentDescription_fr"] = "The content of balloons."; | |
| 580 | +ln["GEOJSONDescription_fr"] = "The GeoJSON data."; | |
| 581 | +ln["GEOJSONContentDescription_fr"] = "The content of GeoJSON."; | |
| 582 | +ln["BubbleContentDescription_fr"] = "The content of bubbles."; | |
| 583 | +ln["BubbleSizeDescription_fr"] = "The size of bubbles."; | |
| 584 | +ln["CategoriesDescription_fr"] = "The category that splits the y-axis values. If selected only the first selected y-axis will be considered."; | |
| 388 | 585 | |
| 389 | 586 | //options |
| 390 | -ln["title_fr"] = "Title" | |
| 391 | -ln["description_fr"] = "Description"; | |
| 392 | - | |
| 393 | 587 | ln["x-axis-label_fr"] = "X Axis Label"; |
| 394 | 588 | ln["y-axis-label_fr"] = "Y Axis Label"; |
| 395 | 589 | ln["suffix_fr"] = "Tooltip Suffix"; |
| 396 | -ln["theme_fr"] = "Theme"; | |
| 590 | +ln["legend_fr"] = "Leged"; | |
| 591 | +ln["data-labels_fr"] = "Show Data Labels"; | |
| 397 | 592 | ln["stack_fr"] = "Stack"; |
| 593 | +ln["theme_fr"] = "Theme"; | |
| 398 | 594 | ln["donut_fr"] = "Donut"; |
| 399 | 595 | |
| 400 | -ln["x-axis-label_description_fr"] = "Vignette pour l’axe X."; | |
| 401 | -ln["y-axis-label_description_fr"] = "Vignette pour l’axe Y."; | |
| 402 | -ln["suffix_description_fr"] = "Unités de mesures (ex: dollars, euros."; | |
| 403 | -ln["theme_description_fr"] = "Theme"; | |
| 404 | -ln["stack_description_fr"] = "Stack"; | |
| 405 | -ln["donut_description_fr"] = "Donut"; | |
| 596 | +ln["true_fr"] = "Yes"; | |
| 597 | +ln["false_fr"] = "No"; | |
| 598 | +ln["bottom_fr"] = "Yes: Bottom"; | |
| 599 | +ln["topRight_fr"] = "Yes: Top Right"; | |
| 600 | +ln["normal_fr"] = "Yes: Normal"; | |
| 601 | +ln["percent_fr"] = "Yes: Percent"; | |
| 602 | +ln["themeBase_fr"] = "Base"; | |
| 603 | +ln["themeDarkUnika_fr"] = "Dark Unika"; | |
| 604 | +ln["themeSandSignika_fr"] = "Sand Signika"; | |
| 605 | +ln["themeGridLight_fr"] = "Grid Light"; | |
| 606 | +ln["themeSpod_fr"] = "Spod"; | |
| 607 | + | |
| 608 | +ln["x-axis-labelDescription_fr"] = "The x-axis label."; | |
| 609 | +ln["y-axis-labelDescription_fr"] = "The y-axis label."; | |
| 610 | +ln["suffixDescription_fr"] = "The suffix added to data labels in the tooltip."; | |
| 611 | +ln["legendDescription_fr"] = "The leged position."; | |
| 612 | +ln["data-labelsDescription_fr"] = "Show/hide data labels."; | |
| 613 | +ln["themeDescription_fr"] = "The theme affects the appearance and colors of the chart."; | |
| 614 | +ln["stackDescription_fr"] = "The stack type."; | |
| 615 | +ln["donutDescription_fr"] = "Pie will become Donut! :) (or viceversa)."; | |
| 406 | 616 | |
| 407 | 617 | /******** NL ********/ |
| 408 | 618 | |
| 409 | 619 | //PAGE SLIDER |
| 410 | -ln["slide1Title_nl"] = "SELECTEER DATASET"; | |
| 411 | -ln["slide1Subtitle_nl"] = "Zoek of kopieer en plak de url van de dataset."; | |
| 412 | -ln["slide2Title_nl"] = "SELECTEER DATA"; | |
| 413 | -ln["slide2Subtitle_nl"] = "Selecteer de velden uit de boomstructuur. De multi-tabel laat de waarden zien van de geselecteerde velden."; | |
| 414 | -ln["slide3Title_nl"] = "SELECTEER VISUALISATIE"; | |
| 415 | -ln["slide3Subtitle_nl"] = "Selecteer een visualisatie, vul de invoer en labels in."; | |
| 416 | -ln["back_nl"] = "TERUG"; | |
| 417 | -ln["forward_nl"] = "VOOTUIT"; | |
| 620 | + | |
| 621 | +ln["slide1Title_nl"] = "SELECT DATASET"; | |
| 622 | +ln["slide1Subtitle_nl"] = "Select a dataset from the list or copy and paste the url of dataset."; | |
| 623 | +ln["slide2Title_nl"] = "SELECT DATA"; | |
| 624 | +ln["slide2Subtitle_nl"] = "Select the fields on the left. The table will show the values related to the selected fields."; | |
| 625 | +ln["slide3Title_nl"] = "SELECT VISUALIZATION"; | |
| 626 | +ln["slide3Subtitle_nl"] = "Select a visualization, fill out inputs and options."; | |
| 627 | +ln["back_nl"] = "BACK TO THE FUTURE"; | |
| 628 | +ln["forward_nl"] = "FORWARD"; | |
| 418 | 629 | |
| 419 | 630 | //SELECT DATASET |
| 420 | -ln["listView_nl"] = "LIJSTWEERGAVE"; | |
| 421 | -ln["treeMapView_nl"] = "BOOMSTRUCTUUR WEEERGAVE"; | |
| 631 | + | |
| 632 | +ln["listView_nl"] = "LIST VIEW"; | |
| 633 | +ln["treeMapView_nl"] = "TREE MAP VIEW"; | |
| 422 | 634 | ln["extendedSearch_nl"] = "EXTENDED SEARCH"; |
| 423 | 635 | ln["provider_nl"] = "Provider"; |
| 424 | 636 | ln["showing_nl"] = "Showing"; |
| 425 | 637 | ln["to_nl"] = "to"; |
| 426 | 638 | ln["of_nl"] = "of"; |
| 427 | 639 | ln["datasets_nl"] = "datasets"; |
| 428 | -//ln["availableDatasets_nl"] = "Beschikbare datasets"; | |
| 429 | -ln["suggestedDatasets_nl"] = "Voeg aanbevolen datasets"; | |
| 430 | -ln["selectedUrl_nl"] = "Selecteer url"; | |
| 431 | -ln["wrongUrl_nl"] = "Ongeldige url of data provider nog niet ondersteund."; | |
| 640 | +ln["suggestedDatasets_nl"] = "Suggested datasets"; | |
| 641 | +ln["selectedUrl_nl"] = "Selected url"; | |
| 642 | +ln["wrongUrl_nl"] = "Invalid url or data provider not supported yet."; | |
| 432 | 643 | |
| 433 | 644 | //SELECT DATA |
| 434 | -ln["expertAddFilters_nl"] = "EXPERT : ADD FILTERS"; | |
| 435 | 645 | |
| 436 | 646 | //select-fields |
| 437 | 647 | ln["fields_nl"] = "FIELDS"; |
| 438 | 648 | |
| 439 | 649 | //data-table |
| 440 | 650 | ln["selectedData_nl"] = "SELECTED DATA"; |
| 651 | +ln["showing_nl"] = "Showing"; | |
| 652 | +ln["to_nl"] = "to"; | |
| 653 | +ln["of_nl"] = "of"; | |
| 441 | 654 | ln["rows_nl"] = "rows"; |
| 442 | 655 | ln["type_nl"] = "TYPE"; |
| 443 | 656 | ln["warning_nl"] = "WARNING"; |
| 444 | 657 | |
| 658 | +//expert | |
| 659 | +ln["expert_nl"] = "EXPERT MODE"; | |
| 660 | +ln["filters_nl"] = "FILTERS"; | |
| 661 | +ln["groupBy_nl"] = "GROUP BY"; | |
| 662 | +ln["query_nl"] = "QUERY"; | |
| 663 | + | |
| 445 | 664 | //filters |
| 446 | 665 | ln["filterField_nl"] = "Field"; |
| 447 | 666 | ln["filterOperation_nl"] = "Operation"; |
| 448 | 667 | ln["filterValue_nl"] = "Value"; |
| 449 | 668 | |
| 450 | -ln["=_nl"] = "is equal to"; | |
| 451 | -ln["!=_nl"] = "is different from"; | |
| 452 | -ln[">_nl"] = "is greater than"; | |
| 453 | -ln[">=_nl"] = "is greater than or equal to"; | |
| 454 | -ln["<_nl"] = "is less than"; | |
| 455 | -ln["<=_nl"] = "is less than or equal to"; | |
| 669 | +ln["disableFilters_nl"] = "DISABLE FILTERS"; | |
| 670 | +ln["enableFilters_nl"] = "ENABLE FILTERS"; | |
| 671 | + | |
| 672 | +ln["=_nl"] = "="; //is equal to | |
| 673 | +ln["!=_nl"] = "not ="; //is not equal to | |
| 674 | +ln[">_nl"] = ">"; //is greater than | |
| 675 | +ln[">=_nl"] = ">="; //is greater than or equal to | |
| 676 | +ln["<_nl"] = "<"; //is less than | |
| 677 | +ln["<=_nl"] = "<="; //is less than or equal to | |
| 456 | 678 | ln["contains_nl"] = "contains"; |
| 457 | 679 | ln["notContains_nl"] = "not contains"; |
| 458 | 680 | ln["start_nl"] = "start with"; |
| 459 | 681 | ln["ends_nl"] = "ends with"; |
| 460 | 682 | |
| 683 | +//aggregators | |
| 684 | +ln["GROUP BY_nl"] = "GROUP BY"; | |
| 685 | +ln["CALCULATE_nl"] = "CALCULATE"; | |
| 686 | +ln["Calculate_nl"] = "Calculate"; | |
| 687 | +ln["aggregatorField_nl"] = "Field"; | |
| 688 | + | |
| 689 | +ln["disableGroupBy_nl"] = "DISABLE GROUP BY"; | |
| 690 | +ln["enableGroupBy_nl"] = "ENABLE GROUP BY"; | |
| 691 | + | |
| 692 | +ln["COUNT_nl"] = "COUNT of"; | |
| 693 | +ln["SUM_nl"] = "SUM of"; | |
| 694 | +ln["MIN_nl"] = "MIN of"; | |
| 695 | +ln["MAX_nl"] = "MAX of"; | |
| 696 | +ln["AVG_nl"] = "AVG of"; | |
| 697 | +ln["FIRST_nl"] = "FIRST of"; | |
| 698 | +ln["LAST_nl"] = "LAST of"; | |
| 699 | + | |
| 461 | 700 | //SELECT VISUALIZATION |
| 701 | + | |
| 702 | +ln["addDatalet_nl"] = "ADD"; | |
| 703 | +ln["modifyDatalet_nl"] = "MODIFY"; | |
| 704 | + | |
| 705 | +//datalet-preview | |
| 706 | +ln["previewTab_nl"] = "DATALET PREVIEW"; | |
| 707 | +ln["infoTab_nl"] = "DATALET INFO"; | |
| 708 | + | |
| 709 | +//select-inputs | |
| 710 | +ln["baseInfo_nl"] = "BASE INFO"; | |
| 462 | 711 | ln["inputs_nl"] = "INPUTS"; |
| 463 | -ln["baseInfo_nl"] = "BASIS INFO"; | |
| 464 | -ln["layouts_nl"] = "LABELS / OPTIES"; | |
| 465 | -ln["dataletPreview_nl"] = "VOORBEELD"; | |
| 466 | -ln["addDatalet_nl"] = "TOEVOEGEN"; | |
| 467 | -ln["modifyDatalet_nl"] = "WIJZIGEN"; | |
| 712 | +ln["options_nl"] = "OPTIONS"; | |
| 468 | 713 | |
| 469 | 714 | //vslider |
| 470 | 715 | ln["search_nl"] = "Search"; |
| 471 | 716 | |
| 472 | -ln["datatable_nl"] = "Tafel"; | |
| 473 | -ln["barchart_nl"] = "Bar"; | |
| 474 | -ln["columnchart_nl"] = "Column"; | |
| 475 | -ln["areachart_nl"] = "Area"; | |
| 476 | -ln["linechart_nl"] = "Line"; | |
| 717 | +ln["datatable_nl"] = "Table"; | |
| 718 | +ln["barchart_nl"] = "Bar Chart"; | |
| 719 | +ln["columnchart_nl"] = "Column Chart"; | |
| 720 | +ln["areachart_nl"] = "Area Chart"; | |
| 721 | +ln["linechart_nl"] = "Line Chart"; | |
| 477 | 722 | ln["heatmap_nl"] = "Heat Map"; |
| 478 | -ln["barchart_stacked_nl"] = "Stacked Bar"; | |
| 479 | -ln["columnchart_stacked_nl"] = "Stacked Column"; | |
| 480 | -ln["areachart_stacked_nl"] = "Stacked Area"; | |
| 481 | -ln["piechart_nl"] = "Pie"; | |
| 482 | -ln["scatterchart_nl"] = "Scatter"; | |
| 483 | -ln["bubblechart_nl"] = "Bubble"; | |
| 723 | +ln["piechart_nl"] = "Pie Chart"; | |
| 724 | +ln["scatterchart_nl"] = "Scatter Chart"; | |
| 725 | +ln["bubblechart_nl"] = "Bubble Chart"; | |
| 484 | 726 | ln["treemap_nl"] = "Tree Map"; |
| 485 | 727 | ln["leafletjs_nl"] = "Map"; |
| 486 | -ln["leafletjs-geojson_nl"] = "Map Geojson"; | |
| 728 | +ln["leafletjs-geojson_nl"] = "Geojson Map"; | |
| 729 | + | |
| 730 | +ln["datatableDescription_nl"] = "A table is a means of arranging data in rows and columns."; | |
| 731 | +ln["barchartDescription_nl"] = "A bar chart is a chart that presents grouped data with rectangular bars plotted horizontally with lengths proportional to the values that they represent."; | |
| 732 | +ln["columnchartDescription_nl"] = "A column chart is a chart that presents grouped data with rectangular bars plotted vertically with lengths proportional to the values that they represent."; | |
| 733 | +ln["areachartDescription_nl"] = "An area chart is a chart which displays graphically quantitive data. The area between axis and line are emphasized with colors and textures. Commonly one compares with the area chart two or more quantities."; | |
| 734 | +ln["linechartDescription_nl"] = "A line chart is chart which displays information as a series of data points called 'markers' connected by straight line segments. A line chart is often used to visualize a trend in data over intervals of time."; | |
| 735 | +ln["heatmapDescription_nl"] = "A heat map is a graphical representation of data where the individual values contained in a matrix are represented as colors."; | |
| 736 | +ln["piechartDescription_nl"] = "A pie chart is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In the pie chart, the arc length of each slice, and consequently its central angle and area, is proportional to the quantity it represents."; | |
| 737 | +ln["scatterchartDescription_nl"] = "A scatter chart is a type of plot or mathematical diagram using Cartesian coordinates to display values for typically two variables for a set of data. The data is displayed as a collection of points, each having the value of one variable determining the position on the horizontal axis and the value of the other variable determining the position on the vertical axis."; | |
| 738 | +ln["bubblechartDescription_nl"] = "A bubble chart is a type of chart that displays three dimensions of data. Each entity with its triplet (v1, v2, v3) of associated data is plotted as a disk that expresses two of the vi values through the disk's xy location and the third through its size."; | |
| 739 | +ln["treemapDescription_nl"] = "A tree map is a chart for displaying hierarchical data by using nested rectangles."; | |
| 740 | +ln["leafletjsDescription_nl"] = ""; | |
| 741 | +ln["leafletjs-geojsonDescription_nl"] = ""; | |
| 487 | 742 | |
| 488 | 743 | //inputs |
| 489 | -ln["expertGroupBy_nl"] = "EXPERT : GROUP BY"; | |
| 490 | - | |
| 491 | -ln["sortAscending_nl"] = "sorted ascending"; | |
| 492 | -ln["sortDescending_nl"] = "sorted descending"; | |
| 493 | -ln["unsort_nl"] = "unsorted"; | |
| 494 | - | |
| 495 | -ln["groupBy_nl"] = "GROUP BY"; | |
| 496 | -ln["calculate_nl"] = "CALCULATE"; | |
| 497 | - | |
| 498 | -ln["COUNT_nl"] = "COUNT of"; | |
| 499 | -ln["SUM_nl"] = "SUM of"; | |
| 500 | -ln["MIN_nl"] = "MIN of"; | |
| 501 | -ln["MAX_nl"] = "MAX of"; | |
| 502 | -ln["AVG_nl"] = "AVG of"; | |
| 503 | -ln["FIRST_nl"] = "FIRST of"; | |
| 504 | -ln["LAST_nl"] = "LAST of"; | |
| 744 | +ln["title_nl"] = "Title" | |
| 745 | +ln["description_nl"] = "Description"; | |
| 505 | 746 | |
| 506 | -ln["XAxis_nl"] = "X AXIS"; | |
| 507 | -ln["YAxis_nl"] = "Y AXIS"; | |
| 508 | -ln["NumericXAxis_nl"] = "X AXIS [num]"; | |
| 509 | -ln["NumericYAxis_nl"] = "Y AXIS [num]"; | |
| 747 | +ln["sortAscending_nl"] = "SORTED ASCENDING"; | |
| 748 | +ln["sortDescending_nl"] = "SORTED DESCENDING"; | |
| 749 | +ln["unsort_nl"] = "UNSORTED"; | |
| 750 | + | |
| 751 | +//--> "_" not allowed! | |
| 752 | +ln["TITLE_nl"] = "TITLE"; | |
| 753 | +ln["DESCRIPTION_nl"] = "DESCRIPTION"; | |
| 754 | +ln["XAxis_nl"] = "X-AXIS"; | |
| 755 | +ln["YAxis_nl"] = "Y-AXIS"; | |
| 756 | +ln["NumericXAxis_nl"] = "X-AXIS"; | |
| 757 | +ln["NumericYAxis_nl"] = "Y-AXIS"; | |
| 510 | 758 | ln["Column_nl"] = "COLUMN"; |
| 511 | 759 | ln["Level_nl"] = "LEVEL"; |
| 512 | 760 | ln["SliceLabels_nl"] = "LABEL"; |
| 513 | -ln["SliceSizes_nl"] = "SIZE [num]"; | |
| 761 | +ln["SliceSizes_nl"] = "SIZE"; | |
| 514 | 762 | ln["Latitude_nl"] = "LATITUDE"; |
| 515 | 763 | ln["Longitude_nl"] = "LONGITUDE"; |
| 516 | -ln["BalloonContent_nl"] = "BALLOON CONTENT";// [opt] | |
| 764 | +ln["BalloonContent_nl"] = "BALLOON CONTENT"; | |
| 517 | 765 | ln["GEOJSON_nl"] = "GEOJSON"; |
| 766 | +ln["GEOJSONContent_nl"] = "GEOJSON CONTENT"; | |
| 518 | 767 | ln["BubbleContent_nl"] = "BUBBLE CONTENT"; |
| 519 | -ln["BubbleSize_nl"] = "BUBBLE SIZE [num]"; | |
| 520 | -ln["Categories_nl"] = "CATEGORY [opt]"; | |
| 768 | +ln["BubbleSize_nl"] = "BUBBLE SIZE"; | |
| 769 | +ln["Categories_nl"] = "CATEGORY"; | |
| 770 | + | |
| 771 | +ln["TITLEDescription_nl"] = "The datalet title."; | |
| 772 | +ln["DESCRIPTIONDescription_nl"] = "The datalet description."; | |
| 773 | +ln["XAxisDescription_nl"] = "The x-axis."; | |
| 774 | +ln["YAxisDescription_nl"] = "The y-axis."; | |
| 775 | +ln["NumericXAxisDescription_nl"] = "The x-axis."; | |
| 776 | +ln["NumericYAxisDescription_nl"] = "The y-axis."; | |
| 777 | +ln["ColumnDescription_nl"] = "The column of the table."; | |
| 778 | +ln["LevelDescription_nl"] = "The level of the tree map."; | |
| 779 | +ln["SliceLabelsDescription_nl"] = "The label of the slices."; | |
| 780 | +ln["SliceSizesDescription_nl"] = "The size of the slices."; | |
| 781 | +ln["LatitudeDescription_nl"] = "The latitude of locations."; | |
| 782 | +ln["LongitudeDescription_nl"] = "The longitude of locations."; | |
| 783 | +ln["BalloonContentDescription_nl"] = "The content of balloons."; | |
| 784 | +ln["GEOJSONDescription_nl"] = "The GeoJSON data."; | |
| 785 | +ln["GEOJSONContentDescription_nl"] = "The content of GeoJSON."; | |
| 786 | +ln["BubbleContentDescription_nl"] = "The content of bubbles."; | |
| 787 | +ln["BubbleSizeDescription_nl"] = "The size of bubbles."; | |
| 788 | +ln["CategoriesDescription_nl"] = "The category that splits the y-axis values. If selected only the first selected y-axis will be considered."; | |
| 521 | 789 | |
| 522 | 790 | //options |
| 523 | -ln["title_nl"] = "Title" | |
| 524 | -ln["description_nl"] = "Description"; | |
| 525 | - | |
| 526 | 791 | ln["x-axis-label_nl"] = "X Axis Label"; |
| 527 | 792 | ln["y-axis-label_nl"] = "Y Axis Label"; |
| 528 | 793 | ln["suffix_nl"] = "Tooltip Suffix"; |
| 529 | -ln["theme_nl"] = "Theme"; | |
| 794 | +ln["legend_nl"] = "Leged"; | |
| 795 | +ln["data-labels_nl"] = "Show Data Labels"; | |
| 530 | 796 | ln["stack_nl"] = "Stack"; |
| 797 | +ln["theme_nl"] = "Theme"; | |
| 531 | 798 | ln["donut_nl"] = "Donut"; |
| 532 | 799 | |
| 533 | -ln["x-axis-label_description_nl"] = "X Axis Label"; | |
| 534 | -ln["y-axis-label_description_nl"] = "Y Axis Label"; | |
| 535 | -ln["suffix_description_nl"] = "Tooltip Suffix"; | |
| 536 | -ln["theme_description_nl"] = "Theme"; | |
| 537 | -ln["stack_description_nl"] = "Stack"; | |
| 538 | -ln["donut_description_nl"] = "Donut"; | |
| 539 | 800 | \ No newline at end of file |
| 801 | +ln["true_nl"] = "Yes"; | |
| 802 | +ln["false_nl"] = "No"; | |
| 803 | +ln["bottom_nl"] = "Yes: Bottom"; | |
| 804 | +ln["topRight_nl"] = "Yes: Top Right"; | |
| 805 | +ln["normal_nl"] = "Yes: Normal"; | |
| 806 | +ln["percent_nl"] = "Yes: Percent"; | |
| 807 | +ln["themeBase_nl"] = "Base"; | |
| 808 | +ln["themeDarkUnika_nl"] = "Dark Unika"; | |
| 809 | +ln["themeSandSignika_nl"] = "Sand Signika"; | |
| 810 | +ln["themeGridLight_nl"] = "Grid Light"; | |
| 811 | +ln["themeSpod_nl"] = "Spod"; | |
| 812 | + | |
| 813 | +ln["x-axis-labelDescription_nl"] = "The x-axis label."; | |
| 814 | +ln["y-axis-labelDescription_nl"] = "The y-axis label."; | |
| 815 | +ln["suffixDescription_nl"] = "The suffix added to data labels in the tooltip."; | |
| 816 | +ln["legendDescription_nl"] = "The leged position."; | |
| 817 | +ln["data-labelsDescription_nl"] = "Show/hide data labels."; | |
| 818 | +ln["themeDescription_nl"] = "The theme affects the appearance and colors of the chart."; | |
| 819 | +ln["stackDescription_nl"] = "The stack type."; | |
| 820 | +ln["donutDescription_nl"] = "Pie will become Donut! :) (or viceversa)."; | |
| 540 | 821 | \ No newline at end of file | ... | ... |