Adding a color picker for the layers for beltrame#16

cesine · Oct 19, 2014 · a91076e · a91076e
1 parent a456d64
commit a91076e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/client/js/controllers/MainCtrl.js b/client/js/controllers/MainCtrl.js
@@ -21,15 +21,19 @@ angular.module('app')
 
         $scope.layers = [{
             label: "layer1",
+            color: "#00ff00",
             visibility: 50
         }, {
             label: "layer2",
+            color: "#0000ff",
             visibility: 20
         }, {
             label: "layer3",
+            color: "#ff0000",
             visibility: 0
         }];
 
+
         $scope.runScript = function(scriptname) {
             console.warn("security hole, this should not permit execution of unknown scripts.");
             scriptname = scriptname.trim().replace(/[\/\\]+/g, "");

diff --git a/client/partials/base.html b/client/partials/base.html
@@ -4,7 +4,7 @@
             <li ng-repeat="dataTransformOrPipeline in dataTransformOrPipelines" class="breadcrumb" ng-class="{active: dataTransformOrPipeline == $parent.dataTransformOrPipeline}">
                 <a ng-click="selectBenchmark(dataTransformOrPipeline)">{{ dataTransformOrPipeline.name }}</a>
             </li>
-            
+
             <li class="breadcrumb">
                 <input placeholder="script name to run on the data" ng-model="scriptName" type="text"/><button class="btn btn-primary" ng-click="runScript(scriptName)">Run</button>
             </li>
@@ -24,10 +24,11 @@
              <li class="breadcrumb">
                 <ul class="unstyled">
                     <li ng-repeat="layer in layers">
-                        <input type="range" ng-model="layer.visibility" max="100" min="0"/> {{layer.label}}
+                        <input type="range" ng-model="layer.visibility" max="100" min="0"/> {{layer.label}} Color: <input type="color" ng-model="layer.color" />{{layer.color}}
                     </li>
                 </ul>
             </li>
+
         </ul>
     </div>
     <div class="col-sm-8" ng-include="partialUrl + '/dataTransformOrPipeline-view.html'" ng-controller="BenchmarkViewCtrl">