|
0
|
1 /*
|
|
|
2 * PlacetableWidget.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 PlacetableWidget
|
|
|
24 * PlacetableWidget Implementation
|
|
|
25 * @author Sebastian Kruse (skruse@mpiwg-berlin.mpg.de)
|
|
|
26 *
|
|
|
27 * @param {WidgetWrapper} core wrapper for interaction to other widgets
|
|
|
28 * @param {HTML object} div parent div to append the Placetable widget div
|
|
|
29 * @param {JSON} options user specified configuration that overwrites options in PlacetableConfig.js
|
|
|
30 */
|
|
|
31 PlacetableWidget = function(core, div, options) {
|
|
|
32
|
|
|
33 this.datasets;
|
|
|
34 this.core = core;
|
|
|
35 this.core.setWidget(this);
|
|
|
36
|
|
|
37 this.options = (new PlacetableConfig(options)).options;
|
|
|
38 this.gui = new PlacetableGui(this, div, this.options);
|
|
|
39 }
|
|
|
40
|
|
|
41 PlacetableWidget.prototype = {
|
|
|
42
|
|
|
43 initWidget : function(data) {
|
|
|
44 this.datasets = data;
|
|
|
45 var placetableWidget = this;
|
|
|
46
|
|
|
47 $(placetableWidget.gui.placetablesTable).empty();
|
|
|
48
|
|
|
49 this.elementHash = [];
|
|
|
50 var datasetIndex = 0;
|
|
|
51 $(this.datasets).each(function(){
|
|
|
52 var dataset = this;
|
|
|
53
|
|
|
54 placetableWidget.elementHash[datasetIndex] = [];
|
|
|
55
|
|
|
56 var row = document.createElement("tr");
|
|
|
57 var rowHeader = document.createElement("td");
|
|
|
58
|
|
|
59 rowHeader.innerHTML = "<b>"+this.label+"</b>";
|
|
|
60 $(rowHeader).mouseover($.proxy(function(){
|
|
|
61 placetableWidget.mouseover(dataset);
|
|
|
62 },{dataset:dataset,placetableWidget:placetableWidget}));
|
|
|
63 $(rowHeader).mouseout($.proxy(function(){
|
|
|
64 placetableWidget.mouseout(dataset);
|
|
|
65 },{dataset:dataset,placetableWidget:placetableWidget}));
|
|
|
66 $(rowHeader).click($.proxy(function(){
|
|
|
67 placetableWidget.click(dataset);
|
|
|
68 },{dataset:dataset,placetableWidget:placetableWidget}));
|
|
|
69
|
|
|
70 $(row).append(rowHeader);
|
|
|
71
|
|
|
72 $(this.objects).each(function(){
|
|
|
73 var object = this;
|
|
|
74 var rowElement = document.createElement("td");
|
|
|
75
|
|
|
76 rowElement.innerHTML = this.getPlace(0,0);
|
|
|
77 $(rowElement).mouseover($.proxy(function(){
|
|
|
78 placetableWidget.mouseover(dataset,object);
|
|
|
79 },{dataset:dataset,object:object,placetableWidget:placetableWidget}));
|
|
|
80 $(rowElement).mouseout($.proxy(function(){
|
|
|
81 placetableWidget.mouseout(dataset,object);
|
|
|
82 },{dataset:dataset,object:object,placetableWidget:placetableWidget}));
|
|
|
83 $(rowElement).click($.proxy(function(){
|
|
|
84 placetableWidget.click(dataset,object);
|
|
|
85 },{dataset:dataset,object:object,placetableWidget:placetableWidget}));
|
|
|
86
|
|
|
87 $(row).append(rowElement);
|
|
|
88
|
|
|
89 placetableWidget.elementHash[datasetIndex][object.index] = rowElement;
|
|
|
90 });
|
|
|
91
|
|
|
92 $(placetableWidget.gui.placetablesTable).append(row);
|
|
|
93
|
|
|
94 datasetIndex++;
|
|
|
95 });
|
|
|
96
|
|
|
97 this.highlightChanged([]);
|
|
|
98 },
|
|
|
99
|
|
|
100 mouseover : function(dataset,object) {
|
|
|
101 var highlightedObjects = [];
|
|
|
102 for (var i = 0; i < GeoTemConfig.datasets.length; i++){
|
|
|
103 if (GeoTemConfig.datasets[i] === dataset){
|
|
|
104 //if label is selected, push all objects of this set
|
|
|
105 if (typeof object === "undefined"){
|
|
|
106 var highlightedInDataset = [];
|
|
|
107 $(dataset.objects).each(function(){
|
|
|
108 highlightedInDataset.push(this);
|
|
|
109 });
|
|
|
110 highlightedObjects.push(highlightedInDataset);
|
|
|
111 } else {
|
|
|
112 //otherwise only push this object
|
|
|
113 highlightedObjects.push([object]);
|
|
|
114 }
|
|
|
115 } else {
|
|
|
116 highlightedObjects.push([]);
|
|
|
117 }
|
|
|
118 }
|
|
|
119
|
|
|
120 this.core.triggerHighlight(highlightedObjects);
|
|
|
121 },
|
|
|
122
|
|
|
123 mouseout : function(dataset,object) {
|
|
|
124 //select none
|
|
|
125 var highlightedObjects = [];
|
|
|
126 for (var i = 0; i < GeoTemConfig.datasets.length; i++)
|
|
|
127 highlightedObjects.push([]);
|
|
|
128
|
|
|
129 this.core.triggerHighlight(highlightedObjects);
|
|
|
130 },
|
|
|
131
|
|
|
132 click : function(dataset,object) {
|
|
|
133 },
|
|
|
134
|
|
|
135 highlightChanged : function(objects) {
|
|
|
136 if( !GeoTemConfig.highlightEvents ){
|
|
|
137 return;
|
|
|
138 }
|
|
|
139 var placetableWidget = this;
|
|
|
140
|
|
|
141 //reset colors
|
|
|
142 var datasetIndex = 0;
|
|
|
143 $(placetableWidget.elementHash).each(function(){
|
|
|
144 var color = GeoTemConfig.getColor(datasetIndex);
|
|
|
145 var colorRGB = 'rgb(' + color.r0 + ',' + color.g0 + ',' + color.b0 + ')';
|
|
|
146
|
|
|
147 $(this).each(function(){
|
|
|
148 $(this).css('background-color', colorRGB);
|
|
|
149 });
|
|
|
150 datasetIndex++;
|
|
|
151 });
|
|
|
152
|
|
|
153 //paint the selected
|
|
|
154 var datasetIndex = 0;
|
|
|
155 $(objects).each(function(){
|
|
|
156 var color = GeoTemConfig.getColor(datasetIndex);
|
|
|
157 var colorRGB = 'rgb(' + color.r1 + ',' + color.g1 + ',' + color.b1 + ')';
|
|
|
158 $(this).each(function(){
|
|
|
159 var object = this;
|
|
|
160
|
|
|
161 var rowElement = placetableWidget.elementHash[datasetIndex][object.index];
|
|
|
162
|
|
|
163 $(rowElement).css('background-color', colorRGB);
|
|
|
164 });
|
|
|
165 datasetIndex++;
|
|
|
166 });
|
|
|
167 },
|
|
|
168
|
|
|
169 selectionChanged : function(selection) {
|
|
|
170 if( !GeoTemConfig.selectionEvents ){
|
|
|
171 return;
|
|
|
172 }
|
|
|
173 },
|
|
|
174 };
|
