source: cowsclient/trunk/cowsclient/templates/wcsdown.html @ 6397

Subversion URL: http://proj.badc.rl.ac.uk/svn/ndg/cowsclient/trunk/cowsclient/templates/wcsdown.html@6397
Revision 6397, 8.6 KB checked in by pnorton, 11 years ago (diff)

Modified the WCS code to work with the csml files in folders in the same way as the WMS code.

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
5<py:def function="makeInput(name, label=None, inputHTML='')">
6    <?python
7        # This function makes a div, label + input html structure for a single input item
8   
9        labelAtts = {'for':name, 'id':name+'_label'}
10        divAtts = {'id':name+'_container'}
11
12        if label == None:
13            label = name
14    ?>
15    <div class="input_item" py:attrs="divAtts">
16        <label py:attrs="labelAtts">${label}</label>
17        ${inputHTML}
18    </div>
19</py:def>
20
21<py:def function="makeSelectInput(name, selected_value, options, label=None, default=None, **atts)">
22    <?python
23        inputHTML = h.html_tags.select(name, selected_value, options,  **atts)
24    ?>
25    ${makeInput(name, label, inputHTML)}
26</py:def>
27
28<py:def function="makeCheckboxInput(name, label=None, default=None, **atts)">
29    <?python
30        inputHTML = h.html_tags.checkbox(name, **atts)
31    ?>
32    ${makeInput(name, label, inputHTML)}
33</py:def>
34
35
36<head>
37
38
39<!-- YUI imports for autocomplete -->
40
41<link rel="stylesheet" type="text/css" href="$g.server/js/yui_2.7.0b/fonts/fonts.css" />
42<link rel="stylesheet" type="text/css" href="$g.server/js/yui_2.7.0b/button/assets/skins/sam/button.css" />
43<link rel="stylesheet" type="text/css" href="$g.server/js/yui_2.7.0b/autocomplete/assets/skins/sam/autocomplete.css" />
44
45<!-- <script type="text/javascript" src="$g.server/js/yui_2.7.0b/yahoo-dom-event/yahoo-dom-event.js"></script> -->
46<script type="text/javascript" src="$g.server/js/yui_2.7.0b/yahoo/yahoo.js"></script>
47<script type="text/javascript" src="$g.server/js/yui_2.7.0b/event/event.js"></script>
48<script type="text/javascript" src="$g.server/js/yui_2.7.0b/dom/dom.js"></script>
49<script type="text/javascript" src="$g.server/js/yui_2.7.0b/animation/animation.js"></script>
50<script type="text/javascript" src="$g.server/js/yui_2.7.0b/element/element.js"></script>
51<script type="text/javascript" src="$g.server/js/yui_2.7.0b/button/button.js"></script>
52<script type="text/javascript" src="$g.server/js/yui_2.7.0b/datasource/datasource.js"></script>
53<script type="text/javascript" src="$g.server/js/yui_2.7.0b/autocomplete/autocomplete.js"></script>
54<script type="text/javascript" src="$g.server/js/yui_2.7.0b/event/event.js"></script>
55
56<!--script type="text/javascript" src="$g.server/js/yui/build/datasource/datasource.js"></script-->
57<!-- End of autocomplete imports -->
58
59<script type="text/javascript" src="${h.getOpenLayersImportPath()}"></script>
60<script type="text/javascript" src="$g.server/js/openlayers-x.js"></script>
61
62<link rel="stylesheet" type="text/css" href="$g.server/layout/wcdown.css" />
63<link rel="stylesheet" type="text/css" href="$g.server/layout/yui_autocomplete.css" />
64
65
66<script src="$g.server/js/wmsc.js"></script>
67<script src="$g.server/js/boundingBoxMapSelect.js"></script>
68<script src="$g.server/js/boundsControl.js"></script>
69<script src="$g.server/js/json2.js"></script>
70<script src="$g.server/js/splitSelect.js"></script>
71<script src="$g.server/js/utils.js"></script>
72<script src="$g.server/js/endpoint.js"></script>
73
74<script type="text/javascript">
75
76var downloadAction ="$g.server/wcsdown/download";
77var refreshAction = "$g.server/wcsdown";
78
79var timedata = ${h.jsonParseIfNotEmpty(c.timedata)};
80var defaultEndpoints = ${h.jsonParseIfNotEmpty(c.defaultWCSEndpoints)};
81
82function init() {
83
84    var baseLayerData = ${h.jsonParseIfNotEmpty(c.baseLayerJSON)};
85
86    var epUrls = [];
87
88    for (var i = 0; i &lt; defaultEndpoints.length; i ++) {
89        epUrls.push(defaultEndpoints[i].url);
90    }
91   
92    // build endpoint autocomplete
93    Utils.makeCombobox("endpoint", "endpoint_toggle", "endpoint_options", epUrls, onEndpointChange);
94   
95    <py:if test="c.selected_layer != None">
96
97        if (timedata !== null) {
98            var startTime = new SplitSelect('time_container', 'time', timedata, 'Start Time:');
99            startTime.build();
100       
101            var endTime = new SplitSelect('time_end_container', 'time_end', timedata, 'End Time:');
102            endTime.build();
103           
104            setSingleTime('${c.singleTimePoint}' == 'true');
105        }
106       
107        var bboxSelect = new BoundingBoxMapSelect('map', 'bounds_control_container', baseLayerData,  'bbox_hidden_input', null);
108    </py:if>
109
110   
111}
112
113function cleanup() {
114   
115}
116
117function onDownloadClick() {
118    var form = document.getElementById('download_form');
119    form.action = downloadAction;
120    form.target = '_blank';
121    form.submit();
122}
123
124function onRefreshClick() {
125    refresh();
126}
127
128function onEndpointChange() {
129    WMSC.log("Endpoint changed");
130    selectLayerValue("");
131    refresh();
132}
133
134function selectLayerValue(value){
135   
136    var layerSelect = document.getElementById('layer');
137   
138    for (var i=0; i&lt;layerSelect.length; i++) {
139        if (layerSelect.options[i].text == value) {
140            layerSelect.options[i].selected = true;
141            break;
142        }
143    }
144}
145
146function onLayerChange() {
147    refresh();
148}
149
150function setSingleTime(value) {
151    var timeEndContainer = document.getElementById('time_end_container');
152    var singleTimeCB = document.getElementById('single_time');
153    var startTimeLabel = document.getElementById('time_label');
154   
155    if (value) {
156        timeEndContainer.style.display = "none";
157        startTimeLabel.innerHTML = "Time :"
158    }
159    else {
160        timeEndContainer.style.display = "block";
161        startTimeLabel.innerHTML = "Start Time :"
162    }
163   
164    singleTimeCB.checked = value
165}
166
167function refresh() {
168    var form = document.getElementById('download_form');
169    form.action = refreshAction;
170    form.target = '';
171    form.submit();
172}
173
174</script>
175
176</head>
177
178<body onload="init()" onunload="cleanup()" class="yui-skin-sam">
179       
180    <span>
181        <py:replace value="c.message">Message placeholder</py:replace>
182    </span>
183   
184   
185   
186    <div id="page_content">
187   
188        <h1 id="page_title">WCS Download</h1>
189   
190        <div id="download_form_container">
191            <form id="download_form" method="get" > 
192                   
193                <div id="data_container">
194                    <h4>Data Selection</h4>
195                   
196                   
197                    <div py:def="autocompleteMarkup" id='endpoint_autocomplete' style='display:inline;'>
198                        ${h.html_tags.text('endpoint', id='endpoint', value=c.endpoint)}
199                        <span id="endpoint_toggle"></span>
200                        <div id="endpoint_options"></div>
201                    </div>
202                   
203                    ${makeInput('endpoint','Endpoint :', autocompleteMarkup())}
204                   
205                    ${makeSelectInput('layer', c.selected_layer, c.layer_options, label='Layer :', onChange='onLayerChange();')}
206                   
207                    <py:if test="c.selected_layer != None">
208                   
209                        ${makeSelectInput('format', c.selected_format, c.format_options, label='Format :')}
210                        ${makeSelectInput('crs', c.selected_crs, c.crs_options, label='CRS :')}
211
212                    </py:if>
213               
214                </div>
215               
216                <py:if test="c.selected_layer != None">
217               
218                    <div id="bounding_container">
219                   
220                        <h4>Bounding Box</h4>   
221                        <div id="bounds_control_container"></div>
222                       
223                        <div id="map_container">
224                            <div id='map'></div>
225                        </div>   
226
227                        ${h.html_tags.hidden(name='bbox', id='bbox_hidden_input', value=c.selected_bbox)}
228   
229                    </div>
230   
231                    <div id="dimensions_container">
232                        <h4>Dimensions</h4>
233                       
234                        ${makeCheckboxInput('single_time', label='Single Time Point :', value='true', onClick="setSingleTime(this.checked);")}
235                       
236                        <div id="time_container" class="input_item"> </div>
237                        <div id="time_end_container" class="input_item"> </div>
238                    </div>
239                   
240                </py:if>
241               
242               
243                <div id="form_control_buttons">
244                    <input type="button" value="Download" onClick="onDownloadClick();"></input>
245               
246                    <input type="button" value="Refresh" onClick="onRefreshClick();"></input>
247                   
248                    <br class="clear" />
249                </div>
250       
251            </form>
252        </div>
253    </div>   
254
255</body>
256</html>
Note: See TracBrowser for help on using the repository browser.