[PATCH] [Kimchi] [RFC] Max memory front-end

2 Feb 2016

From: Samuel Guimarães <sguimaraes943@gmail.com>

This patch adds a hidden "Max Memory" numbered input in Edit Guests. It also changes memory "text" input in Edit Templates to "number" to match Edit Guests ui.
Validation (form submission) wasn't added as the selected guest json doesn't have a "max memory" key.

Signed-off-by: Samuel Guimarães <sguimaraes943@gmail.com>
---
 ui/css/kimchi.css                    | 27 ++++++++++++++++++++-------
 ui/css/src/modules/_edit-guests.scss | 14 +++++++++++++-
 ui/js/src/kimchi.guest_edit_main.js  |  9 ++++++++-
 ui/pages/guest-edit.html.tmpl        |  9 ++++++++-
 ui/pages/i18n.json.tmpl              |  2 ++
 ui/pages/template-edit.html.tmpl     |  2 +-
 6 files changed, 52 insertions(+), 11 deletions(-)

diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
index 88ae7de..d032c4c 100644
--- a/ui/css/kimchi.css
+++ b/ui/css/kimchi.css
@@ -78,7 +78,7 @@
 #guest-add-window.modal-content label.box-iso-outer span.box-iso-border {
   display: block;
   border: 3px solid transparent;
-  transition: all .1s ease-in-out;
+  transition: all 0.1s ease-in-out;
 }
 
 #template-add-window.modal-content label.box-iso-outer .iso-radio-hidden:checked + span.box-iso-border,
@@ -100,7 +100,7 @@
   display: block;
   border: 1px solid transparent;
   background: #fff;
-  transition: all .1s ease-in-out;
+  transition: all 0.1s ease-in-out;
 }
 
 #template-add-window.modal-content ul.list-template,
@@ -666,10 +666,20 @@
   position: relative;
 }
 
-#guest-edit-window #form-guest-edit-general #guest-edit-memory-textbox {
+#guest-edit-window #form-guest-edit-general #guest-max-memory-panel {
+  display: none;
+}
+
+#guest-edit-window #form-guest-edit-general #guest-edit-memory-textbox,
+#guest-edit-window #form-guest-edit-general #guest-edit-max-memory-textbox {
   width: 590px;
 }
 
+#guest-edit-window #form-guest-edit-general #guest-edit-memory-textbox,
+#guest-edit-window #form-guest-edit-general #guest-show-max-memory {
+  display: inline-block;
+}
+
 #guest-edit-window #form-guest-edit-interface .column-actions {
   width: 23%;
 }
@@ -1007,7 +1017,7 @@
   border: 1px solid #eee !important;
   margin-bottom: 3px;
   display: block;
-  padding: .2em .6em .3em;
+  padding: 0.2em 0.6em 0.3em;
   font-weight: 700;
   line-height: 1;
   text-align: left;
@@ -1250,7 +1260,7 @@
   height: 664px;
   width: 2164px;
   left: 0;
-  transition: left .2s ease-in-out;
+  transition: left 0.2s ease-in-out;
 }
 
 #template-add-window.modal-content p {
@@ -1526,7 +1536,9 @@
   padding-right: 35px !important;
 }
 
-#templates-root-container .wok-vm-gallery .item-hidden.column-type, #templates-root-container .wok-vm-gallery .item-hidden.column-version, #templates-root-container .wok-vm-gallery .item-hidden.column-processors {
+#templates-root-container .wok-vm-gallery .item-hidden.column-type,
+#templates-root-container .wok-vm-gallery .item-hidden.column-version,
+#templates-root-container .wok-vm-gallery .item-hidden.column-processors {
   padding-bottom: 11px;
 }
 
@@ -2067,7 +2079,8 @@
   white-space: nowrap;
 }
 
-.storage-modal .filter-select.popable .popover ul li:hover, .storage-modal .filter-select.popable .popover ul li:focus,
+.storage-modal .filter-select.popable .popover ul li:hover,
+.storage-modal .filter-select.popable .popover ul li:focus,
 .storage-modal .storage-target-input .popover ul li:hover,
 .storage-modal .storage-target-input .popover ul li:focus,
 .storage-modal .storage-add-input .popover ul li:hover,
diff --git a/ui/css/src/modules/_edit-guests.scss b/ui/css/src/modules/_edit-guests.scss
index 4d642f3..057aad9 100644
--- a/ui/css/src/modules/_edit-guests.scss
+++ b/ui/css/src/modules/_edit-guests.scss
@@ -25,9 +25,21 @@
         position: relative;
     }
     #form-guest-edit-general {
-        #guest-edit-memory-textbox {
+
+        #guest-max-memory-panel {
+            display: none;
+        }
+
+        #guest-edit-memory-textbox,
+        #guest-edit-max-memory-textbox {
             width: 590px;
         }
+
+        #guest-edit-memory-textbox,
+        #guest-show-max-memory {
+            display: inline-block;
+        }
+
     }
     #form-guest-edit-interface {
         .column-actions {
diff --git a/ui/js/src/kimchi.guest_edit_main.js b/ui/js/src/kimchi.guest_edit_main.js
index 136469b..aa09b65 100644
--- a/ui/js/src/kimchi.guest_edit_main.js
+++ b/ui/js/src/kimchi.guest_edit_main.js
@@ -669,9 +669,16 @@ kimchi.guest_edit_main = function() {
             wok.window.open('plugins/kimchi/guest-storage-add.html', 'extendCreateStorage');
         });
         if ((kimchi.thisVMState === "running") || (kimchi.thisVMState === "paused")) {
-            $("#form-guest-edit-general input").not("#guest-edit-memory-textbox").prop("disabled", true);
+            $("#form-guest-edit-general input").not("#guest-edit-memory-textbox, #guest-edit-max-memory-textbox").prop("disabled", true);
         }
 
+        $('#guest-show-max-memory').on('click', function(e) {
+            e.preventDefault;
+            $('#guest-max-memory-panel').slideToggle();
+            var text = $('#guest-show-max-memory span.text').text();
+            $('#guest-show-max-memory span.text').text(text == i18n['KCHVMED6008M'] ? i18n['KCHVMED6009M'] : i18n['KCHVMED6008M']);
+        });
+
         var onAttached = function(params) {
             refreshCDROMs();
         };
diff --git a/ui/pages/guest-edit.html.tmpl b/ui/pages/guest-edit.html.tmpl
index 0ad635c..b3e5817 100644
--- a/ui/pages/guest-edit.html.tmpl
+++ b/ui/pages/guest-edit.html.tmpl
@@ -50,7 +50,14 @@
                 </div>
                 <div class="form-group">
                     <label for="guest-edit-memory-textbox">$_("Memory (MB)")</label>
-                    <input id="guest-edit-memory-textbox" class="form-control" name="memory" type="number" min="1024" step="1024" />
+                    <div id="guest-memory">
+                        <input id="guest-edit-memory-textbox" class="form-control" name="memory" type="number" min="1024" step="1024" />
+                        <button id="guest-show-max-memory" class="btn btn-primary" type="button"><i class="fa fa-plus-circle"></i> <span class="text">$_("More")</span></button>
+                    </div>
+                </div>
+                <div id="guest-max-memory-panel" class="form-group">
+                    <label for="guest-edit-max-memory-textbox">$_("Max Memory (MB)")</label>
+                    <input id="guest-edit-max-memory-textbox" class="form-control" name="max-memory" type="number" min="1024" step="1024" />
                 </div>
                 <div class="form-group">
                     <label for="guest-edit-icon-textbox">$_("Icon")</label>
diff --git a/ui/pages/i18n.json.tmpl b/ui/pages/i18n.json.tmpl
index 8bc8683..c06b9be 100644
--- a/ui/pages/i18n.json.tmpl
+++ b/ui/pages/i18n.json.tmpl
@@ -78,6 +78,8 @@
     "KCHVMED6005M": "$_("drive_type:")",
     "KCHVMED6006M": "$_("model:")",
     "KCHVMED6007M": "$_("Affected devices:")",
+    "KCHVMED6008M": "$_("More")",
+    "KCHVMED6009M": "$_("Less")",
 
     "KCHNET6001E": "$_("The VLAN id must be between 1 and 4094.")",
 
diff --git a/ui/pages/template-edit.html.tmpl b/ui/pages/template-edit.html.tmpl
index 478ccd5..47d4175 100644
--- a/ui/pages/template-edit.html.tmpl
+++ b/ui/pages/template-edit.html.tmpl
@@ -82,7 +82,7 @@
                                         <input id="template-edit-version-textbox" class="form-control"  name="os_version" type="text" disabled="disabled" />
                                     </div>
                                     <div class="template-edit-wrapper-controls">
-                                        <input id="template-edit-memory-textbox" class="form-control"  name="memory" type="text" />
+                                        <input id="template-edit-memory-textbox" class="form-control"  name="memory" type="number" step="1" min="1" />
                                     </div>
                                     <div class="template-edit-wrapper-controls templ-edit-cdrom">
                                         <input id="template-edit-cdrom-textbox" class="form-control" name="cdrom" type="text" disabled="disabled" />
-- 
1.9.3

    

sguimaraes943＠gmail.com

Rodrigo Trujillo

Aline Manera

Samuel Henrique De Oliveira Guimaraes

Rodrigo Trujillo

Aline Manera

tags

participants (4)