Adding active boolean and sorting

app/assets/javascripts/darkswarm/controllers/hub_node_controller.js.coffee

@@ -2,10 +2,9 @@ Darkswarm.controller "HubNodeCtrl", ($scope, Navigation, $location, $anchorScrol
   $scope.toggle = ->
     Navigation.navigate $scope.hub.path
 
-  $scope.active = ->
+  $scope.open = ->
     $location.path() == $scope.hub.path
 
-  if $scope.active()
-    console.log "scrolling baby"
+  if $scope.open()
     $anchorScroll()
 

app/assets/javascripts/darkswarm/services/hubs.js.coffee

@@ -1,4 +1,4 @@
-Darkswarm.factory 'Hubs', ($location, hubs) ->
+Darkswarm.factory 'Hubs', ($location, hubs, $filter) ->
   new class Hubs
     constructor: ->
-      @hubs = hubs
+      @hubs = $filter('orderBy')(hubs, 'active', true)

app/assets/stylesheets/darkswarm/branding.css.sass

@@ -1,3 +1,6 @@
 $clr-strong: #8f1d45
 $clr-soft: #f5e1e8
 $clr-bright: #c23e6c
+
+$disabled-dark: #999
+$disabled-bright: #ccc

app/assets/stylesheets/darkswarm/hub_node.css.sass

@@ -1,19 +1,22 @@
 @import 'branding'
+@import 'mixins'
 
 hub
   display: block
+  border: 1px solid transparent 
+
+  .active_table_row // Inherits from active_table
+    border: 1px solid transparent
+    &, & > a.row
+      display: block
+
   strong
     color: $clr-strong
-  border: 1px solid transparent 
-  &.closed
-    &:hover, &:active, &:focus
-      background: white
-      border: 1px solid $clr-strong
+  &.inactive, &.inactive strong
+    color: $disabled-dark
 
   &.open
     border: 1px solid $clr-strong
-    p
-      padding-top: 1em
     .active_table_row:first-child
       border-bottom: 1px solid $clr-strong
     .active_table_row:last-child
@@ -27,11 +30,10 @@ hub
         margin: 0 -0.9375rem
         &, & * 
           color: white
+    p
+      padding-top: 1em
 
-  .active_table_row // Inherits from active_table
-    border: 1px solid transparent
-    &, & > a.row
-      display: block
-      //border: 1px solid pink
-      //a.row .columns
-        //border-bottom: 1px solid pink
+  &.closed
+    &:hover, &:active, &:focus
+      background: white
+      border: 1px solid $clr-strong

app/assets/stylesheets/darkswarm/mixins.sass

@@ -1,4 +1,5 @@
 @import typography
+@import branding
 
 @mixin big-input 
   border: 1px solid #999
@@ -8,4 +9,4 @@
   margin-bottom: 1.25em
 
 @mixin disabled
-  color: #ccc
+  color: $disabled-bright

app/views/darkswarm/index.html.haml

@@ -8,7 +8,7 @@
 
 #hubs{"ng-controller" => "HubsCtrl"}
   :javascript
-    angular.module('Darkswarm').value('hubs', #{render "shared/hubs"})
+    angular.module('Darkswarm').value('hubs', #{render "json/hubs"})
 
   .row
     .small-12.columns.text-center
@@ -31,11 +31,11 @@
     .small-12.columns
       .active_table
         %hub.row{"ng-repeat" => "hub in filteredHubs = (hubs | filterHubs:query)",
-        "ng-class" => "{'closed' : !active(), 'open' : active()}",
+        "ng-class" => "{'closed' : !open(), 'open' : open(), 'inactive' : !hub.active}",
         "ng-controller" => "HubNodeCtrl",
         id: "{{hub.path}}"} 
           .small-12.columns
-            .row.active_table_row{"ng-click" => "toggle()", "ng-class" => "{'closed' : !active()}"}
+            .row.active_table_row{"ng-click" => "toggle()", "ng-class" => "{'closed' : !open()}"}
               .columns.small-4
                 %strong {{ hub.name }}
               .columns.small-3
@@ -45,9 +45,9 @@
               .columns.small-3
                 Orders closing when?
               .columns.small-1.text-right
-                %i{"ng-class" => "{'fi-arrow-down' : !open, 'fi-arrow-up' : open}"} 
+                %i{"ng-class" => "{'fi-arrow-down' : !open(), 'fi-arrow-up' : open()}"} 
 
-            .row.active_table_row{"ng-show" => "active()"}
+            .row.active_table_row{"ng-show" => "open()"}
               .columns.small-4
                 %strong Shop for
                 %p
@@ -66,7 +66,7 @@
                   %li Shiny Olives
                   %li Love in the Time of Cholera 
 
-            .row.active_table_row{"ng-show" => "active()"}
+            .row.active_table_row{"ng-show" => "open()"}
               .columns.small-11
                 %a{"bo-href" => "hub.path"} 
                   Shop at 

app/views/json/_hubs.rabl

@@ -20,13 +20,9 @@ node :path do |hub|
   shop_enterprise_path(hub) 
 end
 
-#node :active do |hub|
-  ##@active_distributors.include?(hub)
-#end
-
-#child :shipping_methods do
-  #attributes :name, :require_ship_address
-#end
+node :active do |hub|
+  @active_distributors.include?(hub)
+end
 
 # ALL PRODUCERS
 #