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/09 00:49:56 UTC

[47/51] [partial] incubator-cmda git commit: Add frontend and backend

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/differencePlotTwoTimeAveragedVariables.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/differencePlotTwoTimeAveragedVariables.scala.html b/.target/views/climate/differencePlotTwoTimeAveragedVariables.scala.html
new file mode 100644
index 0000000..5b26eb7
--- /dev/null
+++ b/.target/views/climate/differencePlotTwoTimeAveragedVariables.scala.html
@@ -0,0 +1,1374 @@
+@*******************************************************************************
+ * 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.DiffPlotTwoTimeAveragedVar) @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">
+	var Response = null;
+    var variable1 = "";
+    var variable2 = "";
+    window.onload = function() {
+	    changeDataSource();
+	    select_data1(1);
+	    changeDataSource1();
+	    select_data1(2);
+	    changeVariableName();
+	    select_var1(1);
+	    changeVariableName1();
+	    select_var1(2);
+	    var imageUrl = $('#image').text();
+	    $('#purpose').html($('#executionPurpose').text());
+	    $('#Image').html('<img src="'+imageUrl+'" width=680 />');
+	    $('#data_url').html($('#dataURL').text());
+	    $('#Response').html($('serviceResponseText').text());
+    }
+    function changeVariableName1(){
+	    var var_string = $('#variableName2').text();
+	    var x=document.getElementById("var2");
+	    if (var_string == "clt")
+	    x.options[1].selected=true;
+	    else if (var_string == "ts")
+	    x.options[2].selected=true;
+	    else if (var_string == "tos")
+	    x.options[3].selected=true;
+	    else if (var_string == "pr")
+	    x.options[0].selected=true;
+	    else if (var_string == "uas")
+	    x.options[4].selected=true;
+	    else if (var_string == "vas")
+	    x.options[5].selected=true;
+	    else if (var_string == "sfcWind")
+	    x.options[6].selected=true;
+	    else if (var_string == "zos")
+	    x.options[7].selected=true;
+	    else if (var_string == "lai")
+	    x.options[8].selected=true;
+	    else if (var_string == "zl")
+	    x.options[9].selected=true;
+	    else if (var_string == "zo")
+	    x.options[10].selected=true;
+	    else if (var_string == "ohc700")
+	    x.options[11].selected=true;
+	    else if (var_string == "ohc2000")
+	    x.options[12].selected=true;
+	    else if (var_string == "rlds")
+	    x.options[13].selected=true;
+	    else if (var_string == "rsds")
+	    x.options[14].selected=true;
+	    else if (var_string == "rlus")
+	    x.options[15].selected=true;
+	    else if (var_string == "rsus")
+	    x.options[16].selected=true;
+	    else if (var_string == "rldscs")
+	    x.options[17].selected=true;
+	    else if (var_string == "rsdscs")
+	    x.options[18].selected=true;
+	    else if (var_string == "rsuscs")
+	    x.options[19].selected=true;
+	    else if (var_string == "rsdt")
+	    x.options[20].selected=true;
+	    else if (var_string == "rlutcs")
+	    x.options[21].selected=true;
+	    else if (var_string == "rlut")
+	    x.options[22].selected=true;
+	    else if (var_string == "rsutcs")
+	    x.options[23].selected=true;
+	    else if (var_string == "rsut")
+	    x.options[24].selected=true;
+	}
+    function changeVariableName(){
+	    var var_string = $('#variableName1').text();
+	    var x=document.getElementById("var1");
+	    if (var_string == "clt")
+	    x.options[1].selected=true;
+	    else if (var_string == "ts")
+	    x.options[2].selected=true;
+	    else if (var_string == "tos")
+	    x.options[3].selected=true;
+	    else if (var_string == "pr")
+	    x.options[0].selected=true;
+	    else if (var_string == "uas")
+	    x.options[4].selected=true;
+	    else if (var_string == "vas")
+	    x.options[5].selected=true;
+	    else if (var_string == "sfcWind")
+	    x.options[6].selected=true;
+	    else if (var_string == "zos")
+	    x.options[7].selected=true;
+	    else if (var_string == "lai")
+	    x.options[8].selected=true;
+	    else if (var_string == "zl")
+	    x.options[9].selected=true;
+	    else if (var_string == "zo")
+	    x.options[10].selected=true;
+	    else if (var_string == "ohc700")
+	    x.options[11].selected=true;
+	    else if (var_string == "ohc2000")
+	    x.options[12].selected=true;
+	    else if (var_string == "rlds")
+	    x.options[13].selected=true;
+	    else if (var_string == "rsds")
+	    x.options[14].selected=true;
+	    else if (var_string == "rlus")
+	    x.options[15].selected=true;
+	    else if (var_string == "rsus")
+	    x.options[16].selected=true;
+	    else if (var_string == "rldscs")
+	    x.options[17].selected=true;
+	    else if (var_string == "rsdscs")
+	    x.options[18].selected=true;
+	    else if (var_string == "rsuscs")
+	    x.options[19].selected=true;
+	    else if (var_string == "rsdt")
+	    x.options[20].selected=true;
+	    else if (var_string == "rlutcs")
+	    x.options[21].selected=true;
+	    else if (var_string == "rlut")
+	    x.options[22].selected=true;
+	    else if (var_string == "rsutcs")
+	    x.options[23].selected=true;
+	    else if (var_string == "rsut")
+	    x.options[24].selected=true;
+    }
+    function changeDataSource1(){
+	    var dataSource = $('#source2').text();
+	    dataSource = dataSource.toUpperCase();
+	    var x = document.getElementById("data2");
+	    if(dataSource == "NASA_MODIS" ){
+	    x.options[13].selected=true;
+	    }
+	    else if(dataSource == "NASA_AMSRE" ){
+	    x.options[14].selected=true;
+	    }
+	    else if(dataSource == "NASA_TRMM" ){
+	    x.options[15].selected=true;
+	    }
+	    else if(dataSource == "NASA_GPCP" ){
+	    x.options[16].selected=true;
+	    }
+	    else if(dataSource == "NASA_QUIKSCAT" ){
+	    x.options[17].selected=true;
+	    }
+	    else if(dataSource == "NASA_AVISO" ){
+	    x.options[18].selected=true;
+	    }
+	    else if(dataSource == "NASA_GRACE" ){
+	    x.options[19].selected=true;
+	    }
+	    else if(dataSource == "NOAA_NODC" ){
+	    x.options[20].selected=true;
+	    }
+	    else if(dataSource == "NASA_CERES" ){
+	    x.options[21].selected=true;
+	    }
+	    else if(dataSource == "NASA_AIRS" ){
+	    x.options[22].selected=true;
+	    }
+	    else if(dataSource == "NASA_MLS" ){
+	    x.options[23].selected=true;
+	    }
+	    else if(dataSource == "NASA_ARGO" ){
+	    x.options[24].selected=true;
+	    }
+	    else if(dataSource == "CCCMA_CANESM2" ){
+	    x.options[0].selected=true;
+	    }
+	    else if(dataSource == "GFDL_ESM2G" ){
+	    x.options[1].selected=true;
+	    }
+	    else if(dataSource == "GISS_E2-H" ){
+	    x.options[2].selected=true;
+	    }
+	    else if(dataSource == "GISS_E2-R" ){
+	    x.options[3].selected=true;
+	    }
+	    else if(dataSource == "NCAR_CAM5" ){
+	    x.options[4].selected=true;
+	    }
+	    else if(dataSource == "NCC_NORESM" ){
+	    x.options[5].selected=true;
+	    }
+	    else if(dataSource == "UKMO_HADGEM2-ES" ){
+	    x.options[6].selected=true;
+	    }
+	    else if(dataSource == "CCCMA_CANAM4" ){
+	    x.options[7].selected=true;
+	    }
+	    else if(dataSource == "CSIRO_MK3.6" ){
+	    x.options[8].selected=true;
+	    }
+	    else if(dataSource == "GFDL_CM3" ){
+	    x.options[9].selected=true;
+	    }
+	    else if(dataSource == "IPSL_CM5A-LR" ){
+	    x.options[10].selected=true;
+	    }
+	    else if(dataSource == "MIROC_MIROC5" ){
+	    x.options[11].selected=true;
+	    }
+	    else if(dataSource == "UKMO_HADGEM2-A" ){
+	    x.options[12].selected=true;
+	    }
+	    else if(dataSource == "ECMWF_INTERIM" ){
+	    x.options[25].selected=true;
+	    }
+    }
+    function changeDataSource(){
+	    var dataSource = $('#source1').text();
+	    dataSource = dataSource.toUpperCase();
+	    var x = document.getElementById("data1");
+	    if(dataSource == "NASA_MODIS" ){
+	    x.options[13].selected=true;
+	    }
+	    else if(dataSource == "NASA_AMSRE" ){
+	    x.options[14].selected=true;
+	    }
+	    else if(dataSource == "NASA_TRMM" ){
+	    x.options[15].selected=true;
+	    }
+	    else if(dataSource == "NASA_GPCP" ){
+	    x.options[16].selected=true;
+	    }
+	    else if(dataSource == "NASA_QUIKSCAT" ){
+	    x.options[17].selected=true;
+	    }
+	    else if(dataSource == "NASA_AVISO" ){
+	    x.options[18].selected=true;
+	    }
+	    else if(dataSource == "NASA_GRACE" ){
+	    x.options[19].selected=true;
+	    }
+	    else if(dataSource == "NOAA_NODC" ){
+	    x.options[20].selected=true;
+	    }
+	    else if(dataSource == "NASA_CERES" ){
+	    x.options[21].selected=true;
+	    }
+	    else if(dataSource == "NASA_AIRS" ){
+	    x.options[22].selected=true;
+	    }
+	    else if(dataSource == "NASA_MLS" ){
+	    x.options[23].selected=true;
+	    }
+	    else if(dataSource == "NASA_ARGO" ){
+	    x.options[24].selected=true;
+	    }
+	    else if(dataSource == "CCCMA_CANESM2" ){
+	    x.options[0].selected=true;
+	    }
+	    else if(dataSource == "GFDL_ESM2G" ){
+	    x.options[1].selected=true;
+	    }
+	    else if(dataSource == "GISS_E2-H" ){
+	    x.options[2].selected=true;
+	    }
+	    else if(dataSource == "GISS_E2-R" ){
+	    x.options[3].selected=true;
+	    }
+	    else if(dataSource == "NCAR_CAM5" ){
+	    x.options[4].selected=true;
+	    }
+	    else if(dataSource == "NCC_NORESM" ){
+	    x.options[5].selected=true;
+	    }
+	    else if(dataSource == "UKMO_HADGEM2-ES" ){
+	    x.options[6].selected=true;
+	    }
+	    else if(dataSource == "CCCMA_CANAM4" ){
+	    x.options[7].selected=true;
+	    }
+	    else if(dataSource == "CSIRO_MK3.6" ){
+	    x.options[8].selected=true;
+	    }
+	    else if(dataSource == "GFDL_CM3" ){
+	    x.options[9].selected=true;
+	    }
+	    else if(dataSource == "IPSL_CM5A-LR" ){
+	    x.options[10].selected=true;
+	    }
+	    else if(dataSource == "MIROC_MIROC5" ){
+	    x.options[11].selected=true;
+	    }
+	    else if(dataSource == "UKMO_HADGEM2-A" ){
+	    x.options[12].selected=true;
+	    }
+	    else if(dataSource == "ECMWF_INTERIM" ){
+	    x.options[25].selected=true;
+	    }
+    }
+    function enable_download_button()
+    {
+      var x=document.getElementById("download_data");
+      x.disabled=false;
+    }
+    function unset_vars1(ID)
+    {
+      var x;
+      if (ID == 1) {
+        x=document.getElementById("var1");
+      }
+      else if (ID == 2) {
+        x=document.getElementById("var2");
+      }
+      x.options[0].disabled=true;
+      x.options[1].disabled=true;
+      x.options[2].disabled=true;
+      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[8].disabled=true;
+      x.options[9].disabled=true;
+      x.options[10].disabled=true;
+      x.options[11].disabled=true;
+      x.options[12].disabled=true;
+      x.options[13].disabled=true;
+      x.options[14].disabled=true;
+      x.options[15].disabled=true;
+      x.options[16].disabled=true;
+      x.options[17].disabled=true;
+      x.options[18].disabled=true;
+      x.options[19].disabled=true;
+      x.options[20].disabled=true;
+      x.options[21].disabled=true;
+      x.options[22].disabled=true;
+      x.options[23].disabled=true;
+      x.options[24].disabled=true;
+      x.options[25].disabled=true;
+      x.options[26].disabled=true;
+      x.options[27].disabled=true;
+      x.options[28].disabled=true;
+      x.options[29].disabled=true;
+      x.options[30].disabled=true;
+      x.options[31].disabled=true;
+      x.options[32].disabled=true;
+    }
+    function disable_pres1(ID)
+    {
+      var x;
+      if (ID == 1) {
+        x=document.getElementById("pres1");
+      }
+      else if (ID == 2) {
+        x=document.getElementById("pres2");
+      }
+      x.value = "N/A";
+      x.disabled=true;
+    }
+    function enable_pres1(ID)
+    {
+      var x;
+      if (ID == 1) {
+        x=document.getElementById("pres1");
+      }
+      else if (ID == 2) {
+        x=document.getElementById("pres2");
+      }
+      x.value = "500";
+      x.disabled=false;
+    }
+    function select_var1(ID)
+    {
+      var var_string;
+      if (ID == 1) {
+        var_string = $("#var1").val();
+      }
+      else if (ID == 2) {
+        var_string = $("#var2").val();
+    }
+    disable_download_button();  
+    if (var_string == "Total Cloud Fraction") { 
+      if (ID == 1) {
+        variable1 = "clt";  
+      }
+      else if (ID == 2) {
+        variable2 = "clt";  
+      }
+      disable_pres1(ID);
+    }
+     else if (var_string == "Surface Temperature") {
+       if (ID == 1) {
+         variable1 = "ts";  
+       }
+       else if (ID == 2) {
+         variable2 = "ts";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Sea Surface Temperature") { 
+       if (ID == 1) {
+         variable1 = "tos";  
+       }
+       else if (ID == 2) {
+         variable2 = "tos";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Precipitation Flux") { 
+       if (ID == 1) {
+         variable1 = "pr";  
+       }
+       else if (ID == 2) {
+         variable2 = "pr";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Eastward Near-Surface Wind") { 
+       if (ID == 1) {
+         variable1 = "uas";  
+       }
+       else if (ID == 2) {
+         variable2 = "uas";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Northward Near-Surface Wind") {  
+       if (ID == 1) {
+         variable1 = "vas";  
+       }
+       else if (ID == 2) {
+         variable2 = "vas";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Near-Surface Wind Speed") { 
+       if (ID == 1) {
+         variable1 = "sfcWind";  
+       }
+       else if (ID == 2) {
+         variable2 = "sfcWind";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Sea Surface Height") { 
+       if (ID == 1) {
+         variable1 = "zos";  
+       }
+       else if (ID == 2) {
+         variable2 = "zos";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Leaf Area Index") { 
+       if (ID == 1) {
+         variable1 = "lai";  
+       }
+       else if (ID == 2) {
+         variable2 = "lai";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Equivalent Water Height Over Land") {
+       if (ID == 1) {
+         variable1 = "zl";  
+       }
+       else if (ID == 2) {
+         variable2 = "zl";  
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Equivalent Water Height Over Ocean") {
+       if (ID == 1) {
+         variable1 = "zo";
+       }
+       else if (ID == 2) {
+         variable2 = "zo";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Ocean Heat Content Anomaly within 700 m Depth") {
+       if (ID == 1) {
+         variable1 = "ohc700";
+       }
+       else if (ID == 2) {
+         variable2 = "ohc700";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Ocean Heat Content Anomaly within 2000 m Depth") {
+       if (ID == 1) {
+         variable1 = "ohc2000";
+       }
+       else if (ID == 2) {
+         variable2 = "ohc2000";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Downwelling Longwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rlds";
+       }
+       else if (ID == 2) {
+         variable2 = "rlds";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Downwelling Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsds";
+       }
+       else if (ID == 2) {
+         variable2 = "rsds";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Upwelling Longwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rlus";
+       }
+       else if (ID == 2) {
+         variable2 = "rlus";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Upwelling Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsus";
+       }
+       else if (ID == 2) {
+         variable2 = "rsus";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Downwelling Clear-Sky Longwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rldscs";
+       }
+       else if (ID == 2) {
+         variable2 = "rldscs";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Downwelling Clear-Sky Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsdscs";
+       }
+       else if (ID == 2) {
+         variable2 = "rsdscs";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Surface Upwelling Clear-Sky Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsuscs";
+       }
+       else if (ID == 2) {
+         variable2 = "rsuscs";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "TOA Incident Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsdt";
+       }
+       else if (ID == 2) {
+         variable2 = "rsdt";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "TOA Outgoing Clear-Sky Longwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rlutcs";
+       }
+       else if (ID == 2) {
+         variable2 = "rlutcs";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "TOA Outgoing Longwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rlut";
+       }
+       else if (ID == 2) {
+         variable2 = "rlut";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "TOA Outgoing Clear-Sky Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsutcs";
+       }
+       else if (ID == 2) {
+         variable2 = "rsutcs";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "TOA Outgoing Shortwave Radiation") {
+       if (ID == 1) {
+         variable1 = "rsut";
+       }
+       else if (ID == 2) {
+         variable2 = "rsut";
+       }
+       disable_pres1(ID);
+     }
+     else if (var_string == "Air Temperature") {
+       if (ID == 1) {
+         variable1 = "ta";
+       }
+       else if (ID == 2) {
+         variable2 = "ta";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Specific Humidity") {
+       if (ID == 1) {
+         variable1 = "hus";
+       }
+       else if (ID == 2) {
+         variable2 = "hus";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Cloud Ice Water Content") {
+       if (ID == 1) {
+         variable1 = "cli";
+       }
+       else if (ID == 2) {
+         variable2 = "cli";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Cloud Liquid Water Content") {
+       if (ID == 1) {
+         variable1 = "clw";
+       }
+       else if (ID == 2) {
+         variable2 = "clw";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Ocean Temperature") {
+       if (ID == 1) {
+         variable1 = "ot";
+       }
+       else if (ID == 2) {
+         variable2 = "ot";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Ocean Salinity") {
+       if (ID == 1) {
+         variable1 = "os";
+       }
+       else if (ID == 2) {
+         variable2 = "os";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Vertical Wind Velocity") {
+       if (ID == 1) {
+         variable1 = "wap";
+       }
+       else if (ID == 2) {
+         variable2 = "wap";
+       }
+       enable_pres1(ID);
+     }
+     else if (var_string == "Relative Humidity") {
+       if (ID == 1) {
+         variable1 = "hur";
+       }
+       else if (ID == 2) {
+         variable2 = "hur";
+       }
+       enable_pres1(ID);
+     }
+    }
+    function select_data1(ID)
+    {
+      var data_string;
+      var x;
+      if (ID == 1) {
+        data_string = $("#data1").val();
+        x = document.getElementById("var1");
+      }
+      else if (ID == 2) {
+        data_string = $("#data2").val();
+        x = document.getElementById("var2");
+      }
+      disable_download_button();
+      if (data_string == "NASA/AMSRE") {
+        unset_vars1(ID); 
+        x.options[3].selected=true;
+        disable_pres1(ID); 
+        x.options[3].disabled=false;
+      }
+      else if (data_string == "NASA/MODIS") {
+        unset_vars1(ID);
+        x.options[1].selected=true;
+        disable_pres1(ID); 
+        x.options[1].disabled=false;
+        x.options[8].disabled=false;
+      }
+      else if (data_string == "NASA/TRMM") {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+      }
+      else if (data_string == "NASA/GPCP") {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+      }
+      else if (data_string == "NASA/QuikSCAT") {
+        unset_vars1(ID);
+        x.options[4].selected=true;
+        disable_pres1(ID); 
+        x.options[4].disabled=false;
+        x.options[5].disabled=false;
+        x.options[6].disabled=false;
+      }
+      else if (data_string == "NASA/AVISO") {
+        unset_vars1(ID);
+        x.options[7].selected=true;
+        disable_pres1(ID); 
+        x.options[7].disabled=false;
+      }
+      else if (data_string == "NASA/GRACE") {
+        unset_vars1(ID);
+        x.options[9].selected=true;
+        disable_pres1(ID); 
+        x.options[9].disabled=false;
+        x.options[10].disabled=false;
+      }
+      else if (data_string == "NOAA/NODC") {
+        unset_vars1(ID);
+        x.options[11].selected=true;
+        disable_pres1(ID); 
+        x.options[11].disabled=false;
+        x.options[12].disabled=false;
+      }
+      else if (data_string == "NASA/CERES") {
+        unset_vars1(ID);
+        x.options[13].selected=true;
+        disable_pres1(ID); 
+        x.options[13].disabled=false;
+        x.options[14].disabled=false;
+        x.options[15].disabled=false;
+        x.options[16].disabled=false;
+        x.options[17].disabled=false;
+        x.options[18].disabled=false;
+        x.options[19].disabled=false;
+        x.options[20].disabled=false;
+        x.options[21].disabled=false;
+        x.options[22].disabled=false;
+        x.options[23].disabled=false;
+        x.options[24].disabled=false;
+      }
+      else if (data_string == "NASA/AIRS") {
+        unset_vars1(ID);
+        x.options[25].selected=true;
+        enable_pres1(ID); 
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+      }
+      else if (data_string == "NASA/MLS") {
+        unset_vars1(ID);
+        x.options[25].selected=true;
+        enable_pres1(ID); 
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+      }
+      else if (data_string == "ARGO/ARGO") {
+        unset_vars1(ID);
+        x.options[29].selected=true;
+        enable_pres1(ID); 
+        x.options[29].disabled=false;
+        x.options[30].disabled=false;
+      }
+      else if (data_string == "CCCMA/CANAM4") {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+        x.options[1].disabled=false;
+        x.options[2].disabled=false;
+        x.options[4].disabled=false;
+        x.options[5].disabled=false;
+        x.options[6].disabled=false;
+        x.options[13].disabled=false;
+        x.options[14].disabled=false;
+        x.options[15].disabled=false;
+        x.options[16].disabled=false;
+        x.options[17].disabled=false;
+        x.options[18].disabled=false;
+        x.options[19].disabled=false;
+        x.options[20].disabled=false;
+        x.options[21].disabled=false;
+        x.options[22].disabled=false;
+        x.options[23].disabled=false;
+        x.options[24].disabled=false;
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+        x.options[27].disabled=false;
+        x.options[28].disabled=false;
+      }
+      else if (data_string == "CSIRO/MK3.6") {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+        x.options[1].disabled=false;
+        x.options[2].disabled=false;
+        x.options[4].disabled=false;
+        x.options[5].disabled=false;
+        x.options[6].disabled=false;
+        x.options[13].disabled=false;
+        x.options[14].disabled=false;
+        x.options[15].disabled=false;
+        x.options[16].disabled=false;
+        x.options[17].disabled=false;
+        x.options[18].disabled=false;
+        x.options[19].disabled=false;
+        x.options[20].disabled=false;
+        x.options[21].disabled=false;
+        x.options[22].disabled=false;
+        x.options[23].disabled=false;
+        x.options[24].disabled=false;
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+        x.options[27].disabled=false;
+        x.options[28].disabled=false;
+        x.options[31].disabled=false;
+        x.options[32].disabled=false;
+      }
+      else if (data_string == "NCAR/CAM5") {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+        x.options[1].disabled=false;
+        x.options[2].disabled=false;
+        x.options[3].disabled=false;
+        x.options[4].disabled=false;
+        x.options[5].disabled=false;
+        x.options[6].disabled=false;
+        x.options[7].disabled=false;
+        x.options[8].disabled=false;
+        x.options[14].disabled=false;
+        x.options[15].disabled=false;
+        x.options[16].disabled=false;
+        x.options[17].disabled=false;
+        x.options[18].disabled=false;
+        x.options[19].disabled=false;
+        x.options[20].disabled=false;
+        x.options[21].disabled=false;
+        x.options[22].disabled=false;
+        x.options[23].disabled=false;
+        x.options[24].disabled=false;
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+        x.options[27].disabled=false;
+        x.options[28].disabled=false;
+        x.options[31].disabled=false;
+        x.options[32].disabled=false;
+      }
+      else if (data_string == "CCCMA/CANESM2" || data_string == "GFDL/ESM2G" ||
+               data_string == "GISS/E2-H" || data_string == "GISS/E2-R" ||
+               data_string == "NCC/NORESM" ||
+               data_string == "UKMO/HadGEM2-ES" ||
+               data_string == "GFDL/CM3" || data_string == "IPSL/CM5A-LR" ||
+               data_string == "MIROC/MIROC5" || data_string == "UKMO/HadGEM2-A"
+              ) {
+        unset_vars1(ID);
+        x.options[0].selected=true;
+        disable_pres1(ID); 
+        x.options[0].disabled=false;
+        x.options[1].disabled=false;
+        x.options[2].disabled=false;
+        x.options[3].disabled=false;
+        x.options[4].disabled=false;
+        x.options[5].disabled=false;
+        x.options[6].disabled=false;
+        x.options[7].disabled=false;
+        x.options[8].disabled=false;
+        x.options[13].disabled=false;
+        x.options[14].disabled=false;
+        x.options[15].disabled=false;
+        x.options[16].disabled=false;
+        x.options[17].disabled=false;
+        x.options[18].disabled=false;
+        x.options[19].disabled=false;
+        x.options[20].disabled=false;
+        x.options[21].disabled=false;
+        x.options[22].disabled=false;
+        x.options[23].disabled=false;
+        x.options[24].disabled=false;
+        x.options[25].disabled=false;
+        x.options[26].disabled=false;
+        x.options[27].disabled=false;
+        x.options[28].disabled=false;
+        x.options[31].disabled=false;
+        x.options[32].disabled=false;
+      }
+      else if (data_string == "ECMWF/interim") {
+        unset_vars1(ID);
+        x.options[3].selected=true;
+        disable_pres1(ID); 
+        x.options[3].disabled=false;
+        x.options[31].disabled=false;
+        x.options[32].disabled=false;
+      }
+      select_var1(ID);
+    }
+    $(document).ready(function(){
+    $("#download_data").click(function(event) {
+      var durl = $("#data_url").val();
+      window.location.assign(durl);
+    });
+      $("#scatterPlot2V").click(function(event) {
+        Response = null;
+        disable_download_button();
+        $("#Response").html("Calculating ...");
+        $("#data_url").html("Calculating ...");
+        $("#Image").html("");
+        var url = "http://" + window.location.hostname + ":9002/svc/diffPlot2V?";
+        var d1 = $("#data1").val();
+        var model1 = d1.replace("/", "_");
+        model1 = model1.toLowerCase();
+        var arglist = "";
+        arglist = arglist.concat("model1=");
+        arglist = arglist.concat(model1);
+        var v1 = $("#var1").val();
+        arglist = arglist.concat("&var1=");
+        arglist = arglist.concat(variable1);
+        var pres1 = $("#pres1").val();
+        arglist = arglist.concat("&pres1=");
+        arglist = arglist.concat(pres1);
+        var d2 = $("#data2").val();
+        var model2 = d2.replace("/", "_");
+        model2 = model2.toLowerCase();
+        arglist = arglist.concat("&model2=");
+        arglist = arglist.concat(model2);
+        var v2 = $("#var2").val();
+        arglist = arglist.concat("&var2=");
+        arglist = arglist.concat(variable2);
+        var pres2 = $("#pres2").val();
+        arglist = arglist.concat("&pres2=");
+        arglist = arglist.concat(pres2);
+        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 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 purpose = $("#purpose").val();
+        arglist = arglist.concat("&purpose=");
+        arglist = arglist.concat(purpose);
+        url = url + encodeURI(arglist);
+        var urlTimeBounds = "http://" + window.location.hostname + ":9002/svc/two_time_bounds?";
+        var arglistTB = "";
+        arglistTB = arglistTB.concat("serviceType=");
+        arglistTB = arglistTB.concat("2");
+        arglistTB = arglistTB.concat("&source1=");
+        arglistTB = arglistTB.concat(d1);
+        arglistTB = arglistTB.concat("&var1=");
+        arglistTB = arglistTB.concat(variable1);
+        arglistTB = arglistTB.concat("&source2=");
+        arglistTB = arglistTB.concat(d2);
+        arglistTB = arglistTB.concat("&var2=");
+        arglistTB = arglistTB.concat(variable2);
+        urlTimeBounds = urlTimeBounds + encodeURI(arglistTB);
+        $.ajax({
+            type: "GET",
+            url: urlTimeBounds,
+            dataType: "json",
+            data: null,
+            success: function(data, textStatus, xhr) {
+                Response = data;
+                if (data.success == false) {
+                    Response = null;
+                    var text = JSON.stringify(data, null, 4);
+                    text = "Error in backend: <br>" + text; 
+                    $("#Response").html(text);
+                    $("#data_url").html(text);
+                    return;
+                }
+                var text = JSON.stringify(data, null, 4);
+                var tb1 = data.time_bounds1;
+                var bds1 = String(tb1).split(",");
+                var lowerT1 = parseInt(bds1[0]);
+                var upperT1 = parseInt(bds1[1]);
+                var tb2 = data.time_bounds2;
+                var bds2 = String(tb2).split(",");
+                var lowerT2 = parseInt(bds2[0]);
+                var upperT2 = parseInt(bds2[1]);
+                var t0I = parseInt(t0);
+                var t1I = parseInt(t1);
+                var lowerT, upperT;
+                if (lowerT1 == 0  || upperT1 == 0){ 
+                  alert("We do not have data for the data-1 source and variable configuration.");
+                  return;
+                }
+                else if (lowerT2 == 0  || upperT2 == 0){ 
+                  alert("We do not have data for the data-2 source and variable configuration.");
+                  return;
+                }
+                else if (lowerT2 > upperT1 || lowerT1 > upperT2) { 
+                  alert("The two data sets/vars do not have a common time range.");
+                  return;
+                }
+                else { 
+                  if (lowerT1 > lowerT2) { 
+                    lowerT = lowerT1;
+                  }
+                  else {
+                    lowerT = lowerT2;
+                  }
+                  if (upperT1 > upperT2) { 
+                    upperT = upperT2;
+                  }
+                  else {
+                    upperT = upperT1;
+                  }
+                }
+                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.");
+                }
+            },
+            error: function(xhr, textStatus, errorThrown) {
+		$("#Response").html("error!");
+		$("#data_url").html("error!");
+            },
+            complete: function(xhr, textStatus) {
+            }
+        });
+        $.ajax({
+            type: "GET",
+            url: url,
+            dataType: "json",
+            data: null,
+            success: function(data, textStatus, xhr) {
+                Response = data;
+                if (data.success == false) {
+                    Response = null;
+                    var text = JSON.stringify(data, null, 4);
+                    text = "Error in backend: <br>" + text; 
+                    $("#Response").html(text);
+                    $("#data_url").html(text);
+                    return;
+                }
+                var text = JSON.stringify(data, null, 4);
+                $("#Response").html(text);
+                var html = "<img src='"+data.url+"' width='820'/>";
+                $("#Image").html(html);
+                $("#data_url").html(data.dataUrl);
+                enable_download_button();
+            },
+            error: function(xhr, textStatus, errorThrown) {
+                $("#Response").html("error!");
+                $("#data_url").html("error!");
+            },
+            complete: function(xhr, textStatus) {
+            }
+        });
+      });
+    });
+  </script>
+} @main("Parameters of ConfId", scripts){ @flash_message()
+<p>
+<div id="source1" style="display: none;">@parameters.getSource1()</div>
+<div id="variableName1" style="display: none;">@parameters.getVaribaleName1()</div>
+<div id="pressureLevel1" style="display: none;">@parameters.getPressureLevel1()</div>
+<div id="startYearMonth" style="display: none;">@parameters.getStartYear()</div>
+<div id="startLat" style="display: none;">@parameters.getStartLat()</div>
+<div id="startLon" style="display: none;">@parameters.getStartLon()</div>
+<div id="source2" style="display: none;">@parameters.getSource2()</div>
+<div id="variableName2" style="display: none;">@parameters.getVaribaleName2()</div>
+<div id="pressureLevel2" style="display: none;">@parameters.getPressureLevel2()</div>
+<div id="endYearMonth" style="display: none;">@parameters.getEndYear()</div>
+<div id="endLat" style="display: none;">@parameters.getEndLat()</div>
+<div id="endLon" style="display: none;">@parameters.getEndLon()</div>
+<div id="executionPurpose" style="display: none;">@parameters.getExecutionPurpose()</div>
+<div id="image" style="display: none;">@parameters.getImage()</div>
+<div id="dataURL" style="display: none;">@parameters.getDataUrl()</div>
+<div id="serviceResponseText" style="display: none;">@parameters.getServiceResponse()</div>
+<table border="1">
+	<tr>
+		<td colspan="4">
+			<center>
+				<b>Service: Difference Plot of Two Time Averaged Variables</b><br>
+				<br> This service calculates the differences between two
+				specified variables and displays the lat-lon maps of the two
+				variables and their differences. <br>
+				<br>
+			</center>
+		</td>
+	</tr>
+	<tr>
+		<td colspan="2">
+			<center>data 1</center>
+		</td>
+		<td colspan="2">
+			<center>data 2</center>
+		</td>
+	</tr>
+	<tr>
+		<td>source:</td>
+		<td><select name="data1" , id="data1" onchange="select_data1(1)">
+				<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="Observation">
+					<option>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>
+					<option>NASA/AIRS</option>
+					<option>NASA/MLS</option>
+					<option>ARGO/ARGO</option>
+				</optgroup>
+				<optgroup label="Reanalysis">
+					<option>ECMWF/interim</option>
+				</optgroup>
+		</select></td>
+		<td>source:</td>
+		<td><select name="data2" , id="data2" onchange="select_data1(2)">
+				<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="Observation">
+					<option>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>
+					<option>NASA/AIRS</option>
+					<option>NASA/MLS</option>
+					<option>ARGO/ARGO</option>
+				</optgroup>
+				<optgroup label="Reanalysis">
+					<option>ECMWF/interim</option>
+				</optgroup>
+		</select></td>
+	</tr>
+	<tr>
+		<td>variable name:</td>
+		<td><select name="var1" , id="var1" onchange="select_var1(1)">
+				<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>
+				<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>
+		<td>variable name:</td>
+		<td><select name="var2" , id="var2" onchange="select_var1(2)">
+				<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>
+				<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>atmosphere pressure level (hPa) <br> or ocean pressure
+			level (dbar)
+		</td>
+		<td><input id="pres1" value="500" alt="pressure" /></td>
+		<td>atmosphere pressure level (hPa) <br> or ocean pressure
+			level (dbar)
+		</td>
+		<td><input id="pres2" value="500" alt="pressure" /></td>
+	</tr>
+	<tr>
+	</tr>
+	<tr>
+		<td>start year-month:</td>
+		<td><input id="t0" value=@parameters.getStartYear() alt="start" /></td>
+		<td>end year-month:</td>
+		<td><input id="t1" value=@parameters.getEndYear() 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">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="scatterPlot2V"
+			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 id="Response" cols="89"
+				rows="6">Service Response Text Here</textarea></td>
+	</tr>
+</table>
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/header.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/header.scala.html b/.target/views/climate/header.scala.html
new file mode 100644
index 0000000..0cae470
--- /dev/null
+++ b/.target/views/climate/header.scala.html
@@ -0,0 +1,77 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@()
+	<div class="navbar navbar-default navbar-fixed-top" role="navigation">
+		<div class="container">
+			<div class="navbar-header">
+				<button type="button" class="navbar-toggle" data-toggle="collapse"
+					data-target=".navbar-collapse">
+					<span class="sr-only">Toggle navigation</span> <span
+						class="icon-bar"></span> <span class="icon-bar"></span> <span
+						class="icon-bar"></span>
+				</button>
+				<a class="navbar-brand" style="padding-bottom: 0;" href="/climate"><img
+					src='@routes.Assets.at("images/NASA_JPL_logo.png")' style="height: 40px; width: 220px;">&nbsp&nbsp<img
+					src='@routes.Assets.at("images/logo.png")' style="height: 15px; width: 250px;"></a>
+			</div>
+			<div class="navbar-collapse collapse" style="height:">
+				<ul class="nav navbar-nav navbar-right">
+					
+					<li class="dropdown"><a href="#"
+						class="dropdown-toggle" data-toggle="dropdown">Service<b
+							class="caret"></b></a>
+						<ul class="dropdown-menu">
+
+						<li><a href="@routes.ClimateServiceController.climateServices()">Service List</a></li>
+					
+						</ul>
+					
+					</li>
+					<li class="dropdown"><a href="#"
+						class="dropdown-toggle" data-toggle="dropdown">Dataset<b
+							class="caret"></b></a>
+						<ul class="dropdown-menu">
+						
+						<li><a href="@routes.DatasetController.datasetList()">Dataset List</a></li>
+						<li><a href="@routes.DatasetController.searchDataset()">Search dataset</a></li>
+						</ul>
+					</li>
+					<li class="dropdown"><a href="#"
+						class="dropdown-toggle" data-toggle="dropdown">Support<b
+							class="caret"></b></a>
+						<ul class="dropdown-menu">
+							<li><a href="@routes.AccountController.getServiceLog">Service Execution Log List</a></li>
+							<li><a href="@routes.AccountController.searchServiceLog">Service Execution Log Search</a></li>
+						</ul>
+					</li>
+					
+					<li class="dropdown"><a href="#"
+						class="dropdown-toggle" data-toggle="dropdown">About<b
+							class="caret"></b></a>
+						<ul class="dropdown-menu">
+						<li><a href="@routes.ClimateServiceController.home()">Home</a></li>
+						<li><a href="@routes.AboutusController.aboutUs()">About Us</a></li>
+						<li><a href="@routes.AboutusController.aboutProject()">About project</a></li>
+						</ul>
+					</li>
+					
+				</ul>
+			</div>
+			<!--/.nav-collapse -->
+		</div>
+	</div>

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/home.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/home.scala.html b/.target/views/climate/home.scala.html
new file mode 100644
index 0000000..1803838
--- /dev/null
+++ b/.target/views/climate/home.scala.html
@@ -0,0 +1,58 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(email: String, vfile: String, dataset: String)
+
+@import helper._ 
+
+@main("Home") {
+
+<div class="jumbotron">
+	<div class="row">
+
+		<div class="col-lg-5">
+			</br></br>
+			<img src="/assets/images/main.jpg" height="480" width="330" />
+		</div>
+		<div class="col-lg-6">
+			<h2>Climate Model Diagnostic Analyzer</h2>
+			<br>
+			<p> A repository of web services for multi-aspect physics-based and 
+				phenomenon-oriented phenomenon-oriented climate model performance
+				evaluation and diagnosis through the comprehensive and synergistic 
+				use of multiple observational data, reanalysis data, and model outputs.
+			</p>
+			<br>
+			<p> This repository is specially customized to support the 2015 JPL Center
+				for Climate Sciences Summer School. The theme of the summer school is 
+				<b>Using Satellite Observations to Advance Climate Models</b>. This repository 
+				provides datasets and analysis tools for the students to use for their 
+				group research projects.
+			</p>
+			
+			<!-- @if(!session.get("username")){ -->
+			
+			<p>
+				@if(false){ <a class="btn btn-primary" href="climate/register"
+					role="button">Register &raquo;</a> }
+			</p>
+			<!-- } -->
+		</div>
+	</div>
+</div>
+
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/main.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/main.scala.html b/.target/views/climate/main.scala.html
new file mode 100644
index 0000000..121fc31
--- /dev/null
+++ b/.target/views/climate/main.scala.html
@@ -0,0 +1,93 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(title: String, moreScripts: Html = Html(""))(content: Html) 
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+<title>@title</title>
+<meta charset="utf-8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+<link rel="stylesheet"
+	href='@routes.Assets.at("stylesheets/bootstrap.css")'>
+<link rel="stylesheet"
+	href='@routes.Assets.at("stylesheets/navbar-fixed-top.css")'>
+<link rel="stylesheet"
+	href='@routes.Assets.at("stylesheets/custom.css")'>
+<link rel="stylesheet" media="screen"
+	href='@routes.Assets.at("stylesheets/main.css")'>
+<link rel="shortcut icon" type="image/png"
+	href='@routes.Assets.at("images/favicon.png")'>
+<link href='@routes.Assets.at("stylesheets/bootstrap-editable.css")'
+	rel="stylesheet" />
+<link href='@routes.Assets.at("stylesheets/jquery.tablesorter.pager.css")'
+	rel="stylesheet" />
+<link href='@routes.Assets.at("stylesheets/style.css")'
+	rel="stylesheet" />
+
+<script src='@routes.Assets.at("javascripts/jquery-1.9.0.min.js")'
+	type="text/javascript"></script>	
+<script src='@routes.Assets.at("javascripts/bootstrap.min.js")'
+	type="text/javascript"></script>
+<script type='text/javascript' src='@routes.Assets.at("javascripts/lastLoader.js")'></script>
+<script type='text/javascript' src='@routes.Assets.at("javascripts/jquery.metadata.js")'></script>	
+<script type='text/javascript' src='@routes.Assets.at("javascripts/jquery.tablesorter.js")'></script>
+
+
+<script type='text/javascript' src='@routes.Assets.at("javascripts/jstree.js")'></script>
+<script type='text/javascript' src='@routes.Assets.at("javascripts/keyword_tree.js")'></script>
+
+<script src='@routes.Assets.at("javascripts/bootstrap-editable.min.js")'></script>
+
+
+
+
+
+
+
+
+@moreScripts
+</head>
+
+<body>
+	@header()
+	
+
+
+	<div class="container">
+
+		@content
+
+	</div>
+	
+	<!-- Footer -->
+		<div class="footer" >
+			<div class="row">
+				<div class="col-lg-6 col-lg-offset-3">
+					<p class="text-muted" style="text-align: center; font-size: 14px;">&copy;
+						Carnegie Mellon University - Silicon Valley ; NASA Jet Propulsion Laboratory 2015</p>
+				</div>
+			</div>
+		</div>
+
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/mostPopularServices.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/mostPopularServices.scala.html b/.target/views/climate/mostPopularServices.scala.html
new file mode 100644
index 0000000..675c307
--- /dev/null
+++ b/.target/views/climate/mostPopularServices.scala.html
@@ -0,0 +1,95 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(climateServices: List[metadata.ClimateService], climateServiceForm: play.data.Form[metadata.ClimateService])
+
+@import helper._
+
+@scripts = {
+	<script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
+	<script type="text/javascript">
+	$(document).ready(function(){
+		//alert($("#url").text());
+	});
+	</script>
+}
+
+@main("Climate Services", scripts) {
+	
+	@flash_message()   
+	 
+    <h1>@climateServices.size() Most Popular Used Climate Services</h1>
+		<table class="table table-striped table-bordered table-condensed ex2">
+	<tr>
+		<td class="col-md-2">Climate Service Name</td>
+		<td class="col-md-4">Purpose</td>
+		<td class="col-md-4">Url</td>
+		<td class="col-md-2">Scenario</td>
+		<td class="col-md-2">Version</td>
+		<td class="col-md-2">Root Service</td>
+		 @if(true){
+			<td class="col-md-3">Operation</td> 
+	     } 
+	</tr>
+	@for(climateService <- climateServices){
+	<tr>
+		<td><a href = "@climateService.getUrl()">@climateService.getClimateServiceName()</a></td>
+
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='purpose'>
+				@climateService.getPurpose() </span></td>
+		
+		<td><span class="@climateService.getClimateServiceName() editable" id = "url" data-name='url'>
+				<a href = "@climateService.getUrl()"><img src='@climateService.getPhoto()' style="height: 100px; width: 100px" ></a> </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='scenario'>
+				@climateService.getScenario() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='versionNo'>
+				@climateService.getVersion() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='rootServiceId'>
+				@climateService.getRootservice() </span></td>
+				
+		@if(true){ 
+			<td class="operation">
+				<input type="button" class="edit-btn btn btn-primary" value="Edit" 
+					data-pk='@climateService.getClimateServiceName()'
+					data-url='@routes.ClimateServiceController.editClimateService()' 
+				>
+				@form(routes.ClimateServiceController.deleteClimateService()){ 
+					<input
+						name="idHolder" class="hidden" type="hidden"
+						value="@climateService.getId()"> 
+					<input
+						type="submit" class="btn btn-danger delete-btn span2" value="Delete"
+						onclick="return confirm('Are you sure you want to delete this item?')">
+				}
+			</td> 
+		}
+	</tr>
+	}
+    </table>
+ 
+    
+     @if(true){
+		    
+	    @form(routes.ClimateServiceController.downloadClimateService(), 'class -> "form-horizontal", 'role -> "form") {
+	
+	        <button type="submit" name="action" value="download">Download</button>
+	    }
+    }
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/mostRecentlyAddedServices.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/mostRecentlyAddedServices.scala.html b/.target/views/climate/mostRecentlyAddedServices.scala.html
new file mode 100644
index 0000000..98d738a
--- /dev/null
+++ b/.target/views/climate/mostRecentlyAddedServices.scala.html
@@ -0,0 +1,95 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(climateServices: List[metadata.ClimateService], climateServiceForm: play.data.Form[metadata.ClimateService])
+
+@import helper._
+
+@scripts = {
+	<script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
+	<script type="text/javascript">
+	$(document).ready(function(){
+		//alert($("#url").text());
+	});
+	</script>
+}
+
+@main("Climate Services", scripts) {
+	
+	@flash_message()   
+	 
+    <h1>@climateServices.size() Most Recently Added Climate Services</h1>
+		<table class="table table-striped table-bordered table-condensed ex2">
+	<tr>
+		<td class="col-md-2">Climate Service Name</td>
+		<td class="col-md-4">Purpose</td>
+		<td class="col-md-4">Url</td>
+		<td class="col-md-2">Scenario</td>
+		<td class="col-md-2">Version</td>
+		<td class="col-md-2">Root Service</td>
+		 @if(true){
+			<td class="col-md-3">Operation</td> 
+	     } 
+	</tr>
+	@for(climateService <- climateServices){
+	<tr>
+		<td><a href = "@climateService.getUrl()">@climateService.getClimateServiceName()</a></td>
+
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='purpose'>
+				@climateService.getPurpose() </span></td>
+		
+		<td><span class="@climateService.getClimateServiceName() editable" id = "url" data-name='url'>
+				<a href = "@climateService.getUrl()"><img src='@climateService.getPhoto()' style="height: 100px; width: 100px" ></a> </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='scenario'>
+				@climateService.getScenario() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='versionNo'>
+				@climateService.getVersion() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='rootServiceId'>
+				@climateService.getRootservice() </span></td>
+				
+		@if(true){ 
+			<td class="operation">
+				<input type="button" class="edit-btn btn btn-primary" value="Edit" 
+					data-pk='@climateService.getClimateServiceName()'
+					data-url='@routes.ClimateServiceController.editClimateService()' 
+				>
+				@form(routes.ClimateServiceController.deleteClimateService()){ 
+					<input
+						name="idHolder" class="hidden" type="hidden"
+						value="@climateService.getId()"> 
+					<input
+						type="submit" class="btn btn-danger delete-btn span2" value="Delete"
+						onclick="return confirm('Are you sure you want to delete this item?')">
+				}
+			</td> 
+		}
+	</tr>
+	}
+    </table>
+ 
+    
+     @if(true){
+		    
+	    @form(routes.ClimateServiceController.downloadClimateService(), 'class -> "form-horizontal", 'role -> "form") {
+	
+	        <button type="submit" name="action" value="download">Download</button>
+	    }
+    }
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/mostRecentlyUsedServices.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/mostRecentlyUsedServices.scala.html b/.target/views/climate/mostRecentlyUsedServices.scala.html
new file mode 100644
index 0000000..0b65381
--- /dev/null
+++ b/.target/views/climate/mostRecentlyUsedServices.scala.html
@@ -0,0 +1,95 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(climateServices: List[metadata.ClimateService], climateServiceForm: play.data.Form[metadata.ClimateService])
+
+@import helper._
+
+@scripts = {
+	<script src='@routes.Assets.at("javascripts/edit_button.js")'></script>
+	<script type="text/javascript">
+	$(document).ready(function(){
+		//alert($("#url").text());
+	});
+	</script>
+}
+
+@main("Climate Services", scripts) {
+	
+	@flash_message()   
+	 
+    <h1>@climateServices.size() Most Recently Used Climate Services</h1>
+		<table class="table table-striped table-bordered table-condensed ex2">
+	<tr>
+		<td class="col-md-2">Climate Service Name</td>
+		<td class="col-md-4">Purpose</td>
+		<td class="col-md-4">Url</td>
+		<td class="col-md-2">Scenario</td>
+		<td class="col-md-2">Version</td>
+		<td class="col-md-2">Root Service</td>
+		 @if(true){
+			<td class="col-md-3">Operation</td> 
+	     } 
+	</tr>
+	@for(climateService <- climateServices){
+	<tr>
+		<td><a href = "@climateService.getUrl()">@climateService.getClimateServiceName()</a></td>
+
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='purpose'>
+				@climateService.getPurpose() </span></td>
+		
+		<td><span class="@climateService.getClimateServiceName() editable" id = "url" data-name='url'>
+				<a href = "@climateService.getUrl()"><img src='@climateService.getPhoto()' style="height: 100px; width: 100px" ></a> </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='scenario'>
+				@climateService.getScenario() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='versionNo'>
+				@climateService.getVersion() </span></td>
+				
+		<td><span class="@climateService.getClimateServiceName() editable" data-name='rootServiceId'>
+				@climateService.getRootservice() </span></td>
+				
+		@if(true){ 
+			<td class="operation">
+				<input type="button" class="edit-btn btn btn-primary" value="Edit" 
+					data-pk='@climateService.getClimateServiceName()'
+					data-url='@routes.ClimateServiceController.editClimateService()' 
+				>
+				@form(routes.ClimateServiceController.deleteClimateService()){ 
+					<input
+						name="idHolder" class="hidden" type="hidden"
+						value="@climateService.getId()"> 
+					<input
+						type="submit" class="btn btn-danger delete-btn span2" value="Delete"
+						onclick="return confirm('Are you sure you want to delete this item?')">
+				}
+			</td> 
+		}
+	</tr>
+	}
+    </table>
+ 
+    
+     @if(true){
+		    
+	    @form(routes.ClimateServiceController.downloadClimateService(), 'class -> "form-horizontal", 'role -> "form") {
+	
+	        <button type="submit" name="action" value="download">Download</button>
+	    }
+    }
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/oneService.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/oneService.scala.html b/.target/views/climate/oneService.scala.html
new file mode 100644
index 0000000..ecb9373
--- /dev/null
+++ b/.target/views/climate/oneService.scala.html
@@ -0,0 +1,40 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(url: String) 
+
+@import helper._ 
+
+@scripts = {
+<script type="text/javascript">
+
+	$(document).ready(function(){
+		var obj = document.getElementById("iframe");
+		resizeIframe(obj);
+	}
+	function resizeIframe(obj) {
+		obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
+	}
+</script>
+}
+
+@main("Service", scripts) {
+
+<iframe id="iframe" width="100%" height="1200px" src="@url" frameborder="0" >
+</iframe>
+
+}

http://git-wip-us.apache.org/repos/asf/incubator-cmda/blob/37774c92/.target/views/climate/recommend.scala.html
----------------------------------------------------------------------
diff --git a/.target/views/climate/recommend.scala.html b/.target/views/climate/recommend.scala.html
new file mode 100644
index 0000000..d9ec392
--- /dev/null
+++ b/.target/views/climate/recommend.scala.html
@@ -0,0 +1,125 @@
+@*******************************************************************************
+ * 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.											   *
+ *******************************************************************************@ 
+
+@(jsonData: String)
+@import helper._
+
+<link rel="stylesheet"
+	href='@routes.Assets.at("stylesheets/custom_recommend.css")'>
+
+<link rel="stylesheet"
+  href="https://cdnjs.cloudflare.com/ajax/libs/vis/3.11.0/vis.min.css"
+>
+
+<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>
+}
+
+@main("Service Logs", scripts){
+	
+	@flash_message()   
+
+  <div id="jsonData" style="display: none;">@jsonData</div>
+  <div id="graphText">
+    <div class="row">
+      <div class="col-lg-6" id="testGraph">
+      </div>
+      <div class="col-lg-6" id="testText">
+      </div>
+    </div>
+  </div>
+
+
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/3.11.0/vis.min.js"></script>
+  <script type="text/javascript">
+  	  var jsonString = $('#jsonData').text();
+  	 	var data = JSON.parse(jsonString);
+      var container = document.getElementById('testGraph');
+      var options = {
+        stabilize:false,
+        edges: {
+          color: {
+            color: "gray",
+            highlight: "gray",
+          },
+        },
+        nodes: {
+          shape: 'dot',
+          radiusMin: 10,
+          radiusMax: 30,
+        },
+        groups: {
+          user: {
+            color:"#F2545A",
+            shape:"star",
+          },
+          feature: {
+            shape:"triangle",
+            color:"#EC8F93",
+          },
+          service: {
+            color:"#EF777C",
+            shape:"dot",
+          },
+          /*data: {
+            color:"#F46369",
+            shape:"square",
+          }*/
+        },
+        tooltip: {
+          delay: 300,
+          fontColor: "black",
+          fontSize: 14, // px
+          fontFace: "verdana",
+          color: {
+            border: "#666",
+            background: "#FFFFC6"
+          }
+        }
+      };
+
+      var network = new vis.Network(container, data, options);
+      //focus on serviceid 19
+      network.focusOnNode(19);
+      network.on('select', function(properties) {
+        var select_node = $.grep(data.nodes, function(e){
+          return e["id"] == properties.nodes[0];
+        })[0];
+        if(select_node["group"] == "service"){
+          var select_edges = $.grep(data.edges, function(e) { 
+            return e["from"] == select_node["id"] });
+          var textVal = "";
+          textVal += "<h3>"+select_node["label"]+"</h3>";
+          textVal += "<div><h4>Keywords:</h4><h4>"
+          for (var i = select_edges.length - 1; i >= 0; i--) {
+            textVal += "<span class=\"label label-primary\">"+select_edges[i]["to"]+"</span>\n";
+          };
+          textVal += "</h4></div>";
+          textVal += "<div><img src=\""+select_node["image"]+"\" class=\"img-responsive\"></div>";
+          $("#testText").html(textVal);
+        }
+      });
+  </script>
+  
+  
+	
+}