From d95d76f740fb79ad9f62065ab3a9927463dec74b Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Fri, 8 Oct 2010 11:31:35 -0700
Subject: [PATCH] new UI - ISO page - apply shared function
 initializeEditFunction().

---
 ui/new/jsp/iso.jsp                     | 48 +++++++++++++-------------
 ui/new/jsp/template.jsp                | 32 ++++++++---------
 ui/new/scripts/cloud.core2.iso.js      | 27 ++++-----------
 ui/new/scripts/cloud.core2.template.js |  6 +++-
 4 files changed, 52 insertions(+), 61 deletions(-)

diff --git a/ui/new/jsp/iso.jsp b/ui/new/jsp/iso.jsp
index 68b3ff5b101..3121c3de9ec 100644
--- a/ui/new/jsp/iso.jsp
+++ b/ui/new/jsp/iso.jsp
@@ -53,7 +53,7 @@
                     </div>
                 </div>
             </div>
-            <div class="grid_rows odd">
+            <div class="grid_rows even">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Zone")%>:</div>
@@ -75,7 +75,7 @@
                     <div id="name_edit_errormsg" style="display:none"></div>
                 </div>
             </div>
-            <div class="grid_rows odd">
+            <div class="grid_rows even">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Display.Text")%>:</div>
@@ -97,6 +97,16 @@
                     </div>
                 </div>
             </div>
+            <div class="grid_rows even">
+                <div class="grid_row_cell" style="width: 20%;">
+                    <div class="row_celltitles">
+                        <%=t.t("Size")%>:</div>
+                </div>
+                <div class="grid_row_cell" style="width: 79%;">
+                    <div class="row_celltitles" id="size">
+                    </div>
+                </div>
+            </div>        
             <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
@@ -107,6 +117,16 @@
                     </div>
                 </div>
             </div>
+            <div class="grid_rows even">
+                <div class="grid_row_cell" style="width: 20%;">
+                    <div class="row_celltitles">
+                        <%=t.t("crossZones")%>:</div>
+                </div>
+                <div class="grid_row_cell" style="width: 79%;">
+                    <div class="row_celltitles" id="crossZones">
+                    </div>
+                </div>
+            </div>
             <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
@@ -117,7 +137,7 @@
                     </div>
                 </div>
             </div>
-            <div class="grid_rows odd">
+            <div class="grid_rows even">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Created")%>:</div>
@@ -126,27 +146,7 @@
                     <div class="row_celltitles" id="created">
                     </div>
                 </div>
-            </div>
-            <div class="grid_rows odd">
-                <div class="grid_row_cell" style="width: 20%;">
-                    <div class="row_celltitles">
-                        <%=t.t("Size")%>:</div>
-                </div>
-                <div class="grid_row_cell" style="width: 79%;">
-                    <div class="row_celltitles" id="size">
-                    </div>
-                </div>
-            </div> 
-            <div class="grid_rows odd">
-                <div class="grid_row_cell" style="width: 20%;">
-                    <div class="row_celltitles">
-                        <%=t.t("crossZones")%>:</div>
-                </div>
-                <div class="grid_row_cell" style="width: 79%;">
-                    <div class="row_celltitles" id="crossZones">
-                    </div>
-                </div>
-            </div>
+            </div>                 
         </div>        
         <div class="grid_botactionpanel">
         	<div class="gridbot_buttons" id="save_button" style="display:none;">Save</div>
diff --git a/ui/new/jsp/template.jsp b/ui/new/jsp/template.jsp
index 00891a064e3..b9e6b857e1d 100644
--- a/ui/new/jsp/template.jsp
+++ b/ui/new/jsp/template.jsp
@@ -44,7 +44,7 @@
         </div>
     
         <div class="grid_container">
-            <div class="grid_rows even">
+            <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("ID")%>:</div>
@@ -54,7 +54,7 @@
                     </div>
                 </div>
             </div>
-            <div class="grid_rows odd">
+            <div class="grid_rows even">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Zone")%>:</div>
@@ -64,7 +64,7 @@
                     </div>
                 </div>
             </div>
-            <div class="grid_rows even">
+            <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Name")%>:</div>
@@ -76,7 +76,7 @@
                     <div id="name_edit_errormsg" style="display:none"></div>
                 </div>
             </div>
-            <div class="grid_rows odd">
+            <div class="grid_rows even">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Display.Text")%>:</div>
@@ -88,7 +88,7 @@
                     <div id="displaytext_edit_errormsg" style="display:none"></div>
                 </div>
             </div>
-            <div class="grid_rows even">
+            <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
                         <%=t.t("Status")%>:</div>
@@ -98,6 +98,16 @@
                     </div>
                 </div>
             </div>
+            <div class="grid_rows even">
+                <div class="grid_row_cell" style="width: 20%;">
+                    <div class="row_celltitles">
+                        <%=t.t("Size")%>:</div>
+                </div>
+                <div class="grid_row_cell" style="width: 79%;">
+                    <div class="row_celltitles" id="size">
+                    </div>
+                </div>
+            </div>
             <div class="grid_rows odd">
                 <div class="grid_row_cell" style="width: 20%;">
                     <div class="row_celltitles">
@@ -181,17 +191,7 @@
                     <div class="row_celltitles" id="created">
                     </div>
                 </div>
-            </div>
-            <div class="grid_rows even">
-                <div class="grid_row_cell" style="width: 20%;">
-                    <div class="row_celltitles">
-                        <%=t.t("Size")%>:</div>
-                </div>
-                <div class="grid_row_cell" style="width: 79%;">
-                    <div class="row_celltitles" id="size">
-                    </div>
-                </div>
-            </div>
+            </div>            
         </div>
         <div class="grid_botactionpanel">
         	<div class="gridbot_buttons" id="save_button" style="display:none;">Save</div>
diff --git a/ui/new/scripts/cloud.core2.iso.js b/ui/new/scripts/cloud.core2.iso.js
index c3635964fd3..16eaa0658b4 100644
--- a/ui/new/scripts/cloud.core2.iso.js
+++ b/ui/new/scripts/cloud.core2.iso.js
@@ -66,26 +66,8 @@ function afterLoadIsoJSP() {
     //edit button ***
     var $readonlyFields  = $detailsTab.find("#name, #displaytext");
     var $editFields = $detailsTab.find("#name_edit, #displaytext_edit"); 
-    $("#edit_button").bind("click", function(event){    
-        $readonlyFields.hide();
-        $editFields.show();  
-        $("#cancel_button, #save_button").show()
-        return false;
-    });    
-    $("#cancel_button").bind("click", function(event){    
-        $editFields.hide();
-        $readonlyFields.show();   
-        $("#save_button, #cancel_button").hide();       
-        return false;
-    });
-    $("#save_button").bind("click", function(event){        
-        doUpdateIso();     
-        $editFields.hide();      
-        $readonlyFields.show();       
-        $("#save_button, #cancel_button").hide();       
-        return false;
-    });
-    
+    initializeEditFunction($readonlyFields, $editFields, doUpdateIso); 
+       
     //populate dropdown ***
     var addIsoZoneField = $("#dialog_add_iso #add_iso_zone");    	
 	if (isAdmin())  
@@ -248,6 +230,10 @@ function isoJsonToDetailsTab(jsonObj) {
 }
 
 function isoClearRightPanel() {
+    isoClearDetailsTab(); 
+}
+
+function isoClearDetailsTab() {
     var $detailsTab = $("#right_panel_content #tab_content_details");   
     
     $detailsTab.find("#id").text("");
@@ -263,6 +249,7 @@ function isoClearRightPanel() {
     $detailsTab.find("#size").text("");  
 	$detailsTab.find("#status").text(""); 
 	$detailsTab.find("#bootable").text("");
+	$detailsTab.find("#crossZones").text("");
     $detailsTab.find("#created").text("");   
 }
 
diff --git a/ui/new/scripts/cloud.core2.template.js b/ui/new/scripts/cloud.core2.template.js
index 857ffb499cf..4f73e22375f 100644
--- a/ui/new/scripts/cloud.core2.template.js
+++ b/ui/new/scripts/cloud.core2.template.js
@@ -306,6 +306,10 @@ function setIconByOsType(osType, $field) {
 }
 
 function templateClearRightPanel() {       
+    templateClearDetailsTab();
+}
+
+function templateClearDetailsTab() {
     var $detailsTab = $("#right_panel_content #tab_content_details");   
     $detailsTab.data("jsonObj", null);
     $detailsTab.find("#id").text("");
@@ -335,7 +339,7 @@ function templateClearRightPanel() {
     
     $detailsTab.find("#account").text("");  
 	$detailsTab.find("#size").text("");  
-    $detailsTab.find("#created").text("");      
+    $detailsTab.find("#created").text("");      
 }
 
 var templateActionMap = {