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/10/29 23:56:26 UTC

[3/9] incubator-cmda git commit: Update ApacheCMDA-Frontend with KnowledgeGraph

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/ca952ad9/ApacheCMDA-Frontend/app/views/climate/twoDVariableTimeSeries.scala.html
----------------------------------------------------------------------
diff --git a/ApacheCMDA-Frontend/app/views/climate/twoDVariableTimeSeries.scala.html b/ApacheCMDA-Frontend/app/views/climate/twoDVariableTimeSeries.scala.html
index bf44feb..d9d49fa 100644
--- a/ApacheCMDA-Frontend/app/views/climate/twoDVariableTimeSeries.scala.html
+++ b/ApacheCMDA-Frontend/app/views/climate/twoDVariableTimeSeries.scala.html
@@ -1,45 +1,35 @@
-@*******************************************************************************
- * Licensed to the Apache Software Foundation (ASF) under one or more		   *
- * contributor license agreements.  See the NOTICE file distributed with	   *
- * this work for additional information regarding copyright ownership.         *
- * The ASF licenses this file to You under the Apache License, Version 2.0     *
- * (the "License"); you may not use this file except in compliance with        *
- * the License.  You may obtain a copy of the License at                       *
- *                                                                             *
- *    http://www.apache.org/licenses/LICENSE-2.0                               *
- *																			   *
- * Unless required by applicable law or agreed to in writing, software         *
- * distributed under the License is distributed on an "AS IS" BASIS,           *
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.    *
- * See the License for the specific language governing permissions and         *
- * limitations under the License.											   *
- *******************************************************************************@ 
-
-@(parameters: metadata.TwoDVarTimeSeries) @import helper._
+@(parameters: metadata.TwoDVarTimeSeries)
+
+@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://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">
 	var Response = null;
     var variable = "";
         var method =  @parameters.getVariableScale;
+
+
+    // called on load or reload
     window.onload = function() {
+      
+    	
       changeDataSource();
       select_data();
       changeVariableName();
       select_var();
+      
+      // no data to download yet
       disable_download_button();
+    
     var variableScale = $('#variableScale').text();
     if(variableScale == "0") {
       $('#radioLin').prop( "checked", true );
@@ -55,8 +45,11 @@
     $('#data_url').html($('#dataURL').text());
     $('#Response').html($('serviceResponseText').text());
     }
+
+
     function changeDataSource(){
     var dataSource = $('#dataSource').text();
+    //dataSource = "NASA_QuikSCAT";
     var x = document.getElementById("data");
     if(dataSource == "NASA_MODIS" ){
     x.options[0].selected=true;
@@ -127,7 +120,9 @@
     else if(dataSource == "ECMWF_interim" ){
     x.options[22].selected=true;
     }
+    //$('#data option:contains('+dataSource+')').prop({selected: true});
     }
+
     function changeVariableName(){
     var var_string = $('#variableName').text();
     var x=document.getElementById("var");
@@ -182,19 +177,28 @@
     else if (var_string == "rsut")
     x.options[24].selected=true;
     }
+
+
+    // disable download data button
     function disable_download_button()
     {
       var x=document.getElementById("download_data");
       x.disabled=false;
     }
+
+    // enable download data button
     function enable_download_button()
     {
       var x=document.getElementById("download_data");
       x.disabled=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;
@@ -221,10 +225,15 @@
       x.options[23].disabled=false;
       x.options[24].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 == "Total Cloud Fraction")
         variable = "clt";
       else if (var_string == "Surface Temperature")
@@ -275,13 +284,27 @@
         variable = "rsutcs";
       else if (var_string == "TOA Outgoing Shortwave Radiation")
         variable = "rsut";
+
+      // 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/AMSRE") {
         x.options[0].disabled=true;
         x.options[1].disabled=true;
@@ -307,6 +330,7 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[3].selected=true;
       }
       else if (data_string == "NASA/MODIS") {
@@ -333,7 +357,9 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[1].selected=true;
+        //x.options[8].selected=true;
       }
       else if (data_string == "NASA/TRMM") {
         x.options[0].selected=true;
@@ -390,6 +416,7 @@
         x.options[24].disabled=true;
       }
       else if (data_string == "NASA/QuikSCAT") {
+
         x.options[0].disabled=true;
         x.options[1].disabled=true;
         x.options[2].disabled=true;
@@ -412,7 +439,10 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[4].selected=true;
+        //x.options[5].selected=true;
+        //x.options[6].selected=true;
       }
       else if (data_string == "NASA/AVISO") {
         x.options[0].disabled=true;
@@ -439,9 +469,11 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[7].selected=true;
       }
       else if (data_string == "NASA/GRACE") {
+
         x.options[0].disabled=true;
         x.options[1].disabled=true;
         x.options[2].disabled=true;
@@ -465,9 +497,12 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[9].selected=true;
+        //x.options[10].selected=true;
       }
       else if (data_string == "NOAA/NODC") {
+
         x.options[0].disabled=true;
         x.options[1].disabled=true;
         x.options[2].disabled=true;
@@ -491,9 +526,12 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[11].selected=true;
+        //x.options[12].selected=true;
       }
       else if (data_string == "NASA/CERES") {
+
         x.options[0].disabled=true;
         x.options[1].disabled=true;
         x.options[2].disabled=true;
@@ -507,6 +545,7 @@
         x.options[10].disabled=true;
         x.options[11].disabled=true;
         x.options[12].disabled=true;
+
         x.options[13].selected=true;
       }
       else if (data_string == "ECMWF/interim") {
@@ -534,67 +573,120 @@
         x.options[22].disabled=true;
         x.options[23].disabled=true;
         x.options[24].disabled=true;
+
         x.options[3].selected=true;
       }
+      // for all other models
       else {
         x.options[9].disabled=true;
         x.options[10].disabled=true;
         x.options[11].disabled=true;
         x.options[12].disabled=true;
+
         x.options[0].selected=true;
       }
+
+      // form variable string
       select_var();
     }
+
+
     $(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);
       });
+
+
       $("#timeSeries2D").click(function(event) {
+        // alert('****** inside timeSeries2D()!');
         Response = null;
+
+        // no data to download yet
         disable_download_button();
+
         $("#Response").html("Calculating ...");
         $("#data_url").html("Calculating ...");
         $("#Image").html("");
+
+        // form url string
+        // var url = "http://cmacws.jpl.nasa.gov:9002/svc/timeSeries2D?";
         var url = "http://" + window.location.hostname + ":9002/svc/timeSeries2D?";
+        // alert("url: " + url);
+
         var d1 = $("#data").val();
         var model1 = d1.replace("/", "_");
+
         var arglist = "";
         arglist = arglist.concat("model=");
         arglist = arglist.concat(model1);
+
+        // alert("arglist: " + arglist);
+
         var v1 = $("#var").val();
         arglist = arglist.concat("&var=");
         arglist = arglist.concat(variable);
+
+        // alert("arglist: " + arglist);
+
         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);
+
+        // alert("arglist: " + arglist);
+
         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);
+
+        // alert("arglist: " + arglist);
+
         arglist = arglist.concat("&scale=");
         var y = document.getElementById("radioLin").checked;
+        // alert(y);
         if (y == true)
           arglist = arglist.concat('0');
         else
           arglist = arglist.concat('2');
+
         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 arglistTB = "";
         arglistTB = arglistTB.concat("serviceType=");
@@ -604,6 +696,9 @@
         arglistTB = arglistTB.concat("&var=");
         arglistTB = arglistTB.concat(variable);
         urlTimeBounds = urlTimeBounds + encodeURI(arglistTB);
+        // alert("urlTimeBounds: " + urlTimeBounds);
+
+
         $.ajax({
             type: "GET",
             url: urlTimeBounds,
@@ -611,7 +706,9 @@
             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; 
@@ -620,29 +717,44 @@
                     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.");
@@ -651,10 +763,14 @@
             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,
@@ -662,40 +778,59 @@
             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='820'/>";
+                // 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>
 <div id="endYearMonth" style="display: none;">@parameters.getEndYearMonth()</div>
 <div id="startLat" style="display: none;">@parameters.getStartLat()</div>
 <div id="endLat" style="display: none;">@parameters.getEndLat()</div>
-<div id="startLon" style="display: none;">@parameters.getStartLon()</div>
+<div id="startLon"style="display: none;">@parameters.getStartLon()</div>
 <div id="endLon" style="display: none;">@parameters.getEndLon()</div>
 <div id="variableScale" style="display: none;">@parameters.getVariableScale()</div>
 <div id="executionPurpose" style="display: none;">@parameters.getExecutionPurpose()</div>
@@ -703,140 +838,145 @@
 <div id="dataURL" style="display: none;">@parameters.getDataURL()</div>
 <div id="serviceResponseText" style="display: none;">@parameters.getServiceResponseText()</div>
 <table border="1" align="center">
-	<tr>
-		<td colspan="4">
-			<center>
-				<b>Service: 2-D Variable Time Series</b><br> <br> This
-				service generates a graph of a 2-dimensional variable's time series
-				with monthly averaged values. <br> Select a data source (model
-				or observation), a variable name, a time range, and a spatial 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/MODIS">NASA/MODIS</option>
-					<option>NASA/AMSRE</option>
-					<option>NASA/TRMM</option>
-					<option>NASA/GPCP</option>
-					<option>NASA/QuikSCAT</option>
-					<option>NASA/AVISO</option>
-					<option>NASA/GRACE</option>
-					<option>NOAA/NODC</option>
-					<option>NASA/CERES</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>
-				</optgroup>
-		</select></td>
-		<td>variable name:</td>
-		<td><select name="var" , id="var" onchange="select_var()">
-				<option>Precipitation Flux</option>
-				<option>Total Cloud Fraction</option>
-				<option>Surface Temperature</option>
-				<option>Sea Surface Temperature</option>
-				<option>Eastward Near-Surface Wind</option>
-				<option>Northward Near-Surface Wind</option>
-				<option>Near-Surface Wind Speed</option>
-				<option>Sea Surface Height</option>
-				<option>Leaf Area Index</option>
-				<option>Equivalent Water Height Over Land</option>
-				<option>Equivalent Water Height Over Ocean</option>
-				<option>Ocean Heat Content Anomaly within 700 m Depth</option>
-				<option>Ocean Heat Content Anomaly within 2000 m Depth</option>
-				<option>Surface Downwelling Longwave Radiation</option>
-				<option>Surface Downwelling Shortwave Radiation</option>
-				<option>Surface Upwelling Longwave Radiation</option>
-				<option>Surface Upwelling Shortwave Radiation</option>
-				<option>Surface Downwelling Clear-Sky Longwave Radiation</option>
-				<option>Surface Downwelling Clear-Sky Shortwave Radiation</option>
-				<option>Surface Upwelling Clear-Sky Shortwave Radiation</option>
-				<option>TOA Incident Shortwave Radiation</option>
-				<option>TOA Outgoing Longwave Radiation</option>
-				<option>TOA Outgoing Shortwave Radiation</option>
-				<option>TOA Outgoing Clear-Sky Longwave Radiation</option>
-				<option>TOA Outgoing Clear-Sky Shortwave Radiation</option>
-		</select></td>
-	</tr>
-	<tr>
-		<td>start year-month:</td>
-		<td><input id="t0" value=@parameters.getStartYearMonth()
-			alt="start" /></td>
-		<td>end year-month:</td>
-		<td><input id="t1" value=@parameters.getEndYearMonth() alt="end" /></td>
-	</tr>
-	<tr>
-		<td>start lat (deg):</td>
-		<td><input id="lat0" value=@parameters.getStartLat()></td>
-		<td>end lat (deg):</td>
-		<td><input id="lat1" value=@parameters.getEndLat()></td>
-	</tr>
-	<tr>
-		<td>start lon (deg):</td>
-		<td><input id="lon0" value=@parameters.getStartLon()></td>
-		<td>end lon (deg):</td>
-		<td><input id="lon1" value=@parameters.getEndLon()></td>
-	</tr>
-	<tr>
-		<td colspan="1">variable 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="timeSeries2D"
-			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: 2-D Variable Time Series</b><br><br>
+This service generates a graph of a 2-dimensional variable's time series with monthly averaged values. <br>
+Select a data source (model or observation), a variable name, a time range, and a spatial range below.<br><br>
+</center>
+</td>
+</tr>
+
+<tr>
+<td>data source:</td><td><select name="data", id="data" onchange="select_data()">
+<!-- <option>NASA/obs4MIPs</option>  -->
+<optgroup label="Observation">
+<option selected="NASA/MODIS">NASA/MODIS</option>
+<option>NASA/AMSRE</option>
+<option>NASA/TRMM</option>
+<option>NASA/GPCP</option>
+<option>NASA/QuikSCAT</option>
+<option>NASA/AVISO</option>
+<option>NASA/GRACE</option>
+<option>NOAA/NODC</option>
+<option>NASA/CERES</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>  
+</optgroup>
+</select></td>
+
+<td>variable name:</td><td><select name="var", id="var" onchange="select_var()">
+<option>Precipitation Flux</option>
+<option>Total Cloud Fraction</option>
+<option>Surface Temperature</option>
+<option>Sea Surface Temperature</option>
+<option>Eastward Near-Surface Wind</option>
+<option>Northward Near-Surface Wind</option>
+<option>Near-Surface Wind Speed</option>
+<option>Sea Surface Height</option>
+<option>Leaf Area Index</option>
+<option>Equivalent Water Height Over Land</option>
+<option>Equivalent Water Height Over Ocean</option>
+<option>Ocean Heat Content Anomaly within 700 m Depth</option>
+<option>Ocean Heat Content Anomaly within 2000 m Depth</option>
+<option>Surface Downwelling Longwave Radiation</option>
+<option>Surface Downwelling Shortwave Radiation</option>
+<option>Surface Upwelling Longwave Radiation</option>
+<option>Surface Upwelling Shortwave Radiation</option>
+<option>Surface Downwelling Clear-Sky Longwave Radiation</option>
+<option>Surface Downwelling Clear-Sky Shortwave Radiation</option>
+<option>Surface Upwelling Clear-Sky Shortwave Radiation</option>
+<option>TOA Incident Shortwave Radiation</option>
+<option>TOA Outgoing Longwave Radiation</option>
+<option>TOA Outgoing Shortwave Radiation</option>
+<option>TOA Outgoing Clear-Sky Longwave Radiation</option>
+<option>TOA Outgoing Clear-Sky Shortwave Radiation</option>
+</select></td>
+</tr>
+
+<tr>
+<td>start year-month:</td><td><input id="t0" value=@parameters.getStartYearMonth() alt="start"/></td>
+<td>end year-month:</td><td><input id="t1" value=@parameters.getEndYearMonth() alt="end"/></td>
+</tr>
+
+
+<tr>
+<td>start lat (deg):</td><td><input id="lat0" value=@parameters.getStartLat()></td>
+<td>end lat (deg):</td><td><input id="lat1" value=@parameters.getEndLat()></td>
+</tr>
+
+<tr>
+<td>start lon (deg):</td><td><input id="lon0" value=@parameters.getStartLon()></td>
+<td>end lon (deg):</td><td><input id="lon1" value=@parameters.getEndLon()></td>
+</tr>
+
+<tr>
+<td colspan="1">
+variable 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="timeSeries2D" 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/ca952ad9/ApacheCMDA-Frontend/conf/routes
----------------------------------------------------------------------
diff --git a/ApacheCMDA-Frontend/conf/routes b/ApacheCMDA-Frontend/conf/routes
index f554cae..62a55ed 100644
--- a/ApacheCMDA-Frontend/conf/routes
+++ b/ApacheCMDA-Frontend/conf/routes
@@ -3,7 +3,7 @@
 # ~~~~
 
 # Home page
-GET         /home                                                controllers.ClimateServiceController.home(email ?= null, vfile ?= null, dataset ?= null)
+GET         /home                                                controllers.Application.index()
 GET 		/													 controllers.ClimateServiceController.home(email ?= null, vfile ?= null, dataset ?= null)
 # Account
 
@@ -20,6 +20,11 @@ POST        /syncData                                            controllers.Acc
 GET 		/searchAndGenerateWorkflow							 controllers.AccountController.getSearchAndGenerateWorkflow()
 GET 		/generateWorkflowGetData							 controllers.AccountController.getJsonData()
 
+# Authentication
+GET         /login                                               controllers.Application.login()
+POST        /login                                               controllers.Application.authenticate()
+GET         /logout                                              controllers.Application.logout()
+
 # BugReporting
 GET         /bugs                                                controllers.BugReportController.reports()
 GET         /newReport                                           controllers.BugReportController.newReport()
@@ -27,30 +32,109 @@ GET         /bug/list                                            controllers.Bug
 POST        /delete/report                                       controllers.BugReportController.deleteReport()
 POST        /solve/report                                        controllers.BugReportController.solveReport()
 
+# Map static resources from the /public folder to the /assets URL path
+GET         /assets/*file                                        controllers.Assets.at(path="/public", file)
+
+# sensor_types
+GET         /sensorTypes                                         controllers.SensorTypeController.sensorTypes()
+POST        /new/sensorTypes                                     controllers.SensorTypeController.newSensorType()
+POST        /delete/sensorTypes                                  controllers.SensorTypeController.deleteSensorType()
+POST        /edit/sensorTypes                                    controllers.SensorTypeController.editSensorType()
+
+# device_types
+GET         /deviceTypes                                         controllers.DeviceTypeController.deviceTypes()
+POST        /new/deviceTypes                                     controllers.DeviceTypeController.newDeviceType()
+POST        /delete/deviceTypes                                  controllers.DeviceTypeController.deleteDeviceType()
+POST        /edit/deviceTypes                                    controllers.DeviceTypeController.editDeviceType()
+
+# devices
+GET         /devices                                             controllers.DeviceController.devices()
+POST        /new/devices                                         controllers.DeviceController.newDevice()
+POST        /delete/devices                                      controllers.DeviceController.deleteDevice()
+POST        /edit/devices                                        controllers.DeviceController.editDevice()
+
+# sensors
+GET         /sensors                                             controllers.SensorController.sensors()
+POST        /new/sensors                                         controllers.SensorController.newSensor()
+POST        /delete/sensors                                      controllers.SensorController.deleteSensor()
+POST        /edit/sensors                                        controllers.SensorController.editSensor()
+
+# sensor_categories
+GET         /sensorCategories                                    controllers.SensorCategoryController.sensorCategories()
+POST        /new/sensorCategories                                controllers.SensorCategoryController.newSensorCategory()
+POST        /delete/sensorCategories                             controllers.SensorCategoryController.deleteSensorCategory()
+POST        /download/sensorCategories                           controllers.SensorCategoryController.downloadSensorCategory()
+POST        /edit/sensorCategories                               controllers.SensorCategoryController.editSensorCategory()
+
+# dashboard
+GET         /dashboard                                           controllers.DashboardController.dashboard()
+
 # About Us
-GET         /aboutus                                             controllers.AboutusController.aboutUs()
+GET         /aboutus                                             controllers.AboutusController.aboutus()
 GET         /aboutProject                                        controllers.AboutusController.aboutProject()
 
+# sensor reading
+GET         /sensorReading                                       controllers.SensorReadingController.sensorReadings()
+POST        /getSensorReadings                                   controllers.SensorReadingController.getSensorReadingsWithinRange()
+POST        /getSensorReadingsAtTimestamp                        controllers.SensorReadingController.getSensorReadingsAtTimestamp()
+POST        /getLatestSensorReadings                             controllers.SensorReadingController.getLatestSensorReadings()
+
+
+
+
+# Estimator recommendation
+GET         /estimator                                           controllers.EstimateController.estimate(email ?= null, vfile ?= null, dataset ?= null)
+GET         /estimator/tutorial                                  controllers.EstimateController.tutorial()
+GET         /estimator/login                                     controllers.EstimateController.login()
+POST        /estimator/login                                     controllers.EstimateController.authenticate()
+GET         /estimator/logout                                    controllers.EstimateController.logout()
+GET         /estimator/accountSummary                            controllers.EstimateController.accountSummary(userName ?= null)
+
+# Estimator Registration
+GET         /scientist/register                                  controllers.NasaRegistrationController.registrationForm()
+POST        /scientist/register/publish                          controllers.NasaRegistrationController.submit()
+GET         /scientist/updateUser                                controllers.NasaRegistrationController.updateForm()
+POST        /estimator/updateUser/update                         controllers.NasaRegistrationController.update()
+GET         /scientist/deleteUser                                controllers.NasaRegistrationController.deleteForm()
+POST        /scientist/deleteUser/delete                         controllers.NasaRegistrationController.delete()
+GET         /estimator/adminPage                                 controllers.NasaRegistrationController.adminPage()
+GET			/scientist/allUsers									 controllers.NasaRegistrationController.getAllUsers()
+GET		    /scientist/addUser									 controllers.NasaRegistrationController.addUser()
+GET      	/scientist/addUserForm 								 controllers.NasaRegistrationController.addUserForm()
+
 # Climate Model
-GET			/climate											controllers.ClimateServiceController.home(email ?= null, vfile ?= null, dataset ?= null)
-GET			/climate/tutorial									controllers.ClimateServiceController.tutorial()
-GET			/climate/climateServices							controllers.ClimateServiceController.climateServices()
-GET			/climate/mostRecentlyAddedClimateServices			controllers.ClimateServiceController.mostRecentlyAddedClimateServices()
-GET			/climate/mostRecentlyUsedClimateServices			controllers.ClimateServiceController.mostRecentlyUsedClimateServices()
-GET			/climate/mostPopularClimateServices					controllers.ClimateServiceController.mostPopularClimateServices()
-POST		/climate/new/climateServices    					controllers.ClimateServiceController.newClimateService()
-POST    	/climate/delete/climateServices   					controllers.ClimateServiceController.deleteClimateService()
-POST		/climate/download/climateServices					controllers.ClimateServiceController.downloadClimateService()
-POST		/climate/edit/climateServices						controllers.ClimateServiceController.editClimateService()
-GET			/climate/new/climateServices						controllers.ClimateServiceController.addClimateServices()
-GET			/serviceLog/conf									controllers.ClimateServiceController.getConfigurationByConfId()
-POST    	/climate/delete/serviceLog   						controllers.ClimateServiceController.deleteServiceLog()
-GET			/climate/oneService									controllers.ClimateServiceController.oneService(url ?= null)
+GET		/climate			controllers.ClimateServiceController.home(email ?= null, vfile ?= null, dataset ?= null)
+GET		/climate/tutorial		controllers.ClimateServiceController.tutorial()
+GET		/climate/login		controllers.ClimateServiceController.login()
+POST    /climate/login        controllers.ClimateServiceController.authenticate()
+GET     /climate/logout       controllers.ClimateServiceController.logout()
+GET		/climate/accountSummary		controllers.ClimateServiceController.accountSummary(userName ?= null)
+GET		/climate/climateServices	controllers.ClimateServiceController.climateServices()
+GET		/climate/mostRecentlyAddedClimateServices	controllers.ClimateServiceController.mostRecentlyAddedClimateServices()
+GET		/climate/mostRecentlyUsedClimateServices	controllers.ClimateServiceController.mostRecentlyUsedClimateServices()
+GET		/climate/mostPopularClimateServices	controllers.ClimateServiceController.mostPopularClimateServices()
+POST    /climate/new/climateServices    controllers.ClimateServiceController.newClimateService()
+POST    /climate/delete/climateServices   controllers.ClimateServiceController.deleteClimateService()
+POST	/climate/download/climateServices	 controllers.ClimateServiceController.downloadClimateService()
+POST	/climate/edit/climateServices		controllers.ClimateServiceController.editClimateService()
+GET		/climate/new/climateServices		controllers.ClimateServiceController.addClimateServices()
+GET		/serviceLog/conf		controllers.ClimateServiceController.getConfigurationByConfId()
+POST    /climate/delete/serviceLog   controllers.ClimateServiceController.deleteServiceLog()
+GET		/climate/oneService		controllers.ClimateServiceController.oneService(url ?= null)
+GET		/climate/inframeService		controllers.ClimateServiceController.inframeService(url ?= null)
+GET     /climate/serviceKnowledgeGraph		controllers.AnalyticsController.getKnowledgeGraph()
+
 
 #Keyword search
-GET 		/climate/datasets									controllers.DatasetController.datasetList()
-GET			/climate/searchDataSet 					 			controllers.DatasetController.searchDataset()
-GET 		/climate/getSearchResult				 			controllers.DatasetController.getSearchResult()
+GET 	    /climate/dataSets/						controllers.dataSetController.datasetList()
+GET         /climate/dataSets/*id                    controllers.KeywordSearchController.getDataSetList(id)
+GET			/climate/searchDataSet 					 controllers.dataSetController.searchDataset()
+GET 		/climate/getSearchResult				 controllers.dataSetController.getSearchResult()
+GET         /climate/recommendation						controllers.KeywordSearchController.searchPage()
+POST        /climate/recommendation/keywordSearch                      controllers.KeywordSearchController.keywordSearch()
+GET         /climate/recommendation/displayResult/*id                  controllers.KeywordSearchController.displayResult(id)
+POST        /climate/recommendation/selectedKeywordSearch              controllers.KeywordSearchController.selectedKeywordSearch()
+GET         /climate/keywordTree/                       controllers.KeywordSearchController.getKeywordTree(id :String)
 
-#Map static resources from the /public folder to the /assets URL path
-GET     	/assets/*file               						controllers.Assets.at(path="/public", file)
+#for pages
+GET     /assets/*file               controllers.Assets.at(path="/public", file)
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/ca952ad9/ApacheCMDA-Frontend/public/images/data.png
----------------------------------------------------------------------
diff --git a/ApacheCMDA-Frontend/public/images/data.png b/ApacheCMDA-Frontend/public/images/data.png
new file mode 100644
index 0000000..5a65ccb
Binary files /dev/null and b/ApacheCMDA-Frontend/public/images/data.png differ

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/ca952ad9/ApacheCMDA-Frontend/public/javascripts/exampleUtil.js
----------------------------------------------------------------------
diff --git a/ApacheCMDA-Frontend/public/javascripts/exampleUtil.js b/ApacheCMDA-Frontend/public/javascripts/exampleUtil.js
new file mode 100644
index 0000000..aeeb2df
--- /dev/null
+++ b/ApacheCMDA-Frontend/public/javascripts/exampleUtil.js
@@ -0,0 +1,126 @@
+/**
+ * Created by Alex on 5/20/2015.
+ */
+
+function loadJSON(path, success, error) {
+  var xhr = new XMLHttpRequest();
+  xhr.onreadystatechange = function () {
+    if (xhr.readyState === 4) {
+      if (xhr.status === 200) {
+        success(JSON.parse(xhr.responseText));
+      }
+      else {
+        error(xhr);
+      }
+    }
+  };
+  xhr.open('GET', path, true);
+  xhr.send();
+}
+
+
+function getScaleFreeNetwork(nodeCount) {
+  var nodes = [];
+  var edges = [];
+  var connectionCount = [];
+
+  // randomly create some nodes and edges
+  for (var i = 0; i < nodeCount; i++) {
+    nodes.push({
+      id: i,
+      label: String(i)
+    });
+
+    connectionCount[i] = 0;
+
+    // create edges in a scale-free-network way
+    if (i == 1) {
+      var from = i;
+      var to = 0;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+    else if (i > 1) {
+      var conn = edges.length * 2;
+      var rand = Math.floor(Math.random() * conn);
+      var cum = 0;
+      var j = 0;
+      while (j < connectionCount.length && cum < rand) {
+        cum += connectionCount[j];
+        j++;
+      }
+
+
+      var from = i;
+      var to = j;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+  }
+
+  return {nodes:nodes, edges:edges};
+}
+
+var randomSeed = 764; // Math.round(Math.random()*1000);
+function seededRandom() {
+  var x = Math.sin(randomSeed++) * 10000;
+  return x - Math.floor(x);
+}
+
+function getScaleFreeNetworkSeeded(nodeCount) {
+  var nodes = [];
+  var edges = [];
+  var connectionCount = [];
+
+  // randomly create some nodes and edges
+  for (var i = 0; i < nodeCount; i++) {
+    nodes.push({
+      id: i,
+      label: String(i)
+    });
+
+    connectionCount[i] = 0;
+
+    // create edges in a scale-free-network way
+    if (i == 1) {
+      var from = i;
+      var to = 0;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+    else if (i > 1) {
+      var conn = edges.length * 2;
+      var rand = Math.floor(seededRandom() * conn);
+      var cum = 0;
+      var j = 0;
+      while (j < connectionCount.length && cum < rand) {
+        cum += connectionCount[j];
+        j++;
+      }
+
+
+      var from = i;
+      var to = j;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+  }
+
+  return {nodes:nodes, edges:edges};
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/ca952ad9/ApacheCMDA-Frontend/public/javascripts/googleAnalytics.js
----------------------------------------------------------------------
diff --git a/ApacheCMDA-Frontend/public/javascripts/googleAnalytics.js b/ApacheCMDA-Frontend/public/javascripts/googleAnalytics.js
new file mode 100644
index 0000000..3bdfc85
--- /dev/null
+++ b/ApacheCMDA-Frontend/public/javascripts/googleAnalytics.js
@@ -0,0 +1,12 @@
+(function (i, s, o, g, r, a, m) {
+  i['GoogleAnalyticsObject'] = r;
+  i[r] = i[r] || function () {
+      (i[r].q = i[r].q || []).push(arguments)
+    }, i[r].l = 1 * new Date();
+  a = s.createElement(o), m = s.getElementsByTagName(o)[0];
+  a.async = 1;
+  a.src = g;
+  m.parentNode.insertBefore(a, m)
+})(window, document, 'script', 'http://www.google-analytics.com/analytics.js', 'ga');
+ga('create', 'UA-61231638-1', 'auto');
+ga('send', 'pageview');
\ No newline at end of file