source: cowsclient/branches/1.4.x/cowsclient/templates/wcsdown.html @ 6453

Subversion URL: http://proj.badc.rl.ac.uk/svn/ndg/cowsclient/branches/1.4.x/cowsclient/templates/wcsdown.html@6453
Revision 6453, 8.7 KB checked in by pnorton, 11 years ago (diff)

Fixed a problem with clear.gif on the wcsdown page not having the
correct path.

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
85    var bgImagePath = '$g.server/layout/images/clear.gif';
86   
87    var baseLayerData = ${h.jsonParseIfNotEmpty(c.baseLayerJSON)};
88
89    var epUrls = [];
90
91    for (var i = 0; i &lt; defaultEndpoints.length; i ++) {
92        epUrls.push(defaultEndpoints[i].url);
93    }
94   
95    // build endpoint autocomplete
96    Utils.makeCombobox("endpoint", "endpoint_toggle", "endpoint_options", epUrls, onEndpointChange);
97   
98    <py:if test="c.selected_layer != None">
99
100        if (timedata !== null) {
101            var startTime = new SplitSelect('time_container', 'time', timedata, 'Start Time:');
102            startTime.build();
103       
104            var endTime = new SplitSelect('time_end_container', 'time_end', timedata, 'End Time:');
105            endTime.build();
106           
107            setSingleTime('${c.singleTimePoint}' == 'true');
108        }
109       
110        var bboxSelect = new BoundingBoxMapSelect('map', 'bounds_control_container', baseLayerData, 'bbox_hidden_input', null, bgImagePath, null);
111    </py:if>
112
113   
114}
115
116function cleanup() {
117   
118}
119
120function onDownloadClick() {
121    var form = document.getElementById('download_form');
122    form.action = downloadAction;
123    form.target = '_blank';
124    form.submit();
125}
126
127function onRefreshClick() {
128    refresh();
129}
130
131function onEndpointChange() {
132    WMSC.log("Endpoint changed");
133    selectLayerValue("");
134    refresh();
135}
136
137function selectLayerValue(value){
138   
139    var layerSelect = document.getElementById('layer');
140   
141    for (var i=0; i&lt;layerSelect.length; i++) {
142        if (layerSelect.options[i].text == value) {
143            layerSelect.options[i].selected = true;
144            break;
145        }
146    }
147}
148
149function onLayerChange() {
150    refresh();
151}
152
153function setSingleTime(value) {
154    var timeEndContainer = document.getElementById('time_end_container');
155    var singleTimeCB = document.getElementById('single_time');
156    var startTimeLabel = document.getElementById('time_label');
157   
158    if (value) {
159        timeEndContainer.style.display = "none";
160        startTimeLabel.innerHTML = "Time :"
161    }
162    else {
163        timeEndContainer.style.display = "block";
164        startTimeLabel.innerHTML = "Start Time :"
165    }
166   
167    singleTimeCB.checked = value
168}
169
170function refresh() {
171    var form = document.getElementById('download_form');
172    form.action = refreshAction;
173    form.target = '';
174    form.submit();
175}
176
177</script>
178
179</head>
180
181<body onload="init()" onunload="cleanup()" class="yui-skin-sam">
182       
183    <span>
184        <py:replace value="c.message">Message placeholder</py:replace>
185    </span>
186   
187   
188   
189    <div id="page_content">
190   
191        <h1 id="page_title">WCS Download</h1>
192   
193        <div id="download_form_container">
194            <form id="download_form" method="get" > 
195                   
196                <div id="data_container">
197                    <h4>Data Selection</h4>
198                   
199                   
200                    <div py:def="autocompleteMarkup" id='endpoint_autocomplete' style='display:inline;'>
201                        ${h.html_tags.text('endpoint', id='endpoint', value=c.endpoint)}
202                        <span id="endpoint_toggle"></span>
203                        <div id="endpoint_options"></div>
204                    </div>
205                   
206                    ${makeInput('endpoint','Endpoint :', autocompleteMarkup())}
207                   
208                    ${makeSelectInput('layer', c.selected_layer, c.layer_options, label='Layer :', onChange='onLayerChange();')}
209                   
210                    <py:if test="c.selected_layer != None">
211                   
212                        ${makeSelectInput('format', c.selected_format, c.format_options, label='Format :')}
213                        ${makeSelectInput('crs', c.selected_crs, c.crs_options, label='CRS :')}
214
215                    </py:if>
216               
217                </div>
218               
219                <py:if test="c.selected_layer != None">
220               
221                    <div id="bounding_container">
222                   
223                        <h4>Bounding Box</h4>   
224                        <div id="bounds_control_container"></div>
225                       
226                        <div id="map_container">
227                            <div id='map'></div>
228                        </div>   
229
230                        ${h.html_tags.hidden(name='bbox', id='bbox_hidden_input', value=c.selected_bbox)}
231   
232                    </div>
233   
234                    <div id="dimensions_container">
235                        <h4>Dimensions</h4>
236                       
237                        ${makeCheckboxInput('single_time', label='Single Time Point :', value='true', onClick="setSingleTime(this.checked);")}
238                       
239                        <div id="time_container" class="input_item"> </div>
240                        <div id="time_end_container" class="input_item"> </div>
241                    </div>
242                   
243                </py:if>
244               
245               
246                <div id="form_control_buttons">
247                    <input type="button" value="Download" onClick="onDownloadClick();"></input>
248               
249                    <input type="button" value="Refresh" onClick="onRefreshClick();"></input>
250                   
251                    <br class="clear" />
252                </div>
253       
254            </form>
255        </div>
256    </div>   
257
258</body>
259</html>
Note: See TracBrowser for help on using the repository browser.