You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cmda.apache.org by xi...@apache.org on 2015/09/05 02:20:19 UTC
[15/50] [abbrv] incubator-cmda git commit: delete comments
http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/f22b3e32/app/views/climate/threeDVariableTwoDSlice.scala.html
----------------------------------------------------------------------
diff --git a/app/views/climate/threeDVariableTwoDSlice.scala.html b/app/views/climate/threeDVariableTwoDSlice.scala.html
index e6421df..24273f2 100644
--- a/app/views/climate/threeDVariableTwoDSlice.scala.html
+++ b/app/views/climate/threeDVariableTwoDSlice.scala.html
@@ -1,23 +1,18 @@
-@(parameters: metadata.ThreeDVar2DSlice)
-
-@import helper._
-
+@(parameters: metadata.ThreeDVar2DSlice) @import helper._
<link rel="stylesheet"
href='@routes.Assets.at("stylesheets/livefitler.css")'>
-
@scripts = {
- <script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
- <script src='@routes.Assets.at("javascripts/livefilter.js")'></script>
- <script type="text/javascript" src='@routes.Assets.at("javascripts/jquery-1.9.0.min.js")'></script>
- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.min.js"></script>
- <script type="text/javascript" src='@routes.Assets.at("javascripts/json2.js")'></script>
- <script type="text/javascript" src="@routes.Assets.at("javascripts/xmisc.js")"></script>
- <script type="text/javascript">
-
+<script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
+<script src='@routes.Assets.at("javascripts/livefilter.js")'></script>
+<script type="text/javascript"
+ src='@routes.Assets.at("javascripts/jquery-1.9.0.min.js")'></script>
+<script type="text/javascript" src="https:
+ <script type="
+ text/javascript" src='@routes.Assets.at("javascripts/json2.js")'></script>
+<script type="text/javascript" src="@routes.Assets.at("javascripts/xmisc.js")"></script>
+<script type="text/javascript">
var Response = null;
var variable = "";
-
- // called on load or reload
window.onload = function() {
changeMonths();
changeDataSource();
@@ -47,23 +42,16 @@
$('#radioLog').prop( "checked", true );
}
}
-
-
- // disable download data button
function disable_download_button()
{
var x=document.getElementById("download_data");
x.disabled=true;
}
-
-
- // enable download data button
function enable_download_button()
{
var x=document.getElementById("download_data");
x.disabled=false;
}
-
function changeMonths(){
var months = $("#monthsPara").text();
var temp = months.split(", ");
@@ -95,8 +83,6 @@
}
}
}
-
- // select all months in the checkboxes
function select_all_months()
{
document.getElementById('Jan').checked = true;
@@ -112,8 +98,6 @@
document.getElementById('Nov').checked = true;
document.getElementById('Dec').checked = true;
}
-
- // see if no month is selected
function no_month_check()
{
if (document.getElementById('Jan').checked == false &&
@@ -128,14 +112,11 @@
document.getElementById('Oct').checked == false &&
document.getElementById('Nov').checked == false &&
document.getElementById('Dec').checked == false) {
- // alert("No month check!");
return true;
}
else
return false;
}
-
- // unselect all months in the checkboxes
function reset_months()
{
document.getElementById('Jan').checked = false;
@@ -151,12 +132,9 @@
document.getElementById('Nov').checked = false;
document.getElementById('Dec').checked = false;
}
-
- // enable all vars in dropdown menu
function reset_vars()
{
var x=document.getElementById("var");
-
x.options[0].disabled=false;
x.options[1].disabled=false;
x.options[2].disabled=false;
@@ -166,15 +144,10 @@
x.options[6].disabled=false;
x.options[7].disabled=false;
}
-
- // form variable string based on "var" dropdown selection
function select_var()
{
var var_string = $("#var").val();
-
- // disable the download button because of this change
disable_download_button();
-
if (var_string == "Air Temperature")
variable = "ta";
else if (var_string == "Specific Humidity")
@@ -191,28 +164,15 @@
variable = "wap";
else if (var_string == "Relative Humidity")
variable = "hur";
-
- // alert("variable: " + variable)
}
-
- // set up "var" dropdown based status of "data" dropdown
function select_data()
{
var data_string = $("#data").val();
var x=document.getElementById("var");
-
- // disable the download button because of this change
disable_download_button();
-
- // enable all options in "var" dropdown first
reset_vars();
-
- // alert(data_string);
-
- // disable corresponding "var" options
if (data_string == "NASA/AIRS") {
x.options[0].selected=true;
- //x.options[1].selected=true;
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].disabled=true;
@@ -222,7 +182,6 @@
}
else if (data_string == "NASA/MLS") {
x.options[0].selected=true;
- //x.options[1].selected=true;
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].disabled=true;
@@ -236,7 +195,6 @@
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].selected=true;
- //x.options[5].selected=true;
x.options[6].disabled=true;
x.options[7].disabled=true;
}
@@ -247,26 +205,17 @@
x.options[3].disabled=true;
x.options[4].disabled=true;
x.options[5].disabled=true;
- //x.options[6].disabled=true;
- //x.options[7].disabled=true;
x.options[6].selected=true;
}
- else { // models
+ else {
x.options[0].selected=true;
- //x.options[1].selected=true;
- //x.options[2].selected=true;
- //x.options[3].selected=true;
x.options[4].disabled=true;
x.options[5].disabled=true;
}
-
- // form variable string
select_var();
}
-
function changeDataSource(){
var dataSource = $('#dataSource').text();
- //dataSource = "NASA_QuikSCAT";
var x = document.getElementById("data");
if(dataSource == "NASA_AIRS" ){
x.options[0].selected=true;
@@ -319,9 +268,7 @@
else if(dataSource == "ECMWF_interim" ){
x.options[16].selected=true;
}
- //$('#data option:contains('+dataSource+')').prop({selected: true});
}
-
function changeVariableName(){
var var_string = $('#variableName').text();
var x = document.getElementById("var");
@@ -342,229 +289,145 @@
else if (var_string == "hur")
x.options[7].selected=true;
}
-
- // select checkboxes based on "months" dropdown
function select_months()
{
var s1=document.getElementById("months");
- // alert(s1.selectedIndex);
- // alert(s1.options[s1.selectedIndex].value);
-
- // disable the download button because of this change
disable_download_button();
-
- // "select none"
if (s1.selectedIndex == 1) {
reset_months();
}
- // "select all"
if (s1.selectedIndex == 0) {
select_all_months();
}
- // "summer"
if (s1.selectedIndex == 2) {
reset_months();
document.getElementById('Jun').checked = true;
document.getElementById('Jul').checked = true;
document.getElementById('Aug').checked = true;
}
- // "autumn"
if (s1.selectedIndex == 3) {
reset_months();
document.getElementById('Sep').checked = true;
document.getElementById('Oct').checked = true;
document.getElementById('Nov').checked = true;
}
- // "winter"
if (s1.selectedIndex == 4) {
reset_months();
document.getElementById('Dec').checked = true;
document.getElementById('Jan').checked = true;
document.getElementById('Feb').checked = true;
}
- // "spring"
if (s1.selectedIndex == 5) {
reset_months();
document.getElementById('Mar').checked = true;
document.getElementById('Apr').checked = true;
document.getElementById('May').checked = true;
}
-
}
-
$(document).ready(function(){
-
- /*$("a").click(function(event){
- alert("As you can see, the link no longer took you to jquery.com");
- event.preventDefault();
- });*/
-
-
$("#download_data").click(function(event) {
var durl = $("#data_url").val();
- // alert(durl);
window.location.assign(durl);
});
-
-
$("#twodvarmap").click(function(event) {
Response = null;
-
- // no data to download yet
disable_download_button();
-
- // flag error if no month box is checked
if (no_month_check()) {
- // $("#Response").html("<span style='color:red'>Error: please check at least one month.</span>");
$("#Response").html("Error: please check at least one month.");
$("#Image").html("");
return;
}
-
$("#Response").html("Calculating ...");
$("#data_url").html("Calculating ...");
$("#Image").html("");
-
- // sample url: http://cmacws.jpl.nasa.gov:9002/svc/twoDimSlice3D?model=UKMO_HadGEM2-ES&var=hus&start_time=199001&end_time=199512&pr=80000&lon1=0&lon2=20&lat1=-29&lat2=29&months=1,2,3,4,5,6,7,8,9,10,11,12
-
- // form url string
- // var url = "http://cmacws.jpl.nasa.gov:9002/svc/twoDimSlice3D?";
- var url = "http://" + window.location.hostname + ":9002/svc/twoDimSlice3D?";
- // alert(url);
-
+ var url = "http:
var d1 = $("#data").val();
var model1 = d1.replace("/", "_");
-
var arglist = "";
arglist = arglist.concat("model=");
arglist = arglist.concat(model1);
-
var v1 = $("#var").val();
arglist = arglist.concat("&var=");
arglist = arglist.concat(variable);
-
var t0 = $("#t0").val();
var t1 = $("#t1").val();
-
t0 = t0.replace("-", "");
t1 = t1.replace("-", "");
-
arglist = arglist.concat("&start_time=");
arglist = arglist.concat(t0);
-
arglist = arglist.concat("&end_time=");
arglist = arglist.concat(t1);
-
var pres = $("#pres").val();
- // alert("variable: " + variable);
-
- // when variable is the 3D Ocean Salinity or Ocean Temperature
if (variable == 'ot' || variable == 'os')
- pres = pres * 10000; // convert from dbar on GUI
- // when variable is 2D
+ pres = pres * 10000;
else
- pres = pres * 100; // convert from hPa on GUI
-
+ pres = pres * 100;
arglist = arglist.concat("&pr=");
arglist = arglist.concat(pres);
-
var lon0 = $("#lon0").val();
var lon1 = $("#lon1").val();
var lat0 = $("#lat0").val();
var lat1 = $("#lat1").val();
-
arglist = arglist.concat("&lon1=");
arglist = arglist.concat(lon0);
-
arglist = arglist.concat("&lon2=");
arglist = arglist.concat(lon1);
-
arglist = arglist.concat("&lat1=");
arglist = arglist.concat(lat0);
-
arglist = arglist.concat("&lat2=");
arglist = arglist.concat(lat1);
-
var s1 = document.getElementById('months');
-
- // get months checked by client
var month_str = "";
-
var mm = document.getElementById('Jan');
if (mm.checked == true)
month_str = month_str.concat(",1");
-
var mm = document.getElementById('Feb');
if (mm.checked == true)
month_str = month_str.concat(",2");
-
var mm = document.getElementById('Mar');
if (mm.checked == true)
month_str = month_str.concat(",3");
-
var mm = document.getElementById('Apr');
if (mm.checked == true)
month_str = month_str.concat(",4");
-
var mm = document.getElementById('May');
if (mm.checked == true)
month_str = month_str.concat(",5");
-
var mm = document.getElementById('Jun');
if (mm.checked == true)
month_str = month_str.concat(",6");
-
var mm = document.getElementById('Jul');
if (mm.checked == true)
month_str = month_str.concat(",7");
-
var mm = document.getElementById('Aug');
if (mm.checked == true)
month_str = month_str.concat(",8");
-
var mm = document.getElementById('Sep');
if (mm.checked == true)
month_str = month_str.concat(",9");
-
var mm = document.getElementById('Oct');
if (mm.checked == true)
month_str = month_str.concat(",10");
-
var mm = document.getElementById('Nov');
if (mm.checked == true)
month_str = month_str.concat(",11");
-
var mm = document.getElementById('Dec');
if (mm.checked == true)
month_str = month_str.concat(",12");
-
- // remove the leading ','
month_str = month_str.substr(1);
- // alert(month_str);
-
arglist = arglist.concat("&months=");
arglist = arglist.concat(month_str);
- // alert("arglist: " + arglist);
-
arglist = arglist.concat("&scale=");
var z = document.getElementById("radioLin").checked;
- // alert(z);
if (z == true)
arglist = arglist.concat('0');
else
arglist = arglist.concat('4');
-
var purpose = $("#purpose").val();
arglist = arglist.concat("&purpose=");
arglist = arglist.concat(purpose);
-
- // url = url + encodeURIComponent(arglist);
url = url + encodeURI(arglist);
- // url = url + arglist;
- //alert("url: " + url);
-
-
- var urlTimeBounds = "http://" + window.location.hostname + ":9002/svc/time_bounds?";
+ var urlTimeBounds = "http:
var arglistTB = "";
arglistTB = arglistTB.concat("serviceType=");
arglistTB = arglistTB.concat("1");
@@ -573,8 +436,6 @@
arglistTB = arglistTB.concat("&var=");
arglistTB = arglistTB.concat(variable);
urlTimeBounds = urlTimeBounds + encodeURI(arglistTB);
- // alert("urlTimeBounds: " + urlTimeBounds);
-
$.ajax({
type: "GET",
url: urlTimeBounds,
@@ -582,9 +443,7 @@
data: null,
success: function(data, textStatus, xhr) {
Response = data;
- // alert("data: " + data);
if (data.success == false) {
- // alert(data.error);
Response = null;
var text = JSON.stringify(data, null, 4);
text = "Error in backend: <br>" + text;
@@ -593,44 +452,29 @@
return;
}
var text = JSON.stringify(data, null, 4);
- // alert("text: " + text);
- // $("#Response").html("<pre>"+text+"</pre>");
- // $("#Response").html(text);
-
var tb = data.time_bounds;
var bds = String(tb).split(",");
- // alert("tb: " + tb);
- // alert("bds: " + bds);
var lowerT = parseInt(bds[0]);
var upperT = parseInt(bds[1]);
- // alert("lowerT: " + lowerT);
- // alert("upperT: " + upperT);
var t0I = parseInt(t0);
var t1I = parseInt(t1);
- // alert("t0: " + t0I);
- // alert("t1: " + t1I);
-
if ( lowerT == 0 && upperT ==0 ) {
alert("We do not have data for this source and variable configuration.");
return;
}
-
if (t0I < lowerT && t1I < lowerT ||
t0I > upperT && t1I > upperT) {
alert("We do not have data that span your time range. Try the range inside ["+lowerT+", "+upperT+"].");
return;
}
-
if (t0I < lowerT && t1I <= upperT) {
alert("Your start year-month is out of bound. It has to be in or later than " + lowerT +
". We will use the range ["+lowerT+", "+t1I+"] for you.");
}
-
if (t1I > upperT && t0I >= lowerT) {
alert("Your end year-month is out of bound. It has to be in or earlier than " + upperT +
". We will use the range ["+t0I+", "+upperT+"] for you.");
}
-
if (t0I < lowerT && t1I > upperT ) {
alert("Both of your start and end year-months are out of bounds. They have to be in or earlier than " + upperT +
", and in or later than " + lowerT + ". We will use the range ["+lowerT+", "+upperT+"] for you.");
@@ -639,15 +483,10 @@
error: function(xhr, textStatus, errorThrown) {
$("#Response").html("error!");
$("#data_url").html("error!");
- // alert("xhr.status: "+xhr.status);
- // alert("error status: "+textStatus);
},
complete: function(xhr, textStatus) {
- //alert("complete status: "+textStatus);
}
});
-
-
$.ajax({
type: "GET",
url: url,
@@ -655,53 +494,33 @@
data: null,
success: function(data, textStatus, xhr) {
Response = data;
- // alert("data: " + data);
if (data.success == false) {
- // alert(data.error);
Response = null;
var text = JSON.stringify(data, null, 4);
text = "Error in backend: <br>" + text;
- // $("#Response").html("<span style='color:red'>" + text + "</span>");
$("#Response").html(text);
$("#data_url").html(text);
return;
}
var text = JSON.stringify(data, null, 4);
- // alert(text);
- // $("#Response").html("<pre>"+text+"</pre>");
$("#Response").html(text);
-
var html1 = "<img src='"+data.url+"' width='680'/>";
- // alert(html1);
$("#Image").html(html1);
-
- // post dataUrl to textarea and enable download button
$("#data_url").html(data.dataUrl);
enable_download_button();
},
error: function(xhr, textStatus, errorThrown) {
$("#Response").html("error!");
$("#data_url").html("error!");
- // alert("xhr.status: "+xhr.status);
- // alert("error status: "+textStatus);
},
complete: function(xhr, textStatus) {
- //alert("complete status: "+textStatus);
}
});
-
});
-
-
});
-
</script>
- }
-
- @main("Parameters of ConfId", scripts){
-
- @flash_message()
- <p>
+} @main("Parameters of ConfId", scripts){ @flash_message()
+<p>
<div id="dataSource" style="display: none;">@parameters.getDataSource()</div>
<div id="variableName" style="display: none;">@parameters.getVariableName()</div>
<div id="startYearMonth" style="display: none;">@parameters.getStartYearMonth()</div>
@@ -719,160 +538,154 @@
<div id="dataURL" style="display: none;">@parameters.getDataURL()</div>
<div id="serviceResponseText" style="display: none;">@parameters.getServiceResponseText()</div>
<table border="1" width="800" align="center">
-
-<tr>
-<td colspan="4">
-<center>
-<b>Service: 3-D Variable 2-D Slice</b><br><br>
-This service generates a slice map of a 3-dimensional variable at a selected pressure level. <br>
-Select a data source, a variable name, a time range, a spatial range, and a pressure level below.<br><br>
-</center>
-</td>
-</tr>
-
-<tr>
-<td>data source:</td><td><select name="data", id="data" onchange="select_data()">
-<optgroup label="Observation">
-<option selected="NASA/AIRS">NASA/AIRS</option>
-<option>NASA/MLS</option>
-<option>ARGO/ARGO</option>
-</optgroup>
-<optgroup label="Model: Historical">
-<option>CCCMA/CANESM2</option>
-<option>GFDL/ESM2G</option>
-<option>GISS/E2-H</option>
-<option>GISS/E2-R</option>
-<option>NCAR/CAM5</option>
-<option>NCC/NORESM</option>
-<option>UKMO/HadGEM2-ES</option>
-</optgroup>
-<optgroup label="Model: AMIP">
-<option>CCCMA/CANAM4</option>
-<option>CSIRO/MK3.6</option>
-<option>GFDL/CM3</option>
-<option>IPSL/CM5A-LR</option>
-<option>MIROC/MIROC5</option>
-<option>UKMO/HadGEM2-A</option>
-</optgroup>
-</optgroup>
-<optgroup label="Reanalysis">
-<option>ECMWF/interim</option>
-</select></td>
-
-<td>variable name:</td><td><select name="var", id="var" onchange="select_var()">
-<option>Air Temperature</option>
-<option>Specific Humidity</option>
-<option>Cloud Ice Water Content</option>
-<option>Cloud Liquid Water Content</option>
-<option>Ocean Temperature</option>
-<option>Ocean Salinity</option>
-<option>Vertical Wind Velocity</option>
-<option>Relative Humidity</option>
-</select></td>
-</tr>
-
-<tr>
-<td>start year-month:</td><td><input id="t0" value="2004-01" alt="start"/></td>
-<td>end year-month:</td><td><input id="t1" value="2004-12" alt="end"/></td>
-</tr>
-
-<tr>
-<td>select months:</td>
-<td><select name="months" id="months" onchange="select_months()">
-<option id="all">select all</option>
-<option id="none">select none</option>
-<option id="summer">Summer:Jun-Jul-Aug</option>
-<option id="autum">Autumn:Sep-Oct-Nov</option>
-<option id="winter">Winter:Dec-Jan-Feb</option>
-<option id="spring">Spring:Mar-Apr-May</option> </select>
-</td>
-<td>
-atmosphere pressure level (hPa) <br> or ocean pressure level (dbar)
-</td>
-<td>
-<input id="pres" value="500" alt="pressure"/>
-</td>
-</tr>
-
-<tr>
-<td>
-<label><input type="checkbox" name="option1" id="Jan" value="Jan" /> Jan<br></label>
-<label><input type="checkbox" name="option1" id="Feb" value="Feb" /> Feb<br></label>
-<label><input type="checkbox" name="option1" id="Mar" value="Mar" /> Mar<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Apr" value="Apr" /> Apr<br></label>
-<label><input type="checkbox" name="option1" id="May" value="May" /> May<br></label>
-<label><input type="checkbox" name="option1" id="Jun" value="Jun" /> Jun<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Jul" value="Jul" /> Jul<br></label>
-<label><input type="checkbox" name="option1" id="Aug" value="Aug" /> Aug<br></label>
-<label><input type="checkbox" name="option1" id="Sep" value="Sep" /> Sep<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Oct" value="Oct" /> Oct<br></label>
-<label><input type="checkbox" name="option1" id="Nov" value="Nov" /> Nov<br></label>
-<label><input type="checkbox" name="option1" id="Dec" value="Dec" /> Dec<br></label>
-</td>
-</tr>
-
-<tr>
-<td>start lat (deg):</td><td><input id="lat0" value="-90"/></td>
-<td>end lat (deg):</td><td><input id="lat1" value="90"/></td>
-</tr>
-
-<tr>
-<td>start lon (deg):</td><td><input id="lon0" value="0"/></td>
-<td>end lon (deg):</td><td><input id="lon1" value="360"/></td>
-</tr>
-
-<tr>
-<td colspan="1">
-color scale:
-</td>
-<td colspan="3">
-<form> <input type="radio" name="scale1" value="linear" id="radioLin" checked>linear
-<input type="radio" name="scale1" value="logarithmic" id="radioLog">logarithmic
-</form>
-</td>
-</tr>
-
-<tr>
-<td colspan="1">
-Execution purpose
-</td>
-<td colspan="3">
-<form>
-<textarea name="purpose" id="purpose" rows="4" cols="50"> </textarea>
-</form>
-</td>
-</tr>
-
-<tr>
-<td colspan="2" align="center"><input id="twodvarmap" type="submit" value=" Run Again " style="height:28px"/></td>
-<form>
-<td colspan="2" align="center"><input id="download_data" type="button" value="Download Data" style="height:28px"/>
-</td>
-</form>
-</tr>
-
-<tr>
-<td colspan="4">
-<div id="Image">Image Here</div>
-</td>
-</tr>
-<tr>
-<td colspan="4" align="center">
-<textarea readonly id="data_url" cols="89" rows="2">Data URL Here</textarea>
-</td>
-</tr>
-<tr>
-<td colspan="4" align="center">
-<textarea readonly id="Response" cols="89" rows="6">Service Response Text Here</textarea>
-</td>
-</tr>
-</p>
-
+ <tr>
+ <td colspan="4">
+ <center>
+ <b>Service: 3-D Variable 2-D Slice</b><br>
+ <br> This service generates a slice map of a 3-dimensional
+ variable at a selected pressure level. <br> Select a data
+ source, a variable name, a time range, a spatial range, and a
+ pressure level below.<br>
+ <br>
+ </center>
+ </td>
+ </tr>
+ <tr>
+ <td>data source:</td>
+ <td><select name="data" , id="data" onchange="select_data()">
+ <optgroup label="Observation">
+ <option selected="NASA/AIRS">NASA/AIRS</option>
+ <option>NASA/MLS</option>
+ <option>ARGO/ARGO</option>
+ </optgroup>
+ <optgroup label="Model: Historical">
+ <option>CCCMA/CANESM2</option>
+ <option>GFDL/ESM2G</option>
+ <option>GISS/E2-H</option>
+ <option>GISS/E2-R</option>
+ <option>NCAR/CAM5</option>
+ <option>NCC/NORESM</option>
+ <option>UKMO/HadGEM2-ES</option>
+ </optgroup>
+ <optgroup label="Model: AMIP">
+ <option>CCCMA/CANAM4</option>
+ <option>CSIRO/MK3.6</option>
+ <option>GFDL/CM3</option>
+ <option>IPSL/CM5A-LR</option>
+ <option>MIROC/MIROC5</option>
+ <option>UKMO/HadGEM2-A</option>
+ </optgroup>
+ </optgroup>
+ <optgroup label="Reanalysis">
+ <option>ECMWF/interim</option>
+ </select></td>
+ <td>variable name:</td>
+ <td><select name="var" , id="var" onchange="select_var()">
+ <option>Air Temperature</option>
+ <option>Specific Humidity</option>
+ <option>Cloud Ice Water Content</option>
+ <option>Cloud Liquid Water Content</option>
+ <option>Ocean Temperature</option>
+ <option>Ocean Salinity</option>
+ <option>Vertical Wind Velocity</option>
+ <option>Relative Humidity</option>
+ </select></td>
+ </tr>
+ <tr>
+ <td>start year-month:</td>
+ <td><input id="t0" value="2004-01" alt="start" /></td>
+ <td>end year-month:</td>
+ <td><input id="t1" value="2004-12" alt="end" /></td>
+ </tr>
+ <tr>
+ <td>select months:</td>
+ <td><select name="months" id="months" onchange="select_months()">
+ <option id="all">select all</option>
+ <option id="none">select none</option>
+ <option id="summer">Summer:Jun-Jul-Aug</option>
+ <option id="autum">Autumn:Sep-Oct-Nov</option>
+ <option id="winter">Winter:Dec-Jan-Feb</option>
+ <option id="spring">Spring:Mar-Apr-May</option>
+ </select></td>
+ <td>atmosphere pressure level (hPa) <br> or ocean pressure
+ level (dbar)
+ </td>
+ <td><input id="pres" value="500" alt="pressure" /></td>
+ </tr>
+ <tr>
+ <td><label><input type="checkbox" name="option1" id="Jan"
+ value="Jan" /> Jan<br></label> <label><input type="checkbox"
+ name="option1" id="Feb" value="Feb" /> Feb<br></label> <label><input
+ type="checkbox" name="option1" id="Mar" value="Mar" /> Mar<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Apr"
+ value="Apr" /> Apr<br></label> <label><input type="checkbox"
+ name="option1" id="May" value="May" /> May<br></label> <label><input
+ type="checkbox" name="option1" id="Jun" value="Jun" /> Jun<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Jul"
+ value="Jul" /> Jul<br></label> <label><input type="checkbox"
+ name="option1" id="Aug" value="Aug" /> Aug<br></label> <label><input
+ type="checkbox" name="option1" id="Sep" value="Sep" /> Sep<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Oct"
+ value="Oct" /> Oct<br></label> <label><input type="checkbox"
+ name="option1" id="Nov" value="Nov" /> Nov<br></label> <label><input
+ type="checkbox" name="option1" id="Dec" value="Dec" /> Dec<br></label>
+ </td>
+ </tr>
+ <tr>
+ <td>start lat (deg):</td>
+ <td><input id="lat0" value="-90" /></td>
+ <td>end lat (deg):</td>
+ <td><input id="lat1" value="90" /></td>
+ </tr>
+ <tr>
+ <td>start lon (deg):</td>
+ <td><input id="lon0" value="0" /></td>
+ <td>end lon (deg):</td>
+ <td><input id="lon1" value="360" /></td>
+ </tr>
+ <tr>
+ <td colspan="1">color scale:</td>
+ <td colspan="3">
+ <form>
+ <input type="radio" name="scale1" value="linear" id="radioLin"
+ checked>linear <input type="radio" name="scale1"
+ value="logarithmic" id="radioLog">logarithmic
+ </form>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="1">Execution purpose</td>
+ <td colspan="3">
+ <form>
+ <textarea name="purpose" id="purpose" rows="4" cols="50"> </textarea>
+ </form>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2" align="center"><input id="twodvarmap"
+ type="submit" value=" Run Again "
+ style="height: 28px" /></td>
+ <form>
+ <td colspan="2" align="center"><input id="download_data"
+ type="button" value="Download Data" style="height: 28px" /></td>
+ </form>
+ </tr>
+ <tr>
+ <td colspan="4">
+ <div id="Image">Image Here</div>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="4" align="center"><textarea readonly id="data_url"
+ cols="89" rows="2">Data URL Here</textarea></td>
+ </tr>
+ <tr>
+ <td colspan="4" align="center"><textarea readonly id="Response"
+ cols="89" rows="6">Service Response Text Here</textarea></td>
+ </tr>
+ </p>
</table>
-}
\ No newline at end of file
+}
http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/f22b3e32/app/views/climate/threeDVariableZonalMean.scala.html
----------------------------------------------------------------------
diff --git a/app/views/climate/threeDVariableZonalMean.scala.html b/app/views/climate/threeDVariableZonalMean.scala.html
index fb4c924..1ecc918 100644
--- a/app/views/climate/threeDVariableZonalMean.scala.html
+++ b/app/views/climate/threeDVariableZonalMean.scala.html
@@ -1,31 +1,25 @@
-@(parameters: metadata.ThreeDVarZonalMean)
-
-@import helper._
-
+@(parameters: metadata.ThreeDVarZonalMean) @import helper._
<link rel="stylesheet"
href='@routes.Assets.at("stylesheets/livefitler.css")'>
-
@scripts = {
- <script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
- <script src='@routes.Assets.at("javascripts/livefilter.js")'></script>
- <script type="text/javascript" src='@routes.Assets.at("javascripts/jquery-1.9.0.min.js")'></script>
- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.min.js"></script>
- <script type="text/javascript" src='@routes.Assets.at("javascripts/json2.js")'></script>
- <script type="text/javascript" src="@routes.Assets.at("javascripts/xmisc.js")"></script>
- <script type="text/javascript">
+<script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
+<script src='@routes.Assets.at("javascripts/livefilter.js")'></script>
+<script type="text/javascript"
+ src='@routes.Assets.at("javascripts/jquery-1.9.0.min.js")'></script>
+<script type="text/javascript" src="https:
+ <script type="
+ text/javascript" src='@routes.Assets.at("javascripts/json2.js")'></script>
+<script type="text/javascript" src="@routes.Assets.at("javascripts/xmisc.js")"></script>
+<script type="text/javascript">
var Response = null;
var variable = "";
-
- // called on load or reload
window.onload = function() {
changeMonths();
changeDataSource();
select_data();
changeVariableName();
select_var();
-
enable_download_button();
- // no data to download yet
$('#t0').val($('#startYearMonth').text());
$('#t1').val($('#endYearMonth').text());
$('#pres').val($('#pressureRange').text());
@@ -55,23 +49,16 @@
$('#radioLog2').prop("checked", true);
}
}
-
-
- // disable download data button
function disable_download_button()
{
var x=document.getElementById("download_data");
x.disabled=true;
}
-
-
- // enable download data button
function enable_download_button()
{
var x=document.getElementById("download_data");
x.disabled=false;
}
-
function changeMonths(){
var months = $("#monthsPara").text();
var temp = months.split(", ");
@@ -103,8 +90,6 @@
}
}
}
-
- // select all months in the checkboxes
function select_all_months()
{
document.getElementById('Jan').checked = true;
@@ -120,8 +105,6 @@
document.getElementById('Nov').checked = true;
document.getElementById('Dec').checked = true;
}
-
- // see if no month is selected
function no_month_check()
{
if (document.getElementById('Jan').checked == false &&
@@ -136,14 +119,11 @@
document.getElementById('Oct').checked == false &&
document.getElementById('Nov').checked == false &&
document.getElementById('Dec').checked == false) {
- // alert("No month check!");
return true;
}
else
return false;
}
-
- // unselect all months in the checkboxes
function reset_months()
{
document.getElementById('Jan').checked = false;
@@ -159,12 +139,9 @@
document.getElementById('Nov').checked = false;
document.getElementById('Dec').checked = false;
}
-
- // enable all vars in dropdown menu
function reset_vars()
{
var x=document.getElementById("var");
-
x.options[0].disabled=false;
x.options[1].disabled=false;
x.options[2].disabled=false;
@@ -174,15 +151,10 @@
x.options[6].disabled=false;
x.options[7].disabled=false;
}
-
- // form variable string based on "var" dropdown selection
function select_var()
{
var var_string = $("#var").val();
-
- // disable the download button because of this change
disable_download_button();
-
if (var_string == "Air Temperature")
variable = "ta";
else if (var_string == "Specific Humidity")
@@ -199,28 +171,15 @@
variable = "wap";
else if (var_string == "Relative Humidity")
variable = "hur";
-
- // alert("variable: " + variable)
}
-
- // set up "var" dropdown based status of "data" dropdown
function select_data()
{
var data_string = $("#data").val();
var x=document.getElementById("var");
-
- // disable the download button because of this change
disable_download_button();
-
- // enable all options in "var" dropdown first
reset_vars();
-
- // alert(data_string);
-
- // disable corresponding "var" options
if (data_string == "NASA/AIRS") {
x.options[0].selected=true;
- //x.options[1].selected=true;
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].disabled=true;
@@ -230,7 +189,6 @@
}
else if (data_string == "NASA/MLS") {
x.options[0].selected=true;
- //x.options[1].selected=true;
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].disabled=true;
@@ -244,7 +202,6 @@
x.options[2].disabled=true;
x.options[3].disabled=true;
x.options[4].selected=true;
- //x.options[5].selected=true;
x.options[6].disabled=true;
x.options[7].disabled=true;
}
@@ -255,26 +212,17 @@
x.options[3].disabled=true;
x.options[4].disabled=true;
x.options[5].disabled=true;
- //x.options[6].disabled=true;
- //x.options[7].disabled=true;
x.options[6].selected=true;
}
else {
x.options[0].selected=true;
- //x.options[1].selected=true;
- //x.options[2].selected=true;
- //x.options[3].selected=true;
x.options[4].disabled=true;
x.options[5].disabled=true;
}
-
- // form variable string
select_var();
}
-
function changeDataSource(){
var dataSource = $('#dataSource').text();
- //dataSource = "NASA_QuikSCAT";
var x = document.getElementById("data");
if(dataSource == "NASA_AIRS" ){
x.options[0].selected=true;
@@ -327,9 +275,7 @@
else if(dataSource == "ECMWF_interim" ){
x.options[16].selected=true;
}
- //$('#data option:contains('+dataSource+')').prop({selected: true});
}
-
function changeVariableName(){
var var_string = $('#variableName').text();
var x = document.getElementById("var");
@@ -350,121 +296,80 @@
else if (var_string == "hur")
x.options[7].selected=true;
}
-
- // select checkboxes based on "months" dropdown
function select_months()
{
var s1=document.getElementById("months");
- // alert(s1.selectedIndex);
- // alert(s1.options[s1.selectedIndex].value);
-
- // disable the download button because of this change
disable_download_button();
-
- // "select none"
if (s1.selectedIndex == 1) {
reset_months();
}
- // "select all"
if (s1.selectedIndex == 0) {
select_all_months();
}
- // "summer"
if (s1.selectedIndex == 2) {
reset_months();
document.getElementById('Jun').checked = true;
document.getElementById('Jul').checked = true;
document.getElementById('Aug').checked = true;
}
- // "autumn"
if (s1.selectedIndex == 3) {
reset_months();
document.getElementById('Sep').checked = true;
document.getElementById('Oct').checked = true;
document.getElementById('Nov').checked = true;
}
- // "winter"
if (s1.selectedIndex == 4) {
reset_months();
document.getElementById('Dec').checked = true;
document.getElementById('Jan').checked = true;
document.getElementById('Feb').checked = true;
}
- // "spring"
if (s1.selectedIndex == 5) {
reset_months();
document.getElementById('Mar').checked = true;
document.getElementById('Apr').checked = true;
document.getElementById('May').checked = true;
}
-
}
-
$(document).ready(function(){
-
$("#download_data").click(function(event) {
var durl = $("#data_url").val();
- //alert(durl);
window.location.assign(durl);
});
-
-
$("#threedvarzonalmean").click(function(event) {
Response = null;
-
- // no data to download yet
disable_download_button();
-
- // flag error if no month box is checked
if (no_month_check()) {
- // $("#Response").html("<span style='color:red'>Error: please check at least one month.</span>");
$("#Response").html("Error: please check at least one month.");
$("#Image").html("");
return;
}
-
$("#Response").html("Calculating ...");
$("#data_url").html("Calculating ...");
$("#Image").html("");
-
- // sample url: http://cmacws.jpl.nasa.gov:9002/svc/threeDimZonalMean?model=ukmo_hadgem2-a&var=ts&start_time=199001&end_time=199512&lat1=-29&lat2=29&pres1=90&pres2=20months=1,2,4,5,6,10,12
-
- // form url string
- var url = "http://" + window.location.hostname + ":9002/svc/threeDimZonalMean?";
- // alert(url);
-
+ var url = "http:
var d1 = $("#data").val();
var model1 = d1.replace("/", "_");
-
var arglist = "";
arglist = arglist.concat("model=");
arglist = arglist.concat(model1);
-
var v1 = $("#var").val();
arglist = arglist.concat("&var=");
arglist = arglist.concat(variable);
-
var t0 = $("#t0").val();
var t1 = $("#t1").val();
-
t0 = t0.replace("-", "");
t1 = t1.replace("-", "");
-
arglist = arglist.concat("&start_time=");
arglist = arglist.concat(t0);
-
arglist = arglist.concat("&end_time=");
arglist = arglist.concat(t1);
-
var lat0 = $("#lat0").val();
var lat1 = $("#lat1").val();
-
arglist = arglist.concat("&lat1=");
arglist = arglist.concat(lat0);
-
arglist = arglist.concat("&lat2=");
arglist = arglist.concat(lat1);
-
var pres = $("#pres").val();
var splitty = pres.split(',');
if (splitty.length != 2) {
@@ -474,119 +379,81 @@
else {
pres1 = splitty[0];
pres2 = splitty[1];
-
- // alert("variable: " + variable);
-
- // when variable is the 3D Ocean Salinity or Ocean Temperature
if (variable == 'ot' || variable == 'os') {
- pres1 = pres1 * 10000; // convert from dbar on GUI
- pres2 = pres2 * 10000; // convert from dbar on GUI
+ pres1 = pres1 * 10000;
+ pres2 = pres2 * 10000;
}
- // when variable is 2D
else {
- pres1 = pres1 * 100; // convert from hPa on GUI
- pres2 = pres2 * 100; // convert from hPa on GUI
+ pres1 = pres1 * 100;
+ pres2 = pres2 * 100;
}
}
-
arglist = arglist.concat("&pres1=");
arglist = arglist.concat(pres1);
-
arglist = arglist.concat("&pres2=");
arglist = arglist.concat(pres2);
-
var s1 = document.getElementById('months');
-
- // get months checked by client
var month_str = "";
-
var mm = document.getElementById('Jan');
if (mm.checked == true)
month_str = month_str.concat(",1");
-
var mm = document.getElementById('Feb');
if (mm.checked == true)
month_str = month_str.concat(",2");
-
var mm = document.getElementById('Mar');
if (mm.checked == true)
month_str = month_str.concat(",3");
-
var mm = document.getElementById('Apr');
if (mm.checked == true)
month_str = month_str.concat(",4");
-
var mm = document.getElementById('May');
if (mm.checked == true)
month_str = month_str.concat(",5");
-
var mm = document.getElementById('Jun');
if (mm.checked == true)
month_str = month_str.concat(",6");
-
var mm = document.getElementById('Jul');
if (mm.checked == true)
month_str = month_str.concat(",7");
-
var mm = document.getElementById('Aug');
if (mm.checked == true)
month_str = month_str.concat(",8");
-
var mm = document.getElementById('Sep');
if (mm.checked == true)
month_str = month_str.concat(",9");
-
var mm = document.getElementById('Oct');
if (mm.checked == true)
month_str = month_str.concat(",10");
-
var mm = document.getElementById('Nov');
if (mm.checked == true)
month_str = month_str.concat(",11");
-
var mm = document.getElementById('Dec');
if (mm.checked == true)
month_str = month_str.concat(",12");
-
- // remove the leading ','
month_str = month_str.substr(1);
- // alert(month_str);
-
arglist = arglist.concat("&months=");
arglist = arglist.concat(month_str);
- // alert("arglist: " + arglist);
-
arglist = arglist.concat("&scale=");
var y = document.getElementById("radioLin").checked;
var yval;
var z = document.getElementById("radioLin2").checked;
var zval;
- // alert(y);
if (y == true)
yval = 0;
else
yval = 2;
-
if (z == true)
zval = 0;
else
zval = 4;
-
var scale1 = yval + zval;
var scale1_str = scale1.toString();
-
arglist = arglist.concat(scale1_str);
-
var purpose = $("#purpose").val();
arglist = arglist.concat("&purpose=");
arglist = arglist.concat(purpose);
-
- // url = url + encodeURIComponent(arglist);
url = url + encodeURI(arglist);
- // url = url + arglist;
- // alert("url: " + url);
-
- var urlTimeBounds = "http://" + window.location.hostname + ":9002/svc/time_bounds?";
+ var urlTimeBounds = "http:
var arglistTB = "";
arglistTB = arglistTB.concat("serviceType=");
arglistTB = arglistTB.concat("1");
@@ -595,8 +462,6 @@
arglistTB = arglistTB.concat("&var=");
arglistTB = arglistTB.concat(variable);
urlTimeBounds = urlTimeBounds + encodeURI(arglistTB);
- // alert("urlTimeBounds: " + urlTimeBounds);
-
$.ajax({
type: "GET",
url: urlTimeBounds,
@@ -604,9 +469,7 @@
data: null,
success: function(data, textStatus, xhr) {
Response = data;
- // alert("data: " + data);
if (data.success == false) {
- // alert(data.error);
Response = null;
var text = JSON.stringify(data, null, 4);
text = "Error in backend: <br>" + text;
@@ -615,44 +478,29 @@
return;
}
var text = JSON.stringify(data, null, 4);
- // alert("text: " + text);
- // $("#Response").html("<pre>"+text+"</pre>");
- // $("#Response").html(text);
-
var tb = data.time_bounds;
var bds = String(tb).split(",");
- // alert("tb: " + tb);
- // alert("bds: " + bds);
var lowerT = parseInt(bds[0]);
var upperT = parseInt(bds[1]);
- // alert("lowerT: " + lowerT);
- // alert("upperT: " + upperT);
var t0I = parseInt(t0);
var t1I = parseInt(t1);
- // alert("t0: " + t0I);
- // alert("t1: " + t1I);
-
if ( lowerT == 0 && upperT ==0 ) {
alert("We do not have data for this source and variable configuration.");
return;
}
-
if (t0I < lowerT && t1I < lowerT ||
t0I > upperT && t1I > upperT) {
alert("We do not have data that span your time range. Try the range inside ["+lowerT+", "+upperT+"].");
return;
}
-
if (t0I < lowerT && t1I <= upperT) {
alert("Your start year-month is out of bound. It has to be in or later than " + lowerT +
". We will use the range ["+lowerT+", "+t1I+"] for you.");
}
-
if (t1I > upperT && t0I >= lowerT) {
alert("Your end year-month is out of bound. It has to be in or earlier than " + upperT +
". We will use the range ["+t0I+", "+upperT+"] for you.");
}
-
if (t0I < lowerT && t1I > upperT ) {
alert("Both of your start and end year-months are out of bounds. They have to be in or earlier than " + upperT +
", and in or later than " + lowerT + ". We will use the range ["+lowerT+", "+upperT+"] for you.");
@@ -661,14 +509,10 @@
error: function(xhr, textStatus, errorThrown) {
$("#Response").html("error!");
$("#data_url").html("error!");
- // alert("xhr.status: "+xhr.status);
- // alert("error status: "+textStatus);
},
complete: function(xhr, textStatus) {
- //alert("complete status: "+textStatus);
}
});
-
$.ajax({
type: "GET",
url: url,
@@ -676,52 +520,33 @@
data: null,
success: function(data, textStatus, xhr) {
Response = data;
- // alert("data: " + data);
if (data.success == false) {
- // alert(data.error);
Response = null;
var text = JSON.stringify(data, null, 4);
text = "Error in backend: <br>" + text;
- // $("#Response").html("<span style='color:red'>" + text + "</span>");
$("#Response").html(text);
$("#data_url").html(text);
return;
}
var text = JSON.stringify(data, null, 4);
- // alert(text);
- // $("#Response").html("<pre>"+text+"</pre>");
$("#Response").html(text);
-
var html1 = "<img src='"+data.url+"' width='680'/>";
- // alert(html1);
$("#Image").html(html1);
-
- // post dataUrl to textarea and enable download button
$("#data_url").html(data.dataUrl);
enable_download_button();
},
error: function(xhr, textStatus, errorThrown) {
$("#Response").html("error!");
$("#data_url").html("error!");
- // alert("xhr.status: "+xhr.status);
- // alert("error status: "+textStatus);
},
complete: function(xhr, textStatus) {
- //alert("complete status: "+textStatus);
}
});
-
});
-
-
});
-
</script>
- }
- @main("Parameters of ConfId", scripts){
-
- @flash_message()
- <p>
+} @main("Parameters of ConfId", scripts){ @flash_message()
+<p>
<div id="dataSource" style="display: none;">@parameters.getDataSource()</div>
<div id="variableName" style="display: none;">@parameters.getVariableName()</div>
<div id="startYearMonth" style="display: none;">@parameters.getStartYearMonth()</div>
@@ -738,163 +563,155 @@
<div id="dataURL" style="display: none;">@parameters.getDataURL()</div>
<div id="serviceResponseText" style="display: none;">@parameters.getServiceResponseText()</div>
<table border="1" WIDTH="800" align="center">
-
-<tr>
-<td colspan="4">
-<center>
-<b>Service: 3-D Variable Zonal Mean</b> <br><br>
-This service generates a contour plot of zonal-mean vertical profiles of a 3-dimensional variable. <br>
-Select a data source, a variable name, a time range, and a pressure range below.<br><br>
-
-</center>
-</td>
-</tr>
-
-<tr>
-<td>data source:</td><td><select name="data", id="data" onchange="select_data()">
-<optgroup label="Observation">
-<option selected="NASA/AIRS">NASA/AIRS</option>
-<option>NASA/MLS</option>
-<option>ARGO/ARGO</option>
-</optgroup>
-<optgroup label="Model: Historical">
-<option>CCCMA/CANESM2</option>
-<option>GFDL/ESM2G</option>
-<option>GISS/E2-H</option>
-<option>GISS/E2-R</option>
-<option>NCAR/CAM5</option>
-<option>NCC/NORESM</option>
-<option>UKMO/HadGEM2-ES</option>
-</optgroup>
-<optgroup label="Model: AMIP">
-<option>CCCMA/CANAM4</option>
-<option>CSIRO/MK3.6</option>
-<option>GFDL/CM3</option>
-<option>IPSL/CM5A-LR</option>
-<option>MIROC/MIROC5</option>
-<option>UKMO/HadGEM2-A</option>
-</optgroup>
-<optgroup label="Reanalysis">
-<option>ECMWF/interim</option>
-</select></td>
-
-<td>variable name:</td><td><select name="var", id="var" onchange="select_var()">
-<option>Air Temperature</option>
-<option>Specific Humidity</option>
-<option>Cloud Ice Water Content</option>
-<option>Cloud Liquid Water Content</option>
-<option>Ocean Temperature</option>
-<option>Ocean Salinity</option>
-<option>Vertical Wind Velocity</option>
-<option>Relative Humidity</option>
-</select></td>
-
-</tr>
-
-<tr>
-<td>start year-month:</td><td><input id="t0" value="2004-01" alt="start"/></td>
-<td>end year-month:</td><td><input id="t1" value="2004-12" alt="end"/></td>
-</tr>
-
-<tr>
-<td>select months:</td>
-<td><select name="months" id="months" onchange="select_months()">
-<option id="all">select all</option>
-<option id="none">select none</option>
-<option id="summer">Summer:Jun-Jul-Aug</option>
-<option id="autum">Autumn:Sep-Oct-Nov</option>
-<option id="winter">Winter:Dec-Jan-Feb</option>
-<option id="spring">Spring:Mar-Apr-May</option> </select>
-</td>
-<td>
-atmosphere pressure range (hPa) <br> or ocean pressure range (dbar):
-</td>
-<td><input id="pres" value="200,900" alt="pressure"/></td>
-</tr>
-
-<tr>
-<td>
-<label><input type="checkbox" name="option1" id="Jan" value="Jan" /> Jan<br></label>
-<label><input type="checkbox" name="option1" id="Feb" value="Feb" /> Feb<br></label>
-<label><input type="checkbox" name="option1" id="Mar" value="Mar" /> Mar<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Apr" value="Apr" /> Apr<br></label>
-<label><input type="checkbox" name="option1" id="May" value="May" /> May<br></label>
-<label><input type="checkbox" name="option1" id="Jun" value="Jun" /> Jun<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Jul" value="Jul" /> Jul<br></label>
-<label><input type="checkbox" name="option1" id="Aug" value="Aug" /> Aug<br></label>
-<label><input type="checkbox" name="option1" id="Sep" value="Sep" /> Sep<br></label>
-</td>
-<td>
-<label><input type="checkbox" name="option1" id="Oct" value="Oct" /> Oct<br></label>
-<label><input type="checkbox" name="option1" id="Nov" value="Nov" /> Nov<br></label>
-<label><input type="checkbox" name="option1" id="Dec" value="Dec" /> Dec<br></label>
-</td>
-</tr>
-
-<tr>
-<td>start lat (deg):</td><td><input id="lat0" value="-90"/></td>
-<td>end lat (deg):</td><td><input id="lat1" value="90"/></td>
-</tr>
-
-<tr>
-<td colspan="1">
-pressure level scale:
-</td>
-<td colspan="1">
-<form> <input type="radio" name="scale1" value="linear" id="radioLin">linear
-<input type="radio" name="scale1" value="logarithmic" id="radioLog" checked>logarithmic
-</form>
-</td>
-<td colspan="1">
-color scale:
-</td>
-<td colspan="1">
-<form> <input type="radio" name="scale2" value="linear" id="radioLin2" checked>linear
-<input type="radio" name="scale2" value="logarithmic" id="radioLog2">logarithmic
-</form>
-</td>
-</tr>
-
-<tr>
-<td colspan="1">
-Execution purpose
-</td>
-<td colspan="3">
-<form>
-<textarea name="purpose" id="purpose" rows="4" cols="50"> </textarea>
-</form>
-</td>
-</tr>
-
-<tr>
-<td colspan="2" align="center"><input id="threedvarzonalmean" type="submit" value=" Run Again " style="height:28px"/></td>
-<form>
-<td colspan="2" align="center"><input id="download_data" type="button" value="Download Data" style="height:28px"/>
-</td>
-</form>
-
-</tr>
-
-<tr>
-<td colspan="4">
-<div id="Image">Image Here</div>
-</td>
-</tr>
-<tr>
-<td colspan="4" align="center">
-<textarea readonly id="data_url" cols="89" rows="2">Data URL Here</textarea>
-</td>
-</tr>
-<tr>
-<td colspan="4" align="center">
-<textarea readonly id="Response" cols="89" rows="6">Service Response Text Here</textarea>
-</td>
-</tr>
-</p>
-
+ <tr>
+ <td colspan="4">
+ <center>
+ <b>Service: 3-D Variable Zonal Mean</b> <br>
+ <br> This service generates a contour plot of zonal-mean
+ vertical profiles of a 3-dimensional variable. <br> Select a
+ data source, a variable name, a time range, and a pressure range
+ below.<br>
+ <br>
+ </center>
+ </td>
+ </tr>
+ <tr>
+ <td>data source:</td>
+ <td><select name="data" , id="data" onchange="select_data()">
+ <optgroup label="Observation">
+ <option selected="NASA/AIRS">NASA/AIRS</option>
+ <option>NASA/MLS</option>
+ <option>ARGO/ARGO</option>
+ </optgroup>
+ <optgroup label="Model: Historical">
+ <option>CCCMA/CANESM2</option>
+ <option>GFDL/ESM2G</option>
+ <option>GISS/E2-H</option>
+ <option>GISS/E2-R</option>
+ <option>NCAR/CAM5</option>
+ <option>NCC/NORESM</option>
+ <option>UKMO/HadGEM2-ES</option>
+ </optgroup>
+ <optgroup label="Model: AMIP">
+ <option>CCCMA/CANAM4</option>
+ <option>CSIRO/MK3.6</option>
+ <option>GFDL/CM3</option>
+ <option>IPSL/CM5A-LR</option>
+ <option>MIROC/MIROC5</option>
+ <option>UKMO/HadGEM2-A</option>
+ </optgroup>
+ <optgroup label="Reanalysis">
+ <option>ECMWF/interim</option>
+ </select></td>
+ <td>variable name:</td>
+ <td><select name="var" , id="var" onchange="select_var()">
+ <option>Air Temperature</option>
+ <option>Specific Humidity</option>
+ <option>Cloud Ice Water Content</option>
+ <option>Cloud Liquid Water Content</option>
+ <option>Ocean Temperature</option>
+ <option>Ocean Salinity</option>
+ <option>Vertical Wind Velocity</option>
+ <option>Relative Humidity</option>
+ </select></td>
+ </tr>
+ <tr>
+ <td>start year-month:</td>
+ <td><input id="t0" value="2004-01" alt="start" /></td>
+ <td>end year-month:</td>
+ <td><input id="t1" value="2004-12" alt="end" /></td>
+ </tr>
+ <tr>
+ <td>select months:</td>
+ <td><select name="months" id="months" onchange="select_months()">
+ <option id="all">select all</option>
+ <option id="none">select none</option>
+ <option id="summer">Summer:Jun-Jul-Aug</option>
+ <option id="autum">Autumn:Sep-Oct-Nov</option>
+ <option id="winter">Winter:Dec-Jan-Feb</option>
+ <option id="spring">Spring:Mar-Apr-May</option>
+ </select></td>
+ <td>atmosphere pressure range (hPa) <br> or ocean pressure
+ range (dbar):
+ </td>
+ <td><input id="pres" value="200,900" alt="pressure" /></td>
+ </tr>
+ <tr>
+ <td><label><input type="checkbox" name="option1" id="Jan"
+ value="Jan" /> Jan<br></label> <label><input type="checkbox"
+ name="option1" id="Feb" value="Feb" /> Feb<br></label> <label><input
+ type="checkbox" name="option1" id="Mar" value="Mar" /> Mar<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Apr"
+ value="Apr" /> Apr<br></label> <label><input type="checkbox"
+ name="option1" id="May" value="May" /> May<br></label> <label><input
+ type="checkbox" name="option1" id="Jun" value="Jun" /> Jun<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Jul"
+ value="Jul" /> Jul<br></label> <label><input type="checkbox"
+ name="option1" id="Aug" value="Aug" /> Aug<br></label> <label><input
+ type="checkbox" name="option1" id="Sep" value="Sep" /> Sep<br></label>
+ </td>
+ <td><label><input type="checkbox" name="option1" id="Oct"
+ value="Oct" /> Oct<br></label> <label><input type="checkbox"
+ name="option1" id="Nov" value="Nov" /> Nov<br></label> <label><input
+ type="checkbox" name="option1" id="Dec" value="Dec" /> Dec<br></label>
+ </td>
+ </tr>
+ <tr>
+ <td>start lat (deg):</td>
+ <td><input id="lat0" value="-90" /></td>
+ <td>end lat (deg):</td>
+ <td><input id="lat1" value="90" /></td>
+ </tr>
+ <tr>
+ <td colspan="1">pressure level scale:</td>
+ <td colspan="1">
+ <form>
+ <input type="radio" name="scale1" value="linear" id="radioLin">linear
+ <input type="radio" name="scale1" value="logarithmic" id="radioLog"
+ checked>logarithmic
+ </form>
+ </td>
+ <td colspan="1">color scale:</td>
+ <td colspan="1">
+ <form>
+ <input type="radio" name="scale2" value="linear" id="radioLin2"
+ checked>linear <input type="radio" name="scale2"
+ value="logarithmic" id="radioLog2">logarithmic
+ </form>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="1">Execution purpose</td>
+ <td colspan="3">
+ <form>
+ <textarea name="purpose" id="purpose" rows="4" cols="50"> </textarea>
+ </form>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2" align="center"><input id="threedvarzonalmean"
+ type="submit" value=" Run Again "
+ style="height: 28px" /></td>
+ <form>
+ <td colspan="2" align="center"><input id="download_data"
+ type="button" value="Download Data" style="height: 28px" /></td>
+ </form>
+ </tr>
+ <tr>
+ <td colspan="4">
+ <div id="Image">Image Here</div>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="4" align="center"><textarea readonly id="data_url"
+ cols="89" rows="2">Data URL Here</textarea></td>
+ </tr>
+ <tr>
+ <td colspan="4" align="center"><textarea readonly id="Response"
+ cols="89" rows="6">Service Response Text Here</textarea></td>
+ </tr>
+ </p>
</table>
-}
\ No newline at end of file
+}