From cfe2af8db82e98b1099bdd06d1d9e4793dbfaaff Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Mon, 20 Jun 2011 11:55:52 -0700
Subject: [PATCH] bug 10340: CloudStack UI - IP Address page - Port Forwarding
 tab - add new field "CIDR".

---
 ui/jsp/ipaddress.jsp               | 23 +++++++++++++++++------
 ui/scripts/cloud.core.ipaddress.js | 14 +++++++++++---
 2 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/ui/jsp/ipaddress.jsp b/ui/jsp/ipaddress.jsp
index 13515967e25..add23b6ffc6 100644
--- a/ui/jsp/ipaddress.jsp
+++ b/ui/jsp/ipaddress.jsp
@@ -289,6 +289,10 @@ dictionary = {
         <div id="tab_container">
 	        <div class="grid_container" id="grid_container">
 	            <div class="grid_header">
+	                <div class="grid_header_cell" style="width: 10%; ">
+	                    <div class="grid_header_title">
+	                        <fmt:message key="label.cidr"/></div>
+	                </div>		            
 	                <div class="grid_header_cell" style="width: 15%; ">
 	                    <div class="grid_header_title">
 	                        <fmt:message key="label.public.port"/></div>
@@ -297,7 +301,7 @@ dictionary = {
 	                    <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_cell" style="width: 10%; ">
 	                    <div class="grid_header_title">
 	                        <fmt:message key="label.protocol"/></div>
 	                </div>
@@ -309,12 +313,16 @@ dictionary = {
 	                    <div class="grid_header_title">
 	                        <fmt:message key="label.state"/></div>
 	                </div>
-	                <div class="grid_header_cell" style="width: 15%; ">
+	                <div class="grid_header_cell" style="width: 10%; ">
 	                    <div class="grid_header_title">
 	                        <fmt:message key="label.actions"/></div>
 	                </div>
 	            </div>
 	            <div class="grid_rows even" id="create_port_forwarding_row">
+	                <div class="grid_row_cell" style="width: 10%; ">  
+	                    <input id="cidr" class="text" type="text" />
+	                    <div id="cidr_errormsg" class="errormsg" style="display: none;">Error msg will appear here</div>
+	                </div>
 	                <div class="grid_row_cell" style="width: 15%; ">
 	                    <input id="public_port" class="text" style="width: 30%; " type="text" />
 	                    <div id="public_port_errormsg" class="errormsg" style="display: none;">Error msg will appear here</div>
@@ -333,7 +341,7 @@ dictionary = {
 	                    <input id="private_end_port" class="text" style="width: 30%; " type="text" />
 	                    <div id="private_end_port_errormsg" class="errormsg" style="display: none;">Error msg will appear here</div>	 
 	                </div>
-	                <div class="grid_row_cell" style="width: 15%; ">  
+	                <div class="grid_row_cell" style="width: 10%; ">  
 	                   <select class="select" id="protocol" style="width:70%;">	                    
 	                   </select>
 	                </div>
@@ -345,7 +353,7 @@ dictionary = {
 	                <div class="grid_row_cell" style="width: 10%; ">   
 	                    <div class="row_celltitles" id="state" style="padding:1px;"></div>
 	                </div>  
-	                <div class="grid_row_cell" style="width: 15%; ">
+	                <div class="grid_row_cell" style="width: 10%; ">
 	                    <div class="row_celltitles">
 	                        <a id="add_link" href="#"><fmt:message key="label.add"/></a></div>
 	                </div>
@@ -641,13 +649,16 @@ dictionary = {
 <!-- Port Forwarding template (begin) -->
 <div class="grid_rows odd" id="port_forwarding_template" style="display: none">    
     <div id="row_container">
+        <div class="grid_row_cell" style="width: 10%; ">
+            <div class="row_celltitles" id="cidr" style="padding:1px;"></div>
+        </div>
         <div class="grid_row_cell" style="width: 15%; ">
             <div class="row_celltitles" id="public_port"></div>
         </div>
         <div class="grid_row_cell" style="width: 15%; ">
             <div class="row_celltitles" id="private_port"></div>
         </div>
-        <div class="grid_row_cell" style="width: 15%; ">
+        <div class="grid_row_cell" style="width: 10%; ">
             <div class="row_celltitles" id="protocol"></div>
         </div>
         <div class="grid_row_cell" style="width: 25%; ">
@@ -656,7 +667,7 @@ dictionary = {
         <div class="grid_row_cell" style="width: 10%; ">
             <div class="row_celltitles" id="state" style="padding:1px;"></div>
         </div>        
-        <div class="grid_row_cell" style="width: 15%; ">
+        <div class="grid_row_cell" style="width: 10%; ">
             <div class="row_celltitles">
                 <a id="delete_link" href="#" style="float:left;"><fmt:message key="label.delete"/> </a>                                
             </div>
diff --git a/ui/scripts/cloud.core.ipaddress.js b/ui/scripts/cloud.core.ipaddress.js
index 0622fd99569..5dc874e000c 100644
--- a/ui/scripts/cloud.core.ipaddress.js
+++ b/ui/scripts/cloud.core.ipaddress.js
@@ -280,14 +280,16 @@ function afterLoadIpJSP() {
     */
     
     $createPortForwardingRow.find("#add_link").bind("click", function(event){	        
-		var isValid = true;		
-		isValid &= validateDropDownBox("Instance", $createPortForwardingRow.find("#vm"), $createPortForwardingRow.find("#vm_errormsg"));	
-		
+		var isValid = true;			
+		isValid &= validateCIDR("CIDR", $createPortForwardingRow.find("#cidr"), $createPortForwardingRow.find("#cidr_errormsg"), true); //optional		
+				
 		isValid &= validateInteger("Public Port", $createPortForwardingRow.find("#public_port"), $createPortForwardingRow.find("#public_port_errormsg"), 1, 65535, false); //required
 		isValid &= validateInteger("Public End Port", $createPortForwardingRow.find("#public_end_port"), $createPortForwardingRow.find("#public_end_port_errormsg"), 1, 65535, true); //optional
 		
 		isValid &= validateInteger("Private Port", $createPortForwardingRow.find("#private_port"), $createPortForwardingRow.find("#private_port_errormsg"), 1, 65535, false); //required		
 		isValid &= validateInteger("Private End Port", $createPortForwardingRow.find("#private_end_port"), $createPortForwardingRow.find("#private_end_port_errormsg"), 1, 65535, true); //optional				
+		
+		isValid &= validateDropDownBox("Instance", $createPortForwardingRow.find("#vm"), $createPortForwardingRow.find("#vm_errormsg"));	
 		if (!isValid) 
 		    return;			
 	    
@@ -303,6 +305,10 @@ function afterLoadIpJSP() {
 			
         var array1 = [];
         array1.push("&ipaddressid="+ipObj.id);           
+        
+        var cidr = $createPortForwardingRow.find("#cidr").val();
+        if(cidr != null && cidr.length > 0)
+        	array1.push("&cidrlist="+cidr);
         
 	    var publicPort = $createPortForwardingRow.find("#public_port").val();
 	    array1.push("&publicport="+publicPort);	    
@@ -1506,6 +1512,8 @@ function ipClearPortForwardingTab() {
 function portForwardingJsonToTemplate(jsonObj, $template) {				        
     $template.attr("id", "portForwarding_" + fromdb(jsonObj.id)).data("portForwardingId", fromdb(jsonObj.id));	
     
+    $template.find("#cidr").text(fromdb(jsonObj.cidrlist));
+    
     var publicPort = fromdb(jsonObj.publicport);
     if(jsonObj.publicendport != null && jsonObj.publicendport.length > 0)
     	publicPort += (" - " + fromdb(jsonObj.publicendport));