Mercurial > hg > mpiwg_geobrowser

comparison lib/GeoTemCo/js/Dataloader/Dataloader.js @ 0:b57c7821382f

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
initial
author Dirk Wintergruen <dwinter@mpiwg-berlin.mpg.de>
date Thu, 28 May 2015 10:28:12 +0200
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:b57c7821382f
1 /*
2 * Dataloader.js
3 *
4 * Copyright (c) 2013, Sebastian Kruse. All rights reserved.
5 *
6 * This library is free software; you can redistribute it and/or
7 * modify it under the terms of the GNU Lesser General Public
8 * License as published by the Free Software Foundation; either
9 * version 3 of the License, or (at your option) any later version.
10 *
11 * This library is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
14 * Lesser General Public License for more details.
15 *
16 * You should have received a copy of the GNU Lesser General Public
17 * License along with this library; if not, write to the Free Software
18 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
19 * MA 02110-1301 USA
20 */
21
22 /**
23 * @class Dataloader
24 * Implementation for a Dataloader UI
25 * @author Sebastian Kruse (skruse@mpiwg-berlin.mpg.de)
26 *
27 * @param {HTML object} parent div to append the Dataloader
28 */
29 function Dataloader(parent) {
30
31 this.dataLoader = this;
32
33 this.parent = parent;
34 this.options = parent.options;
35
36 this.initialize();
37 }
38
39 Dataloader.prototype = {
40
41 show : function() {
42 this.dataloaderDiv.style.display = "block";
43 },
44
45 hide : function() {
46 this.dataloaderDiv.style.display = "none";
47 },
48
49 initialize : function() {
50
51 this.addStaticLoader();
52 this.addLocalStorageLoader();
53 this.addKMLLoader();
54 this.addKMZLoader();
55 this.addCSVLoader();
56 this.addLocalKMLLoader();
57 this.addLocalCSVLoader();
58
59 // trigger change event on the select so
60 // that only the first loader div will be shown
61 $(this.parent.gui.loaderTypeSelect).change();
62 },
63
64 getFileName : function(url) {
65 var fileName = $.url(url).attr('file');
66 if ( (typeof fileName === "undefined") || (fileName.length === 0) ){
67 fileName = $.url(url).attr('path');
68 //startsWith and endsWith defined in SIMILE Ajax (string.js)
69 while (fileName.endsWith("/")){
70 fileName = fileName.substr(0,fileName.length-1);
71 }
72 if (fileName.length > 1)
73 fileName = fileName.substr(fileName.lastIndexOf("/")+1);
74 else
75 fileName = "unnamed dataset";
76 }
77 return fileName;
78 },
79
80 distributeDataset : function(dataSet) {
81 GeoTemConfig.addDataset(dataSet);
82 },
83
84 distributeDatasets : function(datasets) {
85 GeoTemConfig.addDatasets(datasets);
86 },
87
88 addStaticLoader : function() {
89 if (this.options.staticKML.length > 0){
90 $(this.parent.gui.loaderTypeSelect).append("<option value='StaticLoader'>Static Data</option>");
91
92 this.StaticLoaderTab = document.createElement("div");
93 $(this.StaticLoaderTab).attr("id","StaticLoader");
94
95 this.staticKMLList = document.createElement("select");
96 $(this.StaticLoaderTab).append(this.staticKMLList);
97
98 var staticKMLList = this.staticKMLList;
99 var isFirstHeader = true;
100 $(this.options.staticKML).each(function(){
101 var label = this.label;
102 var url = this.url;
103 var header = this.header;
104 if (typeof header !== "undefined"){
105 if (!isFirstHeader)
106 $(staticKMLList).append("</optgroup>");
107 $(staticKMLList).append("<optgroup label='"+header+"'>");
108 isFirstHeader = false;
109 } else
110 $(staticKMLList).append("<option value='"+url+"'> "+label+"</option>");
111 });
112 //close last optgroup (if there were any)
113 if (!isFirstHeader)
114 $(staticKMLList).append("</optgroup>");
115
116 this.loadStaticKMLButton = document.createElement("button");
117 $(this.loadStaticKMLButton).text("load");
118 $(this.StaticLoaderTab).append(this.loadStaticKMLButton);
119
120 $(this.loadStaticKMLButton).click($.proxy(function(){
121 var kmlURL = $(this.staticKMLList).find(":selected").attr("value");
122 if (kmlURL.length === 0)
123 return;
124 var origURL = kmlURL;
125 var fileName = this.getFileName(kmlURL);
126 if (typeof GeoTemConfig.proxy != 'undefined')
127 kmlURL = GeoTemConfig.proxy + kmlURL;
128 var kml = GeoTemConfig.getKml(kmlURL);
129 if ((typeof kml !== "undefined") && (kml != null)) {
130 var dataSet = new Dataset(GeoTemConfig.loadKml(kml), fileName, origURL);
131
132 if (dataSet != null)
133 this.distributeDataset(dataSet);
134 } else
135 alert("Could not load file.");
136 },this));
137
138 $(this.parent.gui.loaders).append(this.StaticLoaderTab);
139 }
140 },
141
142 addKMLLoader : function() {
143 $(this.parent.gui.loaderTypeSelect).append("<option value='KMLLoader'>KML File URL</option>");
144
145 this.KMLLoaderTab = document.createElement("div");
146 $(this.KMLLoaderTab).attr("id","KMLLoader");
147
148 this.kmlURL = document.createElement("input");
149 $(this.kmlURL).attr("type","text");
150 $(this.KMLLoaderTab).append(this.kmlURL);
151
152 this.loadKMLButton = document.createElement("button");
153 $(this.loadKMLButton).text("load KML");
154 $(this.KMLLoaderTab).append(this.loadKMLButton);
155
156 $(this.loadKMLButton).click($.proxy(function(){
157 var kmlURL = $(this.kmlURL).val();
158 if (kmlURL.length === 0)
159 return;
160 var origURL = kmlURL;
161 var fileName = this.getFileName(kmlURL);
162 if (typeof GeoTemConfig.proxy != 'undefined')
163 kmlURL = GeoTemConfig.proxy + kmlURL;
164 var kml = GeoTemConfig.getKml(kmlURL);
165 if ((typeof kml !== "undefined") && (kml != null)) {
166 var dataSet = new Dataset(GeoTemConfig.loadKml(kml), fileName, origURL);
167
168 if (dataSet != null)
169 this.distributeDataset(dataSet);
170 } else
171 alert("Could not load file.");
172 },this));
173
174 $(this.parent.gui.loaders).append(this.KMLLoaderTab);
175 },
176
177 addKMZLoader : function() {
178 $(this.parent.gui.loaderTypeSelect).append("<option value='KMZLoader'>KMZ File URL</option>");
179
180 this.KMZLoaderTab = document.createElement("div");
181 $(this.KMZLoaderTab).attr("id","KMZLoader");
182
183 this.kmzURL = document.createElement("input");
184 $(this.kmzURL).attr("type","text");
185 $(this.KMZLoaderTab).append(this.kmzURL);
186
187 this.loadKMZButton = document.createElement("button");
188 $(this.loadKMZButton).text("load KMZ");
189 $(this.KMZLoaderTab).append(this.loadKMZButton);
190
191 $(this.loadKMZButton).click($.proxy(function(){
192
193 var dataLoader = this;
194
195 var kmzURL = $(this.kmzURL).val();
196 if (kmzURL.length === 0)
197 return;
198 var origURL = kmzURL;
199 var fileName = dataLoader.getFileName(kmzURL);
200 if (typeof GeoTemConfig.proxy != 'undefined')
201 kmzURL = GeoTemConfig.proxy + kmzURL;
202
203 GeoTemConfig.getKmz(kmzURL, function(kmlArray){
204 $(kmlArray).each(function(){
205 var dataSet = new Dataset(GeoTemConfig.loadKml(this), fileName, origURL);
206
207 if (dataSet != null)
208 dataLoader.distributeDataset(dataSet);
209 });
210 });
211 },this));
212
213 $(this.parent.gui.loaders).append(this.KMZLoaderTab);
214 },
215
216 addCSVLoader : function() {
217 $(this.parent.gui.loaderTypeSelect).append("<option value='CSVLoader'>CSV File URL</option>");
218
219 this.CSVLoaderTab = document.createElement("div");
220 $(this.CSVLoaderTab).attr("id","CSVLoader");
221
222 this.csvURL = document.createElement("input");
223 $(this.csvURL).attr("type","text");
224 $(this.CSVLoaderTab).append(this.csvURL);
225
226 this.loadCSVButton = document.createElement("button");
227 $(this.loadCSVButton).text("load CSV");
228 $(this.CSVLoaderTab).append(this.loadCSVButton);
229
230 $(this.loadCSVButton).click($.proxy(function(){
231 var dataLoader = this;
232
233 var csvURL = $(this.csvURL).val();
234 if (csvURL.length === 0)
235 return;
236 var origURL = csvURL;
237 var fileName = dataLoader.getFileName(csvURL);
238 if (typeof GeoTemConfig.proxy != 'undefined')
239 csvURL = GeoTemConfig.proxy + csvURL;
240 GeoTemConfig.getCsv(csvURL, function(json){
241 if ((typeof json !== "undefined") && (json.length > 0)) {
242 var dataSet = new Dataset(GeoTemConfig.loadJson(json), fileName, origURL);
243
244 if (dataSet != null)
245 dataLoader.distributeDataset(dataSet);
246 } else
247 alert("Could not load file.");
248 });
249 },this));
250
251 $(this.parent.gui.loaders).append(this.CSVLoaderTab);
252 },
253
254 addLocalKMLLoader : function() {
255 $(this.parent.gui.loaderTypeSelect).append("<option value='LocalKMLLoader'>local KML File</option>");
256
257 this.localKMLLoaderTab = document.createElement("div");
258 $(this.localKMLLoaderTab).attr("id","LocalKMLLoader");
259
260 this.kmlFile = document.createElement("input");
261 $(this.kmlFile).attr("type","file");
262 $(this.localKMLLoaderTab).append(this.kmlFile);
263
264 this.loadLocalKMLButton = document.createElement("button");
265 $(this.loadLocalKMLButton).text("load KML");
266 $(this.localKMLLoaderTab).append(this.loadLocalKMLButton);
267
268 $(this.loadLocalKMLButton).click($.proxy(function(){
269 var filelist = $(this.kmlFile).get(0).files;
270 if (filelist.length > 0){
271 var file = filelist[0];
272 var fileName = file.name;
273 var reader = new FileReader();
274
275 reader.onloadend = ($.proxy(function(theFile) {
276 return function(e) {
277 var dataSet = new Dataset(GeoTemConfig.loadKml($.parseXML(reader.result)), fileName);
278 if (dataSet != null)
279 this.distributeDataset(dataSet);
280 };
281 }(file),this));
282
283 reader.readAsText(file);
284 }
285 },this));
286
287 $(this.parent.gui.loaders).append(this.localKMLLoaderTab);
288 },
289
290 addLocalCSVLoader : function() {
291 $(this.parent.gui.loaderTypeSelect).append("<option value='LocalCSVLoader'>local CSV File</option>");
292
293 this.localCSVLoaderTab = document.createElement("div");
294 $(this.localCSVLoaderTab).attr("id","LocalCSVLoader");
295
296 this.csvFile = document.createElement("input");
297 $(this.csvFile).attr("type","file");
298 $(this.localCSVLoaderTab).append(this.csvFile);
299
300 this.loadLocalCSVButton = document.createElement("button");
301 $(this.loadLocalCSVButton).text("load CSV");
302 $(this.localCSVLoaderTab).append(this.loadLocalCSVButton);
303
304 $(this.loadLocalCSVButton).click($.proxy(function(){
305 var filelist = $(this.csvFile).get(0).files;
306 if (filelist.length > 0){
307 var file = filelist[0];
308 var fileName = file.name;
309 var reader = new FileReader();
310
311 reader.onloadend = ($.proxy(function(theFile) {
312 return function(e) {
313 var json = GeoTemConfig.convertCsv(reader.result);
314 var dataSet = new Dataset(GeoTemConfig.loadJson(json), fileName);
315 if (dataSet != null)
316 this.distributeDataset(dataSet);
317 };
318 }(file),this));
319
320 reader.readAsText(file);
321 }
322 },this));
323
324 $(this.parent.gui.loaders).append(this.localCSVLoaderTab);
325 },
326
327 addLocalStorageLoader : function() {
328 var dataLoader = this;
329 this.localStorageLoaderTab = document.createElement("div");
330 $(this.localStorageLoaderTab).attr("id","LocalStorageLoader");
331
332 var localDatasets = document.createElement("select");
333 $(this.localStorageLoaderTab).append(localDatasets);
334
335 var localStorageDatasetCount = 0;
336 for(var key in localStorage){
337 //TODO: this is a somewhat bad idea, as it is used in multiple widgets.
338 //A global GeoTemCo option "prefix" could be better. But still..
339 if (key.startsWith("GeoBrowser_dataset_")){
340 localStorageDatasetCount++;
341 var label = key.substring("GeoBrowser_dataset_".length);
342 var url = key;
343 $(localDatasets).append("<option value='"+url+"'>"+decodeURIComponent(label)+"</option>");
344 }
345 }
346
347 //only show if there are datasets
348 if (localStorageDatasetCount > 0)
349 $(this.parent.gui.loaderTypeSelect).append("<option value='LocalStorageLoader'>browser storage</option>");
350
351 this.loadLocalStorageButton = document.createElement("button");
352 $(this.loadLocalStorageButton).text("load");
353 $(this.localStorageLoaderTab).append(this.loadLocalStorageButton);
354
355 $(this.loadLocalStorageButton).click($.proxy(function(){
356 var fileKey = $(localDatasets).find(":selected").attr("value");
357 if (fileKey.length === 0)
358 return;
359 var csv = $.remember({name:fileKey});
360 //TODO: this is a somewhat bad idea, as it is used in multiple widgets.
361 //A global GeoTemCo option "prefix" could be better. But still..
362 var fileName = decodeURIComponent(fileKey.substring("GeoBrowser_dataset_".length));
363 var json = GeoTemConfig.convertCsv(csv);
364 var dataSet = new Dataset(GeoTemConfig.loadJson(json), fileName, fileKey, "local");
365 if (dataSet != null)
366 dataLoader.distributeDataset(dataSet);
367 },this));
368
369 $(this.parent.gui.loaders).append(this.localStorageLoaderTab);
370 }
371 };