rafaelweingartner closed pull request #2456: [CLOUDSTACK-10293] Single view 
network ACL rules listing
URL: https://github.com/apache/cloudstack/pull/2456
 
 
   

This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:

As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):

diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index 519778ba59b..9b4e7638001 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -8391,7 +8391,6 @@ div.container div.panel 
div#details-tab-addloadBalancer.detail-group div.loadBal
   border-right: 1px solid #CFC9C9;
   height: 15px;
   overflow: auto;
-  padding-right: 0;
 }
 
 .multi-edit .data .data-body .data-item > table tbody tr td span {
@@ -8426,8 +8425,44 @@ div.container div.panel 
div#details-tab-addloadBalancer.detail-group div.loadBal
   color: #0000FF;
 }
 
-.multi-edit .data .data-body .data-item table tbody tr td.multi-actions {
-  border-right: none;
+div#details-tab-aclRules table.multi-edit tr th.number,
+div#details-tab-aclRules div.data-item table tr td.number {
+  width: 45px !important;
+  min-width: 45px !important;
+  max-width: 45px !important;
+}
+
+div#details-tab-aclRules div.multi-edit table tr th.action,
+div#details-tab-aclRules div.multi-edit table tr td.action {
+    width: 40px !important;
+    min-width: 40px !important;
+    max-width: 40px !important;
+}
+
+div#details-tab-aclRules div.multi-edit table tr th.protocol,
+div#details-tab-aclRules div.multi-edit table tr td.protocol {
+    width: 50px !important;
+    min-width: 50px !important;
+    max-width: 50px !important;
+}
+
+div#details-tab-aclRules div.multi-edit table tr th.protocolnumber,
+div#details-tab-aclRules div.multi-edit table tr td.protocolnumber {
+    width: 60px !important;
+    min-width: 60px !important;
+    max-width: 60px !important;
+}
+
+div#details-tab-aclRules div.multi-edit table tr th.startport, 
div#details-tab-aclRules div.multi-edit table tr td.startport,
+div#details-tab-aclRules div.multi-edit table tr th.endport, 
div#details-tab-aclRules div.multi-edit table tr td.endport {
+    width: 70px !important;
+    min-width: 70px !important;
+    max-width: 70px !important;
+}
+
+div#details-tab-aclRules td.cidrlist span {
+       text-align: center;
+       width: 100%;
 }
 
 .multi-edit .data .data-body .data-item table tbody tr td.multi-actions 
.action {
@@ -8548,17 +8583,18 @@ div.container div.panel 
div#details-tab-addloadBalancer.detail-group div.loadBal
 
 .detail-view .multi-edit table tr th,
 .detail-view .multi-edit table tr td {
-  width: 87px !important;
-  min-width: 87px !important;
-  max-width: 87px !important;
+  width: 84px !important;
+  min-width: 84px !important;
+  max-width: 84px !important;
   font-size: 10px;
 }
 
 /* special case for 'Source CIDR' column - make it wide enough to fit a CIDR 
without ellipsizing*/
 .detail-view .multi-edit table tr th.cidrlist,
 .detail-view .multi-edit table tr td.cidrlist {
-  min-width: 112px !important;
-  max-width: 112px !important;
+  min-width: 118px !important;
+  max-width: 118px !important;
+  padding: 0 0 0 0;
 }
 .detail-view .multi-edit td.cidrlist input {
   width: 85%;
@@ -8615,9 +8651,9 @@ div.container div.panel 
div#details-tab-addloadBalancer.detail-group div.loadBal
 /*Sortable*/
 .multi-edit table tbody tr td.reorder,
 .multi-edit table thead tr th.reorder {
-  width: 30px !important;
-  min-width: 30px !important;
-  max-width: 30px !important;
+  width: 16px !important;
+  min-width: 16px !important;
+  max-width: 16px !important;
 }
 
 /*Security Rules*/
@@ -13037,7 +13073,7 @@ div.ui-dialog div.autoscaler div.field-group 
div.form-container form div.form-it
   -khtml-border-radius: 10px;
   border-radius: 10px;
   border-radius: 10px 10px 10px 10px;
-  background-position: -74px -162px;
+  background-position: -82px -162px;
 }
 
 .moveDrag:hover .icon {
@@ -13357,4 +13393,3 @@ div.panel.copy-template-destination-list div.list-view 
div.fixed-header{
 .multi-edit-add-list .ui-button.copytemplatecancel {
     left: 310px;
 }
-
diff --git a/ui/l10n/ar.js b/ui/l10n/ar.js
index 3b560a86e72..9c10afcea00 100644
--- a/ui/l10n/ar.js
+++ b/ui/l10n/ar.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP Code",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP Type",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "???? ????? ??????",
     "confirm.enable.s3": "???? ?? ?????? ???????? ??????? ?????? ??????? S3 
??????? ????????.",
     "confirm.enable.swift": "Please fill in the following information to 
enable support for Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "????? ????",
     "label.add.rule": "????? ?????",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Add Secondary Storage",
     "label.add.security.group": "Add Security Group",
     "label.add.service.offering": "Add Service Offering",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "????????",
     "label.protocol": "Protocol",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "Providers",
     "label.public": "Public",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Rule Number",
     "label.rules": "Rules",
     "label.running.vms": "Running VMs",
diff --git a/ui/l10n/ca.js b/ui/l10n/ca.js
index f6ae80f81f3..fe85a1938be 100644
--- a/ui/l10n/ca.js
+++ b/ui/l10n/ca.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP Code",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP Type",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Changed item properties",
     "confirm.enable.s3": "Please fill in the following information to enable 
support for S3-backed Secondary Storage",
     "confirm.enable.swift": "Si us plau ompliu la seg?ent informaci? per 
habilitar el suport per a Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Add route",
     "label.add.rule": "Afegir regla",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Add Secondary Storage",
     "label.add.security.group": "Add Security Group",
     "label.add.service.offering": "Add Service Offering",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projectes",
     "label.protocol": "Protocol",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "Prove?dors",
     "label.public": "Public",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Rule Number",
     "label.rules": "Rules",
     "label.running.vms": "Running VMs",
diff --git a/ui/l10n/de_DE.js b/ui/l10n/de_DE.js
index 934f8f98c09..62e00560a69 100644
--- a/ui/l10n/de_DE.js
+++ b/ui/l10n/de_DE.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP-Code",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP-Typ",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Ge?nderte Eintragseigenschaften",
     "confirm.enable.s3": "Bitte f?gen Sie die folgenden Informationen hinzu, 
um die Unterst?tzung f?r \"S3-backed Secondary Storage\" hinzuzuf?gen",
     "confirm.enable.swift": "Bitte f?gen Sie die folgenden Informationen 
hinzu, um die Unterst?tzung f?r Swift zu erm?glichen.",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Rolle hinzuf?gen",
     "label.add.route": "Route hinzuf?gen",
     "label.add.rule": "Regel hinzuf?gen",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Sekund?rspeicher hinzuf?gen",
     "label.add.security.group": "Sicherheitsgruppe hinzuf?gen",
     "label.add.service.offering": "Dienstangebot hinzuf?gen",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projekte",
     "label.protocol": "Protokoll",
     "label.protocol.number": "Protokollnummer",
+    "label.protocol.number.short" : "#Protokoll",
     "label.provider": "Anbieter",
     "label.providers": "Anbieter",
     "label.public": "?ffentlich",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "Routing Host",
     "label.rule": "Regel",
+    "label.rule.number.short": "#Regel",
     "label.rule.number": "Regelnummer",
     "label.rules": "Regeln",
     "label.running.vms": "Laufende VMs",
diff --git a/ui/l10n/en.js b/ui/l10n/en.js
index 7b19946b1ed..ef7c91e290a 100644
--- a/ui/l10n/en.js
+++ b/ui/l10n/en.js
@@ -14,8 +14,11 @@
 // KIND, either express or implied.  See the License for the
 // specific language governing permissions and limitations
 // under the License.
-var dictionary = {"ICMP.code":"ICMP Code",
+var dictionary = {
+"ICMP.code":"ICMP Code",
+"ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
 "ICMP.type":"ICMP Type",
+"ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
 "changed.item.properties":"Changed item properties",
 "confirm.enable.s3":"Please fill in the following information to enable 
support for S3-backed Secondary Storage",
 "confirm.enable.swift":"Please fill in the following information to enable 
support for Swift",
@@ -370,6 +373,7 @@ var dictionary = {"ICMP.code":"ICMP Code",
 "label.add.role":"Add Role",
 "label.add.route":"Add route",
 "label.add.rule":"Add rule",
+"label.add.rule.desc": "Create a new ACL rule",
 "label.add.secondary.storage":"Add Secondary Storage",
 "label.add.security.group":"Add Security Group",
 "label.add.service.offering":"Add Service Offering",
@@ -1316,6 +1320,7 @@ var dictionary = {"ICMP.code":"ICMP Code",
 "label.promiscuous.mode":"Promiscuous Mode",
 "label.protocol":"Protocol",
 "label.protocol.number":"Protocol Number",
+"label.protocol.number.short" : "#Protocol",
 "label.provider":"Provider",
 "label.providers":"Providers",
 "label.public":"Public",
@@ -1467,6 +1472,7 @@ var dictionary = {"ICMP.code":"ICMP Code",
 "label.routing.host":"Routing Host",
 "label.rule":"Rule",
 "label.rule.number":"Rule Number",
+"label.rule.number.short": "#Rule",
 "label.rules":"Rules",
 "label.running.vms":"Running VMs",
 "label.s3.access_key":"Access Key",
diff --git a/ui/l10n/es.js b/ui/l10n/es.js
index 35257d47989..5a0982bee27 100644
--- a/ui/l10n/es.js
+++ b/ui/l10n/es.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "C?digo ICMP",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "Tipo ICMP",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Cambiadas las propiedades del elemento",
     "confirm.enable.s3": "Por favor, complete la siguiente informaci?n para 
habilitar el soporte del Almacenamiento Secundario sobre S3",
     "confirm.enable.swift": "Por favor, complete la siguiente informaci?n para 
habilitar el soporte para Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Agregar Rol",
     "label.add.route": "Agregar ruta",
     "label.add.rule": "Agregar regla",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "A?adir almacenamiento secundario",
     "label.add.security.group": "Agregar grupo de seguridad",
     "label.add.service.offering": "A?adir Oferta de Servicio",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Proyectos",
     "label.protocol": "Protocolo",
     "label.protocol.number": "N?mero de Protocolo",
+    "label.protocol.number.short" : "#Protocolo",
     "label.provider": "Proveedor",
     "label.providers": "Proveedores",
     "label.public": "P?blica",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Enrutamiento",
     "label.routing.host": "Servidor de Routeo",
     "label.rule": "Regla",
+    "label.rule.number.short": "#Regla",
     "label.rule.number": "N?mero de Regla",
     "label.rules": "Reglas",
     "label.running.vms": "MVs corriendo",
diff --git a/ui/l10n/fr_FR.js b/ui/l10n/fr_FR.js
index 9935a818021..0f81e9ccbee 100644
--- a/ui/l10n/fr_FR.js
+++ b/ui/l10n/fr_FR.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "Code ICMP",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "Type ICMP",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Propri?t?s de l'?l?ment modifi?es",
     "confirm.enable.s3": "Remplir les informations suivantes pour activer le 
support de stockage secondaire S3",
     "confirm.enable.swift": "Remplir les informations suivantes pour activer 
Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Ajouter R?le",
     "label.add.route": "Ajouter route",
     "label.add.rule": "Ajouter r?gle",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Ajouter un stockage secondaire",
     "label.add.security.group": "Ajouter un groupe de s?curit?",
     "label.add.service.offering": "Ajouter Offre Service",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projets",
     "label.protocol": "Protocole",
     "label.protocol.number": "Num?ro Protocole",
+    "label.protocol.number.short" : "#Protocole",
     "label.provider": "Fournisseur",
     "label.providers": "Fournisseurs",
     "label.public": "Publique",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routage",
     "label.routing.host": "H?te de routage",
     "label.rule": "R?gle",
+    "label.rule.number.short": "#R?gle",
     "label.rule.number": "Num?ro r?gle",
     "label.rules": "R?gles",
     "label.running.vms": "VMs actives",
diff --git a/ui/l10n/hu.js b/ui/l10n/hu.js
index 912ecf9a49d..105b3ce845b 100644
--- a/ui/l10n/hu.js
+++ b/ui/l10n/hu.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP k?d",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP t?pus",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Az elem tulajdons?gai megv?ltoztak",
     "confirm.enable.s3": "T?ltsd ki a k?vetkez? inform?ci?kat az S3 m?sodlagos 
t?r bekapcsol?s?hoz!",
     "confirm.enable.swift": "T?ltsd ki a k?vetkez? inform?ci?kat a Swift 
t?mogat?s bekapcsol?s?hoz!",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "?tvonal felv?tele",
     "label.add.rule": "Szab?ly felv?tele",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "M?sodlagos t?r felv?tele",
     "label.add.security.group": "Biztons?gi csoport felv?tele",
     "label.add.service.offering": "Szolg?ltat?s aj?nlat felv?tele",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projektek",
     "label.protocol": "Protokol",
     "label.protocol.number": "Protokoll sz?m",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Szolg?ltat?",
     "label.providers": "Szolg?ltat?k",
     "label.public": "Publikus",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "?tvonalv?laszt?s",
     "label.routing.host": "Routing kiszolg?l?",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Szab?ly sz?m",
     "label.rules": "Szab?lyok",
     "label.running.vms": "Fut? VM-ek",
diff --git a/ui/l10n/it_IT.js b/ui/l10n/it_IT.js
index f725584e08b..0e7e17a4db9 100644
--- a/ui/l10n/it_IT.js
+++ b/ui/l10n/it_IT.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "Codice ICMP",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "Tipo ICMP",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Elementi delle propriet? modificati",
     "confirm.enable.s3": "Si prega di inserire i valori richiesti per 
abilitare il supporto per il Secondary Storage di tipo S3",
     "confirm.enable.swift": "Si prega di inserire i valori richiesti per 
abilitare il supporto per Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Aggiungere una rotta",
     "label.add.rule": "Aggiungere regola",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Aggiungere uno Storage Secondario",
     "label.add.security.group": "Aggiungere un Gruppo di Sicurezza",
     "label.add.service.offering": "Aggiungere un'Offerta di Servizio",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Progetti",
     "label.protocol": "Protocol",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "Fornitori",
     "label.public": "Public",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Rule Number",
     "label.rules": "Regole",
     "label.running.vms": "Running VMs",
diff --git a/ui/l10n/ja_JP.js b/ui/l10n/ja_JP.js
index 40cf38fd857..c0e8abdcc0a 100644
--- a/ui/l10n/ja_JP.js
+++ b/ui/l10n/ja_JP.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP ???",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP ???",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "???????????",
     "confirm.enable.s3": "S3 ????????? ?????????????????????????????????",
     "confirm.enable.swift": "Swift ????????????????????????????",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "??????",
     "label.add.rule": "?????",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "????? ????????",
     "label.add.security.group": "?????? ???????",
     "label.add.service.offering": "???? ?????????",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "??????",
     "label.protocol": "?????",
     "label.protocol.number": "???????",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "??????",
     "label.providers": "??????",
     "label.public": "?????",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "??????",
     "label.routing.host": "?????? ???",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "????",
     "label.rules": "??",
     "label.running.vms": "???? VM",
diff --git a/ui/l10n/ko_KR.js b/ui/l10n/ko_KR.js
index f6980bc067e..d8ffb72ef24 100644
--- a/ui/l10n/ko_KR.js
+++ b/ui/l10n/ko_KR.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP ??",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP ??",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "?? ?? ??",
     "confirm.enable.s3": "S3 ?? 2? ??? ??? ??? ?? ??? ??? ????.",
     "confirm.enable.swift": "Swift ?? ??? ?? ??? ?? ??? ??? ????.",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "??? ??",
     "label.add.rule": "?? ??",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "2? ???? ??",
     "label.add.security.group": "?? ?? ??",
     "label.add.service.offering": "????? ??",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "????",
     "label.protocol": "????",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "???",
     "label.public": "??",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "???",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Rule Number",
     "label.rules": "??",
     "label.running.vms": "??? VM",
diff --git a/ui/l10n/nb_NO.js b/ui/l10n/nb_NO.js
index 28cd09c3b9a..0725037de7e 100644
--- a/ui/l10n/nb_NO.js
+++ b/ui/l10n/nb_NO.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP-kode",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP-type",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Endrede egenskaper",
     "confirm.enable.s3": "Vennligst fyll inn f?lgende informasjon for ? 
aktivere st?tte for S3-st?ttet sekund?rlagring",
     "confirm.enable.swift": "Vennligst fyll inn f?lgende informasjon for ? 
aktivere st?tte for Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Legg til rute",
     "label.add.rule": "Legg til regel",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Legg til sekund?rlagring",
     "label.add.security.group": "Legg til sikkerhetsgruppe",
     "label.add.service.offering": "Legg til tjenestetilbud",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Prosjekter",
     "label.protocol": "Protokoll",
     "label.protocol.number": "Protokollnummer",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Tilbyder",
     "label.providers": "Tilbydere",
     "label.public": "Offentlig",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Ruting",
     "label.routing.host": "Ruter Vert",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Regel",
     "label.rule.number": "Regelnummer",
     "label.rules": "Regler",
     "label.running.vms": "Kj?rende VMer",
diff --git a/ui/l10n/nl_NL.js b/ui/l10n/nl_NL.js
index 4508241ad30..9bba48c3bf0 100644
--- a/ui/l10n/nl_NL.js
+++ b/ui/l10n/nl_NL.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP Code",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP Type",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Item eigenschappen gewijzigd",
     "confirm.enable.s3": "Vul de volgende informatie in om ondersteuning voor 
S3-aangestuurde Secundaire Opslag te activeren",
     "confirm.enable.swift": "Vul de volgende informatie in om ondersteuning 
voor Swift te activeren",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Route toevoegen",
     "label.add.rule": "Regel toevoegen",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Secundaire Opslag toevoegen",
     "label.add.security.group": "Security Group toevoegen",
     "label.add.service.offering": "Service Aanbieding toevoegen",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projecten",
     "label.protocol": "Protocol",
     "label.protocol.number": "protocol nummer",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "Providers",
     "label.public": "Publiek",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "routeer machine",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Regel Nummer",
     "label.rules": "Regels",
     "label.running.vms": "Draaiende VMs",
diff --git a/ui/l10n/pl.js b/ui/l10n/pl.js
index 30c04b9ff75..b829dc3a9b5 100644
--- a/ui/l10n/pl.js
+++ b/ui/l10n/pl.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP Code",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP Type",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "Changed item properties",
     "confirm.enable.s3": "Please fill in the following information to enable 
support for S3-backed Secondary Storage",
     "confirm.enable.swift": "Please fill in the following information to 
enable support for Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Add route",
     "label.add.rule": "Dodaj regu??",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "Add Secondary Storage",
     "label.add.security.group": "Add Security Group",
     "label.add.service.offering": "Add Service Offering",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projekty",
     "label.protocol": "Protok??",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "Provider",
     "label.providers": "Dostawcy",
     "label.public": "Pobliczny",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Routing",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "Rule Number",
     "label.rules": "Zasady",
     "label.running.vms": "Running VMs",
diff --git a/ui/l10n/pt_BR.js b/ui/l10n/pt_BR.js
index ccfa59ae7d3..590dd794b76 100644
--- a/ui/l10n/pt_BR.js
+++ b/ui/l10n/pt_BR.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "C?digo ICMP",
+    "ICMP.code.desc": "Informe -1, se voc?s quiser permitir todos os c?digos 
ICMP.",
     "ICMP.type": "Tipo ICMP",
+    "ICMP.type.desc": "Informe -1, se voc?s quiser permitir todos os tipos 
ICMP.",
     "changed.item.properties": "Propriedades do item alteradas",
     "confirm.enable.s3": "Por favor, preencha as informa??es abaixo para 
habilitar suporte o Storage Secund?rio fornecido por S3",
     "confirm.enable.swift": "Por favor, preencha as informa??es abaixo para 
habilitar suporte ao Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "Adicionar rota",
     "label.add.rule": "Adicionar regra",
+    "label.add.rule.desc": "Criar nova regra ACL",
     "label.add.secondary.storage": "Adicionar Storage Secund?rio",
     "label.add.security.group": "Adicionar Security Group",
     "label.add.service.offering": "Adicionar Plano",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "Projetos",
     "label.protocol": "Protocolo",
     "label.protocol.number": "N?mero do Protocolo",
+    "label.protocol.number.short" : "#Protocolo",
     "label.provider": "Provedor",
     "label.providers": "Providers",
     "label.public": "P?blico",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "Roteamento",
     "label.routing.host": "Host de Roteamento",
     "label.rule": "Regra",
+    "label.rule.number.short": "#Regra",
     "label.rule.number": "Regra N?mero",
     "label.rules": "Regras",
     "label.running.vms": "VMs Rodando",
diff --git a/ui/l10n/ru_RU.js b/ui/l10n/ru_RU.js
index 6a11b38a0f7..d676df59d4a 100644
--- a/ui/l10n/ru_RU.js
+++ b/ui/l10n/ru_RU.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "??? ICMP",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "??? ICMP",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "????????? ???????? ????????",
     "confirm.enable.s3": "????????? ?????????? ??? ?????????  S3-???????????? 
??????????????? ?????????",
     "confirm.enable.swift": "????????? ????????????? ?????????? ??? ????????? 
???????? Swift",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "???????? ???????",
     "label.add.rule": "???????? ???????",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "???????? ?????????????? ?????????",
     "label.add.security.group": "???????? ?????? ????????????",
     "label.add.service.offering": "???????? ??????",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "???????",
     "label.protocol": "????????",
     "label.protocol.number": "Protocol Number",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "??????????",
     "label.providers": "??????????",
     "label.public": "?????????",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "?????????????",
     "label.routing.host": "Routing Host",
     "label.rule": "Rule",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "????? ???????",
     "label.rules": "???????",
     "label.running.vms": "?????????? ??",
diff --git a/ui/l10n/zh_CN.js b/ui/l10n/zh_CN.js
index dc44fdb9a96..4d0762d9d96 100644
--- a/ui/l10n/zh_CN.js
+++ b/ui/l10n/zh_CN.js
@@ -16,7 +16,9 @@
 // under the License.
 var dictionary = {
     "ICMP.code": "ICMP ??",
+    "ICMP.code.desc": "Please specify -1 if you want to allow all ICMP codes",
     "ICMP.type": "ICMP ??",
+    "ICMP.type.desc": "Please specify -1 if you want to allow all ICMP types.",
     "changed.item.properties": "??????",
     "confirm.enable.s3": "??????????? S3 ??????????",
     "confirm.enable.swift": "??????????? SWIFT ???",
@@ -367,6 +369,7 @@ var dictionary = {
     "label.add.role": "Add Role",
     "label.add.route": "????",
     "label.add.rule": "????",
+    "label.add.rule.desc": "Create a new ACL rule",
     "label.add.secondary.storage": "??????",
     "label.add.security.group": "?????",
     "label.add.service.offering": "??????",
@@ -1278,6 +1281,7 @@ var dictionary = {
     "label.projects": "??",
     "label.protocol": "??",
     "label.protocol.number": "????",
+    "label.protocol.number.short" : "#Protocol",
     "label.provider": "????",
     "label.providers": "????",
     "label.public": "??",
@@ -1427,6 +1431,7 @@ var dictionary = {
     "label.routing": "????",
     "label.routing.host": "??????",
     "label.rule": "??",
+    "label.rule.number.short": "#Rule",
     "label.rule.number": "????",
     "label.rules": "??",
     "label.running.vms": "????? VM",
diff --git a/ui/scripts/ui/widgets/multiEdit.js 
b/ui/scripts/ui/widgets/multiEdit.js
index c3fa97c8fc1..36e3ffb4c90 100755
--- a/ui/scripts/ui/widgets/multiEdit.js
+++ b/ui/scripts/ui/widgets/multiEdit.js
@@ -79,7 +79,10 @@
                 });
             }
 
-
+            var $actions = undefined;
+            if(options.editOptionsFirst){
+               $actions = 
$('<td>').addClass('multi-actions').appendTo($item.find('tr'));
+            }
             // Setup columns
             $.each(fields, function(fieldName, field) {
                 if (!field || (options.ignoreEmptyFields && !data[fieldName])) 
{
@@ -160,8 +163,9 @@
                 }
 
                 if (!field.isPassword) {
+                       $td.attr('title', data[fieldName]);
                     if (field.edit) {
-                        // Edit fields append value of data
+                       // Edit fields append value of data
                         if (field.range) {
                             var start = _s(data[field.range[0]]);
                             var end = _s(data[field.range[1]]);
@@ -177,7 +181,6 @@
                             } else {
                                 
$td.append($('<span>').html(_s(data[fieldName])));
                             }
-                            $td.attr('title', data[fieldName]);
                         }
                     } else if (field.isBoolean) {
                         var $checkbox = $('<input>');
@@ -324,9 +327,9 @@
                 return true;
             });
 
-            // Actions column
-            var $actions = 
$('<td>').addClass('multi-actions').appendTo($item.find('tr'));
-
+            if(!options.editOptionsFirst){
+               var $actions = 
$('<td>').addClass('multi-actions').appendTo($item.find('tr'));
+            }
             // Align action column width
             $actions.width($multi.find('th.multi-actions').width() + 4);
 
@@ -905,16 +908,20 @@
         var $thead = $('<tr>').appendTo(
             $('<thead>').appendTo($inputTable)
         );
-        var $inputForm = $('<tr>').appendTo(
-            $('<tbody>').appendTo($inputTable)
-        );
+        if (!args.doNotShowInputTable){
+               var $inputForm = $('<tr>').appendTo(
+                   $('<tbody>').appendTo($inputTable)
+               );
+        }
         var $dataBody = $('<div>').addClass('data-body').appendTo($dataTable);
 
         // Setup input table headers
 
         if (reorder) {
             $('<th>').addClass('reorder').appendTo($thead);
-            $('<td>').addClass('reorder').appendTo($inputForm);
+            if (!args.doNotShowInputTable){
+               $('<td>').addClass('reorder').appendTo($inputForm);
+            }
             $multi.find('.data-body').sortable({
                 handle: '.action.moveDrag',
 
@@ -946,6 +953,13 @@
             });
         }
 
+        if (args.editOptionsFirst && args.actions && 
!args.noHeaderActionsColumn) {
+            
$thead.append($('<th></th>').html(_l('label.actions')).addClass('multi-actions'));
+            if (!args.doNotShowInputTable){
+               $inputForm.append($('<td></td>').addClass('multi-actions'));
+            }
+        }
+        
         $.each(args.fields, function(fieldName, field) {
             if (!field) return true;
 
@@ -954,7 +968,10 @@
             $th.appendTo($thead);
             var $td = $('<td>').addClass(fieldName);
             $td.attr('rel', fieldName);
-            $td.appendTo($inputForm);
+            
+            if (!args.doNotShowInputTable){
+               $td.appendTo($inputForm);
+            }
 
             var isHidden = $.isFunction(field.isHidden) ?
                     field.isHidden({ context: context }) : field.isHidden;
@@ -1071,7 +1088,10 @@
                 ).appendTo($td);
             }
 
-            if (field.desc) $input.attr('title', field.desc);
+            if (field.desc){ 
+               $input.attr('title', field.desc);
+               $th.attr('title', _l(field.desc));
+            }
         });
 
         // Setup header fields
@@ -1093,134 +1113,137 @@
                 .prependTo($multi);
         }
 
-        if (args.actions && !args.noHeaderActionsColumn) {
+        if (!args.editOptionsFirst && args.actions && 
!args.noHeaderActionsColumn) {
             
$thead.append($('<th></th>').html(_l('label.actions')).addClass('multi-actions'));
-            $inputForm.append($('<td></td>').addClass('multi-actions'));
-        }
-
-        $addVM.bind('click', function() {
-            // Validate form first
-            if (!$multiForm.valid()) {
-                if ($multiForm.find('input.error:visible').size()) {
-                    return false;
-                }
+            if (!args.doNotShowInputTable){
+               $inputForm.append($('<td></td>').addClass('multi-actions'));
             }
-
-            var $dataList;
-            var addItem = function(itemData) {
-                var data = {};
-
-                $.each(getMultiData($multi), function(key, value) {
-                    if (value != '') {
-                        data[key] = value;
-                    }
-                });
-
-                // Append custom data
-                var $customFields = $multi.find('tbody td').filter(function() {
-                    return $(this).data('multi-custom-data');
-                });
-
-                $customFields.each(function() {
-                    var $field = $(this);
-                    var fieldID = $field.attr('rel');
-                    var fieldData = $field.data('multi-custom-data');
-
-                    data[fieldID] = fieldData;
-                });
-
-                // Loading appearance
-                var $loading = _medit.loadingItem($multi, _l('label.adding') + 
'...');
-                $dataBody.prepend($loading);
-
-                // Clear out fields
-                $multi.find('input').each(function() {
-                    var $input = $(this);
-
-                    if ($input.is(":checkbox")) {
-                        $input.attr({
-                            checked: false
-                        });
-                    } else if ($input.data('multi-default-value')) {
-                        $input.val($input.data('multi-default-value'));
-                    } else {
-                        $input.val('');
-                    }
-                });
-                $multi.find('tbody td').each(function() {
-                    var $item = $(this);
-
-                    if ($item.data('multi-custom-data')) {
-                        $item.data('multi-custom-data', null);
-                    }
-                });
-
-                // Apply action
-                args.add.action({
-                    context: context,
-                    data: data,
-                    itemData: itemData,
-                    $multi: $multi,
-                    response: {
-                        success: function(successArgs) {
-                            var notification = successArgs ? 
successArgs.notification : null;
-                            if (notification) {
-                                $('.notifications').notifications('add', {
-                                    section: 'network',
-                                    desc: notification.label,
-                                    interval: 3000,
-                                    _custom: successArgs._custom,
-                                    poll: function(pollArgs) {
-                                        var complete = pollArgs.complete;
-                                        var error = pollArgs.error;
-
-                                        notification.poll({
-                                            _custom: pollArgs._custom,
-                                            complete: function(completeArgs) {
-                                                complete(args);
-                                                $loading.remove();
-                                                getData();
-                                            },
-
-                                            error: function(args) {
-                                                error(args);
-                                                $loading.remove();
-
-                                                return 
cloudStack.dialog.error(args);
-                                            }
-                                        });
-                                    }
-                                });
-                            } else {
-                                $loading.remove();
-                                getData();
-                            }
-                        },
-
-                        error: cloudStack.dialog.error(function() {
-                            $loading.remove();
-                        })
-                    }
-                });
-            };
-
-            if (args.noSelect) {
-                // Don't append instance data
-                addItem([]);
-
-                return true;
-            }
-
-            _medit.vmList($multi,
-                args.listView,
-                args.context,
-                multipleAdd, _l('label.add.vms'),
-                addItem);
-
-            return true;
-        });
-
+        }
+        if($addVM){
+               $addVM.bind('click', function() {
+                   // Validate form first
+                   if (!$multiForm.valid()) {
+                       if ($multiForm.find('input.error:visible').size()) {
+                           return false;
+                       }
+                   }
+       
+                   var $dataList;
+                   var addItem = function(itemData) {
+                       var data = {};
+       
+                       $.each(getMultiData($multi), function(key, value) {
+                           if (value != '') {
+                               data[key] = value;
+                           }
+                       });
+       
+                       // Append custom data
+                       var $customFields = $multi.find('tbody 
td').filter(function() {
+                           return $(this).data('multi-custom-data');
+                       });
+       
+                       $customFields.each(function() {
+                           var $field = $(this);
+                           var fieldID = $field.attr('rel');
+                           var fieldData = $field.data('multi-custom-data');
+       
+                           data[fieldID] = fieldData;
+                       });
+       
+                       // Loading appearance
+                       var $loading = _medit.loadingItem($multi, 
_l('label.adding') + '...');
+                       $dataBody.prepend($loading);
+       
+                       // Clear out fields
+                       $multi.find('input').each(function() {
+                           var $input = $(this);
+       
+                           if ($input.is(":checkbox")) {
+                               $input.attr({
+                                   checked: false
+                               });
+                           } else if ($input.data('multi-default-value')) {
+                               $input.val($input.data('multi-default-value'));
+                           } else {
+                               $input.val('');
+                           }
+                       });
+                       $multi.find('tbody td').each(function() {
+                           var $item = $(this);
+       
+                           if ($item.data('multi-custom-data')) {
+                               $item.data('multi-custom-data', null);
+                           }
+                       });
+       
+                       // Apply action
+                       args.add.action({
+                           context: context,
+                           data: data,
+                           itemData: itemData,
+                           $multi: $multi,
+                           response: {
+                               success: function(successArgs) {
+                                   var notification = successArgs ? 
successArgs.notification : null;
+                                   if (notification) {
+                                       
$('.notifications').notifications('add', {
+                                           section: 'network',
+                                           desc: notification.label,
+                                           interval: 3000,
+                                           _custom: successArgs._custom,
+                                           poll: function(pollArgs) {
+                                               var complete = 
pollArgs.complete;
+                                               var error = pollArgs.error;
+       
+                                               notification.poll({
+                                                   _custom: pollArgs._custom,
+                                                   complete: 
function(completeArgs) {
+                                                       complete(args);
+                                                       $loading.remove();
+                                                       getData();
+                                                   },
+       
+                                                   error: function(args) {
+                                                       error(args);
+                                                       $loading.remove();
+       
+                                                       return 
cloudStack.dialog.error(args);
+                                                   }
+                                               });
+                                           }
+                                       });
+                                   } else {
+                                       $loading.remove();
+                                       getData();
+                                   }
+                               },
+       
+                               error: cloudStack.dialog.error(function() {
+                                   $loading.remove();
+                               })
+                           }
+                       });
+                   };
+       
+                   if (args.noSelect) {
+                       // Don't append instance data
+                       addItem([]);
+       
+                       return true;
+                   }
+       
+                   _medit.vmList($multi,
+                       args.listView,
+                       args.context,
+                       multipleAdd, _l('label.add.vms'),
+                       addItem);
+       
+                   return true;
+               });
+        }
         var listView = args.listView;
+        var editOptionsFirst = args.editOptionsFirst;
         var getData = function() {
             dataProvider({
                 context: context,
@@ -1247,7 +1270,8 @@
                                     listView: listView,
                                     tags: tags,
                                     reorder: reorder,
-                                    selectPermission: selectPermission
+                                    selectPermission: selectPermission,
+                                    editOptionsFirst: editOptionsFirst
                                 }
                             ).appendTo($dataBody);
                         });
diff --git a/ui/scripts/vpc.js b/ui/scripts/vpc.js
index 14e41af2b23..9dc8323e7cd 100644
--- a/ui/scripts/vpc.js
+++ b/ui/scripts/vpc.js
@@ -190,63 +190,14 @@
         };
     };
 
-    var aclMultiEdit = {
-        noSelect: true,
-
-        reorder: {
-            moveDrag: {
-                action: function(args) {
-                    var rule = args.context.multiRule[0];
-                    var number = 0;
-                    var prevItem = args.prevItem ? args.prevItem.number : null;
-                    var nextItem = args.nextItem ? args.nextItem.number : null;
-
-                    if (!nextItem) { // Last item
-                        number = prevItem + 100;
-                    } else {
-                        if (nextItem - prevItem <= 10) {
-                            number = nextItem - parseInt(((nextItem - 
prevItem) / 2));
-                        } else {
-                            number = nextItem > 1 ? nextItem - 10 : 1;
-                        }
-                    }
-
-                    $.ajax({
-                        url: createURL('updateNetworkACLItem'),
-                        data: {
-                            id: rule.id,
-                            number: number
-                        },
-                        success: function(json) {
-                            var pollTimer = setInterval(function() {
-                                pollAsyncJobResult({
-                                    _custom: {
-                                        jobId: 
json.createnetworkaclresponse.jobid
-                                    },
-                                    complete: function() {
-                                        clearInterval(pollTimer);
-                                        args.response.success();
-                                    },
-                                    error: function(errorMsg) {
-                                        clearInterval(pollTimer);
-                                        args.response.error(errorMsg);
-                                    }
-                                });
-                            }, 1000);
-                        }
-                    });
-                }
-            }
-        },
-        fields: {
-
+    var aclRuleFields = {
             'number': {
-                label: 'label.rule.number',
+                label: 'label.rule.number.short',
+                desc: 'label.rule.number',
                 edit: true,
                 isEditable: true
 
             },
-
             'cidrlist': {
                 edit: true,
                 label: 'label.cidr',
@@ -322,6 +273,13 @@
                                 $portFields.hide();
                             } else if ($(this).val() == 'all') {
                                 $portFields.hide();
+                                $portFields.attr('disabled', 'disabled');
+                                
+                                $icmpFields.hide();
+                                $icmpFields.attr('disabled', 'disabled');
+                                
+                                $protocolFields.attr('disabled', 'disabled');
+                                $protocolFields.hide();
                             } else {
                                 $otherFields.show();
                                 $icmpFields.hide();
@@ -378,8 +336,14 @@
                                 $otherFields.hide();
                                 
$otherFields.parent().find('label.error').hide();
                             } else if ($(this).val() == 'all') {
-                                $portFields.attr('disabled', 'disabled');
                                 $portFields.hide();
+                                $portFields.attr('disabled', 'disabled');
+
+                                $icmpFields.hide();
+                                $icmpFields.attr('disabled', 'disabled');
+
+                                $protocolFields.hide();
+                                $protocolFields.attr('disabled', 'disabled');
                             } else {
                                 $otherFields.show();
                                 
$otherFields.parent().find('label.error').hide();
@@ -420,7 +384,8 @@
             },
 
             'protocolnumber': {
-                label: 'label.protocol.number',
+                label: 'label.protocol.number.short',
+                desc: 'label.protocol.number',
                 edit: true,
                 isEditable: true
             },
@@ -436,6 +401,38 @@
                 isOptional: true,
                 isEditable: true
             },
+            'icmptype': {
+                edit: true,
+                label: 'ICMP.type',
+                desc: 'ICMP.type.desc',
+                defaultValue: '-1',
+                isEditable: true
+            },
+            'icmpcode': {
+                edit: true,
+                label: 'ICMP.code',
+                desc: 'ICMP.code.desc',
+                defaultValue: '-1',
+                isEditable: true
+            },
+            'traffictype': {
+                label: 'label.traffic.type',
+                isEditable: true,
+                select: function(args) {
+                    args.response.success({
+                        data: [{
+                            name: 'Ingress',
+                            description: 'Ingress'
+                        }, {
+                            name: 'Egress',
+                            description: 'Egress'
+                        }]
+                    });
+                }
+            }
+    };
+    
+    var aclRuleFieldsForMultiEdit = {
             'networkid': {
                 label: 'label.select.tier',
                 select: function(args) {
@@ -472,43 +469,60 @@
                     });
                 }
             },
-            'icmptype': {
-                edit: true,
-                label: 'ICMP.type',
-                isDisabled: true,
-                desc: 'Please specify -1 if you want to allow all ICMP types',
-                defaultValue: '-1',
-                isEditable: true
-            },
-            'icmpcode': {
-                edit: true,
-                label: 'ICMP.code',
-                isDisabled: true,
-                desc: 'Please specify -1 if you want to allow all ICMP codes',
-                defaultValue: '-1',
-                isEditable: true
-            },
-            'traffictype': {
-                label: 'label.traffic.type',
-                isEditable: true,
-                select: function(args) {
-                    args.response.success({
-                        data: [{
-                            name: 'Ingress',
-                            description: 'Ingress'
-                        }, {
-                            name: 'Egress',
-                            description: 'Egress'
-                        }]
+    };
+    
+    jQuery.extend(aclRuleFieldsForMultiEdit, aclRuleFields);
+    
+    var aclMultiEdit = {
+       doNotShowInputTable: true,
+       editOptionsFirst: true,
+        noSelect: true,
+        reorder: {
+            moveDrag: {
+                action: function(args) {
+                    var rule = args.context.multiRule[0];
+                    var number = 0;
+                    var prevItem = args.prevItem ? args.prevItem.number : null;
+                    var nextItem = args.nextItem ? args.nextItem.number : null;
+
+                    if (!nextItem) { // Last item
+                        number = prevItem + 100;
+                    } else {
+                        if (nextItem - prevItem <= 10) {
+                            number = nextItem - parseInt(((nextItem - 
prevItem) / 2));
+                        } else {
+                            number = nextItem > 1 ? nextItem - 10 : 1;
+                        }
+                    }
+
+                    $.ajax({
+                        url: createURL('updateNetworkACLItem'),
+                        data: {
+                            id: rule.id,
+                            number: number
+                        },
+                        success: function(json) {
+                            var pollTimer = setInterval(function() {
+                                pollAsyncJobResult({
+                                    _custom: {
+                                        jobId: 
json.createnetworkaclresponse.jobid
+                                    },
+                                    complete: function() {
+                                        clearInterval(pollTimer);
+                                        args.response.success();
+                                    },
+                                    error: function(errorMsg) {
+                                        clearInterval(pollTimer);
+                                        args.response.error(errorMsg);
+                                    }
+                                });
+                            }, 1000);
+                        }
                     });
                 }
-            },
-            'add-rule': {
-                label: 'label.add.rule',
-                addButton: true
             }
         },
-
+        fields: aclRuleFieldsForMultiEdit,
         tags: cloudStack.api.tags({
             resourceType: 'NetworkACL',
             contextId: 'multiRule'
@@ -983,32 +997,6 @@
                                     });
                                 }
                             },
-
-                            /*
-              rules: {
-                title: 'label.rules',
-                multiple: true,
-                fields: [
-                  {
-                    sourceport: { label: 'Source Port' },
-                    instanceport: { label: 'Instance Port' }
-                  }
-                ],
-                dataProvider: function(args) {
-                  $.ajax({
-                    url: createURL('listLoadBalancers'),
-                    data: {
-                      id: args.context.internalLoadBalancers[0].id
-                    },
-                    success: function(json) {
-                      var item = 
json.listloadbalancersresponse.loadbalancer[0];
-                      args.response.success({ data: item.loadbalancerrule });
-                    }
-                  });
-                }
-              },
-              */
-
                             assignedVms: {
                                 title: 'label.assigned.vms',
                                 listView: {
@@ -1333,35 +1321,65 @@
                                             $.ajax({
                                                 url: 
createURL('listNetworkACLs&aclid=' + args.context.aclLists[0].id),
                                                 success: function(json) {
-                                                    var items = 
json.listnetworkaclsresponse.networkacl.sort(function(a, b) {
-                                                        return a.number >= 
b.number;
-                                                    }).map(function(acl) {
-                                                        if 
(parseInt(acl.protocol)) { // protocol number
-                                                            acl.protocolnumber 
= acl.protocol;
-                                                            acl.protocol = 
"protocolnumber";
-                                                        }
-
-                                                        return acl;
-                                                    });
+                                                    var items = 
json.listnetworkaclsresponse.networkacl;
+
+                                                    if(items){
+                                                        items.sort(function(a, 
b) {
+                                                            return a.number >= 
b.number;
+                                                        }).map(function(acl) {
+                                                            if 
(parseInt(acl.protocol)) { // protocol number
+                                                                
acl.protocolnumber = acl.protocol;
+                                                                acl.protocol = 
"protocolnumber";
+                                                            }
+    
+                                                            return acl;
+                                                        });
+                                                    }
 
                                                     args.response.success({
                                                         data: items
-                                                        /* {
-                               cidrlist: '10.1.1.0/24',
-                               protocol: 'TCP',
-                               startport: 22, endport: 22,
-                               networkid: 0,
-                               traffictype: 'Egress'
-                               },
-                               {
-                               cidrlist: '10.2.1.0/24',
-                               protocol: 'UDP',
-                               startport: 56, endport: 72,
-                               networkid: 0,
-                               trafficType: 'Ingress'
-                               }
-                               ]*/
                                                     });
+                                                    
if(jQuery('#details-tab-aclRules').siblings('div.toolbar').children('div.add').size()
 === 0){
+                                                        var 
$addAclRuleDivButton = jQuery('<div>').addClass('button add');
+                                                        var 
$spanAddAclRuleButtonMessage = jQuery('<span>').html(_l('label.add.ACL'));
+                                                        
+                                                        
$addAclRuleDivButton.html($spanAddAclRuleButtonMessage);
+                                                        
$addAclRuleDivButton.click(function(){
+                                                               
cloudStack.dialog.createForm({
+                                                                        form: {
+                                                                     title: 
'label.add.rule',
+                                                                     desc: 
'label.add.rule.desc',
+                                                                     fields: 
aclRuleFields
+                                                                 },
+                                                                 after: 
function(argsLocal) {
+                                                                        var 
data = argsLocal.data;
+                                                                        
data.aclid = argsLocal.context.aclLists[0].id;
+                                                                        
if(data.protocol != 'icmp'){
+                                                                               
 data.icmpcode = undefined;
+                                                                               
 data.icmptype  = undefined;
+                                                                        }
+                                                                        
if(data.protocol != 'protocolnumber'){
+                                                                               
 data.protocolnumber = undefined;
+                                                                        }
+                                                                        
if(data.protocol === 'all'){
+                                                                               
 data.startport = undefined;
+                                                                               
 data.endport = undefined;
+                                                                        }
+                                                                     $.ajax({
+                                                                         url: 
createURL('createNetworkACL'),
+                                                                         data: 
argsLocal.data,
+                                                                         type: 
"POST",
+                                                                         
success: function(json) {
+                                                                               
 jQuery('button.cancel:visible').click();
+                                                                               
 jQuery('div.toolbar:visible div.refresh').click();
+                                                                         }
+                                                                     });
+                                                                 },
+                                                                 context: 
args.context
+                                                               });
+                                                        });
+                                                        
jQuery('#details-tab-aclRules').siblings('div.toolbar').append($addAclRuleDivButton);
+                                                    }
                                                 }
                                             });
                                         }
@@ -4388,7 +4406,6 @@
                                 });
                             })
                         });
-
                         if (error) {
                             cloudStack.dialog.notice({
                                 message: 'Error loading dashboard data.'


 

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

Reply via email to