1
|
package eu.dnetlib.client;
|
2
|
|
3
|
import com.github.gwtbootstrap.client.ui.Image;
|
4
|
import com.github.gwtbootstrap.client.ui.Modal;
|
5
|
import com.github.gwtbootstrap.client.ui.Tab;
|
6
|
import com.github.gwtbootstrap.client.ui.TabPanel;
|
7
|
import com.github.gwtbootstrap.client.ui.ThumbnailLink;
|
8
|
import com.github.gwtbootstrap.client.ui.Thumbnails;
|
9
|
import com.github.gwtbootstrap.client.ui.constants.BackdropType;
|
10
|
import com.google.gwt.event.dom.client.ClickEvent;
|
11
|
import com.google.gwt.event.dom.client.ClickHandler;
|
12
|
import com.google.gwt.user.client.ui.FlowPanel;
|
13
|
import com.google.gwt.user.client.ui.HTML;
|
14
|
import com.google.gwt.user.client.ui.Widget;
|
15
|
|
16
|
import eu.dnetlib.client.leftColumn.OptionsWidget;
|
17
|
import eu.dnetlib.client.rightColumn.DataBox;
|
18
|
import eu.dnetlib.client.rightColumn.PreviewBox;
|
19
|
import eu.dnetlib.shared.SchemaAnswer;
|
20
|
import eu.dnetlib.shared.ValuesOfFields;
|
21
|
|
22
|
public class StartingModal extends Widget{
|
23
|
|
24
|
private Modal masterModal = new Modal();
|
25
|
private FlowPanel masterFlowPanel = new FlowPanel();
|
26
|
private TabPanel masterTabPanel = new TabPanel();
|
27
|
private Tab titleTab = new Tab();
|
28
|
private Tab columnTab = new Tab();
|
29
|
private Tab barTab = new Tab();
|
30
|
private Tab lineTab = new Tab();
|
31
|
private Tab areaTab = new Tab();
|
32
|
private Tab pieTab = new Tab();
|
33
|
private Tab otherTab = new Tab();
|
34
|
private SchemaAnswer schemaFromServer;
|
35
|
|
36
|
public StartingModal(SchemaAnswer schemaFromServer){
|
37
|
|
38
|
this.schemaFromServer = schemaFromServer;
|
39
|
|
40
|
designModal();
|
41
|
designOptionsForColumn();
|
42
|
designOptionsForBar();
|
43
|
designOptionsForLine();
|
44
|
designOptionsForArea();
|
45
|
designOptionsForPie();
|
46
|
}
|
47
|
|
48
|
public void designModal(){
|
49
|
|
50
|
masterTabPanel.setTitle("Select chart type");
|
51
|
masterTabPanel.setTabPosition("left");
|
52
|
masterTabPanel.addStyleName("startingmodal-left");
|
53
|
|
54
|
titleTab.setHeading("Select chart type");
|
55
|
titleTab.setEnabled(false);
|
56
|
|
57
|
columnTab.setHeading("Column");
|
58
|
Image columnImage= new Image("https://live.amcharts.com/static/img/landing/col.png");
|
59
|
columnImage.addStyleName("imageStartingModal");
|
60
|
columnTab.addDecorate(columnImage);
|
61
|
|
62
|
columnTab.setActive(true);
|
63
|
|
64
|
barTab.setHeading("Bar");
|
65
|
Image barImage = new Image("https://live.amcharts.com/static/img/landing/bar.png");
|
66
|
barImage.addStyleName("imageStartingModal");
|
67
|
barTab.addDecorate(barImage);
|
68
|
|
69
|
lineTab.setHeading("Line");
|
70
|
Image lineImage = new Image("https://live.amcharts.com/static/img/landing/line.png");
|
71
|
lineImage.addStyleName("imageStartingModal");
|
72
|
lineTab.addDecorate(lineImage);
|
73
|
|
74
|
areaTab.setHeading("Area");
|
75
|
Image areaImage = new Image("https://live.amcharts.com/static/img/landing/area.png");
|
76
|
areaImage.addStyleName("imageStartingModal");
|
77
|
areaTab.addDecorate(areaImage);
|
78
|
|
79
|
pieTab.setHeading("Pie");
|
80
|
Image pieImage = new Image("https://live.amcharts.com/static/img/landing/pie.png");
|
81
|
pieImage.addStyleName("imageStartingModal");
|
82
|
pieTab.addDecorate(pieImage);
|
83
|
|
84
|
otherTab.setHeading("Other types");
|
85
|
Image otherImage = new Image("https://live.amcharts.com/static/img/landing/other.png");
|
86
|
otherImage.addStyleName("imageStartingModal");
|
87
|
otherTab.addDecorate(otherImage);
|
88
|
|
89
|
masterTabPanel.add(titleTab);
|
90
|
masterTabPanel.add(columnTab);
|
91
|
masterTabPanel.add(barTab);
|
92
|
masterTabPanel.add(lineTab);
|
93
|
masterTabPanel.add(areaTab);
|
94
|
masterTabPanel.add(pieTab);
|
95
|
masterTabPanel.add(otherTab);
|
96
|
|
97
|
masterFlowPanel.add(masterTabPanel);
|
98
|
|
99
|
masterModal.add(masterFlowPanel);
|
100
|
masterModal.addStyleName("startingmodal-general-body");
|
101
|
|
102
|
masterModal.setBackdrop(BackdropType.STATIC);
|
103
|
|
104
|
masterModal.show();
|
105
|
masterModal.show(true);
|
106
|
}
|
107
|
|
108
|
public void designOptionsForColumn(){
|
109
|
|
110
|
FlowPanel flowPanel = new FlowPanel();
|
111
|
Thumbnails containerThumbnail = new Thumbnails();
|
112
|
containerThumbnail.addStyleName("thumbnail-list");
|
113
|
|
114
|
|
115
|
ThumbnailLink first = new ThumbnailLink();
|
116
|
|
117
|
first.add(new HTML("<img src='./img/column/clustered.png'>" +
|
118
|
"<label>Clustered</label>"));
|
119
|
|
120
|
first.addClickHandler(new ClickHandler() {
|
121
|
|
122
|
@Override
|
123
|
public void onClick(ClickEvent arg0) {
|
124
|
// TODO Auto-generated method stub
|
125
|
ValuesOfFields.getInstance().setChartType("chart");
|
126
|
new PreviewBox();
|
127
|
new DataBox();
|
128
|
new OptionsWidget(schemaFromServer,10,false);
|
129
|
masterModal.hide();
|
130
|
}
|
131
|
});
|
132
|
|
133
|
|
134
|
ThumbnailLink second = new ThumbnailLink();
|
135
|
|
136
|
second.add(new HTML("<img src='./img/column/stacked.png'>" +
|
137
|
"<label>Stacked (Mult. dataseries)</label>"));
|
138
|
|
139
|
second.addClickHandler(new ClickHandler() {
|
140
|
|
141
|
@Override
|
142
|
public void onClick(ClickEvent arg0) {
|
143
|
// TODO Auto-generated method stub
|
144
|
ValuesOfFields.getInstance().setChartType("chart");
|
145
|
new PreviewBox();
|
146
|
new DataBox();
|
147
|
new OptionsWidget(schemaFromServer,11,false);
|
148
|
masterModal.hide();
|
149
|
|
150
|
}
|
151
|
});
|
152
|
|
153
|
ThumbnailLink third = new ThumbnailLink();
|
154
|
|
155
|
third.add(new HTML("<img src='./img/column/100-percent-stacked.png'>" +
|
156
|
"<label>Full stacked</label>"));
|
157
|
|
158
|
third.addClickHandler(new ClickHandler() {
|
159
|
|
160
|
@Override
|
161
|
public void onClick(ClickEvent arg0) {
|
162
|
// TODO Auto-generated method stub
|
163
|
ValuesOfFields.getInstance().setChartType("chart");
|
164
|
new PreviewBox();
|
165
|
new DataBox();
|
166
|
new OptionsWidget(schemaFromServer,12,false);
|
167
|
masterModal.hide();
|
168
|
|
169
|
}
|
170
|
});
|
171
|
|
172
|
ThumbnailLink fourth = new ThumbnailLink();
|
173
|
|
174
|
fourth.add(new HTML("<img src='./img/column/stacked-1data.png'>" +
|
175
|
"<label>Stacked (1 dataseries)</label>"));
|
176
|
|
177
|
fourth.addClickHandler(new ClickHandler() {
|
178
|
|
179
|
@Override
|
180
|
public void onClick(ClickEvent arg0) {
|
181
|
// TODO Auto-generated method stub
|
182
|
ValuesOfFields.getInstance().setChartType("chart");
|
183
|
new PreviewBox();
|
184
|
new DataBox();
|
185
|
new OptionsWidget(schemaFromServer,13,false);
|
186
|
masterModal.hide();
|
187
|
|
188
|
}
|
189
|
});
|
190
|
|
191
|
ThumbnailLink fifth = new ThumbnailLink();
|
192
|
|
193
|
fifth.add(new HTML("<img src='./img/column/column-and-line.png'>" +
|
194
|
"<label>Column and line</label>"));
|
195
|
|
196
|
fifth.addClickHandler(new ClickHandler() {
|
197
|
|
198
|
@Override
|
199
|
public void onClick(ClickEvent arg0) {
|
200
|
// TODO Auto-generated method stub
|
201
|
ValuesOfFields.getInstance().setChartType("chart");
|
202
|
new PreviewBox();
|
203
|
new DataBox();
|
204
|
new OptionsWidget(schemaFromServer,14,false);
|
205
|
masterModal.hide();
|
206
|
|
207
|
}
|
208
|
});
|
209
|
|
210
|
containerThumbnail.add(first);
|
211
|
containerThumbnail.add(third);
|
212
|
containerThumbnail.add(second);
|
213
|
containerThumbnail.add(fourth);
|
214
|
containerThumbnail.add(fifth);
|
215
|
|
216
|
flowPanel.add(containerThumbnail);
|
217
|
|
218
|
|
219
|
columnTab.add(flowPanel);
|
220
|
}
|
221
|
|
222
|
public void designOptionsForBar(){
|
223
|
|
224
|
FlowPanel flowPanel = new FlowPanel();
|
225
|
Thumbnails containerThumbnail = new Thumbnails();
|
226
|
containerThumbnail.addStyleName("thumbnail-list");
|
227
|
|
228
|
|
229
|
ThumbnailLink first = new ThumbnailLink();
|
230
|
|
231
|
first.add(new HTML("<img src='./img/bar/clustered.png'>" +
|
232
|
"<label>Clustered</label>"));
|
233
|
|
234
|
first.addClickHandler(new ClickHandler() {
|
235
|
|
236
|
@Override
|
237
|
public void onClick(ClickEvent arg0) {
|
238
|
// TODO Auto-generated method stub
|
239
|
ValuesOfFields.getInstance().setChartType("chart");
|
240
|
new PreviewBox();
|
241
|
new DataBox();
|
242
|
new OptionsWidget(schemaFromServer,20,false);
|
243
|
masterModal.hide();
|
244
|
}
|
245
|
});
|
246
|
|
247
|
|
248
|
ThumbnailLink second = new ThumbnailLink();
|
249
|
|
250
|
second.add(new HTML("<img src='./img/bar/stacked.png'>" +
|
251
|
"<label>Stacked (Mult. dataseries)</label>"));
|
252
|
|
253
|
second.addClickHandler(new ClickHandler() {
|
254
|
|
255
|
@Override
|
256
|
public void onClick(ClickEvent arg0) {
|
257
|
// TODO Auto-generated method stub
|
258
|
ValuesOfFields.getInstance().setChartType("chart");
|
259
|
new PreviewBox();
|
260
|
new DataBox();
|
261
|
new OptionsWidget(schemaFromServer,21,false);
|
262
|
masterModal.hide();
|
263
|
}
|
264
|
});
|
265
|
|
266
|
ThumbnailLink third = new ThumbnailLink();
|
267
|
|
268
|
third.add(new HTML("<img src='./img/bar/100-percent-stacked.png'>" +
|
269
|
"<label>Full stacked</label>"));
|
270
|
|
271
|
third.addClickHandler(new ClickHandler() {
|
272
|
|
273
|
@Override
|
274
|
public void onClick(ClickEvent arg0) {
|
275
|
// TODO Auto-generated method stub
|
276
|
ValuesOfFields.getInstance().setChartType("chart");
|
277
|
new PreviewBox();
|
278
|
new DataBox();
|
279
|
new OptionsWidget(schemaFromServer,22,false);
|
280
|
masterModal.hide();
|
281
|
}
|
282
|
});
|
283
|
|
284
|
ThumbnailLink fourth = new ThumbnailLink();
|
285
|
|
286
|
fourth.add(new HTML("<img src='./img/bar/stacked-1data.png'>" +
|
287
|
"<label>Stacked (1 dataseries)</label>"));
|
288
|
|
289
|
fourth.addClickHandler(new ClickHandler() {
|
290
|
|
291
|
@Override
|
292
|
public void onClick(ClickEvent arg0) {
|
293
|
// TODO Auto-generated method stub
|
294
|
ValuesOfFields.getInstance().setChartType("chart");
|
295
|
new PreviewBox();
|
296
|
new DataBox();
|
297
|
new OptionsWidget(schemaFromServer,23,false);
|
298
|
masterModal.hide();
|
299
|
}
|
300
|
});
|
301
|
|
302
|
|
303
|
ThumbnailLink fifth = new ThumbnailLink();
|
304
|
|
305
|
fifth.add(new HTML("<img src='./img/bar/bar-and-line.png'>" +
|
306
|
"<label>Bar and line</label>"));
|
307
|
|
308
|
fifth.addClickHandler(new ClickHandler() {
|
309
|
|
310
|
@Override
|
311
|
public void onClick(ClickEvent arg0) {
|
312
|
// TODO Auto-generated method stub
|
313
|
ValuesOfFields.getInstance().setChartType("chart");
|
314
|
new PreviewBox();
|
315
|
new DataBox();
|
316
|
new OptionsWidget(schemaFromServer,24,false);
|
317
|
masterModal.hide();
|
318
|
}
|
319
|
});
|
320
|
|
321
|
containerThumbnail.add(first);
|
322
|
containerThumbnail.add(second);
|
323
|
containerThumbnail.add(third);
|
324
|
containerThumbnail.add(fourth);
|
325
|
containerThumbnail.add(fifth);
|
326
|
|
327
|
flowPanel.add(containerThumbnail);
|
328
|
|
329
|
|
330
|
barTab.add(flowPanel);
|
331
|
}
|
332
|
|
333
|
public void designOptionsForLine(){
|
334
|
|
335
|
FlowPanel flowPanel = new FlowPanel();
|
336
|
Thumbnails containerThumbnail = new Thumbnails();
|
337
|
containerThumbnail.addStyleName("thumbnail-list");
|
338
|
|
339
|
|
340
|
ThumbnailLink first = new ThumbnailLink();
|
341
|
|
342
|
first.add(new HTML("<img src='./img/line/line.png'>" +
|
343
|
"<label>Line (Mult. dataseries)</label>"));
|
344
|
|
345
|
first.addClickHandler(new ClickHandler() {
|
346
|
|
347
|
@Override
|
348
|
public void onClick(ClickEvent arg0) {
|
349
|
// TODO Auto-generated method stub
|
350
|
ValuesOfFields.getInstance().setChartType("chart");
|
351
|
new PreviewBox();
|
352
|
new DataBox();
|
353
|
new OptionsWidget(schemaFromServer,30,false);
|
354
|
masterModal.hide();
|
355
|
}
|
356
|
});
|
357
|
|
358
|
ThumbnailLink second = new ThumbnailLink();
|
359
|
|
360
|
second.add(new HTML("<img src='./img/line/column-and-line.png'>" +
|
361
|
"<label>Column and line</label>"));
|
362
|
|
363
|
second.addClickHandler(new ClickHandler() {
|
364
|
|
365
|
@Override
|
366
|
public void onClick(ClickEvent arg0) {
|
367
|
// TODO Auto-generated method stub
|
368
|
ValuesOfFields.getInstance().setChartType("chart");
|
369
|
new PreviewBox();
|
370
|
new DataBox();
|
371
|
new OptionsWidget(schemaFromServer,31,false);
|
372
|
masterModal.hide();
|
373
|
}
|
374
|
});
|
375
|
|
376
|
ThumbnailLink third = new ThumbnailLink();
|
377
|
|
378
|
third.add(new HTML("<img src='./img/line/steps.png'>" +
|
379
|
"<label>Line with steps</label>"));
|
380
|
|
381
|
third.addClickHandler(new ClickHandler() {
|
382
|
|
383
|
@Override
|
384
|
public void onClick(ClickEvent arg0) {
|
385
|
// TODO Auto-generated method stub
|
386
|
ValuesOfFields.getInstance().setChartType("chart");
|
387
|
ValuesOfFields.getInstance().setSteps("true");
|
388
|
new PreviewBox();
|
389
|
new DataBox();
|
390
|
new OptionsWidget(schemaFromServer,32,false);
|
391
|
masterModal.hide();
|
392
|
}
|
393
|
});
|
394
|
|
395
|
ThumbnailLink fourth = new ThumbnailLink();
|
396
|
|
397
|
fourth.add(new HTML("<img src='./img/line/line-1data.png'>" +
|
398
|
"<label>Line (1 dataseries)</label>"));
|
399
|
|
400
|
fourth.addClickHandler(new ClickHandler() {
|
401
|
|
402
|
@Override
|
403
|
public void onClick(ClickEvent arg0) {
|
404
|
// TODO Auto-generated method stub
|
405
|
ValuesOfFields.getInstance().setChartType("chart");
|
406
|
new PreviewBox();
|
407
|
new DataBox();
|
408
|
new OptionsWidget(schemaFromServer,33,false);
|
409
|
masterModal.hide();
|
410
|
}
|
411
|
});
|
412
|
|
413
|
containerThumbnail.add(first);
|
414
|
containerThumbnail.add(second);
|
415
|
containerThumbnail.add(third);
|
416
|
containerThumbnail.add(fourth);
|
417
|
|
418
|
flowPanel.add(containerThumbnail);
|
419
|
|
420
|
|
421
|
lineTab.add(flowPanel);
|
422
|
}
|
423
|
|
424
|
public void designOptionsForPie(){
|
425
|
|
426
|
FlowPanel flowPanel = new FlowPanel();
|
427
|
Thumbnails containerThumbnail = new Thumbnails();
|
428
|
containerThumbnail.addStyleName("thumbnail-list");
|
429
|
|
430
|
|
431
|
ThumbnailLink first = new ThumbnailLink();
|
432
|
|
433
|
first.add(new HTML("<img src='./img/pie/pie.png'>" +
|
434
|
"<label>Pie</label>"));
|
435
|
|
436
|
first.addClickHandler(new ClickHandler() {
|
437
|
|
438
|
@Override
|
439
|
public void onClick(ClickEvent arg0) {
|
440
|
// TODO Auto-generated method stub
|
441
|
ValuesOfFields.getInstance().setChartType("chart");
|
442
|
new PreviewBox();
|
443
|
new DataBox();
|
444
|
new OptionsWidget(schemaFromServer,40,false);
|
445
|
masterModal.hide();
|
446
|
}
|
447
|
});
|
448
|
|
449
|
ThumbnailLink second = new ThumbnailLink();
|
450
|
|
451
|
second.add(new HTML("<img src='./img/pie/3d-pie.png'>" +
|
452
|
"<label>3D Pie</label>"));
|
453
|
|
454
|
second.addClickHandler(new ClickHandler() {
|
455
|
|
456
|
@Override
|
457
|
public void onClick(ClickEvent arg0) {
|
458
|
// TODO Auto-generated method stub
|
459
|
ValuesOfFields.getInstance().setChartType("chart");
|
460
|
new PreviewBox();
|
461
|
new DataBox();
|
462
|
new OptionsWidget(schemaFromServer,41,false);
|
463
|
masterModal.hide();
|
464
|
}
|
465
|
});
|
466
|
|
467
|
|
468
|
ThumbnailLink third = new ThumbnailLink();
|
469
|
|
470
|
third.add(new HTML("<img src='./img/pie/donut.png'>" +
|
471
|
"<label>Donut</label>"));
|
472
|
|
473
|
third.addClickHandler(new ClickHandler() {
|
474
|
|
475
|
@Override
|
476
|
public void onClick(ClickEvent arg0) {
|
477
|
// TODO Auto-generated method stub
|
478
|
ValuesOfFields.getInstance().setChartType("chart");
|
479
|
new PreviewBox();
|
480
|
new DataBox();
|
481
|
new OptionsWidget(schemaFromServer,42,false);
|
482
|
masterModal.hide();
|
483
|
}
|
484
|
});
|
485
|
|
486
|
|
487
|
containerThumbnail.add(first);
|
488
|
containerThumbnail.add(second);
|
489
|
containerThumbnail.add(third);
|
490
|
flowPanel.add(containerThumbnail);
|
491
|
|
492
|
|
493
|
pieTab.add(flowPanel);
|
494
|
}
|
495
|
|
496
|
public void designOptionsForArea(){
|
497
|
|
498
|
FlowPanel flowPanel = new FlowPanel();
|
499
|
Thumbnails containerThumbnail = new Thumbnails();
|
500
|
containerThumbnail.addStyleName("thumbnail-list");
|
501
|
|
502
|
|
503
|
ThumbnailLink first = new ThumbnailLink();
|
504
|
|
505
|
first.add(new HTML("<img src='./img/area/area.png'>" +
|
506
|
"<label>Area (Multi. dataseries)</label>"));
|
507
|
|
508
|
first.addClickHandler(new ClickHandler() {
|
509
|
|
510
|
@Override
|
511
|
public void onClick(ClickEvent arg0) {
|
512
|
// TODO Auto-generated method stub
|
513
|
ValuesOfFields.getInstance().setChartType("chart");
|
514
|
new PreviewBox();
|
515
|
new DataBox();
|
516
|
new OptionsWidget(schemaFromServer,50,false);
|
517
|
masterModal.hide();
|
518
|
}
|
519
|
});
|
520
|
|
521
|
ThumbnailLink second = new ThumbnailLink();
|
522
|
|
523
|
second.add(new HTML("<img src='./img/area/area-stacked.png'>" +
|
524
|
"<label>Area stacked</label>"));
|
525
|
|
526
|
second.addClickHandler(new ClickHandler() {
|
527
|
|
528
|
@Override
|
529
|
public void onClick(ClickEvent arg0) {
|
530
|
// TODO Auto-generated method stub
|
531
|
ValuesOfFields.getInstance().setChartType("chart");
|
532
|
new PreviewBox();
|
533
|
new DataBox();
|
534
|
new OptionsWidget(schemaFromServer,51,false);
|
535
|
masterModal.hide();
|
536
|
}
|
537
|
});
|
538
|
|
539
|
|
540
|
ThumbnailLink third = new ThumbnailLink();
|
541
|
|
542
|
third.add(new HTML("<img src='./img/area/100-percent-stacked-area.png'>" +
|
543
|
"<label>Area stacked 100%</label>"));
|
544
|
|
545
|
third.addClickHandler(new ClickHandler() {
|
546
|
|
547
|
@Override
|
548
|
public void onClick(ClickEvent arg0) {
|
549
|
// TODO Auto-generated method stub
|
550
|
ValuesOfFields.getInstance().setChartType("chart");
|
551
|
new PreviewBox();
|
552
|
new DataBox();
|
553
|
new OptionsWidget(schemaFromServer,52,false);
|
554
|
masterModal.hide();
|
555
|
}
|
556
|
});
|
557
|
|
558
|
ThumbnailLink fourth = new ThumbnailLink();
|
559
|
|
560
|
fourth.add(new HTML("<img src='./img/area/area-1data.png'>" +
|
561
|
"<label>Area (1 dataserie)</label>"));
|
562
|
|
563
|
fourth.addClickHandler(new ClickHandler() {
|
564
|
|
565
|
@Override
|
566
|
public void onClick(ClickEvent arg0) {
|
567
|
// TODO Auto-generated method stub
|
568
|
ValuesOfFields.getInstance().setChartType("chart");
|
569
|
new PreviewBox();
|
570
|
new DataBox();
|
571
|
new OptionsWidget(schemaFromServer,53,false);
|
572
|
masterModal.hide();
|
573
|
}
|
574
|
});
|
575
|
|
576
|
containerThumbnail.add(first);
|
577
|
containerThumbnail.add(second);
|
578
|
containerThumbnail.add(third);
|
579
|
containerThumbnail.add(fourth);
|
580
|
|
581
|
flowPanel.add(containerThumbnail);
|
582
|
|
583
|
|
584
|
areaTab.add(flowPanel);
|
585
|
}
|
586
|
|
587
|
}
|