From 374a114723ba1b86e86344ae070edc36fcf9be3c Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Wed, 26 Jan 2011 12:13:51 -0800
Subject: [PATCH] bug 8210: IP Address page - show new tab Port Range when
 Static NAT is enabled.

---
 .../classes/resources/messages.properties     |  1 +
 ui/jsp/ipaddress.jsp                          | 78 ++++++++++++++++++-
 ui/scripts/cloud.core.ipaddress.js            | 72 ++++++++++++++++-
 3 files changed, 146 insertions(+), 5 deletions(-)

diff --git a/client/WEB-INF/classes/resources/messages.properties b/client/WEB-INF/classes/resources/messages.properties
index 4ab3c81008a..2c9d9c40775 100644
--- a/client/WEB-INF/classes/resources/messages.properties
+++ b/client/WEB-INF/classes/resources/messages.properties
@@ -177,6 +177,7 @@ label.created=Created
 label.system.vm.type=System VM Type
 label.public.ip=Public IP Address
 label.by.state=By State
+label.port.range=Port Range
 label.port.forwarding=Port Forwarding
 label.load.balancer=Load Balancer
 label.vpn=VPN
diff --git a/ui/jsp/ipaddress.jsp b/ui/jsp/ipaddress.jsp
index da784b71f61..31e9d20eeba 100644
--- a/ui/jsp/ipaddress.jsp
+++ b/ui/jsp/ipaddress.jsp
@@ -21,7 +21,9 @@
     </div>
     <div class="tabbox" style="margin-top: 15px;">
         <div class="content_tabs on" id="tab_details">
-            <fmt:message key="label.details"/></div>		
+            <fmt:message key="label.details"/></div>	            
+        <div class="content_tabs off" id="tab_port_range" style="display: none">
+            <fmt:message key="label.port.range"/></div>            	
 		<div class="content_tabs off" id="tab_port_forwarding" style="display: none">
             <fmt:message key="label.port.forwarding"/></div>
         <div class="content_tabs off" id="tab_load_balancer" style="display: none">
@@ -181,6 +183,80 @@
         </div>        
     </div>
     <!-- Details ends here-->
+    <!-- Port Range start here-->
+    <div id="tab_content_port_range" style="display:none">
+    	<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display: none;">
+            <div class="rightpanel_mainloaderbox">
+                <div class="rightpanel_mainloader_animatedicon">
+                </div>
+                <p>
+                    <fmt:message key="label.loading"/> &hellip;</p>
+            </div>
+        </div>        
+        <div id="tab_container">
+	        <div class="grid_container" id="grid_container">
+	            <div class="grid_header">
+	                <div class="grid_header_cell" style="width: 15%;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.public.port"/></div>
+	                </div>
+	                <div class="grid_header_cell" style="width: 15%;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.private.port"/></div>
+	                </div>
+	                <div class="grid_header_cell" style="width: 15%;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.protocol"/></div>
+	                </div>
+	                <div class="grid_header_cell" style="width: 25%; border: none;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.instance"/></div>
+	                </div>
+	                <div class="grid_header_cell" style="width: 10%;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.state"/></div>
+	                </div>
+	                <div class="grid_header_cell" style="width: 15%;">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.actions"/></div>
+	                </div>
+	            </div>
+	            <div class="grid_rows even" id="create_port_range_row">
+	                <div class="grid_row_cell" style="width: 15%;">
+	                    <input id="public_port" class="text" style="width: 70%;" type="text" />
+	                    <div id="public_port_errormsg" class="errormsg" style="display: none;">Error msg will appear here</div>
+	                </div>
+	                <div class="grid_row_cell" style="width: 15%;">
+	                    <input id="private_port" class="text" style="width: 70%;" type="text" />
+	                    <div id="private_port_errormsg" class="errormsg" style="display: none;">Error msg will appear here</div>
+	                </div>
+	                <div class="grid_row_cell" style="width: 15%;">  
+	                   <select class="select" id="protocol" style="width:70%;">
+	                       <!--  
+	                       <option value="TCP">TCP</option>
+	                       <option value="UDP">UDP</option>
+	                       -->
+	                   </select>
+	                </div>
+	                <div class="grid_row_cell" style="width: 25%;">                   
+	                    <select class="select" id="vm">
+	                    </select>
+	                    <div id="vm_errormsg" class="errormsg" style="display: none;"></div>	                    
+	                </div>
+	                <div class="grid_row_cell" style="width: 10%;">   
+	                    <div class="row_celltitles" id="state"></div>
+	                </div>  
+	                <div class="grid_row_cell" style="width: 15%;">
+	                    <div class="row_celltitles">
+	                        <a id="add_link" href="#"><fmt:message key="label.add"/></a></div>
+	                </div>
+	            </div>              
+	            <div id="grid_content">
+	            </div>            
+	        </div>
+        </div>      
+    </div>
+    <!-- Port Range ends here-->
     <!-- Port Forwarding start here-->
     <div id="tab_content_port_forwarding" style="display:none">
     	<div id="tab_spinning_wheel" class="rightpanel_mainloader_panel" style="display: none;">
diff --git a/ui/scripts/cloud.core.ipaddress.js b/ui/scripts/cloud.core.ipaddress.js
index b600258812b..1e4fd25bc13 100644
--- a/ui/scripts/cloud.core.ipaddress.js
+++ b/ui/scripts/cloud.core.ipaddress.js
@@ -50,9 +50,9 @@ function ipGetSearchParams() {
 
 function afterLoadIpJSP() {
     //***** switch between different tabs (begin) ********************************************************************
-    var tabArray = [$("#tab_details"), $("#tab_port_forwarding"), $("#tab_load_balancer"), $("#tab_vpn")];
-    var tabContentArray = [$("#tab_content_details"), $("#tab_content_port_forwarding"), $("#tab_content_load_balancer"), $("#tab_content_vpn")];
-    var afterSwitchFnArray = [ipJsonToDetailsTab, ipJsonToPortForwardingTab, ipJsonToLoadBalancerTab, ipJsonToVPNTab];
+    var tabArray = [$("#tab_details"), $("#tab_port_range"), $("#tab_port_forwarding"), $("#tab_load_balancer"), $("#tab_vpn")];
+    var tabContentArray = [$("#tab_content_details"), $("#tab_content_port_range"), $("#tab_content_port_forwarding"), $("#tab_content_load_balancer"), $("#tab_content_vpn")];
+    var afterSwitchFnArray = [ipJsonToDetailsTab, ipJsonToPortRangeTab, ipJsonToPortForwardingTab, ipJsonToLoadBalancerTab, ipJsonToVPNTab];
     switchBetweenDifferentTabs(tabArray, tabContentArray, afterSwitchFnArray);       
     //***** switch between different tabs (end) **********************************************************************
         
@@ -327,9 +327,11 @@ function ipToRightPanel($midmenuItem1) {
     $("#tab_details").click();        
    
     if(ipObj.isstaticnat == true) {
+        $("#tab_port_range").show();	
         $("#tab_port_forwarding, #tab_load_balancer, #tab_vpn").hide();	
     }
     else { //ipObj.isstaticnat == false  
+        $("#tab_port_range").hide();
         if(ipObj.forvirtualnetwork == true) { //(public network)            
             if(isIpManageable(ipObj.domainid, ipObj.account) == true) {           
 	            //Port Forwarding tab
@@ -389,6 +391,68 @@ function ipToRightPanel($midmenuItem1) {
     }        
 }
 
+function ipJsonToPortRangeTab() {   
+    var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
+    
+    /*
+    if($midmenuItem1 == null) {
+        ipClearPortRangeTab();
+        return;    
+    }
+        
+    var ipObj = $midmenuItem1.data("jsonObj");
+    if(ipObj == null) {
+        ipClearPortRangeTab();
+        return;   
+    }
+        
+    var networkObj = $midmenuItem1.data("networkObj");
+      
+    var ipAddress = ipObj.ipaddress;
+    if(ipAddress == null || ipAddress.length == 0)
+        return;    
+   
+    var $thisTab = $("#right_panel_content #tab_content_port_range");  
+	$thisTab.find("#tab_container").hide(); 
+    $thisTab.find("#tab_spinning_wheel").show();   		
+
+    if(networkObj != null) {
+        var firewallServiceObj = ipFindNetworkServiceByName("Firewall", networkObj);
+        if(firewallServiceObj != null) {
+	        var supportedProtocolsCapabilityObj = ipFindCapabilityByName("SupportedProtocols", firewallServiceObj);    
+            if(supportedProtocolsCapabilityObj != null) {
+                var protocols = supportedProtocolsCapabilityObj.value.toUpperCase();  //e.g. "tcp,udp" => "TCP,UDP"         
+                var array1 = protocols.split(",");
+                var $protocolField = $("#create_port_range_row").find("#protocol").empty();
+                for(var i=0; i<array1.length; i++)
+                    $protocolField.append("<option value='"+array1[i]+"'>"+array1[i]+"</option>")
+            }  
+        }
+    }  
+    
+    refreshCreatePortRangeRow();         
+           		
+    $.ajax({
+        data: createURL("command=listPortRangeRules&ipaddress=" + ipAddress),
+        dataType: "json",        
+        success: function(json) {	                                    
+            var items = json.listPortRangerulesresponse.PortRangerule;              
+            var $PortRangeGrid = $thisTab.find("#grid_content");            
+            $PortRangeGrid.empty();                       		    		      	    		
+            if (items != null && items.length > 0) {				        			        
+                for (var i = 0; i < items.length; i++) {
+	                var $template = $("#port_range_template").clone(true);
+	                PortRangeJsonToTemplate(items[i], $template); 
+	                $PortRangeGrid.append($template.show());						   
+                }			    
+            } 	
+            $thisTab.find("#tab_spinning_wheel").hide();    
+            $thisTab.find("#tab_container").show();           	      		    						
+        }
+    });  
+    */ 
+}
+
 function ipJsonToPortForwardingTab() {   
     var $midmenuItem1 = $("#right_panel_content").data("$midmenuItem1");
     if($midmenuItem1 == null) {
@@ -963,7 +1027,7 @@ function ipJsonToDetailsTab() {
     
     setBooleanReadField(ipObj.isstaticnat, $thisTab.find("#static_nat")); 
     
-    if(ipObj.isstaticnat == true) {   
+    if(ipObj.isstaticnat == true) {    
 	    $thisTab.find("#vm_of_static_nat").text(getVmName(ipObj.virtualmachinename, ipObj.virtualmachinedisplayname));
 	    $thisTab.find("#vm_of_static_nat_container").show();	        
     }