From f373f0928c8b2f73b635ee274bcae873b9caf4fd Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Fri, 29 Oct 2010 14:07:36 -0700
Subject: [PATCH] new UI - adding loading image to domain tree.

---
 ui/new/index.jsp                     | 15 ++++++++++++---
 ui/new/scripts/cloud.core2.domain.js | 13 +++++++++----
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/ui/new/index.jsp b/ui/new/index.jsp
index bbb30f50586..16725e9c44e 100644
--- a/ui/new/index.jsp
+++ b/ui/new/index.jsp
@@ -574,8 +574,17 @@ long milliseconds = new Date().getTime();
                         </div>
                     </div>
                     <div class="leftmenu_expandedbox" style="display: none">
-                        <div class="leftmenu_expandedlist" id="leftmenu_domain_tree">                            
-                        </div>
+                        <div id="leftmenu_domain_tree">
+                            <div id="loading_container" class="leftmenu_loadingbox" style="display: none;">
+                                <div class="leftmenu_loader">
+                                </div>
+                                <p>
+                                    Loading &hellip;
+                                </p>
+                            </div>
+                            <div id="tree_container" class="leftmenu_expandedlist">
+                            </div>
+                        </div>  
                     </div>
                 </div>
                 <div class="leftmenu_list">
@@ -632,7 +641,7 @@ long milliseconds = new Date().getTime();
                         </div>
                         
                         <div id="leftmenu_zone_tree">
-                        	<div class="leftmenu_loadingbox" style="display:none;" id="loading_container">
+                        	<div id="loading_container" class="leftmenu_loadingbox" style="display:none;">
                                 <div class="leftmenu_loader"></div>
                                 <p> Loading &hellip; </p>
                             </div>
diff --git a/ui/new/scripts/cloud.core2.domain.js b/ui/new/scripts/cloud.core2.domain.js
index f6b4ba726ea..32f48faa9aa 100644
--- a/ui/new/scripts/cloud.core2.domain.js
+++ b/ui/new/scripts/cloud.core2.domain.js
@@ -45,20 +45,25 @@ function refreshWholeTree(rootDomainId, rootLevel) {
 
 //draw root node
 function drawRootNode(rootDomainId) {
-    $("#leftmenu_domain_tree").empty();
+    var $loading = $("#leftmenu_domain_tree").find("#loading_container").show();
+    var $domainTree = $("#leftmenu_domain_tree").find("#tree_container").hide();
+   
     $.ajax({
         data: createURL("command=listDomains&id="+rootDomainId+"&pageSize=-1"), //pageSize=-1 will return all items (no limitation)
         dataType: "json",
         async: false,
         success: function(json) {					        
-            var domains = json.listdomainsresponse.domain;				        	    
+            var domains = json.listdomainsresponse.domain;	
+            $domainTree.empty();			        	    
 	        if (domains != null && domains.length > 0) {				   					    
-			    var node = drawNode(domains[0], defaultRootLevel, $("#leftmenu_domain_tree")); 
+			    var node = drawNode(domains[0], defaultRootLevel, $domainTree); 
 			    
 			    var treeLevelsbox = node.find(".tree_levelsbox");	//root node shouldn't have margin-left:20px				   
 			    if(treeLevelsbox!=null && treeLevelsbox.length >0)
 			        treeLevelsbox[0].style.marginLeft="0px";        //set root node's margin-left to 0px.
-			}				
+			}		
+			$loading.hide();
+            $domainTree.show();			
         }
     }); 		
 }