a button to select between modes (node per node, or the whole timeslot at a time...
authorThierry Parmentelat <thierry.parmentelat@sophia.inria.fr>
Sat, 24 Jul 2010 11:05:26 +0000 (13:05 +0200)
committerThierry Parmentelat <thierry.parmentelat@sophia.inria.fr>
Sat, 24 Jul 2010 11:05:26 +0000 (13:05 +0200)
planetlab/css/my_slice.css
planetlab/slices/leases.js
planetlab/slices/slice.php

index 787299a..15b5dd9 100644 (file)
@@ -7,7 +7,7 @@ div.my-slice-renewal {
     margin: 30px;
 }
 
-/* internal toggles */
+/* toggles for the nodes sections */
 div#toggle-container-my-slice-persons-current,
 div#toggle-container-my-slice-nodes-current {
     background: #f0f0f0;
@@ -18,16 +18,26 @@ div#toggle-container-my-slice-nodes-add {
     background: #f0e0e0;
 }
 
-/* the container for the scheduler area */
+/* the scheduler area */
 div#toggle-container-my-slice-nodes-reserve {
     background: #def;
 }
 
+/* where the graphics go */
 div#leases_area {
-    padding: 25px;
+  padding: 10px 25px;
 }
 
-/* don't display the scheduler data table */
+/* don't display the scheduler data table - not quite sure this works */
 table#leases_data {
     display: none;
 }
+
+/* the various controls for the scheduler */
+/* upper section, with selection mode */
+#leases_modes { padding: 10px; text-align: center; color: #333; }
+
+#leases_buttons { padding: 10px; }
+#leases_clear { position: relative; left: 30%;}
+#leases_submit { position: relative; left: 60%; }
+        
index 8368d34..a322f56 100644 (file)
@@ -138,6 +138,24 @@ function Scheduler (slicename, axisx, axisy, data) {
            }
        }
     }
+
+    /* initialize mode buttons */
+    this.init_mode = function (default_mode, node_button, timeslot_button) {
+       this.node_button=node_button;
+       this.timeslot_button=timeslot_button;
+       var scheduler=this;
+       /* xxx set callbacks on buttons */
+       node_button.onclick = function () { scheduler.set_mode('node'); }
+       timeslot_button.onclick = function () { scheduler.set_mode('timeslot'); }
+       this.set_mode(default_mode);
+    }
+
+    /* expecting mode to be either 'node' or 'timeslot' */
+    this.set_mode = function (mode) {
+       this.mode=mode;
+       var active_button = (mode=='node') ? this.node_button : this.timeslot_button;
+       active_button.checked='checked';
+    }
        
 
 } // Scheduler
@@ -158,12 +176,14 @@ var lease_methods = {
     // find out all the currently free leases that overlap this one
     click_free: function (event) {
        var scheduler = this.scheduler;
-       for (var i=0, len=scheduler.leases.length; i<len; ++i) {
-           scan=scheduler.leases[i];
-           // overlap ?
-           if (scan.from_time<=this.from_time && scan.until_time>=this.until_time) {
-               if (scan.current == "free") lease_methods.init_mine(scan,lease_methods.click_free);
-               // the other ones just remain as they are
+       if (scheduler.mode=='node') {
+           lease_methods.init_mine(this,lease_methods.click_free);
+       } else {
+           for (var i=0, len=scheduler.leases.length; i<len; ++i) {
+               scan=scheduler.leases[i];
+               // overlap ?
+               if (scan.from_time<=this.from_time && scan.until_time>=this.until_time) 
+                   if (scan.current == "free") lease_methods.init_mine(scan,lease_methods.click_free);
            }
        }
     },
@@ -176,13 +196,21 @@ var lease_methods = {
     },
 
     click_mine: function (event) {
+       var scheduler = this.scheduler;
        // this lease was originally free but is now marked for booking
        // we free just this lease
-       if (this.initial=="free") 
-           lease_methods.init_free(this, lease_methods.click_mine);
-       // this lease if ours, same for now
-       else
+       if (scheduler.mode=='node') {
            lease_methods.init_free(this, lease_methods.click_mine);
+       } else {
+           for (var i=0, len=scheduler.leases.length; i<len; ++i) {
+               scan=scheduler.leases[i];
+               // overlap ?
+               if (scan.from_time<=this.from_time && scan.until_time>=this.until_time) {
+                   if (scan.current == "mine") lease_methods.init_free(scan,lease_methods.click_mine);
+               }
+               // the other ones just remain as they are
+           }
+       }
     },
 
 
@@ -230,6 +258,10 @@ function init_scheduler () {
     var clear=$$("button#leases_clear")[0];
     clear.onclick = function () { scheduler.clear(); }
 
+    var node_button=$$("input#leases_mode_node")[0];
+    var timeslot_button=$$("input#leases_mode_timeslot")[0];
+    scheduler.init_mode ('timeslot',node_button,timeslot_button);
+
 }
 
 Event.observe(window, 'load', init_scheduler);
index f1dbef8..778283d 100644 (file)
@@ -584,14 +584,25 @@ if ($count && $privileges) {
     }
     echo "</tr>";
   }
-
   echo "</tbody></table>\n";
-  echo "<div id='leases_area'></div>";
-  echo "<div id='leases_control'>";
-  echo "<button id='leases_submit' type='button'>Submit</button>";
-  echo "<button id='leases_clear' type='button'>Clear</button>";
-  echo "</div>";
-      
+
+  // the general layout for the scheduler
+  echo <<< EOF
+<div id='leases_modes'><form>
+  <span id='leases_selection_mode'> Selection mode:
+  <input id='leases_mode_node'     type='radio' name='mode' value="node" />Node
+  <input id='leases_mode_timeslot' type='radio' name='mode' value="timeslot" checked />Timeslot
+  </span>
+</form></div>
+
+<div id='leases_area'></div>
+
+<div id='leases_buttons'>
+  <button id='leases_clear' type='submit'>Clear</button>
+  <button id='leases_submit' type='submit'>Submit</button>
+</div>
+EOF;
+
   $toggle_nodes->end();
  }
 $toggle->end();