source: TI05-delivery/ows_framework/trunk/ows_server/ows_server/templates/visualise.kid @ 2887

Subversion URL: http://proj.badc.rl.ac.uk/svn/ndg/TI05-delivery/ows_framework/trunk/ows_server/ows_server/templates/visualise.kid@2887
Revision 2887, 6.7 KB checked in by spascoe, 13 years ago (diff)

Changes in Constraints tab are reflected in the visualisation.

I've changed the way the lower tabs work so that events are all dealt
with in Javascript. This was necessary because VisMapBox?
was loosing references to the form objects during AJAX tab reload.

--This line, and those below, will be ignored--

M ows_server/ows_server/public/js/VisMapBox.js
A ows_server/ows_server/public/js/tabber.js
A ows_server/ows_server/public/layout/tabber.css
M ows_server/ows_server/templates/visualise.kid
Line 
1<html py:extends="'ndgPage.kid'" xmlns="http://www.w3.org/1999/xhtml"
2    xmlns:py="http://purl.org/kid/ns#">
3   
4    <div py:def="wmsControl()">
5        <!-- Provides the controls necessary to select layers and time, the
6             bounding box is dealt with by the openlayers javascript
7             directly -->
8    </div>
9       
10    <script py:def="granuleMetadata(granuleDict)" language="javascript">
11
12      var app = null;
13      var control = null;
14     
15      <!--! load the metadata of all selected granules into a javascript object on the browser -->
16      var granules = {
17        <?python granuleNames = granuleDict.keys() ?>
18        <for py:for="granuleName in granuleNames" py:strip="True">
19          <?python
20            granule = granuleDict[granuleName]
21            featureIds = granule.getFeatureList()
22          ?>
23          "${granuleName}": {
24            "wmsURI": "${h.url_for(controller='csml_wms', uri=granuleName)}",
25            <for py:for="featureId in featureIds" py:strip="True">
26              <?python feature = granule.getFeature(featureId) ?>
27              "${featureId}": {
28                name: "${feature.description.CONTENT}",
29                ftype: "${feature.featureType}",
30                <!--!TODO make domain generic.  This is a hack! -->
31                domain: {time: ${str(feature.getDomain()['time'])}}
32              }<if py:if="featureId != featureIds[-1]" py:replace="','"/>
33            </for>
34          }<if py:if="granuleName != granuleNames[-1]" py:replace="','"/>
35        </for>
36      };
37
38      function initVisMapBox() {
39        app = new VisApp('visMap', 'visForm', 600, 10);
40        control = new VisControl(app, granules, 'dsList', 'fList', 'visForm');
41        // Update the vis
42        control.updateVisApp();
43      }
44
45      var tabberOptions = {onLoad: initVisMapBox};
46
47    </script>
48       
49    <div py:def="inpage()">
50        <!-- This provides the user interaction tabbed material below the
51        graphics display -->
52        <?python headers=['Granules','Variables','Constraints']
53        print 'Visible',c.visible
54        status={}
55        for hh in headers:status[hh]='hidden'
56        status[c.visible]='current'
57        ?>
58        <div class="tabber">
59            <!-- This provides the tabs -->
60            <!-- This is the Dataset tab content -->
61            <div id="${headers[0]}" class="tabbertab">
62              <h3>${headers[0]}</h3>
63              <form id="dsList">
64              <ul>
65                <li py:for="uri in c.selections">
66                  <?python selStatus=False
67                    if uri==c.viewedDataset: selStatus=True
68                  ?>
69                ${XML(h.radio_button(name="dataset",value=uri,checked=selStatus, onchange="control.updateVisApp()"))}$uri</li>
70              </ul>
71              </form>
72            </div>
73            <!-- Now we have the variables tab content -->
74            <div id="${headers[1]}" class="tabbertab">
75              <h3>${headers[1]}</h3>
76              <?python
77                features=c.selections[c.viewedDataset].getFeatureList()
78                ii=0
79                localkeys={}
80                print c.selected
81                for u,f in c.selected:
82                    if u==c.viewedDataset: localkeys[f]=(u,f)
83              ?>
84              <h4> $c.viewedDataset</h4>
85              <form id="fList" onchange="control.updateVisApp()">
86                <ul>
87                  <li py:for="featureID in features">
88                    <?python
89                      selStatus=False
90                      if featureID in localkeys:
91                          selStatus=True
92                          feature=c.selected[localkeys[featureID]]
93                      else: feature=c.selections[c.viewedDataset].getFeature(featureID)
94                      name=feature.description.CONTENT
95                      ftype=feature.featureType
96                      checkname='Feature%s'%ii
97                      ii+=1
98                    ?>
99                    ${XML(h.check_box(name=checkname,value=featureID,checked=selStatus, onchange="control.updateVisApp()"))}$name
100                  ($ftype)</li>
101                </ul>
102              </form>
103            </div>
104            <div id="${headers[2]}" class="tabbertab">
105              <!-- Provides the constraints tab -->
106              <h3>${headers[2]}</h3>
107              <ul>
108                <li py:for="u,f in c.selected">$u <ul>
109                <li> $f : ${c.selected[(u,f)].featureType}<br />
110                ${','.join(c.selected[(u,f)].getAxisLabels())}</li>
111              </ul>
112                </li>
113                <li py:if="len(c.selected)==0">There are no features
114                selected, hence no constraints!</li>
115              </ul>
116              <div py:if="c.wmsAvailable">
117                <?python
118                  try:
119                      #use the first one for now
120                      for u,f in c.selected:
121                          i=c.selected[(u,f)]
122                          break
123                      taxis=i.getDomain()[i.getTimeAxis()]
124                      tstep=taxis[0]
125                  except Exception,e:
126                      tstep='Error: [%s] '%str(e)
127                ?>
128                <table>
129                  <tr><td>
130                    <form action="" name="visForm" id="visForm" onchange="control.updateVisApp()">
131                    <table><tr>
132                      <td>Northerly Latitude:</td>
133                      <td colspan="2" align="center">
134                        <input size="7" value="${c.bbox[0]}" name="bboxN" onchange="control.updateVisApp()"/>
135                      </td></tr>
136                      <tr><td>Longitudinal Extent:</td>
137                      <td align="center"><input size="8" value="${c.bbox[1]}" name="bboxW" onchange="control.updateVisApp()"/></td>
138                      <td align="center"><input size="8" value="${c.bbox[2]}" name="bboxE" onchange="control.updateVisApp()"/></td></tr>
139                      <tr><td> Southerly Latitude:</td>
140                      <td colspan="2" align="center">
141                        <input size="7" value="${c.bbox[3]}" name="bboxS" onchange="control.updateVisApp()"/>
142                      </td></tr>
143                      <tr><td colspan="3">(Units: degrees, north and east positive)</td></tr>
144                    </table></form>
145                    </td><td>
146                    <p> Select Time </p>
147                    <p> This version simply uses the first timestep:<br/> $tstep </p>
148                  </td>
149                  </tr>
150                </table>
151              </div>
152            </div>
153        </div>
154       
155    </div>
156    <!-- usertalk -->
157    <div py:if="not c.fullpage" py:replace="inpage()"/>
158   
159    <head py:if="c.fullpage">
160      <replace py:replace="pagehead()" />
161
162      <link type="text/css" rel="stylesheet" href="/layout/tabber.css"/>
163      <script src="/js/OpenLayers.js"/>
164      <script src="/js/openlayers-x.js"/>
165      <script src="/js/VisMapBox.js"/>
166      <!--! granuleMetadata sets tabberOptions so include it first -->
167      <replace py:replace="granuleMetadata(c.selections)"/>
168      <script src="/js/tabber.js"/>
169
170    </head>
171
172    <body py:if="c.fullpage">
173        <div id="entirepage">
174            <div py:replace="header()" />
175            <div py:replace="PageTabs('Visualise')" />
176            <div py:replace="searchOneLine()" />
177            <div id="contents">
178                <div py:if="c.wmsAvailable" class="map" id="visMap" />
179                <p> The visualisation feature is not fully implemented. </p>
180                <div py:if="c.nothing2see">
181                    <p> There are no selected datasets </p>
182                </div>
183                <div py:if="not c.nothing2see">
184                    <div id="graphics"/>
185                   
186                    <div id="$c.inpageid">
187                        <div py:replace="inpage()"/>
188                    </div>
189                </div>
190            </div>
191            <div py:replace="footer()" />
192        </div>
193        <!-- entire page -->
194    </body>
195</html>
Note: See TracBrowser for help on using the repository browser.