From c6965f06ccd75dd24fd8885818fb07407baebc44 Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Mon, 2 May 2011 14:56:18 -0700
Subject: [PATCH] CloudStack - pod page - Add Network Device - after
 addNetworkDevice API returns succeeds, show newly added network device in
 grid.

---
 ui/jsp/pod.jsp               | 65 ++++++++++++++++++++++++++++++++++--
 ui/scripts/cloud.core.pod.js | 37 +++++++++++---------
 2 files changed, 84 insertions(+), 18 deletions(-)

diff --git a/ui/jsp/pod.jsp b/ui/jsp/pod.jsp
index 30b2dbfb354..9d863ac42f6 100644
--- a/ui/jsp/pod.jsp
+++ b/ui/jsp/pod.jsp
@@ -156,8 +156,7 @@ dictionary = {
                    <p><fmt:message key="label.loading"/> &hellip;</p>    
               </div>               
         </div>
-        <div id="tab_container">
-            Network Device....
+        <div id="tab_container">           
         </div>
     </div> 
     <!-- Network Device tab (end)-->
@@ -294,6 +293,68 @@ dictionary = {
 <!--  Network tab template (end) -->
 
 
+<!--  Network Device tab template (begin) -->
+<div class="grid_container" id="network_device_tab_template" style="display: none">
+    <div class="grid_header">
+        <div class="grid_header_title" id="grid_header_title">
+        </div>
+        <div class="grid_actionbox" id="action_link"><p><fmt:message key="label.actions"/></p>
+            <div class="grid_actionsdropdown_box" id="action_menu" style="display: none;">
+                <ul class="actionsdropdown_boxlist" id="action_list">
+                </ul>
+            </div>
+        </div>
+        <div class="gridheader_loaderbox" id="spinning_wheel" style="display: none; height: 18px;">
+            <div class="gridheader_loader" id="icon">
+            </div>
+            <p id="description">
+                <fmt:message key="label.waiting"/> &hellip;
+            </p>
+        </div>       
+    </div>
+    
+    <div class="grid_rows" id="after_action_info_container" style="display:none">
+        <div class="grid_row_cell" style="width: 90%; border: none;">
+            <div class="row_celltitles">
+                <strong id="after_action_info">Message will appear here</strong></div>
+        </div>
+    </div>
+        
+    <div class="grid_rows even">
+        <div class="grid_row_cell" style="width: 20%;">
+            <div class="row_celltitles">
+                <fmt:message key="label.id"/>:</div>
+        </div>
+        <div class="grid_row_cell" style="width: 79%;">
+            <div class="row_celltitles" id="id">
+            </div>
+        </div>
+    </div>
+    <div class="grid_rows odd">
+        <div class="grid_row_cell" style="width: 20%;">
+            <div class="row_celltitles">
+                <fmt:message key="label.url"/>:</div>
+        </div>
+        <div class="grid_row_cell" style="width: 79%;">
+            <div class="row_celltitles" id="url">
+            </div>
+        </div>
+    </div>
+    <div class="grid_rows even">
+        <div class="grid_row_cell" style="width: 20%;">
+            <div class="row_celltitles">
+                <fmt:message key="label.type"/>:</div>
+        </div>
+        <div class="grid_row_cell" style="width: 79%;">
+            <div class="row_celltitles" id="type">
+            </div>
+        </div>
+    </div>
+   
+</div>
+<!--  Network Device tab template (end) -->
+
+
 <!-- ***** dialogs (begin) ***** -->
 <!-- Add Host Dialog (begin) -->
 <div id="dialog_add_host" title='<fmt:message key="label.add.host"/>' style="display: none">
diff --git a/ui/scripts/cloud.core.pod.js b/ui/scripts/cloud.core.pod.js
index 6d8235a22ad..978e79bb347 100644
--- a/ui/scripts/cloud.core.pod.js
+++ b/ui/scripts/cloud.core.pod.js
@@ -251,22 +251,30 @@ function podNetworkJsonToTemplate(jsonObj, template) {
    
     var $actionLink = template.find("#action_link");	
     bindActionLink($actionLink);
-    /*	
-	$actionLink.bind("mouseover", function(event) {
-        $(this).find("#action_menu").show();    
-        return false;
-    });
-    $actionLink.bind("mouseout", function(event) {
-        $(this).find("#action_menu").hide();    
-        return false;
-    });		
-	*/
-	
+   	
 	var $actionMenu = $actionLink.find("#action_menu");
     $actionMenu.find("#action_list").empty();	
     
     buildActionLinkForSubgridItem("Delete IP Range", podNetworkActionMap, $actionMenu, template);	
 }
+
+function podNetworkDeviceJsonToTemplate(jsonObj, template) {
+    template.data("jsonObj", jsonObj);     
+    template.attr("id", "networkdevice_"+fromdb(jsonObj.id)).data("networkdeviceId", fromdb(jsonObj.id));    
+    template.find("#grid_header_title").text(fromdb(jsonObj.url));			   
+    template.find("#id").text(fromdb(jsonObj.id));        
+    template.find("#url").text(fromdb(jsonObj.url));
+    template.find("#type").text(fromdb(jsonObj.type));
+       
+    var $actionLink = template.find("#action_link");	
+    bindActionLink($actionLink);
+   	
+	var $actionMenu = $actionLink.find("#action_menu");
+    $actionMenu.find("#action_list").empty();	
+    
+    //buildActionLinkForSubgridItem("Delete Network Device", podNetworkDeviceActionMap, $actionMenu, template);	
+}
+
 
 var podNetworkActionMap = {  
     "Delete IP Range": {              
@@ -976,16 +984,13 @@ function bindAddNetworkDeviceButton($leftmenuItem1) {
 					dataType: "json",
 					success: function(json) {						    				    
 					    $thisDialog.find("#spinning_wheel").hide();				        
-				        $thisDialog.dialog("close");
-					    
-					    /*
+				        $thisDialog.dialog("close");					    
 					    var item = json.addnetworkdeviceresponse.networkdevice;
 					    var $subgridItem = $("#network_device_tab_template").clone(true);
 					    podNetworkDeviceJsonToTemplate(item, $subgridItem); 	
 					    $subgridItem.find("#after_action_info").text(g_dictionary["label.adding.succeeded"]);
                         $subgridItem.find("#after_action_info_container").removeClass("error").addClass("success").show();  				                        
-	                    $("#tab_content_network_device").find("#tab_container").append($subgridItem.fadeIn("slow"));	
-	                    */
+	                    $("#tab_content_networkdevice").find("#tab_container").append($subgridItem.fadeIn("slow"));		                    
 					},
 				    error: function(XMLHttpResponse) {						        	        				        
 				        handleError(XMLHttpResponse, function() {