Return-Path: X-Original-To: apmail-cloudstack-commits-archive@www.apache.org Delivered-To: apmail-cloudstack-commits-archive@www.apache.org Received: from mail.apache.org (hermes.apache.org [140.211.11.3]) by minotaur.apache.org (Postfix) with SMTP id 9404710A79 for ; Wed, 2 Apr 2014 20:55:30 +0000 (UTC) Received: (qmail 12549 invoked by uid 500); 2 Apr 2014 20:55:28 -0000 Delivered-To: apmail-cloudstack-commits-archive@cloudstack.apache.org Received: (qmail 12315 invoked by uid 500); 2 Apr 2014 20:55:24 -0000 Mailing-List: contact commits-help@cloudstack.apache.org; run by ezmlm Precedence: bulk List-Help: List-Unsubscribe: List-Post: List-Id: Reply-To: dev@cloudstack.apache.org Delivered-To: mailing list commits@cloudstack.apache.org Received: (qmail 12281 invoked by uid 99); 2 Apr 2014 20:55:22 -0000 Received: from tyr.zones.apache.org (HELO tyr.zones.apache.org) (140.211.11.114) by apache.org (qpsmtpd/0.29) with ESMTP; Wed, 02 Apr 2014 20:55:22 +0000 Received: by tyr.zones.apache.org (Postfix, from userid 65534) id 7B08B926487; Wed, 2 Apr 2014 20:55:22 +0000 (UTC) Content-Type: text/plain; charset="us-ascii" MIME-Version: 1.0 Content-Transfer-Encoding: 7bit From: bfederle@apache.org To: commits@cloudstack.apache.org Date: Wed, 02 Apr 2014 20:55:22 -0000 Message-Id: X-Mailer: ASF-Git Admin Mailer Subject: [1/2] git commit: updated refs/heads/wip-multi-disk-select to f23dd1d Repository: cloudstack Updated Branches: refs/heads/wip-multi-disk-select [created] f23dd1df9 WIP Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/1120b38e Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/1120b38e Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/1120b38e Branch: refs/heads/wip-multi-disk-select Commit: 1120b38e6a8b332522447baddcb7727b186acf94 Parents: 1586f41 Author: Brian Federle Authored: Wed Apr 2 12:31:31 2014 -0700 Committer: Brian Federle Committed: Wed Apr 2 12:43:05 2014 -0700 ---------------------------------------------------------------------- ui/css/cloudstack3.css | 97 ++++++++++++++++++++++-- ui/scripts/instanceWizard.js | 8 +- ui/scripts/ui-custom/instanceWizard.js | 112 +++++++++++++++++++++------- 3 files changed, 184 insertions(+), 33 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/1120b38e/ui/css/cloudstack3.css ---------------------------------------------------------------------- diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css index bcb82d3..0743bb1 100644 --- a/ui/css/cloudstack3.css +++ b/ui/css/cloudstack3.css @@ -1835,6 +1835,7 @@ div.list-view td.state.off span { float: left; width: 245px; } + .detail-group .main-groups table td.value > span.copypasteenabledvalue { text-overflow: ellipsis; -o-text-overflow: ellipsis; @@ -1849,7 +1850,7 @@ div.list-view td.state.off span { } div.copypasteicon { - background: url("../images/sprites.png") no-repeat scroll -271px -65px; + background: url("../images/sprites.png") no-repeat -271px -65px; float: left; height: 21px; margin-left: 6px; @@ -1858,7 +1859,7 @@ div.copypasteicon { } div.copypasteicon:hover { - background: url("../images/sprites.png") no-repeat scroll -271px -646px; + background: url("../images/sprites.png") no-repeat -271px -646px; } .detail-group .main-groups table td.value > span.copypasteenabledvalue { @@ -1875,7 +1876,7 @@ div.copypasteicon:hover { } div.copypasteicon { - background: url("../images/sprites.png") no-repeat scroll -271px -65px; + background: url("../images/sprites.png") no-repeat -271px -65px; float: left; height: 21px; margin-left: 6px; @@ -1884,10 +1885,9 @@ div.copypasteicon { } div.copypasteicon:hover { - background: url("../images/sprites.png") no-repeat scroll -271px -646px; + background: url("../images/sprites.png") no-repeat -271px -646px; } - .detail-group .main-groups table td.value > span select { width: 100% !important; } @@ -6050,6 +6050,90 @@ label.error { border-radius: 6px 6px 6px 6px; } +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group { + float: left; + margin-top: 12px; + width: 100%; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-header { + border-bottom: 1px solid #D4D4D4; + /*+border-radius:4px;*/ + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + -khtml-border-radius: 4px; + border-radius: 4px; + background: #C2C2C2 0px 4px; + padding: 6px; + height: 17px; +} + +.multi-wizard.instance-wizard .disk-select-group.selected .disk-select-header { + background: #505050; + /*+border-radius:4px 4px 0 0;*/ + -moz-border-radius: 4px 4px 0 0; + -webkit-border-radius: 4px 4px 0 0; + -khtml-border-radius: 4px 4px 0 0; + border-radius: 4px 4px 0 0; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-header input { + float: left; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-header .title { + float: left; + font-size: 14px; + padding: 2px; +} + +.multi-wizard.instance-wizard .disk-select-group.selected .disk-select-header .title { + color: #FFFFFF; + /*+text-shadow:0px -1px #000000;*/ + -moz-text-shadow: 0px -1px #000000; + -webkit-text-shadow: 0px -1px #000000; + -o-text-shadow: 0px -1px #000000; + text-shadow: 0px -1px #000000; +} + +.multi-wizard.instance-wizard .data-disk-offering .multi-disk-select-container { + max-height: 257px; + overflow: auto; + border: 1px solid #DDDBDB; + padding: 13px; + background: #E4E4E4; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group .select-container { + max-height: 114px; + float: left; + margin: 0; + border: none; + /*+border-radius:0;*/ + -moz-border-radius: 0; + -webkit-border-radius: 0; + -khtml-border-radius: 0; + border-radius: 0; + display: none; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group.selected .select-container { + display: block; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group .select { + padding: 0 0 17px; + height: 0; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group .select input { + margin: 13px 12px 12px; +} + +.multi-wizard.instance-wizard .data-disk-offering .disk-select-group .select-desc { + margin: 13px 0 0; +} + .multi-wizard.instance-wizard .data-disk-offering.required .select-container { height: 344px; position: relative; @@ -12491,7 +12575,8 @@ div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-it background-position: -168px -31px; } -.reset .icon, .reinstall .icon { +.reset .icon, +.reinstall .icon { background-position: -168px -31px; } http://git-wip-us.apache.org/repos/asf/cloudstack/blob/1120b38e/ui/scripts/instanceWizard.js ---------------------------------------------------------------------- diff --git a/ui/scripts/instanceWizard.js b/ui/scripts/instanceWizard.js index c2d3030..1b93364 100644 --- a/ui/scripts/instanceWizard.js +++ b/ui/scripts/instanceWizard.js @@ -335,7 +335,13 @@ customIopsDoFlag: 'iscustomizediops', data: { diskOfferings: diskOfferingObjs - } + }, + multiDisk: args.currentData.serviceofferingid === "919ac1bb-be43-4811-8c73-b1c038aac5be" ? + [ + { id: 1, label: 'vm-disk-1' }, + { id: 2, label: 'vm-disk-2' }, + { id: 3, label: 'vm-disk-3' } + ] : null }); } }); http://git-wip-us.apache.org/repos/asf/cloudstack/blob/1120b38e/ui/scripts/ui-custom/instanceWizard.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui-custom/instanceWizard.js b/ui/scripts/ui-custom/instanceWizard.js index 1a0c323..1d325e4 100644 --- a/ui/scripts/ui-custom/instanceWizard.js +++ b/ui/scripts/ui-custom/instanceWizard.js @@ -491,7 +491,11 @@ return { response: { success: function(args) { + var multiDisk = args.multiDisk; + + $step.find('.multi-disk-select-container').remove(); $step.removeClass('custom-disk-size'); + if (args.required) { $step.find('.section.no-thanks').hide(); $step.addClass('required'); @@ -500,15 +504,62 @@ $step.removeClass('required'); } - $step.find('.content .select-container').append( - makeSelects('diskofferingid', args.data.diskOfferings, { - id: 'id', - name: 'name', - desc: 'displaytext' - }, { - 'wizard-field': 'disk-offering' - }) - ); + var $selectContainer = $step.find('.content .select-container:not(.multi-disk)'); + + if (multiDisk) { + var $multiDiskSelect = $('
').addClass('multi-disk-select-container'); + + $(multiDisk).map(function(index, disk) { + var $group = $('
').addClass('disk-select-group'); + var $header = $('
').addClass('disk-select-header').append( + $('
').addClass('title').html(disk.label) + ).appendTo($group); + var $checkbox = $('').addClass('multi-disk-select') + .attr({ + type: 'checkbox', + 'disk-id': disk.id + }) + .prependTo($header); + var $multiSelectContainer = $selectContainer.clone().append( + makeSelects('diskofferingid.' + disk.id, args.data.diskOfferings, { + id: 'id', + name: 'name', + desc: 'displaytext' + }, { + 'wizard-field': 'disk-offering' + }) + ).appendTo($group).addClass('multi-disk'); + + $group.appendTo($multiDiskSelect); + + $checkbox.click(function() { + $group.toggleClass('selected'); + $group.find('.select:first input[type=radio]').click(); + + if (!$multiDiskSelect.find('input[type=checkbox]:checked').size()) { + $step.find('.no-thanks input[type=radio]').click(); + } else { + $step.find('.no-thanks input[type=radio]').attr('checked', false); + } + }); + }); + $multiDiskSelect.insertAfter($selectContainer); + $selectContainer.hide(); + + // Fix issue with containers always showing after reload + $multiDiskSelect.find('.select-container').attr('style', null); + } else { + $selectContainer.show(); + $step.find('.content .select-container').append( + makeSelects('diskofferingid', args.data.diskOfferings, { + id: 'id', + name: 'name', + desc: 'displaytext' + }, { + 'wizard-field': 'disk-offering' + }) + ); + } $step.find('input[type=radio]').bind('change', function() { var $target = $(this); @@ -517,8 +568,17 @@ return elem.id == val; })[0]; + // Uncheck any multi-select groups + if ($target.closest('.no-thanks').size() && + $step.find('.multi-disk-select').size()) { + $step.find('.disk-select-group input[type=checkbox]:checked').click(); + $(this).attr('checked', true); + + return true; + } + if (!item) { - // handle removal of custom size controls + // handle removal of custom size controls $step.find('.section.custom-size').hide(); $step.removeClass('custom-disk-size'); @@ -534,26 +594,26 @@ if (custom) { $target.parent().find('.name') + .append( + $('').addClass('custom-size-label') + .append(': ') .append( - $('').addClass('custom-size-label') - .append(': ') - .append( - $('').addClass('custom-disk-size').html( - $step.find('.custom-size input[name=size]').val() - ) - ) - .append(' GB') + $('').addClass('custom-disk-size').html( + $step.find('.custom-size input[name=size]').val() + ) + ) + .append(' GB') ); $target.parent().find('.select-desc .desc') + .append( + $('').addClass('custom-size-label') + .append(', ') .append( - $('').addClass('custom-size-label') - .append(', ') - .append( - $('').addClass('custom-disk-size').html( - $step.find('.custom-size input[name=size]').val() - ) - ) - .append(' GB') + $('').addClass('custom-disk-size').html( + $step.find('.custom-size input[name=size]').val() + ) + ) + .append(' GB') ); $step.find('.section.custom-size').show(); $step.addClass('custom-disk-size');