climate-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From jo...@apache.org
Subject svn commit: r1496249 - in /incubator/climate/trunk/rcmet/src/main/ui/app: css/app.css index.html
Date Mon, 24 Jun 2013 22:57:04 GMT
Author: joyce
Date: Mon Jun 24 22:57:04 2013
New Revision: 1496249

URL: http://svn.apache.org/r1496249
Log:
CLIMATE-152 progress - Initial UI layout work

- Basic two column layout added.
- Most of the functionality (specifically buttons to access features)
  are commented out so the overall layout could be worked on. Certain
  features need to be added back in/removed and many others still need
  to be moved to better locations.

Modified:
    incubator/climate/trunk/rcmet/src/main/ui/app/css/app.css
    incubator/climate/trunk/rcmet/src/main/ui/app/index.html

Modified: incubator/climate/trunk/rcmet/src/main/ui/app/css/app.css
URL: http://svn.apache.org/viewvc/incubator/climate/trunk/rcmet/src/main/ui/app/css/app.css?rev=1496249&r1=1496248&r2=1496249&view=diff
==============================================================================
--- incubator/climate/trunk/rcmet/src/main/ui/app/css/app.css (original)
+++ incubator/climate/trunk/rcmet/src/main/ui/app/css/app.css Mon Jun 24 22:57:04 2013
@@ -19,15 +19,8 @@
 
 #map 
 {
-    height: 670px;
-    width: 80%;
-    margin-left: 10%;
-	margin-bottom: 20px;
-}
-
-#rcmetHeader
-{
-	margin-left: 10%;
+	height: 500px;
+	width: 100%;
 }
 
 .small-alert 

Modified: incubator/climate/trunk/rcmet/src/main/ui/app/index.html
URL: http://svn.apache.org/viewvc/incubator/climate/trunk/rcmet/src/main/ui/app/index.html?rev=1496249&r1=1496248&r2=1496249&view=diff
==============================================================================
--- incubator/climate/trunk/rcmet/src/main/ui/app/index.html (original)
+++ incubator/climate/trunk/rcmet/src/main/ui/app/index.html Mon Jun 24 22:57:04 2013
@@ -94,141 +94,63 @@
   </div>
   </bootstrap-modal>
 
-  <h1 id="rcmetHeader">Apache Open Climate Workbench UI</h1>
-  <div ng-controller="WorldMapCtrl">
-    <leaflet-map id="map"></leaflet-map>
-  </div>
-  
-  <!-- Timeline -->
-  <div ng-controller="TimelineCtrl">
-    <div class="timeline"></div>
-  </div>
-  
-  <div ng-controller="ParameterSelectCtrl">
-    <div class="row">
-      <div class="span1 offset2 text-center">Start Date:</div>
-      <div class="span2">
-        <form>
-          <input ng-disabled="shouldDisableControls()" on-blur="checkParameters();" ng-model="displayParams.start"
ui-date="datepickerSettings" ui-date-format="yy-mm-dd" type="text" class="text-center span2"
/>
-        </form>
-      </div>
-      <div class="span1 text-center">End Date:</div>
-      <div class="span2">
-        <form>
-          <input ng-disabled="shouldDisableControls()" on-blur="checkParameters();" ng-model="displayParams.end"
ui-date="datepickerSettings" ui-date-format="yy-mm-dd" type="text" class="text-center span2"
/>
-        </form>
-      </div>
-      <div class="span1">
-        <button class="btn btn-block btn-success" bootstrap-modal-open="datasetSelect">Select</button>
-      </div>
-      <div class="span1">
-        <button ng-click="clearDatasets()" ng-hide="shouldDisableClearButton()" class="btn
btn-block btn-warning">Clear</button>
-      </div>
-      <div class="span1">
-        <button ng-click="runEvaluation()" ng-hide="shouldDisableControls()" ng-disabled="runningEval"
class="btn btn-block btn-primary">
-          <div ng-hide="runningEval">Evaluate</div>
-          <div ng-show="runningEval"><i class="icon-spinner icon-spin"></i></div>
-        </button>
-      </div>
-      <div class="span1">
-        <button class="btn btn-block btn-primary" ng-hide="shouldDisableResultsView()"
bootstrap-modal-open="evaluationResults">Results</button>
-      </div>
-      <div class="span1">
-        <button class="btn btn-block" background="false" bootstrap-modal-open="evaluationSettings"><i
class="icon-cogs"></i></button>
-      </div>
-    </div>
-    <div class="row">
-      <div class="span1 offset2 text-center">North:</div>
-      <div class="span2">
-        <form action="">
-		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.latMax" 
on-blur="checkParameters();" type="text" class="span2 text-center" />
-        </form>
-      </div>
-      <div class="span1 text-center">South:</div>
-      <div class="span2">
-        <form action="">
-		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.latMin" on-blur="checkParameters();"
type="text" class="span2 text-center" />
-        </form>
-      </div>
-      <div ng-show="areInUserRegridState">
-        <div class="span1 text-center">Lat. Step:</div>
-        <div class="span2">
-          <div id="latSlider"></div>
-        </div>
-        <div class="span1 text-center">{{latSliderVal}}</div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="span1 offset2 text-center">East:</div>
-      <div class="span2">
-        <form>
-		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.lonMax" on-blur="checkParameters();"
type="text" class="span2 text-center" />
-        </form>
-      </div>
-      <div class="span1 text-center">West:</div>
-      <div class="span2">
-        <form>
-		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.lonMin" on-blur="checkParameters();";
type="text" class="span2 text-center" />
-        </form>
-      </div>
-      <div ng-show="areInUserRegridState">
-        <div class="span1 text-center">Lon. Step:</div>
-        <div class="span2">
-          <div id="lonSlider"></div>
-        </div>
-        <div class="span1 text-center">{{lonSliderVal}}</div>
-      </div>
-    </div>
-  </div>
+<!--New layout test-->
+<div class="row">
+  <div class="span6">
 
   <!--Dataset display-->
   <div ng-controller="DatasetDisplayCtrl">
     <div ng-repeat="dataset in datasets">
 	  <div class="row displayRow">
-  	    <div class="span10 offset2"><hr /></div>
+        <!--<div class="span4 offset2"><hr /></div>-->
+  	    <div class="span4 "><hr /></div>
 	  </div>
 	  <div class="row displayRow">
-		<div class="span4 offset2">
-		  <input class="span6 text-center" type="text" value="{{dataset.name}}" />
+		<!--<div class="span4 offset2">-->
+		<div class="span4 ">
+		  <input class="span4 text-center" type="text" value="{{dataset.name}}" />
 		</div>
 	  </div>
 	  <!--Time Values!-->
     <div class="row displayRow">
-      <div class="span1 offset2 text-center">Start Date:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.timeVals.start}}"
readonly/>
+      <!--<div class="span1 offset2 text-center">Start Date:</div>-->
+      <div class="span1 text-center">Start Date:</div>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.timeVals.start}}"
readonly/>
       </div>
       <div class="span1 text-center">End Date:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.timeVals.end}}"
readonly/>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.timeVals.end}}"
readonly/>
       </div>
-      <div class="span2">
-        <a class="btn btn-block" ng-click="removeDataset($index)">Remove Dataset</a>
+      <div class="span1">
+        <a class="btn btn-block" ng-click="removeDataset($index)">Remove</a>
       </div>
       <div class="span1" style="background-color: {{fillColors[$index]}}; height: 28px;
width: 28px;"></div>
     </div>
 	  <!--Lat/Long Values!-->
     <div class="row displayRow">
-      <div class="span1 offset2 text-center">North:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.latlonVals.latMax}}"
readonly/>
+      <!--<div class="span1 offset2 text-center">North:</div>-->
+      <div class="span1 text-center">North:</div>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.latlonVals.latMax}}"
readonly/>
       </div>
       <div class="span1 text-center">East:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.latlonVals.lonMax}}"
readonly/>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.latlonVals.lonMax}}"
readonly/>
       </div>
-      <div class="span2">
+      <div class="span1">
         <label><input type="checkbox" ng-model="dataset.shouldDisplay" /> Display
Overlay</label>
       </div>
 	  </div>
     <div class="row displayRow">
-      <div class="span1 offset2 text-center">South:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.latlonVals.latMin}}"
readonly/>
+      <!--<div class="span1 offset2 text-center">South:</div>-->
+      <div class="span1 text-center">South:</div>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.latlonVals.latMin}}"
readonly/>
       </div>
       <div class="span1 text-center">West:</div>
-      <div class="span2">
-        <input class="span2 text-center" type="text" value="{{dataset.latlonVals.lonMin}}"
readonly/>
+      <div class="span1">
+        <input class="span1 text-center" type="text" value="{{dataset.latlonVals.lonMin}}"
readonly/>
       </div>
       <div class="span2">
         <label>
@@ -240,6 +162,108 @@
     </div>
   </div>
 
+  </div>
+  <div class="span6">
+
+  <div class="row span6">
+    <div ng-controller="WorldMapCtrl">
+      <leaflet-map id="map"></leaflet-map>
+    </div>
+  </div>
+  
+  <!-- Timeline -->
+  <div class="row span6">
+    <div ng-controller="TimelineCtrl">
+      <div class="timeline"></div>
+    </div>
+  </div>
+  
+  <div class="row span6">
+  <div ng-controller="ParameterSelectCtrl">
+    <div class="row">
+      <!--<div class="span1 offset2 text-center">Start Date:</div>-->
+      <div class="span1 text-center">Start Date:</div>
+      <div class="span1">
+        <form>
+          <input ng-disabled="shouldDisableControls()" on-blur="checkParameters();" ng-model="displayParams.start"
ui-date="datepickerSettings" ui-date-format="yy-mm-dd" type="text" class="text-center span1"
/>
+        </form>
+      </div>
+      <div class="span1 text-center">End Date:</div>
+      <div class="span1">
+        <form>
+          <input ng-disabled="shouldDisableControls()" on-blur="checkParameters();" ng-model="displayParams.end"
ui-date="datepickerSettings" ui-date-format="yy-mm-dd" type="text" class="text-center span1"
/>
+        </form>
+      </div>
+      <div class="span1">
+        <button class="btn btn-block btn-success" bootstrap-modal-open="datasetSelect">Select</button>
+      </div>
+      <!--<div class="span1">-->
+        <!--<button ng-click="clearDatasets()" ng-hide="shouldDisableClearButton()"
class="btn btn-block btn-warning">Clear</button>-->
+      <!--</div>-->
+      <!--<div class="span1">-->
+        <!--<button ng-click="runEvaluation()" ng-hide="shouldDisableControls()" ng-disabled="runningEval"
class="btn btn-block btn-primary">-->
+          <!--<div ng-hide="runningEval">Evaluate</div>-->
+          <!--<div ng-show="runningEval"><i class="icon-spinner icon-spin"></i></div>-->
+        <!--</button>-->
+      <!--</div>-->
+      <!--<div class="span1">-->
+        <!--<button class="btn btn-block btn-primary" ng-hide="shouldDisableResultsView()"
bootstrap-modal-open="evaluationResults">Results</button>-->
+      <!--</div>-->
+      <!--<div class="span1">-->
+        <!--<button class="btn btn-block" background="false" bootstrap-modal-open="evaluationSettings"><i
class="icon-cogs"></i></button>-->
+      <!--</div>-->
+    </div>
+    <div class="row">
+      <!--<div class="span1 offset2 text-center">North:</div>-->
+      <div class="span1 text-center">North:</div>
+      <div class="span1">
+        <form action="">
+		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.latMax" 
on-blur="checkParameters();" type="text" class="span1 text-center" />
+        </form>
+      </div>
+      <div class="span1 text-center">South:</div>
+      <div class="span1">
+        <form action="">
+		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.latMin" on-blur="checkParameters();"
type="text" class="span1 text-center" />
+        </form>
+      </div>
+      <!--<div ng-show="areInUserRegridState">-->
+        <!--<div class="span1 text-center">Lat. Step:</div>-->
+        <!--<div class="span2">-->
+          <!--<div id="latSlider"></div>-->
+        <!--</div>-->
+        <!--<div class="span1 text-center">{{latSliderVal}}</div>-->
+      <!--</div>-->
+    </div>
+    <div class="row">
+      <!--<div class="span1 offset2 text-center">East:</div>-->
+      <div class="span1 text-center">East:</div>
+      <div class="span1">
+        <form>
+		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.lonMax" on-blur="checkParameters();"
type="text" class="span1 text-center" />
+        </form>
+      </div>
+      <div class="span1 text-center">West:</div>
+      <div class="span1">
+        <form>
+		      <input ng-disabled="shouldDisableControls()" ng-model="displayParams.lonMin" on-blur="checkParameters();";
type="text" class="span1 text-center" />
+        </form>
+      </div>
+      <!--<div ng-show="areInUserRegridState">-->
+        <!--<div class="span1 text-center">Lon. Step:</div>-->
+        <!--<div class="span2">-->
+          <!--<div id="lonSlider"></div>-->
+        <!--</div>-->
+        <!--<div class="span1 text-center">{{lonSliderVal}}</div>-->
+      <!--</div>-->
+    </div>
+  </div>
+  </div>
+
+<!--new layout test-->
+</div>
+</div>
+
   <!--Libraries-->
   <script src="js/lib/jquery/jquery-1.10.1.js"></script>
   <script src="js/lib/jquery/jquery-ui/jquery-ui-1.10.3.min.js"></script>



Mime
View raw message