Testbed/Facility selection
authorCiro Scognamiglio <ciro.scognamiglio@cslash.net>
Mon, 16 Feb 2015 14:46:13 +0000 (15:46 +0100)
committerCiro Scognamiglio <ciro.scognamiglio@cslash.net>
Mon, 16 Feb 2015 14:46:13 +0000 (15:46 +0100)
plugins/testbeds/static/js/testbeds.js
plugins/testbeds/templates/testbeds.html
portal/static/css/onelab.css
portal/static/icons/IoTLab.png [new file with mode: 0644]
portal/static/icons/PlanetLab.png [new file with mode: 0644]
portal/static/icons/Wireless.png [new file with mode: 0644]

index e628a67..1050f54 100644 (file)
         {
             var selected, prev_selected, num, num_selected, num_prev_selected, filter;
 
-            prev_selected = $.map($scope.facility_names, function(x, i) {
-                return $scope.is_facility_active(x) ? x : null;
-            });
+            // prev_selected = $.map($scope.facility_names, function(x, i) {
+                // return $scope.is_facility_active(x) ? x : null;
+            // });
 
             $scope.set_facility_active(facility, ! $scope.is_facility_active(facility));
-
-            selected = $.map($scope.facility_names, function(x, i) {
-                return $scope.is_facility_active(x) ? x : null;
+            
+            $.each($scope.testbed_names[facility], function(j, testbed_name) {
+                $scope.select_testbed(facility, testbed_name);
             });
-
-            num = $scope.facility_names.length;
-            prev_num_selected = prev_selected.length;
-            num_selected = selected.length;
-
-            if ((prev_num_selected != 0) && (prev_num_selected != num)) {
-                // Remove previous filter
-                filter = ['facility_name', 'included', prev_selected];
-                manifold.raise_event($scope.instance.options.query_uuid, FILTER_REMOVED, filter);
-            }
-
-            if (num_selected != num) {
-                filter = ['facility_name', 'included', selected];
-                manifold.raise_event($scope.instance.options.query_uuid, FILTER_ADDED, filter);
-            }
+            console.log($scope);
+            // selected = $.map($scope.facility_names, function(x, i) {
+                // return $scope.is_facility_active(x) ? x : null;
+            // });
+
+            // num = $scope.facility_names.length;
+            // prev_num_selected = prev_selected.length;
+            // num_selected = selected.length;
+
+            // if ((prev_num_selected != 0) && (prev_num_selected != num)) {
+                // // Remove previous filter
+                // filter = ['facility_name', 'included', prev_selected];
+                // manifold.raise_event($scope.instance.options.query_uuid, FILTER_REMOVED, filter);
+            // }
+// 
+            // if (num_selected != num) {
+                // filter = ['facility_name', 'included', selected];
+                // manifold.raise_event($scope.instance.options.query_uuid, FILTER_ADDED, filter);
+            // }
         };
 
         $scope.select_testbed = function(facility, testbed)
 
         _get_scope : function()
         {
-            return angular.element('[ng-controller=TestbedsCtrl]').scope()
+            return angular.element('[ng-controller=TestbedsCtrl]').scope();
         },
 
 /*
index 296e5ef..6ee26f2 100644 (file)
@@ -1,34 +1,27 @@
-<div id={{ domid }} ng-controller="TestbedsCtrl">
-
-<div class="list-group-item sl-platform"><span class="list-group-item-heading">Facilities</span></div>
-
-<div ng-repeat="facility_name in facility_names">
-       <a href="#" 
-          class="list-group-item sl-platform"
-          ng-class="{active: is_facility_active(facility_name)}"
-          id="facility-filter_{[{ facility_name }]}"
-          ng-click="select_facility(facility_name)"
-          data-platform="{[{ facility_name }]}">
-       <span class="list-group-item-heading">{[{ facility_name }]}</span>
-       </a>
-       <div ng-repeat="testbed_name in testbed_names[facility_name]">
-               <a href="#" 
-                  class="list-group-item sl-platform"
-                  ng-class="{active: is_testbed_active(facility_name, testbed_name)}"
-                  id="testbeds-filter_{[{ testbed_name }]}"
-                ng-click="select_testbed(facility_name, testbed_name)"
-                  data-platform="{[{ testbed_name }]}">
-               <span class="list-group-item-heading">&nbsp;&nbsp;{[{testbed_name}]}</span>
-               </a>
-       </div>
-</div>
-
-<!--
-<style>
-a.sl-platform  {
-    text-transform: uppercase;
-}
-
-</style>
--->
+<div id="{{ domid }}" class="sl-filter-facilities" ng-controller="TestbedsCtrl">
+    <h4>
+       Facilities
+    </h4>
+    <div>
+        <div class="sl-facilities" ng-repeat="facility_name in facility_names">
+            <a href="#" 
+               class="sl-facility"
+               ng-class="{active: is_facility_active(facility_name)}"
+               id="facility-filter_{[{ facility_name }]}"
+               ng-click="select_facility(facility_name)"
+               data-platform="{[{ facility_name }]}">
+               <img class="sl-image" src="/static/icons/{[{ facility_name }]}.png" /> {[{ facility_name }]}
+            </a>
+            <div class="sl-testbeds" ng-repeat="testbed_name in testbed_names[facility_name]">
+                <a href="#" 
+                   class="sl-testbed"
+                   ng-class="{active: is_testbed_active(facility_name, testbed_name)}"
+                   id="testbeds-filter_{[{ testbed_name }]}"
+                   ng-click="select_testbed(facility_name, testbed_name)"
+                   data-platform="{[{ testbed_name }]}">
+                    <input ng-checked="is_testbed_active(facility_name, testbed_name)" type="checkbox">&nbsp;{[{testbed_name}]}
+                </a>
+            </div>
+        </div>
+    </div>
 </div>
index 27c6b47..ef5d3e3 100644 (file)
@@ -82,6 +82,10 @@ span.version {
     font-size:8pt;
     color:#888888;
 }
+input[type=checkbox] {
+  min-width:5px !important;
+  margin-left:0 !important;
+}
 input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], select, option {
     min-width:260px;
     padding:6px;
@@ -378,45 +382,52 @@ div.container-resource, div.container-slice {
 div#slice-view {
     margin:0;
 }
-div.list-group-item {
-    border:0;
-    -moz-border-radius: 0;
-    border-radius: 0;
-    background-color:white;
-    font-weight:bold;
-    padding-left:0;
+div.sl-filter-facilities {
+    padding:0 5px;
 }
-a.list-group-item {
-    -moz-border-radius: 0;
-    border-radius: 0;
-    border:0;
-    background-color:white;
-    padding:3px 2px 3px 10px;
-    border-left:2pt white solid;
+div.sl-filter-facilities h4 {
+    margin-bottom:15px;
+    
+}
+img.sl-image {
+    margin:0 5px 5px 0;
+    padding:0;
+    vertical-align:middle;
+}
+a.sl-facility {
+    color:gray;
+    text-decoration:none;
+}
+a.sl-facility:hover {
+    color:#342961;
 }
-a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
-    -moz-border-radius: 0;
-    border-radius: 0;
-    font-weight: bold;
+a.sl-facility.active {
     color:black;
-    background-color:#F5F5F5;
-    border-left:2pt blue solid;
+    text-decoration:none;
 }
-
-a.list-group-item:hover {
-    -moz-border-radius: 0;
-    border-radius: 0;
-    border-left:2pt blue solid;
+a.sl-facility::before {
+    content: " ";
 }
-a.list-group-item p.list-group-item-text {
-    -moz-border-radius: 0;
-    border-radius: 0;
-    font-size:9pt;
-    font-style:italic;
-    font-weight: normal;
-    color: black !important;
+div.sl-facilities {
+    border-bottom:#CCCCCC 1px solid;
+    padding-bottom:15px;
+    margin-bottom:15px;
+}
+div.sl-facilities:last-child {
+    border:0;
+}
+a.sl-testbed {
+    color:gray;
+    text-decoration:none;
+    margin-left:25px;
+    margin-bottom:5px;
+}
+a.sl-testbed:hover {
+    color:#342961;
+}
+a.sl-testbed.active {
+    color:black;
 }
-
 span.sl-resources {
     font-size:9pt;
     color:gray;
diff --git a/portal/static/icons/IoTLab.png b/portal/static/icons/IoTLab.png
new file mode 100644 (file)
index 0000000..56a8e56
Binary files /dev/null and b/portal/static/icons/IoTLab.png differ
diff --git a/portal/static/icons/PlanetLab.png b/portal/static/icons/PlanetLab.png
new file mode 100644 (file)
index 0000000..a74082a
Binary files /dev/null and b/portal/static/icons/PlanetLab.png differ
diff --git a/portal/static/icons/Wireless.png b/portal/static/icons/Wireless.png
new file mode 100644 (file)
index 0000000..4db0aa3
Binary files /dev/null and b/portal/static/icons/Wireless.png differ