From 8bd204f77123ef390b7d260513ff03c22fe5b226 Mon Sep 17 00:00:00 2001
From: Brian Federle <brian.federle@citrix.com>
Date: Fri, 21 Jun 2013 14:33:26 -0700
Subject: [PATCH] UI form dialog: Support left-right field columns

For larger forms, if 'bigSize' is specified in form options, dialog
will widen to a 2-column layout. This is to prevent the form fields
from going off the bottom of the screen.
---
 ui/css/cloudstack3.css  | 4 ++++
 ui/scripts/ui/dialog.js | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index 7113dbcb557..a89e0c3cdfa 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -3804,6 +3804,10 @@ Dialogs*/
   margin: 0 0 12px;
 }
 
+.ui-dialog.big div.form-container div.form-item {
+  width: 45%;
+}
+
 .ui-dialog div.form-container div.name {
   float: left;
   clear: both;
diff --git a/ui/scripts/ui/dialog.js b/ui/scripts/ui/dialog.js
index 71d229a4e2a..6f05af2dd3e 100644
--- a/ui/scripts/ui/dialog.js
+++ b/ui/scripts/ui/dialog.js
@@ -62,10 +62,10 @@
         $('.overlay').remove();
         
         return $formContainer.dialog({
-          dialogClass: 'create-form',
+          dialogClass: args.form.bigSize ? 'create-form big' : 'create-form',
           closeOnEscape: false,
           draggable: false,
-          width: 400,
+          width: args.form.bigSize ? 800 : 400,
           title: _l(args.form.title),
           open: function() {
             if (args.form.preFilter) {