Mercurial > hg > mpiwg_geobrowser
comparison lib/GeoTemCo/loader_devel.html @ 0:b57c7821382f
initial
author | Dirk Wintergruen <dwinter@mpiwg-berlin.mpg.de> |
---|---|
date | Thu, 28 May 2015 10:28:12 +0200 |
parents | |
children | ea066ce001bd |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:b57c7821382f |
---|---|
1 <!DOCTYPE html> | |
2 <html height="100%"> | |
3 | |
4 <head> | |
5 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | |
6 <title>PLATIN</title> | |
7 | |
8 <style type="text/css"> | |
9 .legend > table, .legend > div { | |
10 width: 200px !important; | |
11 height: 100px !important; | |
12 display: block; | |
13 overflow-y: scroll; | |
14 position: absolute; | |
15 right: 0px; | |
16 bottom: 0px; | |
17 font-size: 12px; | |
18 } | |
19 </style> | |
20 | |
21 <link href="css/platin.css" rel="stylesheet" type="text/css"> | |
22 <script src="js/Util/Publisher.js"></script> | |
23 <script src="js/Build/Loader/DynaJsLoader.js"></script> | |
24 <script src="js/Build/Loader/Loader.js"></script> | |
25 </head> | |
26 | |
27 <body height="100%"> | |
28 | |
29 <noscript> | |
30 <div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif"> | |
31 Your web browser must have JavaScript enabled in order for this application to display correctly. | |
32 </div> | |
33 </noscript> | |
34 | |
35 <table width=100%> | |
36 <tr> | |
37 <td colspan=2 width=100% align="center"> | |
38 <div style="width:100%; position:relative"> | |
39 <div style='width: 100%; float:left;'> | |
40 <a href="http://www.informatik.uni-leipzig.de:8080/geotemco/" target="_"><img width='18%' src='images/geotemco.png'></a> | |
41 <a href="http://www.topoi.org/group/d-6/" target="_"><img width='18%' src='images/topoi.png'></a> | |
42 <a href="http://skruse.github.io/PLATIN/" target="_"><img width='18%' src='images/platin.png'></a> | |
43 <a href="http://www.mpiwg-berlin.mpg.de /de/index.html" target=""><img width='18%' src='images/mpiwg.gif'></a> | |
44 <a href="https://de.dariah.eu/geobrowser" target="_"><img width='18%' src='images/dariah.png'></a> | |
45 </div> | |
46 </div> | |
47 </td> | |
48 </tr> | |
49 <tr > | |
50 <td width=50%> | |
51 <fieldset id="dataloaderContainerDiv" style="position:relative;"> | |
52 <legend>Load Data</legend> | |
53 </fieldset> | |
54 </td> | |
55 <td rowspan=2 width=50% valign=top> | |
56 <fieldset id="storytellingContainerDiv" style="position:relative;"> | |
57 <legend>Data History</legend> | |
58 </fieldset> | |
59 </td> | |
60 </tr> | |
61 <tr> | |
62 <td width=50%> | |
63 <fieldset id="overlayloaderContainerDiv" style="position:relative;"> | |
64 <legend>Load Overlay</legend> | |
65 </fieldset> | |
66 </td> | |
67 </tr> | |
68 <tr> | |
69 <td width=50%> | |
70 <div id="mapContainerDiv" style="position:relative;"></div> | |
71 </td> | |
72 <td width=50%> | |
73 <div id="piechartContainerDiv" style="height:580px; position:relative;"></div> | |
74 </td> | |
75 </tr> | |
76 </table> | |
77 <div id="plotContainerDiv" style="position:relative;"></div> | |
78 <div id="tableContainerDiv" style="position:relative;"></div> | |
79 | |
80 <script> | |
81 Publisher.Subscribe( 'GeoTemCoReady', this, function(){ | |
82 var datasets = []; | |
83 var mapDiv = document.getElementById("mapContainerDiv"); | |
84 var map = new WidgetWrapper(); | |
85 var mapWidget = new MapWidget(map,mapDiv,{ | |
86 mapTitle: "Publication Place" | |
87 }); | |
88 var timeDiv = document.getElementById("plotContainerDiv"); | |
89 var time = new WidgetWrapper(); | |
90 var timeWidget = new FuzzyTimelineWidget(time,timeDiv,{ | |
91 timeTitle: "Publication Date" | |
92 }); | |
93 var tableDiv = document.getElementById("tableContainerDiv"); | |
94 var table = new WidgetWrapper(); | |
95 var tableWidget = new TableWidget(table,tableDiv); | |
96 | |
97 var dataloaderDiv = document.getElementById("dataloaderContainerDiv"); | |
98 var dataloader = new WidgetWrapper(); | |
99 var dataloaderWidget = new DataloaderWidget(dataloader,dataloaderDiv); | |
100 | |
101 var overlayloaderDiv = document.getElementById("overlayloaderContainerDiv"); | |
102 var overlayloader = new WidgetWrapper(); | |
103 var overlayloaderWidget = new OverlayloaderWidget(overlayloader,overlayloaderDiv); | |
104 overlayloaderWidget.attachMapWidget(mapWidget); | |
105 | |
106 var piechartDiv = document.getElementById("piechartContainerDiv"); | |
107 var piechart = new WidgetWrapper(); | |
108 var piechartWidget = new PieChartWidget(piechart,piechartDiv); | |
109 | |
110 var storytellingDiv = document.getElementById("storytellingContainerDiv"); | |
111 var storytelling = new WidgetWrapper(); | |
112 var storytellingWidget = new StorytellingWidget(storytelling,storytellingDiv); | |
113 | |
114 dataloaderWidget.loadFromURL(); | |
115 }); | |
116 </script> | |
117 | |
118 </body> | |
119 | |
120 </html> |