[Ovirt-devel] [PATCH] Fix behavior when adding/removing 1st/last item in a flexigrid.

Jason Guiditta jguiditt at redhat.com
Mon Aug 25 17:37:41 UTC 2008


For instance, adding a host when there were none before should make
the flexigrid appear, and removing the last host from a list of one
should make the default 'no hosts exist' content show again.

The bulk of the work is in ovirt.js, checking for existance of a grid
and adding it if not there.  Individual delete methods reload the the
tab as well, since the flexReload does not seem to provide a callback
interface.  The problem here is if you don't check after reload is done,
your information will not be correct (since javascript is single-threaded,
and continues to run after reload is called), so you could have the wrong
number of items being used to determine whether the grid needs to be removed.
The potential weak part of tab reload right now is that we do not save state
of what page of the grid you are on.  However, this may not be known
anyway, as you are removing an indeterminant number of entries from the grid.

Also included are a few added semicolons.  These are required by javascript,
though not by browser interpreters.  However, this sometimes causes erratic
behavior when the browser has to guess (I hit this working on this patch), so
I fixed any I came across in the course of my work.  This will also help when
we are ready to minimize/pack our js, as most compressors work more reliably
when correct syntax is followed.  One missed sizing of a popup is included as
well (too trivial to go in its own patch).

Signed-off-by: Jason Guiditta <jguiditt at redhat.com>
---
 wui/src/app/views/hardware/show_hosts.rhtml   |    7 +--
 wui/src/app/views/hardware/show_storage.rhtml |   10 ++--
 wui/src/app/views/hardware/show_vms.rhtml     |    8 +-
 wui/src/app/views/resources/show_vms.rhtml    |   12 ++--
 wui/src/app/views/user/_show.rhtml            |   26 ++++----
 wui/src/app/views/vm/_form.rhtml              |    1 +
 wui/src/public/javascripts/ovirt.js           |   95 +++++++++++++-----------
 7 files changed, 81 insertions(+), 78 deletions(-)

diff --git a/wui/src/app/views/hardware/show_hosts.rhtml b/wui/src/app/views/hardware/show_hosts.rhtml
index 61d8e01..6943db2 100644
--- a/wui/src/app/views/hardware/show_hosts.rhtml
+++ b/wui/src/app/views/hardware/show_hosts.rhtml
@@ -29,12 +29,7 @@
       $.post('<%= url_for :controller => "hardware", :action => "move_hosts", :id => @pool %>',
              { resource_ids: hosts.toString(), target_pool_id: <%= Pool.root.id %> },
               function(data,status){
-                grid = $("#hosts_grid");
-                if (grid.size()>0 && grid != null) {
-                  grid.flexReload();
-                } else {
-                  $tabs.tabs("load",$tabs.data('selected.tabs'));
-                }
+                $tabs.tabs("load",$tabs.data('selected.tabs'));
 		if (data.alert) {
 		  $.jGrowl(data.alert);
                 }
diff --git a/wui/src/app/views/hardware/show_storage.rhtml b/wui/src/app/views/hardware/show_storage.rhtml
index 37af1ce..02b5180 100644
--- a/wui/src/app/views/hardware/show_storage.rhtml
+++ b/wui/src/app/views/hardware/show_storage.rhtml
@@ -20,7 +20,7 @@
       $.post('<%= url_for :controller => "hardware", :action => "move_storage", :id => @pool %>',
              { resource_ids: storage.toString(), target_pool_id: <%= Pool.root.id %> },
               function(data,status){
-                $("#storage_grid").flexReload()
+                $tabs.tabs("load",$tabs.data('selected.tabs'));
 		if (data.alert) {
 		  $.jGrowl(data.alert);
                 }
@@ -37,7 +37,7 @@
       $.post('<%= url_for :controller => "storage", :action => "delete_pools", :id => @pool %>',
              { storage_pool_ids: storage.toString() },
               function(data,status){
-                $("#storage_grid").flexReload()
+                $tabs.tabs("load",$tabs.data('selected.tabs'));
 		if (data.alert) {
 		  $.jGrowl(data.alert);
                 }
@@ -49,14 +49,14 @@
   }
   function storage_select(selected_rows)
   {
-    var selected_ids = new Array() 
+    var selected_ids = new Array() ;
     for(i=0; i<selected_rows.length; i++) { 
-      selected_ids[i] = selected_rows[i].id
+      selected_ids[i] = selected_rows[i].id;
     }
     if (selected_ids.length == 1)
     {
       $('#storage_selection').load('<%= url_for :controller => "storage", :action => "show" %>',
-                { id: parseInt(selected_ids[0].substring(3))})
+                { id: parseInt(selected_ids[0].substring(3))});
     }
   }
 
diff --git a/wui/src/app/views/hardware/show_vms.rhtml b/wui/src/app/views/hardware/show_vms.rhtml
index 4555718..5ff5cc9 100644
--- a/wui/src/app/views/hardware/show_vms.rhtml
+++ b/wui/src/app/views/hardware/show_vms.rhtml
@@ -7,7 +7,7 @@
 <script type="text/javascript">
   function get_selected_vm_pools()
   {
-    return get_selected_checkboxes("vmpools_grid_form")
+    return get_selected_checkboxes("vmpools_grid_form");
   }
   function delete_vm_pools()
   {
@@ -16,12 +16,12 @@
       $.post('<%= url_for :controller => "resources", :action => "delete", :id => @pool %>',
              { vm_pool_ids: vm_pools.toString() },
               function(data,status){
-                $("#vmpools_grid").flexReload()
+                $tabs.tabs("load",$tabs.data('selected.tabs'));
 		if (data.alert) {
 		  $.jGrowl(data.alert);
                 }
 		if (vm_pools.indexOf($('#vmpool_selection_id').html()) != -1){
-		  empty_summary('vmpool_selection', 'Virtual Machine Pool')
+		  empty_summary('vmpool_selection', 'Virtual Machine Pool');
 		}   
                }, 'json');
     }
@@ -31,7 +31,7 @@
     var selected_ids = new Array() 
     for(i=0; i<selected_rows.length; i++) { 
       load_widget_select(selected_rows[i]);
-      selected_ids[i] = selected_rows[i].id
+      selected_ids[i] = selected_rows[i].id;
     }
     if (selected_ids.length == 1)
     {
diff --git a/wui/src/app/views/resources/show_vms.rhtml b/wui/src/app/views/resources/show_vms.rhtml
index 359bd8f..45e0089 100644
--- a/wui/src/app/views/resources/show_vms.rhtml
+++ b/wui/src/app/views/resources/show_vms.rhtml
@@ -22,7 +22,7 @@
 <script type="text/javascript">
   function get_selected_vms()
   {
-    return get_selected_checkboxes("vms_grid_form")
+    return get_selected_checkboxes("vms_grid_form");
   }
   function delete_vms()
   {
@@ -31,12 +31,12 @@
       $.post('<%= url_for :controller => "vm", :action => "delete", :id => @vm_resource_pool %>',
              { vm_ids: vms.toString() },
               function(data,status){
-                $("#vms_grid").flexReload()
+                $tabs.tabs("load",$tabs.data('selected.tabs'));
 		if (data.alert) {
 		  $.jGrowl(data.alert);
                 }
 		if (vms.indexOf($('#vms_selection_id').html()) != -1){
-		  empty_summary('vms_selection', 'Virtual Machine')
+		  empty_summary('vms_selection', 'Virtual Machine');
 		}   
                }, 'json');
     }
@@ -45,7 +45,7 @@
   {
     vms = get_selected_vms()
     if (validate_selected(vms, "vm")) {
-      jQuery.facebox('<div id="vm_action_results">')
+      jQuery.facebox('<div id="vm_action_results">');
       $('#vm_action_results').load('<%= url_for :controller => "resources", 
              :action => "vm_actions", :id => @vm_resource_pool %>',
              { vm_ids: vms.toString(), vm_action: action });
@@ -53,10 +53,10 @@
   }
   function vms_select(selected_rows)
   {
-    var selected_ids = new Array() 
+    var selected_ids = new Array();
     for(i=0; i<selected_rows.length; i++) { 
       load_widget_select(selected_rows[i]);
-      selected_ids[i] = selected_rows[i].id
+      selected_ids[i] = selected_rows[i].id;
     }
     if (selected_ids.length == 1)
     {
diff --git a/wui/src/app/views/user/_show.rhtml b/wui/src/app/views/user/_show.rhtml
index 351d0c7..916afe8 100644
--- a/wui/src/app/views/user/_show.rhtml
+++ b/wui/src/app/views/user/_show.rhtml
@@ -12,16 +12,16 @@
   }
   function delete_users()
   {
-    permissions = get_selected_users()
+    permissions = get_selected_users();
     if (validate_selected(permissions, "user")) {
       $.post('<%= url_for :controller => "permission", :action => "delete", :id => pool.id %>',
            { permission_ids: permissions.toString() },
-            function(data,status){
-              $("#users_grid").flexReload()
-		if (data.alert) {
-		  $.jGrowl(data.alert);
-                }
-             }, 'json');
+           function(data,status){
+             $tabs.tabs("load",$tabs.data('selected.tabs'));
+             if (data.alert) {
+               $.jGrowl(data.alert);
+             }
+           }, 'json');
     }
   }
   function update_users(role)
@@ -30,12 +30,12 @@
     if (validate_selected(permissions, "users")) {
       $.post('<%= url_for :controller => "permission", :action => "update_roles" %>',
              { permission_ids: permissions.toString(), user_role: role },
-              function(data,status){
-                $("#users_grid").flexReload()
-		if (data.alert) {
-		  $.jGrowl(data.alert);
-                }
-               }, 'json');
+             function(data,status){
+               $tabs.tabs("load",$tabs.data('selected.tabs'));
+               if (data.alert) {
+                 $.jGrowl(data.alert);
+               }
+             }, 'json');
     }
   }
 </script>
diff --git a/wui/src/app/views/vm/_form.rhtml b/wui/src/app/views/vm/_form.rhtml
index b3a8957..60ed003 100644
--- a/wui/src/app/views/vm/_form.rhtml
+++ b/wui/src/app/views/vm/_form.rhtml
@@ -61,6 +61,7 @@
                            :action => "storage_volumes_for_vm_json", 
                            :id => @vm, :vm_pool_id => @vm.vm_resource_pool %>',
 	dataType: 'json',
+        width: 700,
 	colModel : [
 		{display: '', name : 'id', width : 20, sortable : false, align: 'left', process: storage_volumes_grid_checkbox},
 		{display: 'Alias', name : 'display_name', width : 180, sortable : false, align: 'left'},
diff --git a/wui/src/public/javascripts/ovirt.js b/wui/src/public/javascripts/ovirt.js
index 829738f..9a0d4b7 100644
--- a/wui/src/public/javascripts/ovirt.js
+++ b/wui/src/public/javascripts/ovirt.js
@@ -7,13 +7,13 @@
 // returns an array of selected values for flexigrid checkboxes
 function get_selected_checkboxes(formid)
 {
-  var selected_array = new Array()
-  var selected_index = 0
-  var selected = $('#'+formid+' .grid_checkbox:checkbox:checked')
+  var selected_array = new Array();
+  var selected_index = 0;
+  var selected = $('#'+formid+' .grid_checkbox:checkbox:checked');
   selected.each(function(){
-    selected_array.push(this.value)  
+    selected_array.push(this.value);
   })
-  return selected_array
+  return selected_array;
 }
 
 
@@ -21,26 +21,26 @@ function get_selected_checkboxes(formid)
 function validate_selected(selected_array, name)
 {
   if (selected_array.length == 0) {
-    $.jGrowl("Please select at least one " + name + "  to continue")
-    return false
+    $.jGrowl("Please select at least one " + name + "  to continue");
+    return false;
   } else {
-    return true
+    return true;
   }
 }
 
 function add_hosts(url)
 {
-    hosts= get_selected_checkboxes("addhosts_grid_form")
+    hosts= get_selected_checkboxes("addhosts_grid_form");
     if (validate_selected(hosts, "host")) {
       $.post(url,
              { resource_ids: hosts.toString() },
               function(data,status){ 
                 jQuery(document).trigger('close.facebox');
-	        grid = $("#hosts_grid")
-                if (grid.size()>0) {
-                  grid.flexReload()
+	        grid = $("#hosts_grid");
+                if (grid.size()>0 && grid != null) {
+                  grid.flexReload();
                 } else {
-		  $('.tab_nav li.current a').click()
+		  $tabs.tabs("load",$tabs.data('selected.tabs'));
                 }
 		if (data.alert) {
 		  $.jGrowl(data.alert);
@@ -50,17 +50,17 @@ function add_hosts(url)
 }
 function add_storage(url)
 {
-    storage= get_selected_checkboxes("addstorage_grid_form")
+    storage= get_selected_checkboxes("addstorage_grid_form");
     if (validate_selected(storage, "storage pool")) {
       $.post(url,
              { resource_ids: storage.toString() },
-              function(data,status){ 
+              function(data,status){;
                 jQuery(document).trigger('close.facebox');
-	        grid = $("#storage_grid")
-                if (grid.size()>0) {
-                  grid.flexReload()
+	        grid = $("#storage_grid");
+                if (grid.size()>0 && grid != null) {
+                  grid.flexReload();
                 } else {
-		  $('.tab_nav li.current a').click()
+                   $tabs.tabs("load",$tabs.data('selected.tabs'));
                 }
 		if (data.alert) {
 		  $.jGrowl(data.alert);
@@ -86,76 +86,83 @@ function ajax_validation(response, status)
       }
     }
     if (response.alert) {
-      $.jGrowl(response.alert)
+      $.jGrowl(response.alert);
     }
   }
 }
 
 // callback actions for dialog submissions
 function afterHwPool(response, status){
-    ajax_validation(response, status)
+    ajax_validation(response, status);
     if (response.success) {
       jQuery(document).trigger('close.facebox');
       // FIXME do we need to reload the tree here
 
       // this is for reloading the host/storage grid when 
       // adding hosts/storage to a new HW pool
+      alert(response.resource_type);
       if (response.resource_type) {
-        $('#' + response.resource_type + '_grid').flexReload()
+        grid = $('#' + response.resource_type + '_grid');
+        alert(response.resource_type);
+        if (grid.size()>0 && grid != null) {
+          grid.flexReload();
+        } else {
+          $tabs.tabs("load",$tabs.data('selected.tabs'));
+        }
       }
       
       if ((response.resource_type == 'hosts' ? get_selected_hosts() : get_selected_storage()).indexOf($('#'+response.resource_type+'_selection_id').html()) != -1){
-	  empty_summary(response.resource_type +'_selection', (response.resource_type == 'hosts' ? 'Host' : 'Storage Pool'))
+	  empty_summary(response.resource_type +'_selection', (response.resource_type == 'hosts' ? 'Host' : 'Storage Pool'));
       }   
       // do we have HW pools grid?
       //$("#vmpools_grid").flexReload()
     }
 }
 function afterVmPool(response, status){
-    ajax_validation(response, status)
+    ajax_validation(response, status);
     if (response.success) {
       jQuery(document).trigger('close.facebox');
-      grid = $("#vmpools_grid")
-      if (grid.size()>0) {
-        grid.flexReload()
+      grid = $("#vmpools_grid");
+      if (grid.size()>0 && grid != null) {
+        grid.flexReload();
       } else {
-        $('.tab_nav li.current a').click()
+        $tabs.tabs("load",$tabs.data('selected.tabs'));
       }
     }
 }
 function afterStoragePool(response, status){
-    ajax_validation(response, status)
+    ajax_validation(response, status);
     if (response.success) {
       jQuery(document).trigger('close.facebox');
-      grid = $("#storage_grid")
-      if (grid.size()>0) {
-        grid.flexReload()
-      } else {
-        $('.tab_nav li.current a').click()
+      grid = $("#storage_grid");
+      if (grid.size()>0 && grid != null) {
+        grid.flexReload();
+      } else {;
+        $tabs.tabs("load",$tabs.data('selected.tabs'));
       }
     }
 }
 function afterPermission(response, status){
-    ajax_validation(response, status)
+    ajax_validation(response, status);
     if (response.success) {
       jQuery(document).trigger('close.facebox');
-      grid = $("#users_grid")
-      if (grid.size()>0) {
-        grid.flexReload()
+      grid = $("#users_grid");
+      if (grid.size()>0 && grid!= null) {
+        grid.flexReload();
       } else {
-        $('.tab_nav li.current a').click()
+        $tabs.tabs("load",$tabs.data('selected.tabs'));
       }
     }
 }
 function afterVm(response, status){
-    ajax_validation(response, status)
+    ajax_validation(response, status);
     if (response.success) {
       jQuery(document).trigger('close.facebox');
-      grid = $("#vms_grid")
-      if (grid.size()>0) {
-        grid.flexReload()
+      grid = $("#vms_grid");
+      if (grid.size()>0 && grid != null) {
+        grid.flexReload();
       } else {
-        $('.tab_nav li.current a').click()
+        $tabs.tabs("load",$tabs.data('selected.tabs'));
       }
     }
 }
-- 
1.5.5.1




More information about the ovirt-devel mailing list