use button instead of checkbox to provide editing semantic

buildbot · May 23, 2015 · d792fea · d792fea
1 parent 6aba65c
commit d792fea
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 4 deletions.
diff --git a/www/md_base/src/app/home/home.controller.coffee b/www/md_base/src/app/home/home.controller.coffee
@@ -2,7 +2,7 @@ class Home extends Controller
     title: ''
     titleURL: ''
 
-    constructor: ($scope, config, bbSettingsService) ->
+    constructor: ($scope, config, @bbSettingsService) ->
         @title = config.title
         @titleURL = config.titleURL
 
@@ -15,5 +15,12 @@ class Home extends Controller
 
         @panels = @settings.panels.value
 
-        $scope.$watch 'home.panels', (-> bbSettingsService.save()), true
-        $scope.$watch 'home.settings.lock_panels', (-> bbSettingsService.save()), true
+        @editing_panels = !@settings.lock_panels.value
+
+        $scope.$watch 'home.panels', (=> @bbSettingsService.save()), true
+
+    edit_panels: (state) ->
+        @editing_panels = state
+        @sortable_settings.disabled = state
+        @settings.lock_panels.value = state
+        @bbSettingsService.save()
diff --git a/www/md_base/src/app/home/home.less b/www/md_base/src/app/home/home.less
@@ -13,6 +13,10 @@
     }
   }
 
+  .dashboard-controls {
+    margin: 0 5px;
+  }
+
   .dashboard panel {
     float: left;
   }

diff --git a/www/md_base/src/app/home/home.tpl.jade b/www/md_base/src/app/home/home.tpl.jade
@@ -3,7 +3,14 @@ div.project-info(layout="row")
   md-button.md-raised.md-primary(ng-href="{{ home.titleURL }}") Homepage
 div.dashboard-controls(layout="row")
   span(flex)
-  md-checkbox(ng-model="home.settings.lock_panels.value") LOCK PANELS
+  div
+    md-button.md-primary(
+      ng-show="!home.editing_panels",
+      ng-click="home.edit_panels(true)") edit panels
+    md-button.md-primary(
+      ng-show="home.editing_panels",
+      ng-click="home.edit_panels(false)") lock panels
+
 div.dashboard(ng-sortable="home.sortable_settings")
   panel(
     ng-repeat="panel in home.panels",