source: cowsclient/trunk/cowsclient/templates/old_wmsviz.html @ 7592

Subversion URL: http://proj.badc.rl.ac.uk/svn/ndg/cowsclient/trunk/cowsclient/templates/old_wmsviz.html@7592
Revision 7592, 7.6 KB checked in by astephen, 10 years ago (diff)

Updated to be compatible with:

  • python 2.6
  • pylons 1.0
Line 
1<html xmlns:py="http://genshi.edgewall.org/" 
2      xmlns="http://www.w3.org/1999/xhtml"
3          xmlns:xi="http://www.w3.org/2001/XInclude">   
4<xi:include href="utils.html" />
5<head>
6<link type="text/css" rel="stylesheet" href="$app_globals.server/layout/ddc_style.css"/>
7<link type="text/css" rel="stylesheet" href="$app_globals.server/layout/ddc_vis.css"/>
8<link type="text/css" rel="stylesheet" href="$app_globals.server/layout/ndg2.css"/>
9<!-- <script type='text/javascript'
10        src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script> -->
11
12
13<!-- BEGIN: Yahoo Interface Library -->
14<link type="text/css" rel="stylesheet"
15        href="$app_globals.server/js/yui/treeview/assets/skins/sam/treeview.css"/> 
16         
17<!-- Dependency source files --> 
18<script src = "$app_globals.server/js/yui/yahoo/yahoo-min.js" ></script> 
19<script src = "$app_globals.server/js/yui/event/event-min.js" ></script> 
20 
21<!-- TreeView source file --> 
22<script src = "$app_globals.server/js/yui/treeview/treeview-min.js" ></script> 
23
24<!-- TreeView Menu Style -->
25<link rel="stylesheet" type="text/css" href="$app_globals.server/js/yui/treeview/assets/treeview-menu.css"/> 
26
27<link rel="stylesheet" type="text/css" href="$app_globals.server/js/yui/fonts/fonts-min.css?_yuiversion=2.5.0" />
28<script type="text/javascript" src="$app_globals.server/js/yui/utilities/utilities.js?_yuiversion=2.5.0"></script>
29
30<script type="text/javascript" src="$app_globals.server/js/yui/yahoo-dom-event/yahoo-dom-event.js" ></script> 
31<script type="text/javascript" src="$app_globals.server/js/yui/dragdrop/dragdrop-min.js" ></script>
32<script type="text/javascript" src="$app_globals.server/js/toggleDiv.js" ></script>
33<link type="text/css" rel="stylesheet" href="$app_globals.server/layout/drag_drop_style.css"/>
34<script src = "$app_globals.server/js/dragAndDrop.js" ></script> 
35
36<!-- END: Yahoo Interface Library -->
37
38<!-- BEGIN: WMSC library -->
39<link type="text/css" rel="stylesheet" href="$app_globals.server/layout/control.css"/>
40
41<script src="$app_globals.server/js/wmsc.js"></script>
42<script src="$app_globals.server/js/prototype.js"></script>
43<!--script src="http://www.openlayers.org/api/2.4/OpenLayers.js"></script-->
44<script src="$app_globals.server/js/OpenLayers.js" />
45<script src="$app_globals.server/js/openlayers-x.js"/>
46<script src="$app_globals.server/js/dimensionControl.js"/>
47<script src="$app_globals.server/js/mapControl.js"/>
48<script src="$app_globals.server/js/layerControl.js"></script>
49<script src="$app_globals.server/js/capabilities.js"></script>
50<script src="$app_globals.server/js/wcs.js"></script>
51<!-- END: WMSC library -->
52
53<script type="text/javascript">
54
55// Hook into application for debugging.   
56var app = null;
57var control = null;
58
59<?python
60from pylons import session 
61?>     
62       
63function init() 
64{
65    var coordControl = new WMSC.DimControl('dims');
66    var layerControl = new WMSC.VisAppLayers('layerTree', 'layerLeaves', coordControl); 
67        <for py:for="i in session['viewItems']" class="dataset" py:strip="True">
68        <span py:if="i.wmcURL" py:strip="True">
69                layerControl.addWebMapContext("${i.wmcURL}");
70            </span>
71    </for>
72    app = new WMSC.VisApp('map', 10, 640, true);
73    app.addDimensionControl(coordControl);
74    app.addLayerControl(layerControl); 
75        if (document.getElementById('wcsdownload') == null) {
76                createDownloadButton(wcsdownloadDiv);   
77                }       
78}
79
80function cleanup() 
81{
82    app.destroy();
83}
84       
85<!--! Help Icons -->
86<span py:def="helpIcon(value, elementType = 'div')">
87       <span>
88          <a href="javascript:;" title="Toggle help" onclick="toggleDiv(1,'$value','shown','hidden','$elementType'); return false;">
89          <img src="$app_globals.helpIcon" alt="Toggle help" class="helpicon"/></a>
90       </span>
91</span>
92       
93
94</script>
95
96<!--<replace py:replace="pagehead()"/> -->
97</head>
98
99<body onload="init()" onunload="cleanup()">
100        <div id="entirepage">
101    <!--<div py:replace="header()"/>  -->
102        <!-- <div py:replace="PageTabs('View')"/> -->
103    <!-- <div py:replace="searchOneLine()"/> -->
104
105<div id="visBody">
106<table>
107  <tr>
108    <td align="center">
109        <div id="mapBox">
110                        <div id="map"></div>
111                        <div id="legend"></div>
112                </div>
113    </td>
114    <td valign="top">
115      <div class="optDiv">
116        <b>Selection Description</b>
117                <div id="description">
118                  Complete your selection below to view  <span py:replace="helpIcon('coord_help', 'div')"/> 
119                </div>
120      </div>
121               
122                <div id="coord_help" class="hidden">
123        <div class="helptxt">
124                                Specifying coordinate dimensions will select a region on the map;
125                                when this is appropriately sized, the map will automatically zoom to this region.<br/>
126                                'Reset selection' will return the map to its full, global size.<br/>
127                                Some map layers have additional dimensions, e.g. 'time';
128                                if these are available, they will also be displayed in this panel for selection.<br/>
129                                NB, the dimensions displayed are those relating to the selected dataset
130                                in the left hand tree view - however they will also be applied, where appropriate, to all selected map layers.
131        </div>
132      </div>   
133               
134      <div class="optDiv">
135        <b>Domain</b>
136                        <div id="dims"></div>
137      </div>
138        <div class="wcsDiv">
139        <b>Download Data for this Selection</b>
140                        <div id="wcsdownloadDiv"></div>
141      </div>
142    <div class="hiddenDiv">
143        <form id="figureForm">
144          <b>Plot type</b><br/>
145          <input type="radio" name="figType" value="colour" checked="1"/>Colour<br/>
146          <input type="radio" name="figType" value="bw"/>B/W Contour<br/>
147          <b>Format</b><br/>
148          <select name="figFormat">
149            <option value="image/png" name="figFormat" selected="1"> PNG </option>
150            <option value="image/jpeg" name="figFormat"> JPEG </option>
151            <option value="application/postscript" name="figFormat"> EPS </option>
152            <option value="image/svg+xml" name="figFormat"> SVG </option>
153          </select>
154          <input type="button" value="Make Figure" 
155                onclick="app.makeFigure(this.parentNode.figType, this.parentNode.figFormat)"/>
156        </form>
157      </div>
158    </td>
159  </tr>
160</table>
161
162<table class="controlTable">
163<tr class="controlHeadings">
164<th>Dataset  <span py:replace="helpIcon('dataset_help')"/> 
165</th> 
166<th>Layer <span py:replace="helpIcon('layer_help')"/></th> 
167</tr>
168<tr>
169<td>
170        <div id="dataset_help" class="hidden">
171        <div class="helptxt">
172                        Select a dataset to expand it and make its map layers visible; these can then be selected to add to the 'Layer'
173                        panel for visualisation.<br/> 
174                        Remove datasets from the display by clicking their <img src="$app_globals.server/js/img/close.gif" /> icon.
175        </div>
176    </div>
177</td>
178<td>
179        <div id="layer_help" class="hidden">
180        <div class="helptxt">
181                When multiple map layers are selected, the displayed map is constructed by sequentially adding the layers from the bottom of the list
182                to the top.<br/>
183                NB, if the topmost layer has legend data available then this will be displayed under the completed map.<br/>
184                Remove layers from the displayed map by clicking their <img src="$app_globals.server/js/img/close.gif" /> icon.
185        </div>
186    </div>
187</td>
188</tr>
189<tr>
190<td class="controlPanel"><div class="controlContent" id="layerTree">
191        Please wait while datasets load</div>
192</td>
193<td class="controlPanel">
194        <div class="controlContent" id="layerLeaves">
195                <div id="layerMessage" class="layerMessage">
196            <span py:if="'viewItems' not in session" py:strip="True">
197                Please select a dataset to view - from the 'Selections' tab.
198            </span>
199            <span py:if="'viewItems' in session" py:strip="True">
200                                Expand a dataset and select a layer to view
201                        </span>
202                </div>
203                <div class="workarea">
204                        <ul class="draglist" id="layerlist">
205                        </ul>
206                </div>
207        </div>
208</td>
209</tr>
210</table>
211
212</div>
213</div>
214</body>
215</html>
Note: See TracBrowser for help on using the repository browser.