SGH / COMPONENTS

Commit 73cc8795b09adf7737fdaefc0691a7699762e12c

Authored by pina
1 parent 339d682e

dataset page and wait datalet

Inline Side-by-side
Showing 3 changed files with 129 additions and 13 deletions
datalets/base-ajax-json-jsonpath-datalet/static/js/AjaxJsonJsonPathBehavior.js
  View file @73cc879
... ... @@ -2,7 +2,7 @@
2 2 @license
3 3 The MIT License (MIT)
4 4  
5   - Copyright (c) 2015 Dipartimento di Informatica - Università di Salerno - Italy
  5 + Copyright (c) 2015 Dipartimento di Informatica - Universit� di Salerno - Italy
6 6  
7 7 Permission is hereby granted, free of charge, to any person obtaining a copy
8 8 of this software and associated documentation files (the "Software"), to deal
... ... @@ -98,7 +98,7 @@ var AjaxJsonJsonPathBehavior = {
98 98 *
99 99 * @method selectData
100 100 */
101   - selectData : function(){
  101 + selectData : function() {
102 102  
103 103 this.data = [];
104 104  
... ... @@ -107,17 +107,27 @@ var AjaxJsonJsonPathBehavior = {
107 107  
108 108 this._component.fields = JSON.parse(this._component.fields);
109 109  
110   - for(var i=0;i < this._component.fields.length; i++){
  110 + for (var i = 0; i < this._component.fields.length; i++) {
111 111 var query = "$";
112 112 var query_elements = this._component.fields[i].split(',');
113   - for(var j=0; j < query_elements.length;j++){
  113 + for (var j = 0; j < query_elements.length; j++) {
114 114 query += "['" + query_elements[j] + "']";
115   - if(this.isFieldArray(query_elements.slice(0,j+1))){
  115 + if (this.isFieldArray(query_elements.slice(0, j + 1))) {
116 116 query += "[*]";
117 117 }
118 118 }
119   - this.data.push({name : query_elements[query_elements.length - 1], data : jsonPath(this.properties.json_results.value, query)});
  119 + this.data.push({
  120 + name: query_elements[query_elements.length - 1],
  121 + data: jsonPath(this.properties.json_results.value, query)
  122 + });
120 123 }
121   - }
  124 + this.deleteWaitImage();
  125 + },
122 126  
  127 + /**
  128 + * Delete a image after loading a datalet
  129 + */
  130 + deleteWaitImage : function() {
  131 + $("img[src$='spin.svg']").remove();
  132 + }
123 133 };
124 134 \ No newline at end of file
... ...
datalets/base-datalet/base-datalet.html
  View file @73cc879
... ... @@ -72,13 +72,27 @@ Example :
72 72 height:32px;
73 73 width: 32px;
74 74 }
  75 + #image_spin {
  76 + height:32px;
  77 + width: 32px;
  78 + position: relative;
  79 + center: center;
  80 + width: 100%;
  81 + }
  82 +
75 83 </style>
76 84  
  85 + <div id="base_datalet_imgWaitDatalet">
  86 + <img id="image_spin" src="static/images/spin.svg">
  87 +
  88 + </div>
  89 +
77 90 <div id="base_datalet_container">
78 91 <b>Source: </b><span id="domain"></span>
  92 + <b> </b><span id="domainPage"></span>
79 93 <div id="base_datalet_rtp">
80   - <div id="rtp">Powered by Route-to-PA</div>
81   - <div><a href="http://routetopa.eu/"><img id="rtpalogo" src="static/images/rtpalogo.png"></a></div>
  94 + <div id="rtp">Powered by ROUTE-TO-PA</div>
  95 + <div><a href="http://www.routetopa.eu/"><img id="rtpalogo" src="static/images/rtpalogo.png" ></a></div>
82 96 </div>
83 97 </div>
84 98  
... ... @@ -92,19 +106,51 @@ Example :
92 106 <script>
93 107 BaseDatalet = Polymer({
94 108 is: 'base-datalet',
95   -
  109 + objectDatalet: {
  110 + /**
  111 + * It contains the json data from async xhr call returned from core-ajax core component
  112 + *
  113 + * @attribute json_resultDatalet
  114 + * @type object
  115 + * @default 'null'.
  116 + */
  117 + json_resultDatalet: {
  118 + type: Object,
  119 + value: {}
  120 + }
  121 + },
96 122 /**
97 123 * It is called after the element�s template has been stamped and all elements inside the element�s local
98 124 * DOM have been configured (with values bound from parents, deserialized attributes, or else default values)
99 125 * and had their ready method called.
100 126 *
101   - * Extract the dataset domain from the entire URL and set the text content of the datalet footer.
102   - *
  127 + * Extract
  128 + * 1) the dataset domain
  129 + * 2) the page of a datalet
  130 + * from the entire URL and set the text content of the datalet footer.
103 131 * @method ready
104   - *
105 132 */
106 133 ready: function(){
  134 + var urlDatalet;
107 135 if(this.dataUrl != undefined){
  136 +
  137 + urlSource = this.dataUrl.split("/")[0] + "//" + this.dataUrl.split("/")[2];
  138 +
  139 + var apiIdResource = "resource_show?id=";
  140 +
  141 + //Resourceid of a datalet
  142 + var query = this.dataUrl.substring(this.dataUrl.indexOf("?"), this.dataUrl.length);
  143 + var params = this.decomponeQueryString(query);
  144 + resultIdDatalet = params["resource_id"];
  145 +
  146 + //cKan organized with or not catalog
  147 + queryInitial = this.dataUrl.substring(0, this.dataUrl.indexOf("api"));
  148 + queryFinal = this.dataUrl.substring(this.dataUrl.indexOf("api"), this.dataUrl.indexOf("datastore_search"));
  149 +
  150 + urlDatalet = queryInitial + queryFinal + apiIdResource + resultIdDatalet;
  151 +
  152 + this.requestDataletData(urlDatalet);
  153 + //String source to define for Issy
108 154 this.$.domain.textContent = this.dataUrl.split("/")[0] + "//" + this.dataUrl.split("/")[2];
109 155 }
110 156 },
... ... @@ -113,7 +159,66 @@ Example :
113 159 */
114 160 setDomain: function(url){
115 161 this.$.domain.textContent = url;
  162 + },
  163 + /**
  164 + * Get the (key, value) query string parameters
  165 + **/
  166 + decomponeQueryString: function (querystring) {
  167 + // remove any preceding url and split
  168 + querystring = querystring.substring(querystring.indexOf('?')+1).split('&');
  169 + var params = {}, pair, d = decodeURIComponent;
  170 + // march and parse
  171 + for (var i = querystring.length - 1; i >= 0; i--) {
  172 + pair = querystring[i].split('=');
  173 + params[d(pair[0])] = d(pair[1]);
  174 + }
  175 + return params;
  176 + },
  177 + /**
  178 + * Make an AJAX call to the dataset URL to retrieve package_id
  179 + *
  180 + * @method urlDatalet
  181 + */
  182 + requestDataletData: function(urlDatalet){
  183 + var comp = this;
  184 + $.ajax({
  185 + url: urlDatalet, //url con package
  186 + dataType: "json",
  187 + success: function(e){
  188 + comp.handleDataletResponse(e);
  189 + }
  190 + });
  191 + },
  192 + /**
  193 + * Called when core-ajax component receive the json data from called url.
  194 + *
  195 + * @method handleResponse
  196 + */
  197 + handleDataletResponse: function(e) {
  198 + this.objectDatalet.json_resultDatalet.value = e;
  199 +
  200 + //packageId of a give datalet
  201 + packageIdDatalet = this.objectDatalet.json_resultDatalet.value.result.package_id;
  202 + resourceId = this.objectDatalet.json_resultDatalet.value.result.id;
  203 +
  204 + //url complete of download
  205 + urlDatasetDownload = this.objectDatalet.json_resultDatalet.value.result.url;
  206 +
  207 + if(this.dataUrl != undefined){
  208 + //static url
  209 + lastStringResourceId = this.dataUrl.split("/")[5];
  210 + resourceId = lastStringResourceId.split('=')[1];
  211 + var urlDatalet = this.dataUrl.split("/")[0]+ "//" + this.dataUrl.split("/")[2] + "/dataset/" + packageIdDatalet +"/resource/" +resourceId;
116 212  
  213 +
  214 + urlDatalet = urlDatasetDownload.replace(/\/download\/.*/, '');
  215 + urlSource = this.dataUrl.split("/")[0] + "//" + this.dataUrl.split("/")[2];
  216 +
  217 + //this.$.domain.textContent = this.dataUrl.split("/")[0] + "//" + this.dataUrl.split("/")[2];
  218 +
  219 + //this.$.domainPage.innerHTML = '<a href=' + urlSource + ' target=' + "_blank>" + " urlSource" + '</a>';
  220 + this.$.domainPage.innerHTML = '<a href=' + urlDatalet + ' target=' + "_blank>" + " Dataset's page" + '</a>';
  221 + }
117 222 }
118 223 });
119 224 </script>
... ...
datalets/base-datalet/static/images/spin.svg 0 → 100644
  View file @73cc879
  1 +<?xml version="1.0" encoding="utf-8"?><svg width='198px' height='198px' xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-spin"><rect x="0" y="0" width="100" height="100" fill="none" class="bk"></rect><g transform="translate(50 50)"><g transform="rotate(0) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(45) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.12s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.12s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(90) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.25s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.25s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(135) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.37s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.37s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(180) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.5s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.5s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(225) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.62s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.62s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(270) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.75s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.75s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g><g transform="rotate(315) translate(34 0)"><circle cx="0" cy="0" r="8" fill="#1976d2"><animate attributeName="opacity" from="1" to="0.1" begin="0.87s" dur="1s" repeatCount="indefinite"></animate><animateTransform attributeName="transform" type="scale" from="1.5" to="1" begin="0.87s" dur="1s" repeatCount="indefinite"></animateTransform></circle></g></g></svg>
0 2 \ No newline at end of file
... ...