Add pod UI: Add multi-edit form
Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/edc09bc3 Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/edc09bc3 Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/edc09bc3 Branch: refs/heads/ui-multiple-pod-ranges Commit: edc09bc36240499029ab50b0f70c344af8a41fb5 Parents: 8eb3ebb Author: Brian Federle <[email protected]> Authored: Mon Mar 25 10:51:30 2013 -0700 Committer: Brian Federle <[email protected]> Committed: Mon Mar 25 10:51:30 2013 -0700 ---------------------------------------------------------------------- ui/css/cloudstack3.css | 36 ++++++++++++++++++ ui/index.jsp | 8 ++--- ui/scripts/ui-custom/podEdit.js | 66 ++++++++++++++++++++++++++++++++++ ui/scripts/zoneWizard.js | 25 +++++++++++++ 4 files changed, 130 insertions(+), 5 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/edc09bc3/ui/css/cloudstack3.css ---------------------------------------------------------------------- diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css index 9b77b9f..8ae54ed 100644 --- a/ui/css/cloudstack3.css +++ b/ui/css/cloudstack3.css @@ -7022,6 +7022,42 @@ label.error { max-width: 91px; } +/*** Add multiple pod ranges form*/ +.multi-wizard.zone-wizard .add-pod .info-desc { + margin-bottom: 26px; +} + +.multi-wizard.zone-wizard .pod-edit { +} + +.multi-wizard.zone-wizard .pod-edit span.message { + display: none; + text-decoration: underline; +} + +.multi-wizard.zone-wizard .pod-edit .form-container { + height: 36px; +} + +.multi-wizard.zone-wizard .pod-edit .form-container form { +} + +.multi-wizard.zone-wizard .pod-edit .form-container form { +} + +.multi-wizard.zone-wizard .pod-edit .form-container .form-item .name label { + width: 51px; +} + +.multi-wizard.zone-wizard .pod-edit .form-container .form-item .name { + width: 58px; +} + +.multi-wizard.zone-wizard .pod-edit .multi-edit .data-body { + height: 209px; + overflow: auto; +} + /*** Select container fields*/ .multi-wizard.zone-wizard .select-container .field { width: 100%; http://git-wip-us.apache.org/repos/asf/cloudstack/blob/edc09bc3/ui/index.jsp ---------------------------------------------------------------------- diff --git a/ui/index.jsp b/ui/index.jsp index 3b8f378..3145244 100644 --- a/ui/index.jsp +++ b/ui/index.jsp @@ -659,8 +659,7 @@ under the License. <div ui-custom="publicTrafficIPRange"></div> </div> <!-- Step 3.3: Add pod --> - <div class="add-pod" zone-wizard-form="pod" - zone-wizard-step-id="addPod"> + <div class="add-pod" zone-wizard-step-id="addPod"> <ul class="subnav"> <li class="conditional netscaler physical-network"><fmt:message key="label.netScaler"/></li> <li class="public-network"><fmt:message key="label.public.traffic"/></li> @@ -671,9 +670,7 @@ under the License. <div class="info-desc"> <fmt:message key="message.add.pod.during.zone.creation"/> </div> - <div class="content input-area"> - <div class="select-container"></div> - </div> + <div ui-custom="podIPRange"></div> </div> <!-- Step 3.4: Configure guest traffic --> <div class="setup-guest-traffic" @@ -1659,6 +1656,7 @@ under the License. <script type="text/javascript" src="scripts/events.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/regions.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/regions.js?t=<%=now%>"></script> + <script type="text/javascript" src="scripts/ui-custom/podEdit.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/ipRules.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/enableStaticNAT.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/securityRules.js?t=<%=now%>"></script> http://git-wip-us.apache.org/repos/asf/cloudstack/blob/edc09bc3/ui/scripts/ui-custom/podEdit.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui-custom/podEdit.js b/ui/scripts/ui-custom/podEdit.js new file mode 100644 index 0000000..d33cd97 --- /dev/null +++ b/ui/scripts/ui-custom/podEdit.js @@ -0,0 +1,66 @@ +// Licensed to the Apache Software Foundation (ASF) under one +// or more contributor license agreements. See the NOTICE file +// distributed with this work for additional information +// regarding copyright ownership. The ASF licenses this file +// to you under the Apache License, Version 2.0 (the +// "License"); you may not use this file except in compliance +// with the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, +// software distributed under the License is distributed on an +// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +// KIND, either express or implied. See the License for the +// specific language governing permissions and limitations +// under the License. +(function(cloudStack, $) { + cloudStack.uiCustom.podEdit = function(args) { + var $podEdit = $('<div></div>').addClass('pod-edit'); + var multiEditData = []; + var totalIndex = 0; + var form = cloudStack.dialog.createForm({ + noDialog: true, + desc: '', + form: { + desc: '', + fields: args.form.fields + } + }); + var $multi = $('<div></div>').multiEdit($.extend(true, {}, args.multiEdit, { + context: args.context, + noSelect: true, + add: { + label: 'label.add', + action: function(args) { + multiEditData.push($.extend(args.data, { + index: totalIndex + })); + + totalIndex++; + args.response.success(); + } + }, + actions: { + destroy: { + label: 'label.remove.rule', + action: function(args) { + multiEditData = $.grep(multiEditData, function(item) { + return item.index != args.context.multiRule[0].index; + }); + args.response.success(); + } + } + }, + dataProvider: function(args) { + args.response.success({ + data: multiEditData + }); + } + })); + + $podEdit.append(form.$formContainer, $multi); + + return $podEdit; + }; +}(window.cloudStack, window.jQuery)); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/cloudstack/blob/edc09bc3/ui/scripts/zoneWizard.js ---------------------------------------------------------------------- diff --git a/ui/scripts/zoneWizard.js b/ui/scripts/zoneWizard.js index 5108c5c..79f0643 100755 --- a/ui/scripts/zoneWizard.js +++ b/ui/scripts/zoneWizard.js @@ -121,6 +121,31 @@ }, customUI: { + podIPRange: function(args) { + return cloudStack.uiCustom.podEdit({ + form: { + fields: { + name: { + label: 'label.name', + validation: { required: true }, + desc: 'message.tooltip.pod.name' + } + } + }, + multiEdit: { + noSelect: true, + fields: { + 'gateway': { edit: true, label: 'label.gateway' }, + 'netmask': { edit: true, label: 'label.netmask' }, + 'vlanid': { edit: true, label: 'label.vlan', isOptional: true }, + 'startip': { edit: true, label: 'label.start.IP' }, + 'endip': { edit: true, label: 'label.end.IP' }, + 'add-rule': { label: 'label.add', addButton: true } + } + } + }); + }, + publicTrafficIPRange: function(args) { var multiEditData = []; var totalIndex = 0;
