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 | function alasql_QUERY (data, fields, filters, aggregators, orders) { | 1 | function alasql_QUERY (data, fields, filters, aggregators, orders) { |
| 2 | - if(fields.length == 0) | 2 | + if(fields && fields.length == 0) |
| 3 | return []; | 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 | var where = ""; | 15 | var where = ""; |
| 10 | if(filters && filters.length) { | 16 | if(filters && filters.length) { |
| @@ -28,7 +34,7 @@ function alasql_QUERY (data, fields, filters, aggregators, orders) { | @@ -28,7 +34,7 @@ function alasql_QUERY (data, fields, filters, aggregators, orders) { | ||
| 28 | 34 | ||
| 29 | var query = select + " FROM ?" + where + " " + groupBy + " " + orderBy; | 35 | var query = select + " FROM ?" + where + " " + groupBy + " " + orderBy; |
| 30 | 36 | ||
| 31 | - return alasql(query, [data]); | 37 | + return query; |
| 32 | } | 38 | } |
| 33 | 39 | ||
| 34 | function _alasql_SELECT (fields) { | 40 | function _alasql_SELECT (fields) { |
| @@ -44,16 +50,19 @@ function _alasql_SELECT (fields) { | @@ -44,16 +50,19 @@ function _alasql_SELECT (fields) { | ||
| 44 | } | 50 | } |
| 45 | 51 | ||
| 46 | function _alasql_WHERE (filters) { | 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 | for (var i=0; i < filters.length; i++) | 67 | for (var i=0; i < filters.length; i++) |
| 59 | filters[i]["field"] = _normalizeField(filters[i]["field"]); | 68 | filters[i]["field"] = _normalizeField(filters[i]["field"]); |
| @@ -87,7 +96,8 @@ function _alasql_GROUPBY (aggregators) { | @@ -87,7 +96,8 @@ function _alasql_GROUPBY (aggregators) { | ||
| 87 | groupBy += aggregators[i]["field"] + ", "; | 96 | groupBy += aggregators[i]["field"] + ", "; |
| 88 | } | 97 | } |
| 89 | else | 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 | return [select.slice(0, -2), groupBy.slice(0, -2)]; | 103 | return [select.slice(0, -2), groupBy.slice(0, -2)]; |
| @@ -118,7 +128,7 @@ function _normalizeField (field) { | @@ -118,7 +128,7 @@ function _normalizeField (field) { | ||
| 118 | return "[" + field + "]"; | 128 | return "[" + field + "]"; |
| 119 | } | 129 | } |
| 120 | 130 | ||
| 121 | -function alasql_transformData (data, fields, truncate) { | 131 | +function alasql_transformData (data, fields, round) { |
| 122 | if(!data || data.length == 0) | 132 | if(!data || data.length == 0) |
| 123 | return []; | 133 | return []; |
| 124 | 134 | ||
| @@ -129,11 +139,11 @@ function alasql_transformData (data, fields, truncate) { | @@ -129,11 +139,11 @@ function alasql_transformData (data, fields, truncate) { | ||
| 129 | var field = fields[i]; | 139 | var field = fields[i]; |
| 130 | var values = []; | 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 | if(!isNaN(v) && v % 1 != 0) | 145 | if(!isNaN(v) && v % 1 != 0) |
| 136 | - v = Math.floor(v * 100) / 100; | 146 | + v = Math.round(v * 1000000) / 1000000; |
| 137 | values.push(v); | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 58 | \ No newline at end of file |
controllets/data-sevc-controllet/co-datalets-creator-controllet.html
| @@ -41,7 +41,8 @@ | @@ -41,7 +41,8 @@ | ||
| 41 | listeners : { | 41 | listeners : { |
| 42 | 'page-slider-controllet_selected' : '_updateSlider', | 42 | 'page-slider-controllet_selected' : '_updateSlider', |
| 43 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', | 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 | properties : { | 48 | properties : { |
| @@ -104,13 +105,15 @@ | @@ -104,13 +105,15 @@ | ||
| 104 | 105 | ||
| 105 | _allowThirdStep : function(){ | 106 | _allowThirdStep : function(){ |
| 106 | this.$.slider.chevronRight(false); | 107 | this.$.slider.chevronRight(false); |
| 107 | - var fields = this.$.select_data.getSelectedFields(); | 108 | + var selectedFields = this.$.select_data.getSelectedFields(); |
| 108 | var filters = this.$.select_data.getFilters(); | 109 | var filters = this.$.select_data.getFilters(); |
| 110 | + var aggregators = this.$.select_data.getAggregators(); | ||
| 109 | var data = this.$.select_data.getData(); | 111 | var data = this.$.select_data.getData(); |
| 110 | - if(fields.length > 0) { | 112 | + if(selectedFields.length > 0) { |
| 111 | this.$.select_visualization.init(); | 113 | this.$.select_visualization.init(); |
| 112 | - this.$.select_visualization.setFields(fields); | 114 | + this.$.select_visualization.setSelectedFields(selectedFields); |
| 113 | this.$.select_visualization.setFilters(filters); | 115 | this.$.select_visualization.setFilters(filters); |
| 116 | + this.$.select_visualization.setAggregators(aggregators); | ||
| 114 | this.$.select_visualization.setData(data); | 117 | this.$.select_visualization.setData(data); |
| 115 | this.$.slider.chevronRight(true); | 118 | this.$.slider.chevronRight(true); |
| 116 | } | 119 | } |
controllets/data-sevc-controllet/data-sevc-controllet.html
| @@ -50,6 +50,7 @@ | @@ -50,6 +50,7 @@ | ||
| 50 | 'dataset-selection-controllet_data-url' : '_allowSecondStep', | 50 | 'dataset-selection-controllet_data-url' : '_allowSecondStep', |
| 51 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', | 51 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', |
| 52 | 'filters-controllet_filters': '_allowThirdStep', | 52 | 'filters-controllet_filters': '_allowThirdStep', |
| 53 | + 'aggregators-controllet_aggregators': '_allowThirdStep', | ||
| 53 | 'data-ready': '_dataReady' | 54 | 'data-ready': '_dataReady' |
| 54 | }, | 55 | }, |
| 55 | 56 | ||
| @@ -138,13 +139,15 @@ | @@ -138,13 +139,15 @@ | ||
| 138 | 139 | ||
| 139 | _allowThirdStep : function(){ | 140 | _allowThirdStep : function(){ |
| 140 | this.$.slider.chevronRight(false); | 141 | this.$.slider.chevronRight(false); |
| 141 | - var fields = this.$.select_data.getSelectedFields(); | 142 | + var selectedFields = this.$.select_data.getSelectedFields(); |
| 142 | var filters = this.$.select_data.getFilters(); | 143 | var filters = this.$.select_data.getFilters(); |
| 144 | + var aggregators = this.$.select_data.getAggregators(); | ||
| 143 | var data = this.$.select_data.getData(); | 145 | var data = this.$.select_data.getData(); |
| 144 | - if(fields.length > 0) { | 146 | + if(selectedFields.length > 0) { |
| 145 | this.$.select_visualization.init(); | 147 | this.$.select_visualization.init(); |
| 146 | - this.$.select_visualization.setFields(fields); | 148 | + this.$.select_visualization.setSelectedFields(selectedFields); |
| 147 | this.$.select_visualization.setFilters(filters); | 149 | this.$.select_visualization.setFilters(filters); |
| 150 | + this.$.select_visualization.setAggregators(aggregators); | ||
| 148 | this.$.select_visualization.setData(data); | 151 | this.$.select_visualization.setData(data); |
| 149 | this.$.slider.chevronRight(true); | 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 | \ No newline at end of file | 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,6 +42,7 @@ | ||
| 42 | 'page-slider-controllet_selected' : '_updateSlider', | 42 | 'page-slider-controllet_selected' : '_updateSlider', |
| 43 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', | 43 | 'select-fields-controllet_selected-fields' : '_allowThirdStep', |
| 44 | 'filters-controllet_filters': '_allowThirdStep', | 44 | 'filters-controllet_filters': '_allowThirdStep', |
| 45 | + 'aggregators-controllet_aggregators': '_allowThirdStep', | ||
| 45 | 'data-ready': '_preselect' | 46 | 'data-ready': '_preselect' |
| 46 | }, | 47 | }, |
| 47 | 48 | ||
| @@ -96,6 +97,8 @@ | @@ -96,6 +97,8 @@ | ||
| 96 | _preselect : function(){ | 97 | _preselect : function(){ |
| 97 | this.$.select_data.setSelectedFields(this.selectedFields); | 98 | this.$.select_data.setSelectedFields(this.selectedFields); |
| 98 | this.$.select_data.setFilters(JSON.parse(this.dataletPreset["filters"])); | 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 | _updateSlider : function(e){ | 104 | _updateSlider : function(e){ |
| @@ -114,23 +117,27 @@ | @@ -114,23 +117,27 @@ | ||
| 114 | 117 | ||
| 115 | this.$.slider.chevronLeft(true); | 118 | this.$.slider.chevronLeft(true); |
| 116 | this.$.slider.chevronRight("invisible"); | 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 | _allowThirdStep : function(){ | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 372 | \ No newline at end of file |
controllets/filters-controllet/filters-controllet.html
| 1 | <link rel="import" href="../../bower_components/polymer/polymer.html" /> | 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 | <link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> | 3 | <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"> | 4 | <link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> |
| 7 | <link rel="import" href="../../bower_components/paper-item/paper-item.html"> | 5 | <link rel="import" href="../../bower_components/paper-item/paper-item.html"> |
| @@ -19,8 +17,9 @@ | @@ -19,8 +17,9 @@ | ||
| 19 | <style is="custom-style"> | 17 | <style is="custom-style"> |
| 20 | 18 | ||
| 21 | #filters_container { | 19 | #filters_container { |
| 22 | - height: 48px; | 20 | + height: 100%; |
| 23 | width: 100%; | 21 | width: 100%; |
| 22 | + position: relative; | ||
| 24 | } | 23 | } |
| 25 | 24 | ||
| 26 | #filters_container * { | 25 | #filters_container * { |
| @@ -29,37 +28,6 @@ | @@ -29,37 +28,6 @@ | ||
| 29 | line-height: 24px; | 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 | paper-dropdown-menu { | 31 | paper-dropdown-menu { |
| 64 | width: 100%; | 32 | width: 100%; |
| 65 | --paper-input-container-focus-color: #2196F3; | 33 | --paper-input-container-focus-color: #2196F3; |
| @@ -87,11 +55,34 @@ | @@ -87,11 +55,34 @@ | ||
| 87 | } | 55 | } |
| 88 | 56 | ||
| 89 | paper-button { | 57 | paper-button { |
| 90 | - margin: 0px; | ||
| 91 | - height: 44px; | 58 | + margin: 0; |
| 59 | + height: 48px; | ||
| 60 | + padding: 12px; | ||
| 92 | color: #FFFFFF; | 61 | color: #FFFFFF; |
| 93 | background: #2196F3; | 62 | background: #2196F3; |
| 94 | font-weight: 700; | 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 | paper-button:hover { | 88 | paper-button:hover { |
| @@ -138,7 +129,8 @@ | @@ -138,7 +129,8 @@ | ||
| 138 | height: 44px; | 129 | height: 44px; |
| 139 | width: calc(100% - 40px); | 130 | width: calc(100% - 40px); |
| 140 | padding: 8px 0px; | 131 | padding: 8px 0px; |
| 141 | - text-align: right; | 132 | + /*text-align: right;*/ |
| 133 | + text-align: center; | ||
| 142 | } | 134 | } |
| 143 | 135 | ||
| 144 | #filters_container .row2 { | 136 | #filters_container .row2 { |
| @@ -147,7 +139,7 @@ | @@ -147,7 +139,7 @@ | ||
| 147 | width: 100%; | 139 | width: 100%; |
| 148 | } | 140 | } |
| 149 | 141 | ||
| 150 | - #filters_container .row2 .highlighted { | 142 | + .highlighted { |
| 151 | color: #2196F3; | 143 | color: #2196F3; |
| 152 | font-weight: 700; | 144 | font-weight: 700; |
| 153 | } | 145 | } |
| @@ -162,16 +154,11 @@ | @@ -162,16 +154,11 @@ | ||
| 162 | height: 40px; | 154 | height: 40px; |
| 163 | width: 40px; | 155 | width: 40px; |
| 164 | padding: 4px 8px; | 156 | padding: 4px 8px; |
| 165 | - | ||
| 166 | } | 157 | } |
| 167 | 158 | ||
| 168 | </style> | 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 | <div class="row"> | 163 | <div class="row"> |
| 177 | <div class="ddl_container"> | 164 | <div class="ddl_container"> |
| @@ -209,7 +196,7 @@ | @@ -209,7 +196,7 @@ | ||
| 209 | <template is="dom-if" if="{{index}}"><!--excludes logicalOperator--> | 196 | <template is="dom-if" if="{{index}}"><!--excludes logicalOperator--> |
| 210 | <div class="row2"> | 197 | <div class="row2"> |
| 211 | <div class="filter"> | 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 | </div> | 200 | </div> |
| 214 | <div class="remove_container"> | 201 | <div class="remove_container"> |
| 215 | <paper-icon-button on-click="_deleteFilter" icon="cancel" class="cancel"></paper-icon-button> | 202 | <paper-icon-button on-click="_deleteFilter" icon="cancel" class="cancel"></paper-icon-button> |
| @@ -218,9 +205,9 @@ | @@ -218,9 +205,9 @@ | ||
| 218 | </template> | 205 | </template> |
| 219 | </template> | 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 | </template> | 212 | </template> |
| 226 | 213 | ||
| @@ -245,18 +232,12 @@ | @@ -245,18 +232,12 @@ | ||
| 245 | filters : { | 232 | filters : { |
| 246 | type : Array, | 233 | type : Array, |
| 247 | value : [{logicalOperator: "AND"}] | 234 | value : [{logicalOperator: "AND"}] |
| 248 | - }, | ||
| 249 | - | ||
| 250 | - show : { | ||
| 251 | - type : Boolean, | ||
| 252 | - value : false | ||
| 253 | } | 235 | } |
| 254 | 236 | ||
| 255 | }, | 237 | }, |
| 256 | 238 | ||
| 257 | ready : function() { | 239 | ready : function() { |
| 258 | - $(this.$.panel).perfectScrollbar(); | ||
| 259 | -// this._showFiltersPanel();gi | 240 | + $(this.$.filters_container).perfectScrollbar(); |
| 260 | this.logicalOperator = "AND"; | 241 | this.logicalOperator = "AND"; |
| 261 | }, | 242 | }, |
| 262 | 243 | ||
| @@ -266,7 +247,10 @@ | @@ -266,7 +247,10 @@ | ||
| 266 | 247 | ||
| 267 | setFields : function(fields) { | 248 | setFields : function(fields) { |
| 268 | this.fields = this._copy(fields); | 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 | setFilters : function(filters) { | 256 | setFilters : function(filters) { |
| @@ -283,43 +267,26 @@ | @@ -283,43 +267,26 @@ | ||
| 283 | 267 | ||
| 284 | reset : function() { | 268 | reset : function() { |
| 285 | this.fields = []; | 269 | this.fields = []; |
| 270 | + this.selectedFields = []; | ||
| 286 | this.filters = [{logicalOperator: "AND"}]; | 271 | this.filters = [{logicalOperator: "AND"}]; |
| 287 | }, | 272 | }, |
| 288 | 273 | ||
| 289 | _translate : function() { | 274 | _translate : function() { |
| 290 | - this.$.addFilters.innerHTML = ln["expertAddFilters_" + ln["localization"]]; | ||
| 291 | this.$.filter_field.setAttribute("label", ln["filterField_" + ln["localization"]]); | 275 | this.$.filter_field.setAttribute("label", ln["filterField_" + ln["localization"]]); |
| 292 | this.$.filter_operation.setAttribute("label", ln["filterOperation_" + ln["localization"]]); | 276 | this.$.filter_operation.setAttribute("label", ln["filterOperation_" + ln["localization"]]); |
| 293 | this.$.filter_value.setAttribute("label", ln["filterValue_" + ln["localization"]]); | 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 | _fieldName : function(field) { | 282 | _fieldName : function(field) { |
| 297 | return field.substring(field.lastIndexOf(",")+1, field.length); | 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 | _fire : function() { | 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 | if (this.filters.length > 1) | 290 | if (this.filters.length > 1) |
| 324 | this.fire('filters-controllet_filters', {filters: this.filters}); | 291 | this.fire('filters-controllet_filters', {filters: this.filters}); |
| 325 | else | 292 | else |
| @@ -331,13 +298,8 @@ | @@ -331,13 +298,8 @@ | ||
| 331 | var field = this.$.filter_field.value; | 298 | var field = this.$.filter_field.value; |
| 332 | var id = this.$.filter_operation.selectedItem.id; | 299 | var id = this.$.filter_operation.selectedItem.id; |
| 333 | var operation = this.operations[id]; | 300 | var operation = this.operations[id]; |
| 334 | -// var operation = this.$.filter_operation.value; | ||
| 335 | var value = this.$.filter_value.value; | 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 | this.filters.push({"field": field, "operation": operation, "value": value}); | 303 | this.filters.push({"field": field, "operation": operation, "value": value}); |
| 342 | 304 | ||
| 343 | this.$.filter_field_menu.select(-1); | 305 | this.$.filter_field_menu.select(-1); |
| @@ -353,10 +315,6 @@ | @@ -353,10 +315,6 @@ | ||
| 353 | _deleteFilter : function(e) { | 315 | _deleteFilter : function(e) { |
| 354 | var index = e.model.index; | 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 | this.filters.splice(index, 1); | 318 | this.filters.splice(index, 1); |
| 361 | 319 | ||
| 362 | this._fire(); | 320 | this._fire(); |
| @@ -366,28 +324,8 @@ | @@ -366,28 +324,8 @@ | ||
| 366 | 324 | ||
| 367 | _getOperationlName: function(operation) { | 325 | _getOperationlName: function(operation) { |
| 368 | return ln[operation + "_" + ln["localization"]]; | 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 | _changeLogicalOperator : function() { | 329 | _changeLogicalOperator : function() { |
| 392 | if(this.logicalOperator == "AND") | 330 | if(this.logicalOperator == "AND") |
| 393 | this.logicalOperator = "OR"; | 331 | this.logicalOperator = "OR"; |
| @@ -416,6 +354,20 @@ | @@ -416,6 +354,20 @@ | ||
| 416 | return this.filters[0].logicalOperator; | 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 | _copy : function(o) { | 371 | _copy : function(o) { |
| 420 | var out, v, key; | 372 | var out, v, key; |
| 421 | out = Array.isArray(o) ? [] : {}; | 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 | \ No newline at end of file | 434 | \ No newline at end of file |
controllets/items-vslider-controllet/demo/index.html
| @@ -8,12 +8,19 @@ | @@ -8,12 +8,19 @@ | ||
| 8 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> | 8 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> |
| 9 | <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> | 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 | <link rel="import" href="../items-vslider-controllet.html" /> | 13 | <link rel="import" href="../items-vslider-controllet.html" /> |
| 12 | </head> | 14 | </head> |
| 13 | 15 | ||
| 14 | <body> | 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 | </body> | 25 | </body> |
| 19 | 26 |
controllets/items-vslider-controllet/items-vslider-controllet.html
| @@ -10,13 +10,15 @@ | @@ -10,13 +10,15 @@ | ||
| 10 | 10 | ||
| 11 | <link rel="import" href="../../bower_components/paper-input/paper-input.html"> | 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 | <dom-module id="items-vslider-controllet"> | 15 | <dom-module id="items-vslider-controllet"> |
| 14 | 16 | ||
| 15 | <template> | 17 | <template> |
| 16 | 18 | ||
| 17 | <style is="custom-style"> | 19 | <style is="custom-style"> |
| 18 | paper-icon-button{ | 20 | paper-icon-button{ |
| 19 | - color: #FFFFFF; | 21 | + /*color: #FFFFFF;*/ |
| 20 | height: 32px;/*48*/ | 22 | height: 32px;/*48*/ |
| 21 | width: 32px;/*48*/ | 23 | width: 32px;/*48*/ |
| 22 | padding: 0px; | 24 | padding: 0px; |
| @@ -58,6 +60,20 @@ | @@ -58,6 +60,20 @@ | ||
| 58 | background-color: #FFFFFF; | 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 | img{ | 77 | img{ |
| 62 | width: 100%; | 78 | width: 100%; |
| 63 | } | 79 | } |
| @@ -70,7 +86,8 @@ | @@ -70,7 +86,8 @@ | ||
| 70 | width: 124px; | 86 | width: 124px; |
| 71 | color: #000000; | 87 | color: #000000; |
| 72 | background-color: rgba(158, 158, 158, 0.8);/*9E*/ | 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 | z-index: 1; | 91 | z-index: 1; |
| 75 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | 92 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
| 76 | font-size: 16px; | 93 | font-size: 16px; |
| @@ -79,10 +96,12 @@ | @@ -79,10 +96,12 @@ | ||
| 79 | } | 96 | } |
| 80 | 97 | ||
| 81 | .legend.selected { | 98 | .legend.selected { |
| 82 | - background-color: #2196F3; | ||
| 83 | - /*background-color: rgba(33, 150, 243, 0.8);*/ | ||
| 84 | color: #FFFFFF; | 99 | color: #FFFFFF; |
| 100 | + background-color: #2196F3; | ||
| 101 | + opacity: 0.9; | ||
| 85 | 102 | ||
| 103 | + /*background: black;*/ | ||
| 104 | + /*color: #2196F3;*/ | ||
| 86 | } | 105 | } |
| 87 | 106 | ||
| 88 | #items_vslider_search{ | 107 | #items_vslider_search{ |
| @@ -94,7 +113,7 @@ | @@ -94,7 +113,7 @@ | ||
| 94 | } | 113 | } |
| 95 | 114 | ||
| 96 | .search{ | 115 | .search{ |
| 97 | - color: #FFFFFF | 116 | + /*color: #FFFFFF*/ |
| 98 | } | 117 | } |
| 99 | 118 | ||
| 100 | .clear { | 119 | .clear { |
| @@ -121,7 +140,7 @@ | @@ -121,7 +140,7 @@ | ||
| 121 | 140 | ||
| 122 | <div id="div_datalets_container" class="flex"> | 141 | <div id="div_datalets_container" class="flex"> |
| 123 | <template is="dom-repeat" items="{{filteredDatalets}}"> | 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 | <div class="legend">{{_getChartName(item.imageName)}}</div> | 144 | <div class="legend">{{_getChartName(item.imageName)}}</div> |
| 126 | <div><img src={{item.imageUrl}}></div> | 145 | <div><img src={{item.imageUrl}}></div> |
| 127 | </paper-material> | 146 | </paper-material> |
| @@ -174,6 +193,7 @@ | @@ -174,6 +193,7 @@ | ||
| 174 | value : "", | 193 | value : "", |
| 175 | observer : '_filterDatalets' | 194 | observer : '_filterDatalets' |
| 176 | } | 195 | } |
| 196 | + | ||
| 177 | }, | 197 | }, |
| 178 | 198 | ||
| 179 | listeners: { | 199 | listeners: { |
| @@ -185,15 +205,34 @@ | @@ -185,15 +205,34 @@ | ||
| 185 | }, | 205 | }, |
| 186 | 206 | ||
| 187 | attached : function() { | 207 | attached : function() { |
| 188 | -// if(this.preselectedDatalet){ | 208 | +// if(this.preselectedDatalet) |
| 189 | // this._preselectDatalet(); | 209 | // this._preselectDatalet(); |
| 190 | -// this.preselectedDatalet = undefined; | ||
| 191 | -// } | ||
| 192 | 210 | ||
| 193 | this._translate(); | 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 | if(this.selectedDatalet != undefined && (document.getElementById(this.selectedDatalet) != null)){ | 236 | if(this.selectedDatalet != undefined && (document.getElementById(this.selectedDatalet) != null)){ |
| 198 | var dataletCard = document.getElementById(this.selectedDatalet); | 237 | var dataletCard = document.getElementById(this.selectedDatalet); |
| 199 | dataletCard.elevation = "1"; | 238 | dataletCard.elevation = "1"; |
| @@ -216,27 +255,85 @@ | @@ -216,27 +255,85 @@ | ||
| 216 | _getDatalets : function(e){ | 255 | _getDatalets : function(e){ |
| 217 | var datalets = new Array(); | 256 | var datalets = new Array(); |
| 218 | for(var i=0; i < e.detail.response.length; i++){ | 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 | if(e.detail.response[i].type != "hidden") | 265 | if(e.detail.response[i].type != "hidden") |
| 221 | datalets.push(datalet); | 266 | datalets.push(datalet); |
| 222 | } | 267 | } |
| 223 | 268 | ||
| 224 | this.datalets = datalets; | 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 | _filterDatalets : function(){ | 324 | _filterDatalets : function(){ |
| 229 | var datalets = new Array(); | 325 | var datalets = new Array(); |
| 230 | for(var i=0; i < this.datalets.length; i++){ | 326 | for(var i=0; i < this.datalets.length; i++){ |
| 231 | var datalet = this.datalets[i]; | 327 | var datalet = this.datalets[i]; |
| 232 | var imageName = this._getChartName(datalet.imageName).toLowerCase(); | 328 | var imageName = this._getChartName(datalet.imageName).toLowerCase(); |
| 233 | -// console.log(imageName); | ||
| 234 | -// console.log(this.filter); | ||
| 235 | if(imageName.indexOf(this.filter.toLowerCase()) > -1) | 329 | if(imageName.indexOf(this.filter.toLowerCase()) > -1) |
| 236 | datalets.push(datalet); | 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 | $("#div_datalets_container").animate({ scrollTop: 0}, 0); | 338 | $("#div_datalets_container").animate({ scrollTop: 0}, 0); |
| 242 | }, | 339 | }, |
| @@ -278,32 +375,13 @@ | @@ -278,32 +375,13 @@ | ||
| 278 | this.fire('items-vslider-controllet_selected-datalet', {datalet: this.selectedDatalet}); | 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 | _getImageUrl : function(index){ | 380 | _getImageUrl : function(index){ |
| 302 | return this.datalets[index].imageUrl; | 381 | return this.datalets[index].imageUrl; |
| 303 | }, | 382 | }, |
| 304 | 383 | ||
| 305 | _onPrevClick : function() { | 384 | _onPrevClick : function() { |
| 306 | - | ||
| 307 | var container = $("#div_datalets_container"); | 385 | var container = $("#div_datalets_container"); |
| 308 | var h = container.height(); | 386 | var h = container.height(); |
| 309 | var dataletPerPage = parseInt(h/156); | 387 | var dataletPerPage = parseInt(h/156); |
controllets/page-slider-controllet/page-slider-controllet.html
| @@ -8,6 +8,8 @@ | @@ -8,6 +8,8 @@ | ||
| 8 | <link rel="import" href="../../bower_components/iron-icons/iron-icons.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"> | 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 | <dom-module id="page-slider-controllet"> | 13 | <dom-module id="page-slider-controllet"> |
| 12 | 14 | ||
| 13 | <template> | 15 | <template> |
| @@ -30,6 +32,19 @@ | @@ -30,6 +32,19 @@ | ||
| 30 | color: #B6B6B6; | 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 | .header{ | 48 | .header{ |
| 34 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | 49 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
| 35 | width: 100%; | 50 | width: 100%; |
| @@ -96,6 +111,9 @@ | @@ -96,6 +111,9 @@ | ||
| 96 | </div> | 111 | </div> |
| 97 | </div> | 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 | <neon-animated-pages on-neon-animation-finish="_onNeonAnimationFinish" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> | 117 | <neon-animated-pages on-neon-animation-finish="_onNeonAnimationFinish" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> |
| 100 | <content></content> | 118 | <content></content> |
| 101 | </neon-animated-pages> | 119 | </neon-animated-pages> |
| @@ -160,8 +178,11 @@ | @@ -160,8 +178,11 @@ | ||
| 160 | attached : function() { | 178 | attached : function() { |
| 161 | this.fire('page-slider-controllet_selected', {selected : this.selected}); | 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 | setTitle : function(title, subtitle) { | 188 | setTitle : function(title, subtitle) { |
controllets/search-panel-controllet/search-panel-controllet.html
| @@ -36,6 +36,7 @@ | @@ -36,6 +36,7 @@ | ||
| 36 | <link rel="import" href="../../bower_components/neon-animation/neon-animated-pages.html"> | 36 | <link rel="import" href="../../bower_components/neon-animation/neon-animated-pages.html"> |
| 37 | <link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> | 37 | <link rel="import" href="../../bower_components/neon-animation/neon-animatable.html"> |
| 38 | <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html"> | 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 | `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. | 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,14 +63,19 @@ Example: | ||
| 62 | <style is="custom-style"> | 63 | <style is="custom-style"> |
| 63 | 64 | ||
| 64 | paper-input.search-text{ | 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 | position: absolute; | 69 | position: absolute; |
| 69 | width: 340px; | 70 | width: 340px; |
| 70 | margin-left: -5px; | 71 | margin-left: -5px; |
| 71 | } | 72 | } |
| 72 | 73 | ||
| 74 | + paper-fab#search_button{ | ||
| 75 | + height: 40px; | ||
| 76 | + width: 40px; | ||
| 77 | + } | ||
| 78 | + | ||
| 73 | paper-icon-button | 79 | paper-icon-button |
| 74 | { | 80 | { |
| 75 | } | 81 | } |
| @@ -80,6 +86,10 @@ Example: | @@ -80,6 +86,10 @@ Example: | ||
| 80 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> | 86 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> |
| 81 | </template> | 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 | <neon-animated-pages selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> | 93 | <neon-animated-pages selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> |
| 84 | <neon-animatable></neon-animatable> | 94 | <neon-animatable></neon-animatable> |
| 85 | <neon-animatable> | 95 | <neon-animatable> |
| @@ -91,6 +101,7 @@ Example: | @@ -91,6 +101,7 @@ Example: | ||
| 91 | <template is="dom-if" if="{{rightDirection}}"> | 101 | <template is="dom-if" if="{{rightDirection}}"> |
| 92 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> | 102 | <paper-icon-button id="search_button" icon="search" class="dropdown-trigger" on-click="_toggleClick"></paper-icon-button> |
| 93 | </template> | 103 | </template> |
| 104 | + | ||
| 94 | </div> | 105 | </div> |
| 95 | 106 | ||
| 96 | </template> | 107 | </template> |
| @@ -137,6 +148,10 @@ Example: | @@ -137,6 +148,10 @@ Example: | ||
| 137 | rightDirection: { | 148 | rightDirection: { |
| 138 | type: String, | 149 | type: String, |
| 139 | value: undefined | 150 | value: undefined |
| 151 | + }, | ||
| 152 | + paperfab: { | ||
| 153 | + type: Boolean, | ||
| 154 | + value: false | ||
| 140 | } | 155 | } |
| 141 | }, | 156 | }, |
| 142 | 157 | ||
| @@ -146,7 +161,8 @@ Example: | @@ -146,7 +161,8 @@ Example: | ||
| 146 | this.$.search_text.style.left = '5px'; | 161 | this.$.search_text.style.left = '5px'; |
| 147 | }else if(this.rightDirection != undefined){ | 162 | }else if(this.rightDirection != undefined){ |
| 148 | this.$.search_text.style.right = '5px'; | 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 | _toggleClick: function(e){ | 168 | _toggleClick: function(e){ |
| @@ -170,7 +186,9 @@ Example: | @@ -170,7 +186,9 @@ Example: | ||
| 170 | _valueChanged : function(oldvalue, newValue){ | 186 | _valueChanged : function(oldvalue, newValue){ |
| 171 | var t = this; | 187 | var t = this; |
| 172 | clearTimeout(this.timer); | 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 | * It returns the value in text area | 194 | * It returns the value in text area |
controllets/select-data-controllet/select-data-controllet.html
| @@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
| 2 | 2 | ||
| 3 | <link rel="import" href="../select-fields-controllet/select-fields-controllet.html" /> | 3 | <link rel="import" href="../select-fields-controllet/select-fields-controllet.html" /> |
| 4 | <link rel="import" href="../data-table-controllet/data-table-controllet.html" /> | 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 | <link rel="import" href="../providers-utility-controllet/providers-utility-controllet.html" /> | 7 | <link rel="import" href="../providers-utility-controllet/providers-utility-controllet.html" /> |
| 8 | 8 | ||
| @@ -44,7 +44,7 @@ | @@ -44,7 +44,7 @@ | ||
| 44 | width: 100%; | 44 | width: 100%; |
| 45 | } | 45 | } |
| 46 | 46 | ||
| 47 | - #select_data_controllet_container #filters_container { | 47 | + #select_data_controllet_container #expert_container { |
| 48 | height: 48px; | 48 | height: 48px; |
| 49 | width: 100%; | 49 | width: 100%; |
| 50 | margin-top: 24px; | 50 | margin-top: 24px; |
| @@ -64,8 +64,8 @@ | @@ -64,8 +64,8 @@ | ||
| 64 | <div id="table_container"> | 64 | <div id="table_container"> |
| 65 | <data-table-controllet id="data_table"></data-table-controllet> | 65 | <data-table-controllet id="data_table"></data-table-controllet> |
| 66 | </div> | 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 | </div> | 69 | </div> |
| 70 | </div> | 70 | </div> |
| 71 | </div> | 71 | </div> |
| @@ -83,7 +83,6 @@ | @@ -83,7 +83,6 @@ | ||
| 83 | dataUrl : { | 83 | dataUrl : { |
| 84 | type : String, | 84 | type : String, |
| 85 | value : undefined | 85 | value : undefined |
| 86 | -// observer : '_init' | ||
| 87 | }, | 86 | }, |
| 88 | 87 | ||
| 89 | data : { | 88 | data : { |
| @@ -96,6 +95,11 @@ | @@ -96,6 +95,11 @@ | ||
| 96 | value : [] | 95 | value : [] |
| 97 | }, | 96 | }, |
| 98 | 97 | ||
| 98 | + aggregators : { | ||
| 99 | + type : Array, | ||
| 100 | + value : [] | ||
| 101 | + }, | ||
| 102 | + | ||
| 99 | selectedFields : { | 103 | selectedFields : { |
| 100 | type : Array, | 104 | type : Array, |
| 101 | value : [] | 105 | value : [] |
| @@ -104,13 +108,13 @@ | @@ -104,13 +108,13 @@ | ||
| 104 | }, | 108 | }, |
| 105 | 109 | ||
| 106 | listeners: { | 110 | listeners: { |
| 107 | - 'filters-controllet_show': '_resizeFilters', | 111 | + 'expert-controllet_show': '_resizeExpertWindow', |
| 108 | 'select-fields-controllet_selected-fields': '_updateFields', | 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 | ready : function() { | 117 | ready : function() { |
| 113 | - this.showFilter = false; | ||
| 114 | }, | 118 | }, |
| 115 | 119 | ||
| 116 | attached : function(){ | 120 | attached : function(){ |
| @@ -119,23 +123,47 @@ | @@ -119,23 +123,47 @@ | ||
| 119 | window.addEventListener("resize", function() { that._resize(); }); | 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 | getSelectedFields : function() { | 140 | getSelectedFields : function() { |
| 123 | - return utility_getSelectedFields(this.fields, this.selectedFields);; | 141 | + return this.selectedFields; |
| 124 | }, | 142 | }, |
| 125 | 143 | ||
| 126 | getFilters : function() { | 144 | getFilters : function() { |
| 127 | return this.filters; | 145 | return this.filters; |
| 128 | }, | 146 | }, |
| 129 | 147 | ||
| 148 | + getAggregators : function() { | ||
| 149 | + return this.aggregators; | ||
| 150 | + }, | ||
| 151 | + | ||
| 130 | getData : function() { | 152 | 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(); | 153 | var converter = new DataTypeConverter(); |
| 154 | + | ||
| 155 | + var data = alasql_QUERY(this.data, this.selectedFields, this.filters, null, null); | ||
| 135 | var result = converter.inferJsonDataType(data, ["*"]); | 156 | var result = converter.inferJsonDataType(data, ["*"]); |
| 136 | result = converter.cast(result); | 157 | result = converter.cast(result); |
| 137 | data = result.dataset; | 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 | return data; | 167 | return data; |
| 140 | }, | 168 | }, |
| 141 | 169 | ||
| @@ -147,38 +175,42 @@ | @@ -147,38 +175,42 @@ | ||
| 147 | }, | 175 | }, |
| 148 | 176 | ||
| 149 | setFilters : function(filters) { | 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 | this.$.table_container.style.height = "calc(50% - 12px)"; | 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 | else { | 190 | else { |
| 161 | this.$.table_container.style.height = "calc(100% - 72px)"; | 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 | this.$.data_table._resize(); | 195 | this.$.data_table._resize(); |
| 166 | - | ||
| 167 | - this.showFilter = !this.showFilter; | ||
| 168 | }, | 196 | }, |
| 169 | 197 | ||
| 170 | _updateFields : function(e) { | 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 | _updateFilters : function(e) { | 206 | _updateFilters : function(e) { |
| 178 | this.filters = e.detail.filters; | 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 | init : function() { | 216 | init : function() { |
| @@ -204,7 +236,8 @@ | @@ -204,7 +236,8 @@ | ||
| 204 | that.data = alasql_QUERY(data, that.fields, null, null, null); | 236 | that.data = alasql_QUERY(data, that.fields, null, null, null); |
| 205 | 237 | ||
| 206 | that.$.select_fields.setFields(that.fields); | 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 | that.fire('data-ready', {ready : true}); | 242 | that.fire('data-ready', {ready : true}); |
| 210 | }, | 243 | }, |
| @@ -225,16 +258,18 @@ | @@ -225,16 +258,18 @@ | ||
| 225 | this.data = alasql_QUERY(data, this.fields, null, null, null); | 258 | this.data = alasql_QUERY(data, this.fields, null, null, null); |
| 226 | 259 | ||
| 227 | this.$.select_fields.setFields(this.fields); | 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 | reset : function() { | 266 | reset : function() { |
| 233 | this.filters = []; | 267 | this.filters = []; |
| 268 | + this.aggregators = []; | ||
| 234 | this.selectedFields = []; | 269 | this.selectedFields = []; |
| 235 | this.$.select_fields.reset(); | 270 | this.$.select_fields.reset(); |
| 236 | this.$.data_table.reset(); | 271 | this.$.data_table.reset(); |
| 237 | - this.$.filters.reset(); | 272 | + this.$.expert.reset(); |
| 238 | }, | 273 | }, |
| 239 | 274 | ||
| 240 | _resize : function(){ | 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 | \ No newline at end of file | 251 | \ No newline at end of file |
controllets/select-fields-controllet/select-fields-controllet.html
| @@ -28,6 +28,10 @@ | @@ -28,6 +28,10 @@ | ||
| 28 | cursor: pointer; | 28 | cursor: pointer; |
| 29 | } | 29 | } |
| 30 | 30 | ||
| 31 | + #select_fields_controllet_container #header:hover { | ||
| 32 | + color: #2196F3; | ||
| 33 | + } | ||
| 34 | + | ||
| 31 | #select_fields_controllet_container #menu_container { | 35 | #select_fields_controllet_container #menu_container { |
| 32 | position: relative; | 36 | position: relative; |
| 33 | height: calc(100% - 48px); | 37 | height: calc(100% - 48px); |
| @@ -42,6 +46,14 @@ | @@ -42,6 +46,14 @@ | ||
| 42 | cursor: pointer; | 46 | cursor: pointer; |
| 43 | color: #000000; | 47 | color: #000000; |
| 44 | margin: 4px; | 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 | paper-item.iron-selected { | 59 | paper-item.iron-selected { |
| @@ -73,7 +85,7 @@ | @@ -73,7 +85,7 @@ | ||
| 73 | <div id="menu_container"> | 85 | <div id="menu_container"> |
| 74 | <paper-menu id="menu" multi> | 86 | <paper-menu id="menu" multi> |
| 75 | <template is="dom-repeat" items="{{fields}}"> | 87 | <template is="dom-repeat" items="{{fields}}"> |
| 76 | - <paper-item>{{item}}</paper-item> | 88 | + <paper-item title="{{item}}"><span>{{item}}</span></paper-item> |
| 77 | </template> | 89 | </template> |
| 78 | </paper-menu> | 90 | </paper-menu> |
| 79 | </div> | 91 | </div> |
| @@ -92,12 +104,8 @@ | @@ -92,12 +104,8 @@ | ||
| 92 | fields : { | 104 | fields : { |
| 93 | type : Array, | 105 | type : Array, |
| 94 | value : [] | 106 | value : [] |
| 95 | - }, | 107 | + } |
| 96 | 108 | ||
| 97 | -// preselectedFields : { | ||
| 98 | -// type : Array, | ||
| 99 | -// value : [] | ||
| 100 | -// } | ||
| 101 | }, | 109 | }, |
| 102 | 110 | ||
| 103 | listeners: { | 111 | listeners: { |
| @@ -110,13 +118,13 @@ | @@ -110,13 +118,13 @@ | ||
| 110 | 118 | ||
| 111 | attached : function() { | 119 | attached : function() { |
| 112 | this._translate(); | 120 | this._translate(); |
| 113 | - | ||
| 114 | -// if (this.preselectedFields.length > 0) | ||
| 115 | -// this._preselectFields(); | ||
| 116 | }, | 121 | }, |
| 117 | 122 | ||
| 118 | setFields : function(fields) { | 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 | setSelectFields : function(selectFields) { | 130 | setSelectFields : function(selectFields) { |
| @@ -134,12 +142,6 @@ | @@ -134,12 +142,6 @@ | ||
| 134 | this.$.fields.innerHTML = ln["fields_" + ln["localization"]]; | 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 | _fireSelectedFields : function() { | 145 | _fireSelectedFields : function() { |
| 144 | this.debounce('_fireSelectedFields', function () { | 146 | this.debounce('_fireSelectedFields', function () { |
| 145 | this.fire('select-fields-controllet_selected-fields', {selectedFields: this.$.menu.selectedValues}); | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 168 | \ No newline at end of file |
controllets/select-visualization-controllet/demo/index.html
| @@ -13,6 +13,8 @@ | @@ -13,6 +13,8 @@ | ||
| 13 | <script type="text/javascript" src="../../../alasql-utility/alasql.min.js"></script> | 13 | <script type="text/javascript" src="../../../alasql-utility/alasql.min.js"></script> |
| 14 | <script type="text/javascript" src="../../../alasql-utility/alasql-utility.js"></script> | 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 | <script> | 18 | <script> |
| 17 | ln["localization"] = "en"; | 19 | ln["localization"] = "en"; |
| 18 | </script> | 20 | </script> |
controllets/select-visualization-controllet/select-datalet-inputs.html
| @@ -317,6 +317,18 @@ | @@ -317,6 +317,18 @@ | ||
| 317 | temp.push({name: name + " " +(i-1), description: description, selection: selection}); | 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 | this.inputs = this._copy(temp); | 332 | this.inputs = this._copy(temp); |
| 321 | 333 | ||
| 322 | this.selectedFields = new Array(temp.length); | 334 | this.selectedFields = new Array(temp.length); |
controllets/select-visualization-controllet/select-visualization-controllet.html
| @@ -5,9 +5,10 @@ | @@ -5,9 +5,10 @@ | ||
| 5 | <link rel="import" href="../../bower_components/paper-button/paper-button.html"> | 5 | <link rel="import" href="../../bower_components/paper-button/paper-button.html"> |
| 6 | 6 | ||
| 7 | <link rel="import" href="../items-vslider-controllet/items-vslider-controllet.html" /> | 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 | <script src="../../../DEEPCLIENT/js/deepClient.js"></script> | 13 | <script src="../../../DEEPCLIENT/js/deepClient.js"></script> |
| 13 | 14 | ||
| @@ -18,63 +19,61 @@ | @@ -18,63 +19,61 @@ | ||
| 18 | <style is="custom-style"> | 19 | <style is="custom-style"> |
| 19 | #select_visualization_container { | 20 | #select_visualization_container { |
| 20 | display: flex; | 21 | display: flex; |
| 21 | - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | ||
| 22 | - font-size: 16px; | ||
| 23 | margin-top: 8px; | 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 | position: relative; | 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 | position: relative; | 37 | position: relative; |
| 39 | - margin-left: 32px; | 38 | + width: calc(50% - 12px - 172px - 24px); |
| 40 | min-width: 258px; | 39 | min-width: 258px; |
| 40 | + margin-left: 24px; | ||
| 41 | } | 41 | } |
| 42 | 42 | ||
| 43 | #datalet_preview_container { | 43 | #datalet_preview_container { |
| 44 | position: relative; | 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 | paper-button { | 63 | paper-button { |
| 68 | position: absolute; | 64 | position: absolute; |
| 69 | - bottom: 16px; | ||
| 70 | - right: 11px; | ||
| 71 | - | ||
| 72 | height: 48px; | 65 | height: 48px; |
| 73 | width: 172px; | 66 | width: 172px; |
| 74 | - background-color: #00BCD4; | ||
| 75 | - color: white; | 67 | + padding: 12px; |
| 68 | + background: #00BCD4; | ||
| 69 | + color: #FFFFFF; | ||
| 76 | font-weight: 700; | 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 | paper-button:hover { | 79 | paper-button:hover { |
| @@ -94,36 +93,26 @@ | @@ -94,36 +93,26 @@ | ||
| 94 | 93 | ||
| 95 | <div id="select_visualization_container"> | 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 | </div> | 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 | </div> | 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 | </div> | 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 | </div> | 117 | </div> |
| 129 | 118 | ||
| @@ -147,72 +136,64 @@ | @@ -147,72 +136,64 @@ | ||
| 147 | value : undefined | 136 | value : undefined |
| 148 | }, | 137 | }, |
| 149 | 138 | ||
| 150 | - selectedDatalet : { | 139 | + dataUrl : { |
| 151 | type : String, | 140 | type : String, |
| 152 | value : undefined | 141 | value : undefined |
| 153 | }, | 142 | }, |
| 154 | 143 | ||
| 155 | - preselectedDatalet : { | ||
| 156 | - type : String, | 144 | + data : { |
| 145 | + type : Object, | ||
| 157 | value : undefined | 146 | value : undefined |
| 158 | }, | 147 | }, |
| 159 | 148 | ||
| 160 | - type : { | ||
| 161 | - type : String, | ||
| 162 | - value : "" | ||
| 163 | - }, | ||
| 164 | - | ||
| 165 | - filters : { | 149 | + selectedFields : { |
| 166 | type : Array, | 150 | type : Array, |
| 167 | value : [] | 151 | value : [] |
| 168 | }, | 152 | }, |
| 169 | 153 | ||
| 170 | - fields : { | 154 | + filters : { |
| 171 | type : Array, | 155 | type : Array, |
| 172 | value : [] | 156 | value : [] |
| 173 | }, | 157 | }, |
| 174 | 158 | ||
| 175 | - selectedFields : { | 159 | + aggregators : { |
| 176 | type : Array, | 160 | type : Array, |
| 177 | value : [] | 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 | type : String, | 170 | type : String, |
| 187 | value : undefined | 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 | value : undefined | 181 | value : undefined |
| 198 | }, | 182 | }, |
| 199 | 183 | ||
| 184 | + dataletPreset : { | ||
| 185 | + type : Object, | ||
| 186 | + value : [] | ||
| 187 | + } | ||
| 188 | + | ||
| 200 | }, | 189 | }, |
| 201 | 190 | ||
| 202 | listeners: { | 191 | listeners: { |
| 203 | -// 'select-fields-controllet_selected-fields': '_updateFields', | ||
| 204 | -// 'filters-controllet_filters': '_updateFilters', | ||
| 205 | 'items-vslider-controllet_selected-datalet': '_selectDatalet', | 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 | ready : function() { | 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 | attached : function() { | 199 | attached : function() { |
| @@ -227,34 +208,31 @@ | @@ -227,34 +208,31 @@ | ||
| 227 | this.filters = this._copy(filters); | 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 | setData : function(data) { | 223 | setData : function(data) { |
| 242 | this.data = this._copy(data); | 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 | _translate : function(){ | 238 | _translate : function(){ |
| @@ -262,111 +240,82 @@ | @@ -262,111 +240,82 @@ | ||
| 262 | this.$.add_button.innerHTML = ln["modifyDatalet_" + ln["localization"]]; | 240 | this.$.add_button.innerHTML = ln["modifyDatalet_" + ln["localization"]]; |
| 263 | else | 241 | else |
| 264 | this.$.add_button.innerHTML = ln["addDatalet_" + ln["localization"]]; | 242 | this.$.add_button.innerHTML = ln["addDatalet_" + ln["localization"]]; |
| 265 | - | ||
| 266 | - this.$.dataletPreview.innerHTML = ln["dataletPreview_" + ln["localization"]]; | ||
| 267 | }, | 243 | }, |
| 268 | 244 | ||
| 269 | _selectDatalet : function(e){ | 245 | _selectDatalet : function(e){ |
| 270 | - | ||
| 271 | - this.$.add_button.setAttribute("disabled", "true"); | ||
| 272 | - | ||
| 273 | this.selectedDatalet = e.detail.datalet; | 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 | this.$.selectedDatalet_request.url = this.deepUrl + e.detail.datalet + "-datalet"; | 253 | this.$.selectedDatalet_request.url = this.deepUrl + e.detail.datalet + "-datalet"; |
| 283 | this.$.selectedDatalet_request.generateRequest(); | 254 | this.$.selectedDatalet_request.generateRequest(); |
| 284 | } | 255 | } |
| 256 | + else { | ||
| 257 | + this.dataletType = undefined; | ||
| 258 | + this.$.inputs._reset(); | ||
| 259 | + } | ||
| 285 | }, | 260 | }, |
| 286 | 261 | ||
| 287 | _handleSelectedDatalet : function(e){ | 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 | else { | 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 | _loadDatalet : function(e){ | 284 | _loadDatalet : function(e){ |
| 336 | if(!e.detail.isReady) { | 285 | if(!e.detail.isReady) { |
| 337 | - this.$.datalet_selection_datalet_placeholder.innerHTML = ""; | 286 | + this.$.preview.eraseDatalet(); |
| 338 | return; | 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 | this.params["filters"] = JSON.stringify(this.filters); | 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 | this.params["export_menu"] = "0"; | 299 | this.params["export_menu"] = "0"; |
| 357 | 300 | ||
| 358 | - var params = this.$.options.getParams(); | 301 | + var params = this.$.inputs.getSelectedOptions(); |
| 359 | for (var key in params) { this.params[key] = params[key]; } | 302 | for (var key in params) { this.params[key] = params[key]; } |
| 360 | 303 | ||
| 361 | //use cache | 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 | var converter = new DataTypeConverter(); | 311 | var converter = new DataTypeConverter(); |
| 312 | + | ||
| 313 | + var data = alasql_QUERY(this.data, fields, null, null, this.$.inputs.getOrders()); | ||
| 365 | var result = converter.inferJsonDataType(data, ["*"]); | 314 | var result = converter.inferJsonDataType(data, ["*"]); |
| 366 | result = converter.cast(result); | 315 | result = converter.cast(result); |
| 367 | data = result.dataset; | 316 | data = result.dataset; |
| 368 | 317 | ||
| 369 | - data = alasql_transformData(data, this.selectedFields, true); | 318 | + data = alasql_transformData(data, fields, true); |
| 370 | 319 | ||
| 371 | this.params["data"] = JSON.stringify(data).replace(/'/g, "'"); | 320 | this.params["data"] = JSON.stringify(data).replace(/'/g, "'"); |
| 372 | // | 321 | // |
| @@ -374,45 +323,35 @@ | @@ -374,45 +323,35 @@ | ||
| 374 | var dataletParams ={ | 323 | var dataletParams ={ |
| 375 | component: this.selectedDatalet+"-datalet", | 324 | component: this.selectedDatalet+"-datalet", |
| 376 | fields: this.selectedFields, | 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 | this.$.add_button.removeAttribute("disabled"); | 335 | this.$.add_button.removeAttribute("disabled"); |
| 385 | }, | 336 | }, |
| 386 | 337 | ||
| 387 | _addDatalet : function(){ | 338 | _addDatalet : function(){ |
| 388 | - delete this.params["export_menu"]; | 339 | + var staticData = this.params["data"]; |
| 340 | + | ||
| 389 | delete this.params["data"]; | 341 | delete this.params["data"]; |
| 342 | + delete this.params["export_menu"]; | ||
| 390 | 343 | ||
| 391 | var data = { | 344 | var data = { |
| 392 | dataUrl: this.dataUrl, | 345 | dataUrl: this.dataUrl, |
| 393 | datalet: this.selectedDatalet+"-datalet", | 346 | datalet: this.selectedDatalet+"-datalet", |
| 394 | fields: this.selectedFields, | 347 | fields: this.selectedFields, |
| 395 | params: this.params, | 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 | this.fire('data-sevc-controllet.dataletCreated', {data : data}); | 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 | _copy : function(o) { | 355 | _copy : function(o) { |
| 417 | var out, v, key; | 356 | var out, v, key; |
| 418 | out = Array.isArray(o) ? new Array(o.length) : {}; | 357 | out = Array.isArray(o) ? new Array(o.length) : {}; |
| @@ -427,11 +366,9 @@ | @@ -427,11 +366,9 @@ | ||
| 427 | var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; | 366 | var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; |
| 428 | h = h - 64 - 8; //height with page scroller | 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 | \ No newline at end of file | 442 | \ No newline at end of file |
datalets/areachart-datalet/areachart-datalet.html
| @@ -71,7 +71,7 @@ Example: | @@ -71,7 +71,7 @@ Example: | ||
| 71 | text: this._component.title | 71 | text: this._component.title |
| 72 | }, | 72 | }, |
| 73 | xAxis: { | 73 | xAxis: { |
| 74 | - categories: this.properties.categories.value,//this._component.categories, | 74 | + categories: this.properties.categories.value, |
| 75 | title: { | 75 | title: { |
| 76 | text: this._component.xAxisLabel | 76 | text: this._component.xAxisLabel |
| 77 | } | 77 | } |
| @@ -86,7 +86,13 @@ Example: | @@ -86,7 +86,13 @@ Example: | ||
| 86 | valueSuffix: ' ' + this._component.suffix | 86 | valueSuffix: ' ' + this._component.suffix |
| 87 | }, | 87 | }, |
| 88 | plotOptions: { | 88 | plotOptions: { |
| 89 | + series: { | ||
| 90 | + stacking: this._component.stack | ||
| 91 | + }, | ||
| 89 | area: { | 92 | area: { |
| 93 | + dataLabels: { | ||
| 94 | + enabled: this._component.dataLabels | ||
| 95 | + }, | ||
| 90 | marker: { | 96 | marker: { |
| 91 | enabled: false, | 97 | enabled: false, |
| 92 | symbol: 'circle', | 98 | symbol: 'circle', |
| @@ -99,17 +105,6 @@ Example: | @@ -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 | credits: { | 108 | credits: { |
| 114 | enabled: false | 109 | enabled: false |
| 115 | }, | 110 | }, |
| @@ -119,6 +114,27 @@ Example: | @@ -119,6 +114,27 @@ Example: | ||
| 119 | if(this._component.theme != "themeBase" && this._component.theme != "") | 114 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 120 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 138 | $(this._component.$.charts.$.container).highcharts(options); |
| 123 | } | 139 | } |
| 124 | }; | 140 | }; |
| @@ -132,50 +148,34 @@ Example: | @@ -132,50 +148,34 @@ Example: | ||
| 132 | type: Array, | 148 | type: Array, |
| 133 | value: undefined | 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 | xAxisLabel: { | 151 | xAxisLabel: { |
| 143 | type: String, | 152 | type: String, |
| 144 | value: "" | 153 | value: "" |
| 145 | }, | 154 | }, |
| 146 | - /** | ||
| 147 | - * It's the label for Y axis | ||
| 148 | - * | ||
| 149 | - * @attribute yAxisLabel | ||
| 150 | - * @type String | ||
| 151 | - * @default '' | ||
| 152 | - */ | ||
| 153 | yAxisLabel: { | 155 | yAxisLabel: { |
| 154 | type: String, | 156 | type: String, |
| 155 | value: "" | 157 | value: "" |
| 156 | }, | 158 | }, |
| 157 | - /** | ||
| 158 | - * It's the values suffix | ||
| 159 | - * | ||
| 160 | - * @attribute suffix | ||
| 161 | - * @type Strig | ||
| 162 | - * @default 'units' | ||
| 163 | - */ | ||
| 164 | suffix : { | 159 | suffix : { |
| 165 | type : String, | 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 | theme : { | 175 | theme : { |
| 169 | type : String, | 176 | type : String, |
| 170 | value : "" | 177 | value : "" |
| 171 | }, | 178 | }, |
| 172 | - /** | ||
| 173 | - * It's the component behavior | ||
| 174 | - * | ||
| 175 | - * @attribute behavior | ||
| 176 | - * @type Object | ||
| 177 | - * @default {} | ||
| 178 | - */ | ||
| 179 | behavior : { | 179 | behavior : { |
| 180 | type : Object, | 180 | type : Object, |
| 181 | value : {} | 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,21 +88,13 @@ Example: | ||
| 88 | plotOptions: { | 88 | plotOptions: { |
| 89 | bar: { | 89 | bar: { |
| 90 | dataLabels: { | 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 | credits: { | 98 | credits: { |
| 107 | enabled: false | 99 | enabled: false |
| 108 | }, | 100 | }, |
| @@ -112,6 +104,27 @@ Example: | @@ -112,6 +104,27 @@ Example: | ||
| 112 | if(this._component.theme != "themeBase" && this._component.theme != "") | 104 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 113 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 128 | $(this._component.$.charts.$.container).highcharts(options); |
| 116 | } | 129 | } |
| 117 | }; | 130 | }; |
| @@ -136,6 +149,18 @@ Example: | @@ -136,6 +149,18 @@ Example: | ||
| 136 | type : String, | 149 | type : String, |
| 137 | value : "" | 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 | theme : { | 164 | theme : { |
| 140 | type : String, | 165 | type : String, |
| 141 | value : "" | 166 | value : "" |
datalets/base-ajax-json-alasql-datalet/static/js/AjaxJsonAlasqlBehavior.js
| @@ -95,12 +95,21 @@ var AjaxJsonAlasqlBehavior = { | @@ -95,12 +95,21 @@ var AjaxJsonAlasqlBehavior = { | ||
| 95 | }, | 95 | }, |
| 96 | 96 | ||
| 97 | filterData : function() { | 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 | var filters = JSON.parse(this._component.getAttribute("filters")); | 99 | var filters = JSON.parse(this._component.getAttribute("filters")); |
| 101 | var aggregators = JSON.parse(this._component.getAttribute("aggregators")); | 100 | var aggregators = JSON.parse(this._component.getAttribute("aggregators")); |
| 102 | var orders = JSON.parse(this._component.getAttribute("orders")); | 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 | //preview my space ? | 113 | //preview my space ? |
| 105 | if(filters && filters[0] && filters[0].constructor == Array){ | 114 | if(filters && filters[0] && filters[0].constructor == Array){ |
| 106 | filters = filters[0]; | 115 | filters = filters[0]; |
| @@ -109,14 +118,22 @@ var AjaxJsonAlasqlBehavior = { | @@ -109,14 +118,22 @@ var AjaxJsonAlasqlBehavior = { | ||
| 109 | } | 118 | } |
| 110 | 119 | ||
| 111 | var converter = new DataTypeConverter(); | 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 | if(aggregators && aggregators.length) { | 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 | result = converter.inferJsonDataType(data, ["*"]); | 137 | result = converter.inferJsonDataType(data, ["*"]); |
| 121 | result = converter.cast(result); | 138 | result = converter.cast(result); |
| 122 | data = result.dataset; | 139 | data = result.dataset; |
| @@ -125,16 +142,4 @@ var AjaxJsonAlasqlBehavior = { | @@ -125,16 +142,4 @@ var AjaxJsonAlasqlBehavior = { | ||
| 125 | this.data = alasql_transformData(data, fields, true); | 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 | \ No newline at end of file | 146 | \ No newline at end of file |
datalets/base-datalet/base-datalet.html
datalets/base-datalet/static/js/BaseDataletBehavior.js
| @@ -42,8 +42,7 @@ var BaseDataletBehavior ={ | @@ -42,8 +42,7 @@ var BaseDataletBehavior ={ | ||
| 42 | // type: Array, | 42 | // type: Array, |
| 43 | // value: [] | 43 | // value: [] |
| 44 | //}, | 44 | //}, |
| 45 | - | ||
| 46 | - //fields: { | 45 | + //fields: { //inputs filters aggregators orders |
| 47 | // type: String, | 46 | // type: String, |
| 48 | // value: "" | 47 | // value: "" |
| 49 | //}, | 48 | //}, |
datalets/bubblechart-datalet/bubblechart-datalet.html
| @@ -93,7 +93,7 @@ Examples: | @@ -93,7 +93,7 @@ Examples: | ||
| 93 | } | 93 | } |
| 94 | 94 | ||
| 95 | this.properties.series = bubbleSeries; | 95 | this.properties.series = bubbleSeries; |
| 96 | - this._component.legend = true; | 96 | +// this._component.legend = true; |
| 97 | } | 97 | } |
| 98 | else {// == 4 | 98 | else {// == 4 |
| 99 | var bubbleSeries = []; | 99 | var bubbleSeries = []; |
| @@ -108,7 +108,7 @@ Examples: | @@ -108,7 +108,7 @@ Examples: | ||
| 108 | bubbleSeries.push({data: series}); | 108 | bubbleSeries.push({data: series}); |
| 109 | 109 | ||
| 110 | this.properties.series = bubbleSeries; | 110 | this.properties.series = bubbleSeries; |
| 111 | - this._component.legend = false; | 111 | +// this._component.legend = false; |
| 112 | } | 112 | } |
| 113 | 113 | ||
| 114 | options = { | 114 | options = { |
| @@ -120,9 +120,6 @@ Examples: | @@ -120,9 +120,6 @@ Examples: | ||
| 120 | title: { | 120 | title: { |
| 121 | text: this._component.title | 121 | text: this._component.title |
| 122 | }, | 122 | }, |
| 123 | -// subtitle: { | ||
| 124 | -// text: this._component.description | ||
| 125 | -// }, | ||
| 126 | xAxis: { | 123 | xAxis: { |
| 127 | title: { | 124 | title: { |
| 128 | text: this._component.xAxisLabel | 125 | text: this._component.xAxisLabel |
| @@ -133,10 +130,12 @@ Examples: | @@ -133,10 +130,12 @@ Examples: | ||
| 133 | text: this._component.yAxisLabel, | 130 | text: this._component.yAxisLabel, |
| 134 | } | 131 | } |
| 135 | }, | 132 | }, |
| 136 | - legend: { | ||
| 137 | - enabled: this._component.legend, | ||
| 138 | - }, | ||
| 139 | plotOptions: { | 133 | plotOptions: { |
| 134 | + bubble: { | ||
| 135 | + dataLabels: { | ||
| 136 | + enabled: this._component.dataLabels | ||
| 137 | + } | ||
| 138 | + }, | ||
| 140 | series: { | 139 | series: { |
| 141 | dataLabels: { | 140 | dataLabels: { |
| 142 | enabled: true, | 141 | enabled: true, |
| @@ -153,6 +152,27 @@ Examples: | @@ -153,6 +152,27 @@ Examples: | ||
| 153 | if(this._component.theme != "themeBase" && this._component.theme != "") | 152 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 154 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 176 | $(this._component.$.charts.$.container).highcharts(options); |
| 157 | } | 177 | } |
| 158 | }; | 178 | }; |
| @@ -178,6 +198,10 @@ Examples: | @@ -178,6 +198,10 @@ Examples: | ||
| 178 | type : String, | 198 | type : String, |
| 179 | value : "" | 199 | value : "" |
| 180 | }, | 200 | }, |
| 201 | + legend : { | ||
| 202 | + type : Object, | ||
| 203 | + value : "topRight" | ||
| 204 | + }, | ||
| 181 | behavior : { | 205 | behavior : { |
| 182 | type : Object, | 206 | type : Object, |
| 183 | value : {} | 207 | value : {} |
datalets/columnchart-datalet/columnchart-datalet.html
| @@ -66,7 +66,7 @@ Example: | @@ -66,7 +66,7 @@ Example: | ||
| 66 | options = { | 66 | options = { |
| 67 | chart: { | 67 | chart: { |
| 68 | type: 'column', | 68 | type: 'column', |
| 69 | - zoomType: 'xy', | 69 | + zoomType: 'xy' |
| 70 | }, | 70 | }, |
| 71 | title: { | 71 | title: { |
| 72 | text: this._component.title | 72 | text: this._component.title |
| @@ -75,8 +75,7 @@ Example: | @@ -75,8 +75,7 @@ Example: | ||
| 75 | categories: this.properties.categories.value, | 75 | categories: this.properties.categories.value, |
| 76 | title: { | 76 | title: { |
| 77 | text: this._component.xAxisLabel | 77 | text: this._component.xAxisLabel |
| 78 | - }, | ||
| 79 | -// crosshair: true | 78 | + } |
| 80 | }, | 79 | }, |
| 81 | yAxis: { | 80 | yAxis: { |
| 82 | min: 0, | 81 | min: 0, |
| @@ -84,41 +83,19 @@ Example: | @@ -84,41 +83,19 @@ Example: | ||
| 84 | text: this._component.yAxisLabel, | 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 | tooltip: { | 86 | tooltip: { |
| 102 | valueSuffix: ' ' + this._component.suffix | 87 | valueSuffix: ' ' + this._component.suffix |
| 103 | }, | 88 | }, |
| 104 | plotOptions: { | 89 | plotOptions: { |
| 105 | column: { | 90 | column: { |
| 106 | dataLabels: { | 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 | credits: { | 99 | credits: { |
| 123 | enabled: false | 100 | enabled: false |
| 124 | }, | 101 | }, |
| @@ -128,6 +105,27 @@ Example: | @@ -128,6 +105,27 @@ Example: | ||
| 128 | if(this._component.theme != "themeBase" && this._component.theme != "") | 105 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 129 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 129 | $(this._component.$.charts.$.container).highcharts(options); |
| 132 | } | 130 | } |
| 133 | }; | 131 | }; |
| @@ -140,51 +138,34 @@ Example: | @@ -140,51 +138,34 @@ Example: | ||
| 140 | type: Array, | 138 | type: Array, |
| 141 | value: undefined | 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 | xAxisLabel: { | 141 | xAxisLabel: { |
| 151 | type: String, | 142 | type: String, |
| 152 | value: "" | 143 | value: "" |
| 153 | }, | 144 | }, |
| 154 | - /** | ||
| 155 | - * It's the label for Y axis | ||
| 156 | - * | ||
| 157 | - * @attribute yAxisLabel | ||
| 158 | - * @type String | ||
| 159 | - * @default '' | ||
| 160 | - */ | ||
| 161 | yAxisLabel: { | 145 | yAxisLabel: { |
| 162 | type: String, | 146 | type: String, |
| 163 | value: "" | 147 | value: "" |
| 164 | }, | 148 | }, |
| 165 | - /** | ||
| 166 | - * It's the values suffix | ||
| 167 | - * | ||
| 168 | - * @attribute suffix | ||
| 169 | - * @type Strig | ||
| 170 | - * @default 'units' | ||
| 171 | - */ | ||
| 172 | suffix : { | 149 | suffix : { |
| 173 | type : String, | 150 | type : String, |
| 174 | value : "" | 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 | theme : { | 165 | theme : { |
| 178 | type : String, | 166 | type : String, |
| 179 | value : "" | 167 | value : "" |
| 180 | }, | 168 | }, |
| 181 | - /** | ||
| 182 | - * It's the component behavior | ||
| 183 | - * | ||
| 184 | - * @attribute behavior | ||
| 185 | - * @type Object | ||
| 186 | - * @default {} | ||
| 187 | - */ | ||
| 188 | behavior : { | 169 | behavior : { |
| 189 | type : Object, | 170 | type : Object, |
| 190 | value : {} | 171 | value : {} |
datalets/graph-datalet/demo/demo-clustering-2.html
| @@ -3,32 +3,44 @@ | @@ -3,32 +3,44 @@ | ||
| 3 | <head> | 3 | <head> |
| 4 | <meta charset="UTF-8"> | 4 | <meta charset="UTF-8"> |
| 5 | <title>Demo Graph with node clustering</title> | 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 | <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> | 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 | loadDoc(); | 32 | loadDoc(); |
| 33 | + }); | ||
| 22 | 34 | ||
| 23 | - </script> | ||
| 24 | -</head> | 35 | + loadDoc(); |
| 36 | + | ||
| 37 | +</script> | ||
| 25 | <body> | 38 | <body> |
| 26 | <h1>Graph with clustering</h1> | 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 | </body> | 45 | </body> |
| 34 | </html> | 46 | </html> |
| 35 | \ No newline at end of file | 47 | \ No newline at end of file |
datalets/graph-datalet/demo/demo-clustering.html
| @@ -4,21 +4,33 @@ | @@ -4,21 +4,33 @@ | ||
| 4 | <meta charset="UTF-8"> | 4 | <meta charset="UTF-8"> |
| 5 | <title>Demo Graph with node clustering</title> | 5 | <title>Demo Graph with node clustering</title> |
| 6 | <link rel="import" href="../graph-with-clustering-extend-datalet.html"> | 6 | <link rel="import" href="../graph-with-clustering-extend-datalet.html"> |
| 7 | + <link rel="import" href="../graph-datalet.html"> | ||
| 7 | <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> | 8 | <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> |
| 8 | </head> | 9 | </head> |
| 9 | <script> | 10 | <script> |
| 10 | function loadDoc() { | 11 | function loadDoc() { |
| 12 | + debugger; | ||
| 11 | var xhttp = new XMLHttpRequest(); | 13 | var xhttp = new XMLHttpRequest(); |
| 12 | xhttp.onreadystatechange = function() { | 14 | xhttp.onreadystatechange = function() { |
| 13 | if (xhttp.readyState == 4 && xhttp.status == 200) { | 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 | xhttp.send(); | 27 | xhttp.send(); |
| 20 | } | 28 | } |
| 21 | 29 | ||
| 30 | + $(document).ready(function(){ | ||
| 31 | + loadDoc(); | ||
| 32 | + }); | ||
| 33 | + | ||
| 22 | loadDoc(); | 34 | loadDoc(); |
| 23 | 35 | ||
| 24 | </script> | 36 | </script> |
| @@ -27,7 +39,7 @@ | @@ -27,7 +39,7 @@ | ||
| 27 | <!-- | 39 | <!-- |
| 28 | 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}]}' | 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 | </body> | 44 | </body> |
| 33 | </html> | 45 | </html> |
| 34 | \ No newline at end of file | 46 | \ No newline at end of file |
datalets/graph-datalet/graph-datalet.html
| @@ -288,7 +288,7 @@ Example: | @@ -288,7 +288,7 @@ Example: | ||
| 288 | _this.gnodes.attr("cx", function (t) { | 288 | _this.gnodes.attr("cx", function (t) { |
| 289 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) | 289 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) |
| 290 | }).attr("cy", function (t) { | 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 | _this.glinks.attr("x1", function (t) { | 294 | _this.glinks.attr("x1", function (t) { |
datalets/graph-datalet/graph-with-clustering-datalet.html
| @@ -463,7 +463,7 @@ Example: | @@ -463,7 +463,7 @@ Example: | ||
| 463 | _this.svgNodes.attr("cx", function (t) { | 463 | _this.svgNodes.attr("cx", function (t) { |
| 464 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) | 464 | return t.x = Math.max(25, Math.min(_this.width - 50, t.x)) |
| 465 | }).attr("cy", function (t) { | 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 | _this.svgLinks.attr("x1", function (t) { | 469 | _this.svgLinks.attr("x1", function (t) { |
datalets/heatmap-datalet/heatmap-datalet.html
| @@ -76,47 +76,35 @@ Example: | @@ -76,47 +76,35 @@ Example: | ||
| 76 | options = { | 76 | options = { |
| 77 | chart: { | 77 | chart: { |
| 78 | type: 'heatmap', | 78 | type: 'heatmap', |
| 79 | - marginTop: 40, | 79 | + zoomType: 'xy', |
| 80 | +// marginTop: 40, | ||
| 80 | // marginBottom: 80, | 81 | // marginBottom: 80, |
| 81 | plotBorderWidth: 1 | 82 | plotBorderWidth: 1 |
| 82 | }, | 83 | }, |
| 83 | - | ||
| 84 | title: { | 84 | title: { |
| 85 | text: this._component.title | 85 | text: this._component.title |
| 86 | }, | 86 | }, |
| 87 | - | ||
| 88 | xAxis: { | 87 | xAxis: { |
| 89 | categories: Xcategories, | 88 | categories: Xcategories, |
| 90 | title: { | 89 | title: { |
| 91 | text: this._component.xAxisLabel | 90 | text: this._component.xAxisLabel |
| 92 | } | 91 | } |
| 93 | }, | 92 | }, |
| 94 | - | ||
| 95 | yAxis: { | 93 | yAxis: { |
| 96 | categories: Ycategories, | 94 | categories: Ycategories, |
| 97 | title: { | 95 | title: { |
| 98 | text: this._component.yAxisLabel | 96 | text: this._component.yAxisLabel |
| 99 | } | 97 | } |
| 100 | }, | 98 | }, |
| 101 | - | 99 | + tooltip: { |
| 100 | + valueSuffix: ' ' + this._component.suffix | ||
| 101 | + }, | ||
| 102 | colorAxis: { | 102 | colorAxis: { |
| 103 | min: 0, | 103 | min: 0, |
| 104 | minColor: '#FFFFFF', | 104 | minColor: '#FFFFFF', |
| 105 | maxColor: Highcharts.getOptions().colors[0] | 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 | credits: { | 108 | credits: { |
| 121 | enabled: false | 109 | enabled: false |
| 122 | }, | 110 | }, |
| @@ -124,15 +112,36 @@ Example: | @@ -124,15 +112,36 @@ Example: | ||
| 124 | borderWidth: 1, | 112 | borderWidth: 1, |
| 125 | data: series, | 113 | data: series, |
| 126 | dataLabels: { | 114 | dataLabels: { |
| 127 | - enabled: true, | 115 | + enabled: this._component.dataLabels, |
| 128 | color: '#000000' | 116 | color: '#000000' |
| 129 | - } | 117 | + }, |
| 130 | }] | 118 | }] |
| 131 | }; | 119 | }; |
| 132 | 120 | ||
| 133 | if(this._component.theme != "themeBase" && this._component.theme != "") | 121 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 134 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 145 | $(this._component.$.charts.$.container).highcharts(options); |
| 137 | } | 146 | } |
| 138 | }; | 147 | }; |
| @@ -146,50 +155,34 @@ Example: | @@ -146,50 +155,34 @@ Example: | ||
| 146 | type: Array, | 155 | type: Array, |
| 147 | value: undefined | 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 | xAxisLabel: { | 158 | xAxisLabel: { |
| 157 | type: String, | 159 | type: String, |
| 158 | value: "" | 160 | value: "" |
| 159 | }, | 161 | }, |
| 160 | - /** | ||
| 161 | - * It's the label for Y axis | ||
| 162 | - * | ||
| 163 | - * @attribute yAxisLabel | ||
| 164 | - * @type String | ||
| 165 | - * @default '' | ||
| 166 | - */ | ||
| 167 | yAxisLabel: { | 162 | yAxisLabel: { |
| 168 | type: String, | 163 | type: String, |
| 169 | value: "" | 164 | value: "" |
| 170 | }, | 165 | }, |
| 171 | - /** | ||
| 172 | - * It's the values suffix | ||
| 173 | - * | ||
| 174 | - * @attribute suffix | ||
| 175 | - * @type String | ||
| 176 | - * @default 'units' | ||
| 177 | - */ | ||
| 178 | suffix : { | 166 | suffix : { |
| 179 | type : String, | 167 | type : String, |
| 180 | value : "" | 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 | theme : { | 182 | theme : { |
| 183 | type : String, | 183 | type : String, |
| 184 | value : "" | 184 | value : "" |
| 185 | }, | 185 | }, |
| 186 | - /** | ||
| 187 | - * It's the component behavior | ||
| 188 | - * | ||
| 189 | - * @attribute behavior | ||
| 190 | - * @type Object | ||
| 191 | - * @default {} | ||
| 192 | - */ | ||
| 193 | behavior : { | 186 | behavior : { |
| 194 | type : Object, | 187 | type : Object, |
| 195 | value : {} | 188 | value : {} |
datalets/highcharts-datalet/highcharts-datalet.html
| @@ -79,31 +79,41 @@ Example : | @@ -79,31 +79,41 @@ Example : | ||
| 79 | }, | 79 | }, |
| 80 | 80 | ||
| 81 | transformData: function () { | 81 | transformData: function () { |
| 82 | - var selectedFields = JSON.parse(this._component.getAttribute("selectedFields")); | ||
| 83 | - | ||
| 84 | if(this.data.length == 0) | 82 | if(this.data.length == 0) |
| 85 | return; | 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 | var x = this.data[0]["data"]; | 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 | var categories = x.filter(function(item, pos) { | 110 | var categories = x.filter(function(item, pos) { |
| 101 | return x.indexOf(item) == pos; | 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 | var series = []; | 118 | var series = []; |
| 109 | for(var i = 0; i < s.length; i++) { | 119 | for(var i = 0; i < s.length; i++) { |
| @@ -113,7 +123,7 @@ Example : | @@ -113,7 +123,7 @@ Example : | ||
| 113 | for(var i = 0; i < y.length; i++){ | 123 | for(var i = 0; i < y.length; i++){ |
| 114 | var index = categories.indexOf(x[i]); | 124 | var index = categories.indexOf(x[i]); |
| 115 | var s = series.filter(function( obj ) { | 125 | var s = series.filter(function( obj ) { |
| 116 | - return obj.name == gb[i]; | 126 | + return obj.name == cat[i]; |
| 117 | }); | 127 | }); |
| 118 | s[0]["data"][index] = y[i]; | 128 | s[0]["data"][index] = y[i]; |
| 119 | } | 129 | } |
| @@ -121,7 +131,6 @@ Example : | @@ -121,7 +131,6 @@ Example : | ||
| 121 | this.properties.categories.value = categories; | 131 | this.properties.categories.value = categories; |
| 122 | this.properties.series.value = series; | 132 | this.properties.series.value = series; |
| 123 | } | 133 | } |
| 124 | - | ||
| 125 | }, | 134 | }, |
| 126 | 135 | ||
| 127 | redraw: function () { | 136 | redraw: function () { |
datalets/leafletjs-datalet/leafletjs-datalet.html
| @@ -99,6 +99,14 @@ Example: | @@ -99,6 +99,14 @@ Example: | ||
| 99 | if(!isNaN(t.data[0].data[i][0]) && !isNaN(t.data[0].data[i][1])) | 99 | if(!isNaN(t.data[0].data[i][0]) && !isNaN(t.data[0].data[i][1])) |
| 100 | coordinates.push([parseFloat(t.data[0].data[i][0]), parseFloat(t.data[0].data[i][1])]); | 100 | coordinates.push([parseFloat(t.data[0].data[i][0]), parseFloat(t.data[0].data[i][1])]); |
| 101 | else | 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 | continue; | 110 | continue; |
| 103 | } | 111 | } |
| 104 | else | 112 | else |
| @@ -206,5 +214,4 @@ Example: | @@ -206,5 +214,4 @@ Example: | ||
| 206 | } | 214 | } |
| 207 | }); | 215 | }); |
| 208 | </script> | 216 | </script> |
| 209 | -</dom-module> | ||
| 210 | - | 217 | +</dom-module> |
| 211 | \ No newline at end of file | 218 | \ No newline at end of file |
datalets/leafletjs-geojson-datalet/leafletjs-geojson-datalet.html
| @@ -93,6 +93,11 @@ Example: | @@ -93,6 +93,11 @@ Example: | ||
| 93 | 93 | ||
| 94 | for (var i = 0; i < t.data[0].data.length; i++) | 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 | var geoJsonLayer = L.geoJson(t.data[0].data[i]).addTo(t._component.map); | 101 | var geoJsonLayer = L.geoJson(t.data[0].data[i]).addTo(t._component.map); |
| 97 | 102 | ||
| 98 | if(t.data.length > 1) | 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,7 +70,7 @@ Example: | ||
| 70 | text: this._component.title | 70 | text: this._component.title |
| 71 | }, | 71 | }, |
| 72 | xAxis: { | 72 | xAxis: { |
| 73 | - categories: this.properties.categories.value,//this._component.categories, | 73 | + categories: this.properties.categories.value, |
| 74 | title: { | 74 | title: { |
| 75 | text: this._component.xAxisLabel | 75 | text: this._component.xAxisLabel |
| 76 | } | 76 | } |
| @@ -84,16 +84,15 @@ Example: | @@ -84,16 +84,15 @@ Example: | ||
| 84 | tooltip: { | 84 | tooltip: { |
| 85 | valueSuffix: ' ' + this._component.suffix | 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 | credits: { | 97 | credits: { |
| 99 | enabled: false | 98 | enabled: false |
| @@ -104,6 +103,27 @@ Example: | @@ -104,6 +103,27 @@ Example: | ||
| 104 | if(this._component.theme != "themeBase" && this._component.theme != "") | 103 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 105 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 127 | $(this._component.$.charts.$.container).highcharts(options); |
| 108 | } | 128 | } |
| 109 | }; | 129 | }; |
| @@ -117,50 +137,34 @@ Example: | @@ -117,50 +137,34 @@ Example: | ||
| 117 | type: Array, | 137 | type: Array, |
| 118 | value: undefined | 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 | xAxisLabel: { | 140 | xAxisLabel: { |
| 128 | type: String, | 141 | type: String, |
| 129 | value: "" | 142 | value: "" |
| 130 | }, | 143 | }, |
| 131 | - /** | ||
| 132 | - * It's the label for Y axis | ||
| 133 | - * | ||
| 134 | - * @attribute yAxisLabel | ||
| 135 | - * @type String | ||
| 136 | - * @default '' | ||
| 137 | - */ | ||
| 138 | yAxisLabel: { | 144 | yAxisLabel: { |
| 139 | type: String, | 145 | type: String, |
| 140 | value: "" | 146 | value: "" |
| 141 | }, | 147 | }, |
| 142 | - /** | ||
| 143 | - * It's the values suffix | ||
| 144 | - * | ||
| 145 | - * @attribute suffix | ||
| 146 | - * @type Strig | ||
| 147 | - * @default 'units' | ||
| 148 | - */ | ||
| 149 | suffix : { | 148 | suffix : { |
| 150 | type : String, | 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 | theme : { | 164 | theme : { |
| 154 | type : String, | 165 | type : String, |
| 155 | value : "" | 166 | value : "" |
| 156 | }, | 167 | }, |
| 157 | - /** | ||
| 158 | - * It's the component behavior | ||
| 159 | - * | ||
| 160 | - * @attribute behavior | ||
| 161 | - * @type Object | ||
| 162 | - * @default {} | ||
| 163 | - */ | ||
| 164 | behavior : { | 168 | behavior : { |
| 165 | type : Object, | 169 | type : Object, |
| 166 | value : {} | 170 | value : {} |
datalets/piechart-datalet/piechart-datalet.html
| @@ -100,7 +100,7 @@ Example: | @@ -100,7 +100,7 @@ Example: | ||
| 100 | allowPointSelect: true, | 100 | allowPointSelect: true, |
| 101 | cursor: 'pointer', | 101 | cursor: 'pointer', |
| 102 | dataLabels: { | 102 | dataLabels: { |
| 103 | - enabled: true, | 103 | + enabled: this._component.dataLabels, |
| 104 | format: '<b>{point.name}</b>: {point.percentage:.1f} %', | 104 | format: '<b>{point.name}</b>: {point.percentage:.1f} %', |
| 105 | style: { | 105 | style: { |
| 106 | color: (Highcharts[this._component.theme] && Highcharts[this._component.theme].contrastTextColor) || 'black' | 106 | color: (Highcharts[this._component.theme] && Highcharts[this._component.theme].contrastTextColor) || 'black' |
| @@ -117,6 +117,31 @@ Example: | @@ -117,6 +117,31 @@ Example: | ||
| 117 | if(this._component.theme != "themeBase" && this._component.theme != "") | 117 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 118 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 145 | $(this._component.$.charts.$.container).highcharts(options); |
| 121 | } | 146 | } |
| 122 | }; | 147 | }; |
| @@ -134,14 +159,22 @@ Example: | @@ -134,14 +159,22 @@ Example: | ||
| 134 | type : String, | 159 | type : String, |
| 135 | value : "" | 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 | donut : { | 170 | donut : { |
| 142 | type : String, | 171 | type : String, |
| 143 | value : "false" | 172 | value : "false" |
| 144 | }, | 173 | }, |
| 174 | + theme : { | ||
| 175 | + type : String, | ||
| 176 | + value : "" | ||
| 177 | + }, | ||
| 145 | behavior : { | 178 | behavior : { |
| 146 | type : Object, | 179 | type : Object, |
| 147 | value : {} | 180 | value : {} |
datalets/scatterchart-datalet/scatterchart-datalet.html
| @@ -85,7 +85,7 @@ Example: | @@ -85,7 +85,7 @@ Example: | ||
| 85 | } | 85 | } |
| 86 | 86 | ||
| 87 | this.properties.series = scatterSeries; | 87 | this.properties.series = scatterSeries; |
| 88 | - this._component.legend = true; | 88 | +// this._component.legend = true; |
| 89 | } | 89 | } |
| 90 | else {// == 2 | 90 | else {// == 2 |
| 91 | var scatterSeries = []; | 91 | var scatterSeries = []; |
| @@ -100,7 +100,7 @@ Example: | @@ -100,7 +100,7 @@ Example: | ||
| 100 | scatterSeries.push({data: series}); | 100 | scatterSeries.push({data: series}); |
| 101 | 101 | ||
| 102 | this.properties.series = scatterSeries; | 102 | this.properties.series = scatterSeries; |
| 103 | - this._component.legend = false; | 103 | +// this._component.legend = false; |
| 104 | } | 104 | } |
| 105 | 105 | ||
| 106 | options = { | 106 | options = { |
| @@ -121,8 +121,12 @@ Example: | @@ -121,8 +121,12 @@ Example: | ||
| 121 | text: this._component.yAxisLabel, | 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 | credits: { | 131 | credits: { |
| 128 | enabled: false | 132 | enabled: false |
| @@ -133,6 +137,27 @@ Example: | @@ -133,6 +137,27 @@ Example: | ||
| 133 | if(this._component.theme != "themeBase" && this._component.theme != "") | 137 | if(this._component.theme != "themeBase" && this._component.theme != "") |
| 134 | jQuery.extend(true, options, Highcharts[this._component.theme]); | 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 | $(this._component.$.charts.$.container).highcharts(options); | 161 | $(this._component.$.charts.$.container).highcharts(options); |
| 137 | } | 162 | } |
| 138 | }; | 163 | }; |
| @@ -153,14 +178,18 @@ Example: | @@ -153,14 +178,18 @@ Example: | ||
| 153 | type: String, | 178 | type: String, |
| 154 | value: "" | 179 | value: "" |
| 155 | }, | 180 | }, |
| 156 | - suffix : { | ||
| 157 | - type : String, | ||
| 158 | - value : "" | ||
| 159 | - }, | ||
| 160 | theme : { | 181 | theme : { |
| 161 | type : String, | 182 | type : String, |
| 162 | value : "" | 183 | value : "" |
| 163 | }, | 184 | }, |
| 185 | + legend : { | ||
| 186 | + type : Object, | ||
| 187 | + value : "topRight" | ||
| 188 | + }, | ||
| 189 | + dataLabels : { | ||
| 190 | + type : Object, | ||
| 191 | + value : true | ||
| 192 | + }, | ||
| 164 | behavior : { | 193 | behavior : { |
| 165 | type : Object, | 194 | type : Object, |
| 166 | value : {} | 195 | value : {} |
locales/controllet_ln.js
| @@ -5,16 +5,18 @@ ln["localization"] = "en"; | @@ -5,16 +5,18 @@ ln["localization"] = "en"; | ||
| 5 | /******** EN ********/ | 5 | /******** EN ********/ |
| 6 | 6 | ||
| 7 | //PAGE SLIDER | 7 | //PAGE SLIDER |
| 8 | + | ||
| 8 | ln["slide1Title_en"] = "SELECT DATASET"; | 9 | ln["slide1Title_en"] = "SELECT DATASET"; |
| 9 | ln["slide1Subtitle_en"] = "Select a dataset from the list or copy and paste the url of dataset."; | 10 | ln["slide1Subtitle_en"] = "Select a dataset from the list or copy and paste the url of dataset."; |
| 10 | ln["slide2Title_en"] = "SELECT DATA"; | 11 | ln["slide2Title_en"] = "SELECT DATA"; |
| 11 | ln["slide2Subtitle_en"] = "Select the fields on the left. The table will show the values related to the selected fields."; | 12 | ln["slide2Subtitle_en"] = "Select the fields on the left. The table will show the values related to the selected fields."; |
| 12 | ln["slide3Title_en"] = "SELECT VISUALIZATION"; | 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 | //SELECT DATASET | 18 | //SELECT DATASET |
| 19 | + | ||
| 18 | ln["listView_en"] = "LIST VIEW"; | 20 | ln["listView_en"] = "LIST VIEW"; |
| 19 | ln["treeMapView_en"] = "TREE MAP VIEW"; | 21 | ln["treeMapView_en"] = "TREE MAP VIEW"; |
| 20 | ln["extendedSearch_en"] = "EXTENDED SEARCH"; | 22 | ln["extendedSearch_en"] = "EXTENDED SEARCH"; |
| @@ -23,516 +25,795 @@ ln["showing_en"] = "Showing"; | @@ -23,516 +25,795 @@ ln["showing_en"] = "Showing"; | ||
| 23 | ln["to_en"] = "to"; | 25 | ln["to_en"] = "to"; |
| 24 | ln["of_en"] = "of"; | 26 | ln["of_en"] = "of"; |
| 25 | ln["datasets_en"] = "datasets"; | 27 | ln["datasets_en"] = "datasets"; |
| 26 | -//ln["availableDatasets_en"] = "Available datasets"; | ||
| 27 | ln["suggestedDatasets_en"] = "Suggested datasets"; | 28 | ln["suggestedDatasets_en"] = "Suggested datasets"; |
| 28 | ln["selectedUrl_en"] = "Selected url"; | 29 | ln["selectedUrl_en"] = "Selected url"; |
| 29 | ln["wrongUrl_en"] = "Invalid url or data provider not supported yet."; | 30 | ln["wrongUrl_en"] = "Invalid url or data provider not supported yet."; |
| 30 | 31 | ||
| 31 | //SELECT DATA | 32 | //SELECT DATA |
| 32 | -ln["expertAddFilters_en"] = "EXPERT : ADD FILTERS"; | ||
| 33 | 33 | ||
| 34 | //select-fields | 34 | //select-fields |
| 35 | ln["fields_en"] = "FIELDS"; | 35 | ln["fields_en"] = "FIELDS"; |
| 36 | 36 | ||
| 37 | //data-table | 37 | //data-table |
| 38 | ln["selectedData_en"] = "SELECTED DATA"; | 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 | ln["rows_en"] = "rows"; | 42 | ln["rows_en"] = "rows"; |
| 43 | ln["type_en"] = "TYPE"; | 43 | ln["type_en"] = "TYPE"; |
| 44 | ln["warning_en"] = "WARNING"; | 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 | //filters | 52 | //filters |
| 47 | ln["filterField_en"] = "Field"; | 53 | ln["filterField_en"] = "Field"; |
| 48 | ln["filterOperation_en"] = "Operation"; | 54 | ln["filterOperation_en"] = "Operation"; |
| 49 | ln["filterValue_en"] = "Value"; | 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 | ln["contains_en"] = "contains"; | 66 | ln["contains_en"] = "contains"; |
| 58 | ln["notContains_en"] = "not contains"; | 67 | ln["notContains_en"] = "not contains"; |
| 59 | ln["start_en"] = "start with"; | 68 | ln["start_en"] = "start with"; |
| 60 | ln["ends_en"] = "ends with"; | 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 | //SELECT VISUALIZATION | 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 | ln["addDatalet_en"] = "ADD"; | 90 | ln["addDatalet_en"] = "ADD"; |
| 68 | ln["modifyDatalet_en"] = "MODIFY"; | 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 | //vslider | 102 | //vslider |
| 71 | ln["search_en"] = "Search"; | 103 | ln["search_en"] = "Search"; |
| 72 | 104 | ||
| 73 | ln["datatable_en"] = "Table"; | 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 | ln["heatmap_en"] = "Heat Map"; | 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 | ln["treemap_en"] = "Tree Map"; | 114 | ln["treemap_en"] = "Tree Map"; |
| 86 | ln["leafletjs_en"] = "Map"; | 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 | //inputs | 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 | ln["Column_en"] = "COLUMN"; | 146 | ln["Column_en"] = "COLUMN"; |
| 112 | ln["Level_en"] = "LEVEL"; | 147 | ln["Level_en"] = "LEVEL"; |
| 113 | ln["SliceLabels_en"] = "LABEL"; | 148 | ln["SliceLabels_en"] = "LABEL"; |
| 114 | -ln["SliceSizes_en"] = "SIZE [num]"; | 149 | +ln["SliceSizes_en"] = "SIZE"; |
| 115 | ln["Latitude_en"] = "LATITUDE"; | 150 | ln["Latitude_en"] = "LATITUDE"; |
| 116 | ln["Longitude_en"] = "LONGITUDE"; | 151 | ln["Longitude_en"] = "LONGITUDE"; |
| 117 | -ln["BalloonContent_en"] = "BALLOON CONTENT";// [opt] | 152 | +ln["BalloonContent_en"] = "BALLOON CONTENT"; |
| 118 | ln["GEOJSON_en"] = "GEOJSON"; | 153 | ln["GEOJSON_en"] = "GEOJSON"; |
| 154 | +ln["GEOJSONContent_en"] = "GEOJSON CONTENT"; | ||
| 119 | ln["BubbleContent_en"] = "BUBBLE CONTENT"; | 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 | //options | 178 | //options |
| 124 | -ln["title_en"] = "Title" | ||
| 125 | -ln["description_en"] = "Description"; | ||
| 126 | - | ||
| 127 | ln["x-axis-label_en"] = "X Axis Label"; | 179 | ln["x-axis-label_en"] = "X Axis Label"; |
| 128 | ln["y-axis-label_en"] = "Y Axis Label"; | 180 | ln["y-axis-label_en"] = "Y Axis Label"; |
| 129 | ln["suffix_en"] = "Tooltip Suffix"; | 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 | ln["stack_en"] = "Stack"; | 184 | ln["stack_en"] = "Stack"; |
| 185 | +ln["theme_en"] = "Theme"; | ||
| 132 | ln["donut_en"] = "Donut"; | 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 | /******** IT ********/ | 209 | /******** IT ********/ |
| 142 | 210 | ||
| 143 | //PAGE SLIDER | 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 | //SELECT DATASET | 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 | ln["provider_it"] = "Provider"; | 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 | ln["datasets_it"] = "datasets"; | 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 | //SELECT DATA | 236 | //SELECT DATA |
| 168 | -ln["expertAddFilters_it"] = "ESPERTO : AGGIUNGI FILTRI"; | ||
| 169 | 237 | ||
| 170 | //select-fields | 238 | //select-fields |
| 171 | -ln["fields_it"] = "CAMPI"; | 239 | +ln["fields_it"] = "FIELDS"; |
| 172 | 240 | ||
| 173 | //data-table | 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 | //filters | 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 | //SELECT VISUALIZATION | 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 | //vslider | 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 | //inputs | 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 | ln["GEOJSON_it"] = "GEOJSON"; | 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 | //options | 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 | ln["stack_it"] = "Stack"; | 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 | /******** FR ********/ | 413 | /******** FR ********/ |
| 275 | 414 | ||
| 276 | //PAGE SLIDER | 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 | //SELECT DATASET | 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 | ln["extendedSearch_fr"] = "EXTENDED SEARCH"; | 430 | ln["extendedSearch_fr"] = "EXTENDED SEARCH"; |
| 290 | ln["provider_fr"] = "Provider"; | 431 | ln["provider_fr"] = "Provider"; |
| 291 | ln["showing_fr"] = "Showing"; | 432 | ln["showing_fr"] = "Showing"; |
| 292 | ln["to_fr"] = "to"; | 433 | ln["to_fr"] = "to"; |
| 293 | ln["of_fr"] = "of"; | 434 | ln["of_fr"] = "of"; |
| 294 | ln["datasets_fr"] = "datasets"; | 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 | ln["wrongUrl_fr"] = "Invalid url or data provider not supported yet."; | 438 | ln["wrongUrl_fr"] = "Invalid url or data provider not supported yet."; |
| 299 | 439 | ||
| 300 | //SELECT DATA | 440 | //SELECT DATA |
| 301 | -ln["expertAddFilters_fr"] = "EXPERT : ADD FILTERS"; | ||
| 302 | 441 | ||
| 303 | //select-fields | 442 | //select-fields |
| 304 | ln["fields_fr"] = "FIELDS"; | 443 | ln["fields_fr"] = "FIELDS"; |
| 305 | 444 | ||
| 306 | //data-table | 445 | //data-table |
| 307 | ln["selectedData_fr"] = "SELECTED DATA"; | 446 | ln["selectedData_fr"] = "SELECTED DATA"; |
| 447 | +ln["showing_fr"] = "Showing"; | ||
| 448 | +ln["to_fr"] = "to"; | ||
| 449 | +ln["of_fr"] = "of"; | ||
| 308 | ln["rows_fr"] = "rows"; | 450 | ln["rows_fr"] = "rows"; |
| 309 | ln["type_fr"] = "TYPE"; | 451 | ln["type_fr"] = "TYPE"; |
| 310 | ln["warning_fr"] = "WARNING"; | 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 | //filters | 460 | //filters |
| 313 | ln["filterField_fr"] = "Field"; | 461 | ln["filterField_fr"] = "Field"; |
| 314 | ln["filterOperation_fr"] = "Operation"; | 462 | ln["filterOperation_fr"] = "Operation"; |
| 315 | ln["filterValue_fr"] = "Value"; | 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 | ln["contains_fr"] = "contains"; | 474 | ln["contains_fr"] = "contains"; |
| 324 | ln["notContains_fr"] = "not contains"; | 475 | ln["notContains_fr"] = "not contains"; |
| 325 | ln["start_fr"] = "start with"; | 476 | ln["start_fr"] = "start with"; |
| 326 | ln["ends_fr"] = "ends with"; | 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 | //SELECT VISUALIZATION | 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 | //vslider | 510 | //vslider |
| 337 | ln["search_fr"] = "Search"; | 511 | ln["search_fr"] = "Search"; |
| 338 | 512 | ||
| 339 | ln["datatable_fr"] = "Table"; | 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 | ln["heatmap_fr"] = "Heat Map"; | 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 | ln["treemap_fr"] = "Tree Map"; | 522 | ln["treemap_fr"] = "Tree Map"; |
| 352 | ln["leafletjs_fr"] = "Map"; | 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 | //inputs | 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 | ln["Column_fr"] = "COLUMN"; | 554 | ln["Column_fr"] = "COLUMN"; |
| 378 | ln["Level_fr"] = "LEVEL"; | 555 | ln["Level_fr"] = "LEVEL"; |
| 379 | ln["SliceLabels_fr"] = "LABEL"; | 556 | ln["SliceLabels_fr"] = "LABEL"; |
| 380 | -ln["SliceSizes_fr"] = "SIZE [num]"; | 557 | +ln["SliceSizes_fr"] = "SIZE"; |
| 381 | ln["Latitude_fr"] = "LATITUDE"; | 558 | ln["Latitude_fr"] = "LATITUDE"; |
| 382 | ln["Longitude_fr"] = "LONGITUDE"; | 559 | ln["Longitude_fr"] = "LONGITUDE"; |
| 383 | -ln["BalloonContent_fr"] = "BALLOON CONTENT";// [opt] | 560 | +ln["BalloonContent_fr"] = "BALLOON CONTENT"; |
| 384 | ln["GEOJSON_fr"] = "GEOJSON"; | 561 | ln["GEOJSON_fr"] = "GEOJSON"; |
| 562 | +ln["GEOJSONContent_fr"] = "GEOJSON CONTENT"; | ||
| 385 | ln["BubbleContent_fr"] = "BUBBLE CONTENT"; | 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 | //options | 586 | //options |
| 390 | -ln["title_fr"] = "Title" | ||
| 391 | -ln["description_fr"] = "Description"; | ||
| 392 | - | ||
| 393 | ln["x-axis-label_fr"] = "X Axis Label"; | 587 | ln["x-axis-label_fr"] = "X Axis Label"; |
| 394 | ln["y-axis-label_fr"] = "Y Axis Label"; | 588 | ln["y-axis-label_fr"] = "Y Axis Label"; |
| 395 | ln["suffix_fr"] = "Tooltip Suffix"; | 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 | ln["stack_fr"] = "Stack"; | 592 | ln["stack_fr"] = "Stack"; |
| 593 | +ln["theme_fr"] = "Theme"; | ||
| 398 | ln["donut_fr"] = "Donut"; | 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 | /******** NL ********/ | 617 | /******** NL ********/ |
| 408 | 618 | ||
| 409 | //PAGE SLIDER | 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 | //SELECT DATASET | 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 | ln["extendedSearch_nl"] = "EXTENDED SEARCH"; | 634 | ln["extendedSearch_nl"] = "EXTENDED SEARCH"; |
| 423 | ln["provider_nl"] = "Provider"; | 635 | ln["provider_nl"] = "Provider"; |
| 424 | ln["showing_nl"] = "Showing"; | 636 | ln["showing_nl"] = "Showing"; |
| 425 | ln["to_nl"] = "to"; | 637 | ln["to_nl"] = "to"; |
| 426 | ln["of_nl"] = "of"; | 638 | ln["of_nl"] = "of"; |
| 427 | ln["datasets_nl"] = "datasets"; | 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 | //SELECT DATA | 644 | //SELECT DATA |
| 434 | -ln["expertAddFilters_nl"] = "EXPERT : ADD FILTERS"; | ||
| 435 | 645 | ||
| 436 | //select-fields | 646 | //select-fields |
| 437 | ln["fields_nl"] = "FIELDS"; | 647 | ln["fields_nl"] = "FIELDS"; |
| 438 | 648 | ||
| 439 | //data-table | 649 | //data-table |
| 440 | ln["selectedData_nl"] = "SELECTED DATA"; | 650 | ln["selectedData_nl"] = "SELECTED DATA"; |
| 651 | +ln["showing_nl"] = "Showing"; | ||
| 652 | +ln["to_nl"] = "to"; | ||
| 653 | +ln["of_nl"] = "of"; | ||
| 441 | ln["rows_nl"] = "rows"; | 654 | ln["rows_nl"] = "rows"; |
| 442 | ln["type_nl"] = "TYPE"; | 655 | ln["type_nl"] = "TYPE"; |
| 443 | ln["warning_nl"] = "WARNING"; | 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 | //filters | 664 | //filters |
| 446 | ln["filterField_nl"] = "Field"; | 665 | ln["filterField_nl"] = "Field"; |
| 447 | ln["filterOperation_nl"] = "Operation"; | 666 | ln["filterOperation_nl"] = "Operation"; |
| 448 | ln["filterValue_nl"] = "Value"; | 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 | ln["contains_nl"] = "contains"; | 678 | ln["contains_nl"] = "contains"; |
| 457 | ln["notContains_nl"] = "not contains"; | 679 | ln["notContains_nl"] = "not contains"; |
| 458 | ln["start_nl"] = "start with"; | 680 | ln["start_nl"] = "start with"; |
| 459 | ln["ends_nl"] = "ends with"; | 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 | //SELECT VISUALIZATION | 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 | ln["inputs_nl"] = "INPUTS"; | 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 | //vslider | 714 | //vslider |
| 470 | ln["search_nl"] = "Search"; | 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 | ln["heatmap_nl"] = "Heat Map"; | 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 | ln["treemap_nl"] = "Tree Map"; | 726 | ln["treemap_nl"] = "Tree Map"; |
| 485 | ln["leafletjs_nl"] = "Map"; | 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 | //inputs | 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 | ln["Column_nl"] = "COLUMN"; | 758 | ln["Column_nl"] = "COLUMN"; |
| 511 | ln["Level_nl"] = "LEVEL"; | 759 | ln["Level_nl"] = "LEVEL"; |
| 512 | ln["SliceLabels_nl"] = "LABEL"; | 760 | ln["SliceLabels_nl"] = "LABEL"; |
| 513 | -ln["SliceSizes_nl"] = "SIZE [num]"; | 761 | +ln["SliceSizes_nl"] = "SIZE"; |
| 514 | ln["Latitude_nl"] = "LATITUDE"; | 762 | ln["Latitude_nl"] = "LATITUDE"; |
| 515 | ln["Longitude_nl"] = "LONGITUDE"; | 763 | ln["Longitude_nl"] = "LONGITUDE"; |
| 516 | -ln["BalloonContent_nl"] = "BALLOON CONTENT";// [opt] | 764 | +ln["BalloonContent_nl"] = "BALLOON CONTENT"; |
| 517 | ln["GEOJSON_nl"] = "GEOJSON"; | 765 | ln["GEOJSON_nl"] = "GEOJSON"; |
| 766 | +ln["GEOJSONContent_nl"] = "GEOJSON CONTENT"; | ||
| 518 | ln["BubbleContent_nl"] = "BUBBLE CONTENT"; | 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 | //options | 790 | //options |
| 523 | -ln["title_nl"] = "Title" | ||
| 524 | -ln["description_nl"] = "Description"; | ||
| 525 | - | ||
| 526 | ln["x-axis-label_nl"] = "X Axis Label"; | 791 | ln["x-axis-label_nl"] = "X Axis Label"; |
| 527 | ln["y-axis-label_nl"] = "Y Axis Label"; | 792 | ln["y-axis-label_nl"] = "Y Axis Label"; |
| 528 | ln["suffix_nl"] = "Tooltip Suffix"; | 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 | ln["stack_nl"] = "Stack"; | 796 | ln["stack_nl"] = "Stack"; |
| 797 | +ln["theme_nl"] = "Theme"; | ||
| 531 | ln["donut_nl"] = "Donut"; | 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 | \ No newline at end of file | 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 | \ No newline at end of file | 821 | \ No newline at end of file |