<html>
  <head>
    <meta content="text/html; charset=windows-1252"
      http-equiv="Content-Type">
  </head>
  <body text="#000000" bgcolor="#FFFFFF">
    <br>
    <br>
    <div class="moz-cite-prefix">On 02/05/2016 09:03 AM, Paulo Ricardo
      Paz Vital wrote:<br>
    </div>
    <blockquote cite="mid:56B48166.8090800@linux.vnet.ibm.com"
      type="cite">
      <pre wrap="">Looks good! I tested the patch and could create a new volume and attach
it to the VM I was editing.

Just only one suggestion. Add the extension iso in the end of the
filename of the volume when creating. The volume I added to my VM
'ubuntu15.10-vm-1' was created with this info:

$ sudo qemu-img info /var/lib/libvirt/images/ubuntu15.10-vm-11454669512074
image: /var/lib/libvirt/images/ubuntu15.10-vm-11454669512074
file format: qcow2
virtual size: 10K (10240 bytes)
disk size: 196K
cluster_size: 65536
Format specific information:
    compat: 0.10
    refcount bits: 16

Would be nice, that the file has the name
ubuntu15.10-vm-11454669512074.iso
</pre>
    </blockquote>
    <br>
    The extension '.iso' is for ISO files. In this case, we should use
    the extension given by the selected format, ie, in your case
    ubuntu15.10-vm-11454669512074<b>.qcow2<br>
      <br>
    </b>Socorro, following Paulo's suggestion, please, append the
    ".&lt;format&gt;" to the end of the file name.<br>
    <b><br>
    </b>
    <blockquote cite="mid:56B48166.8090800@linux.vnet.ibm.com"
      type="cite">
      <pre wrap="">
On 02/05/2016 12:41 AM, Socorro Stoppler wrote:
</pre>
      <blockquote type="cite">
        <pre wrap="">This is the initial checkin for creating a new volume and attaching to VM when editing a guest.
Not sure of all the supported cases, but certainly tried default pool and qcow2 format per the
example provided and it was successful.

Known issue - which currently exists in the code already in master - code is broken when VM 
is running.  This patch does not address that.  It will get addressed separately.


Signed-off-by: Socorro Stoppler <a class="moz-txt-link-rfc2396E" href="mailto:socorro@linux.vnet.ibm.com">&lt;socorro@linux.vnet.ibm.com&gt;</a>
---
 ui/js/src/kimchi.guest_storage_add.main.js | 320 ++++++++++++++++++++++++-----
 ui/pages/guest-storage-add.html.tmpl       |  58 ++++--
 2 files changed, 315 insertions(+), 63 deletions(-)

diff --git a/ui/js/src/kimchi.guest_storage_add.main.js b/ui/js/src/kimchi.guest_storage_add.main.js
index 6e1926b..9c3f6e4 100644
--- a/ui/js/src/kimchi.guest_storage_add.main.js
+++ b/ui/js/src/kimchi.guest_storage_add.main.js
@@ -15,6 +15,37 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+kimchi.switchPage = function(fromPageId, toPageId, direction) {
+    $('.tab-content').css('overflow', 'hidden');
+    direction = direction || 'left';
+    var toLeftBegin;
+    var fromLeftEnd;
+    if ('left' === direction) {
+        toLeftBegin = '100%';
+        fromLeftEnd = '-100%';
+    } else if ('right' === direction) {
+        toLeftBegin = '-100%';
+        fromLeftEnd = '100%';
+    }
+    var formPage = $('#' + fromPageId);
+    var toPage = $('#' + toPageId);
+    toPage.css({
+        left: toLeftBegin
+    });
+    formPage.animate({
+        left: fromLeftEnd,
+        opacity: 0.1
+    }, 400, function() {
+        $('.tab-content').css('overflow', 'visible');
+    });
+    toPage.animate({
+        left: '0',
+        opacity: 1
+    }, 400, function() {
+        $('.tab-content').css('overflow', 'visible');
+    });
+};
+
 kimchi.guest_storage_add_main = function() {
     var types = [{
         label: 'cdrom',
@@ -35,9 +66,27 @@ kimchi.guest_storage_add_main = function() {
     var pathTextbox = $('input[name="path"]', storageAddForm);
     var poolTextbox = $('select#guest-disk-pool', storageAddForm);
     var volTextbox = $('select#guest-disk-vol', storageAddForm);
+    var newPoolTextbox = $('select#guest-disk-pool-new', storageAddForm);
+    var capacityTextbox = $('input[name="capacity"]', storageAddForm);
+    var formatTextbox = $('select#guest-disk-format-new', storageAddForm);
     var selectStorageTypeHTML = '';
     var selectStoragePoolHTML = '';
     var selectStorageVolHTML  = '';
+    var rbExisting = 'false';
+
+    var getFormatList = function() {
+        var format = ["bochs", "cloop", "cow", "dmg", "qcow", "qcow2", "qed", "raw", "vmdk", "vpc"];
+        var selectFormatHTML = '';
+        var i;
+        for (i = 0; i &lt; format.length; i++) {
+            selectFormatHTML += '&lt;option value="'+ format[i] + '"&gt;' + format[i] + '&lt;/option&gt;';
+        }
+        formatTextbox.empty();
+        formatTextbox.append(selectFormatHTML);
+        $(formatTextbox).change();
+        formatTextbox.selectpicker();
+        $('.selectpicker').selectpicker('refresh');
+    };

     typeTextbox.change(function() {
         var pathObject = {'cdrom': ".path-section", 'disk': '.volume-section'};
@@ -45,41 +94,82 @@ kimchi.guest_storage_add_main = function() {
         $.each(pathObject, function(type, value) {
             if(selectType === type){
                 $(value).removeClass('hidden');
+            } else if ((selectType === null) &amp;&amp; (type === 'disk')) {
+                $(value).removeClass('hidden');
             } else {
                 $(value).addClass('hidden');
             }
         });
-
         if ($(".path-section").hasClass('hidden')) {
-            $(poolTextbox).val('default');
-            $(poolTextbox).change();
             $(pathTextbox).val("");
-        }
-        else {
+            if ($('#new-disk').checked) {
+                $('#existing-disk-box').addClass('hidden');
+                $(newPoolTextbox).val('default');
+                $(newPoolTextbox).change();
+            } else if ($('#existing-disk').checked) {
+                $('#new-disk-box').addClass('hidden');
+                $(poolTextbox).val('default');
+                $(poolTextbox).change();
+            } else {
+                if (rbExisting === 'true') {
+                    $('#new-disk-box').addClass('hidden');
+                } else {
+                    $('#existing-disk-box').addClass('hidden');
+                }
+            }
+        } else {
             $(poolTextbox).val("");
             $(volTextbox).val("");
+            $(newPoolTextbox).val("");
+            $(capacityTextbox).val("");
+            $(formatTextbox).val("");
         }
         $('.selectpicker').selectpicker('refresh');
     });

-    kimchi.listStoragePools(function(result) {
-        var options = [];
-        if (result &amp;&amp; result.length) {
-            $.each(result, function(index, storagePool) {
-                if ((storagePool.state==="active") &amp;&amp; (storagePool.type !== 'kimchi-iso')) {
-                    options.push({
-                        label: storagePool.name,
-                        value: storagePool.name
-                        });
-                    selectStoragePoolHTML += '&lt;option value="'+ storagePool.name + '"&gt;' + storagePool.name + '&lt;/option&gt;';
+    var getStoragePools = function(radioButton) {
+        kimchi.listStoragePools(function(result) {
+            var options = [];
+            selectStoragePoolHTML = ''; //reset string
+            if (result &amp;&amp; result.length) {
+                $.each(result, function(index, storagePool) {
+                    if (radioButton === 'existing') {
+                        if ((storagePool.state==="active") &amp;&amp; (storagePool.type !== 'kimchi-iso')) {
+                            options.push({
+                                label: storagePool.name,
+                                value: storagePool.name
+                                });
+                            selectStoragePoolHTML += '&lt;option value="'+ storagePool.name + '"&gt;' + storagePool.name + '&lt;/option&gt;';
+                        }
+                    } else { //new disk
+                        if ((storagePool.type != 'iscsi') &amp;&amp; (storagePool.type != 'scsi')) {
+                            options.push({
+                                label: storagePool.name,
+                                value: storagePool.name
+                                });
+                            selectStoragePoolHTML += '&lt;option value="'+ storagePool.name + '"&gt;' + storagePool.name + '&lt;/option&gt;';
+                        }
                     }
-
                 });
-            poolTextbox.append(selectStoragePoolHTML);
-            poolTextbox.val(options[0].value);
-            poolTextbox.selectpicker();
-        }
-    });
+                if (radioButton === 'existing') {
+                    poolTextbox.empty();
+                    poolTextbox.append(selectStoragePoolHTML);
+                    $(poolTextbox).change();
+                    poolTextbox.selectpicker();
+                    $('.selectpicker').selectpicker('refresh');
+                } else if (radioButton === 'new') { //new disk
+                    newPoolTextbox.empty();
+                    newPoolTextbox.append(selectStoragePoolHTML);
+                    $(newPoolTextbox).val(options[0].value);
+                    newPoolTextbox.selectpicker();
+                    getFormatList();
+                }
+            }
+        });
+    };
+
+    //First time retrieving list of Storage Pools - defaulting to new disk
+    getStoragePools('new');

     poolTextbox.change(function() {
         var options = [];
@@ -109,13 +199,15 @@ kimchi.guest_storage_add_main = function() {
                     $(volTextbox).prop('disabled',true);
                     $(submitButton).prop('disabled', true);
                 }
-                volTextbox.selectpicker();
-                $('.selectpicker').selectpicker('refresh');
+            } else {
+                $(volTextbox).prop('disabled',true);
+                $(submitButton).prop('disabled', true);
             }
+            volTextbox.selectpicker();
+            $('.selectpicker').selectpicker('refresh');
         }, null, false);
     });

-
     typeTextbox.change(function() {
         var pathObject = {'cdrom': ".path-section<a class="moz-txt-link-rfc2396E" href="mailto:,'disk':'.volume-section'};varselectType=$(this).val();@@-128,6+220,47@@kimchi.guest_storage_add_main=function(){});});+varcurrentPage='new-disk-box';+$('#existing-disk').change(function(){+if(this.checked){+rbExisting='true';+if(currentPage==='new-disk-box'){+kimchi.switchPage(currentPage,'existing-disk-box','right');+}+currentPage='existing-disk-box';+$('#existing-disk-box').removeClass('hidden');+$('#new-disk-box').addClass('hidden');+$('#guest-storage-add-window.modal-body.template-pager').animate({+height:">", 'disk': '.volume-section'};
         var selectType = $(this).val();
@@ -128,6 +220,47 @@ kimchi.guest_storage_add_main = function() {
         });
     });

+    var currentPage = 'new-disk-box';
+    $('#existing-disk').change(function() {
+        if (this.checked) {
+            rbExisting = 'true';
+            if (currentPage === 'new-disk-box') {
+                kimchi.switchPage(currentPage, 'existing-disk-box', 'right');
+            }
+            currentPage = 'existing-disk-box';
+            $('#existing-disk-box').removeClass('hidden');
+            $('#new-disk-box').addClass('hidden');
+            $('#guest-storage-add-window .modal-body .template-pager').animate({
+                height: "</a>200px"
+            }, 300);
+            getStoragePools('existing');
+            $(pathTextbox).val("");
+            $(newPoolTextbox).val("");
+            $(capacityTextbox).val("");
+            $(formatTextbox).val("");
+        }
+    });
+
+    $('#new-disk').change(function() {
+        if (this.checked) {
+            rbExisting = 'false';
+            if (currentPage === 'existing-disk-box') {
+                kimchi.switchPage(currentPage, 'new-disk-box', 'right');
+            } else if($(capacityTextbox).is(":visible") === false ) {
+                 kimchi.switchPage(currentPage, 'new-disk-box', 'right');
+            }
+            currentPage = 'new-disk-box';
+            $('#existing-disk-box').addClass('hidden');
+            $('#new-disk-box').removeClass('hidden');
+            $('#guest-storage-add-window .modal-body .template-pager').animate({
+                height: "300px"
+            }, 400);
+            $(pathTextbox).val("");
+            $(poolTextbox).val("");
+            $(volTextbox).val("");
+        }
+    });
+
     if (kimchi.thisVMState === 'running') {
         types =typesRunning;
         $(typeTextbox).val('disk');
@@ -155,15 +288,104 @@ kimchi.guest_storage_add_main = function() {
         }
     };

+    var onError = function(result) {
+        if(!result) {
+            return;
+        }
+        var msg = result['message'] || (
+            result['responseJSON'] &amp;&amp; result['responseJSON']['reason']
+        );
+        wok.message.error(msg);
+    };
+
+    var addStorage = function(settings) {
+        kimchi.addVMStorage(settings, function(result) {
+            wok.window.close();
+            wok.topic('kimchi/vmCDROMAttached').publish({
+            result: result
+            });
+        }, function(result) {
+            var errText = result['reason'] ||
+            result['responseJSON']['reason'];
+            wok.message.error(errText, '#alert-modal-container2');
+            $.each([submitButton, pathTextbox, poolTextbox, volTextbox, newPoolTextbox, capacityTextbox, formatTextbox], function(i, c) {
+                $(c).prop('disabled', false);
+            });
+        });
+    }
+
+    var createVol = function(settings, addVolSettings) {
+        kimchi.createVolumeWithCapacity('default', {
+            name: settings['vol'],
+            format: settings['format'],
+            capacity: settings['capacity']
+        }, function(result) {
+            var taskId = result.id;
+            function monitorTask() {
+                kimchi.getTask(taskId, function(result) {
+                    var status = result.status;
+                    if (status === "finished") {
+                        //Now add newly created volume to VM
+                        addStorage(addVolSettings);
+                    } else if (status === "running") {
+                        setTimeout(monitorTask, 2000);
+                        $(submitButton).prop('disabled', true);
+                    } else if (status === "failed") {
+                        var errText = result['reason'] ||
+                        result['responseJSON']['reason'];
+                        $(submitButton).prop('disabled', true);
+                        wok.message.error(errText, '#alert-modal-container2');
+                    }
+                });
+            }
+            setTimeout(monitorTask, 2000);
+        }, onError);
+    };
+
+    var bNewDisk = 'false';
+
     var validateDisk = function(settings) {
-        if (settings['pool'] &amp;&amp; settings['vol']){
-           // Delete path property since it's not needed for disk
-           delete settings['path'];
-           return true;
+        // Determine whether it's existing disk or new disk
+        if($(capacityTextbox).is(":visible") === true ) {
+            bNewDisk = 'true';
         }
-        else {
-            wok.message.error(i18n['KCHVMSTOR0002E'],'#alert-modal-container2');
-            return false;
+        if (bNewDisk === 'true') {
+            if (settings['newpool'] &amp;&amp; settings['capacity'] &amp;&amp; settings['format']){
+                //Change settings['newpool'] to settings['pool']
+                settings['pool']=settings['newpool'];
+                var vmname = settings['vm'];
+                vmname = vmname + new Date().getTime();
+                //Unique vol name to be created
+                settings['vol']=vmname;
+                //This is all that is needed for attaching newly created volume to VM
+                var addVolSettings = {
+                    vm: settings['vm'],
+                    type: settings['type'],
+                    vol:  settings['vol'],
+                    pool: settings['pool']
+                };
+                var sizeInMB = parseInt(settings['capacity']) * 1024;
+                settings['capacity'] = sizeInMB;
+                //These need to be deleted so they don't get passed to backend
+                delete settings['path'];
+                delete settings['newpool'];
+                //Create an empty storage volume and attach to VM if successful
+                createVol(settings, addVolSettings);
+                return true;
+            } else {
+                wok.message.error(i18n['KCHVMSTOR0002E'],'#alert-modal-container2');
+                return false;
+            }
+        } else {
+            if (settings['pool'] &amp;&amp; settings['vol']){
+                // Delete path property since it's not needed for disk
+                delete settings['path'];
+                return true;
+            }
+            else {
+                wok.message.error(i18n['KCHVMSTOR0002E'],'#alert-modal-container2');
+                return false;
+            }
         }
     };

@@ -172,6 +394,11 @@ kimchi.guest_storage_add_main = function() {
         if (submitButton.prop('disabled')) {
             return false;
         }
+        var bNewDisk = 'false';
+        // Determine whether it's existing disk or new disk
+        if($(capacityTextbox).is(":visible") === true ) {
+            bNewDisk = 'true';
+        }

         var formData = storageAddForm.serializeObject();
         var settings = {
@@ -179,40 +406,30 @@ kimchi.guest_storage_add_main = function() {
             type: typeTextbox.val(),
             path: pathTextbox.val(),
             pool: poolTextbox.val(),
-            vol: volTextbox.val()
+            vol: volTextbox.val(),
+            newpool: newPoolTextbox.val(),
+            format: formatTextbox.val(),
+            capacity: capacityTextbox.val()
         };

         $(submitButton).prop('disabled', true);
-        $.each([pathTextbox, poolTextbox, volTextbox], function(i, c) {
+        $.each([pathTextbox, poolTextbox, volTextbox, newPoolTextbox, capacityTextbox, formatTextbox], function(i, c) {
             $(c).prop('disabled', true);
         });
         // Validate form for cdrom and disk
         validateSpecifiedForm = validator[settings['type']];
         if (!validateSpecifiedForm(settings)) {
             $(submitButton).prop('disabled', false);
-            $.each([submitButton, pathTextbox, poolTextbox, volTextbox], function(i, c) {
+            $.each([submitButton, pathTextbox, poolTextbox, volTextbox, newPoolTextbox, capacityTextbox, formatTextbox], function(i, c) {
                 $(c).prop('disabled', false);
             });
             return false;
         }
         $(submitButton).addClass('loading').text(i18n['KCHVMCD6003M']);

-        kimchi.addVMStorage(settings, function(result) {
-            wok.window.close();
-            wok.topic('kimchi/vmCDROMAttached').publish({
-                result: result
-            });
-        }, function(result) {
-            var errText = result['reason'] ||
-                result['responseJSON']['reason'];
-            wok.message.error(errText, '#alert-modal-container2');
-
-            $.each([submitButton, pathTextbox, poolTextbox, volTextbox], function(i, c) {
-                $(c).prop('disabled', false);
-            });
-            $(submitButton).removeClass('loading').text(i18n['KCHVMCD6002M']);
-        });
-
+        if(bNewDisk === 'false'){
+            addStorage(settings);
+        }
         event.preventDefault();
     };

@@ -224,5 +441,8 @@ kimchi.guest_storage_add_main = function() {
     volTextbox.on('change propertychange', function (event) {
         $(submitButton).prop('disabled', $(this).val() === '');
     });
+    capacityTextbox.on('change input propertychange', function(event) {
+        $(submitButton).prop('disabled', $(this).val() === '');
+    });

 };
diff --git a/ui/pages/guest-storage-add.html.tmpl b/ui/pages/guest-storage-add.html.tmpl
index bde0eee..660c274 100644
--- a/ui/pages/guest-storage-add.html.tmpl
+++ b/ui/pages/guest-storage-add.html.tmpl
@@ -1,7 +1,7 @@
 #*
  * Project Kimchi
  *
- * Copyright IBM, Corp. 2014
+ * Copyright IBM, Corp. 2014-2016
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -41,18 +41,50 @@
                     &lt;/select&gt;
                     &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("The device type. Currently, \"cdrom\" and \"disk\" are supported.")&lt;/p&gt;
                 &lt;/div&gt;
-                &lt;div class="volume-section hidden"&gt;
-                    &lt;div class="form-group"&gt;
-                        &lt;label&gt;$_("Storage Pool")&lt;/label&gt;
-                        &lt;select id="guest-disk-pool" class="selectpicker col-md-12 col-lg-12"&gt;
-                        &lt;/select&gt;
-                        &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Storage pool which volume located in")&lt;/p&gt;
+                &lt;div class="volume-section hidden form-group"&gt;
+                    &lt;div class="template-modal-container"&gt;
+                        &lt;div&gt;
+                            &lt;span id="alert-modal-container"&gt;&lt;/span&gt;
+                            &lt;input type="radio" checked="checked" name="disk-btn" id="new-disk" value="new-disk" class="wok-radio"&gt;
+                            &lt;label for="new-disk"&gt;$_("Create a new disk")&lt;/label&gt;
+                            &lt;input type="radio" name="disk-btn" id="existing-disk" value="existing-disk" class="wok-radio"&gt;
+                            &lt;label for="existing-disk"&gt;$_("Select an existing disk")&lt;/label&gt;
+                        &lt;/div&gt;
                     &lt;/div&gt;
-                    &lt;div class="form-group"&gt;
-                        &lt;label&gt;$_("Storage Volume")&lt;/label&gt;
-                        &lt;select id="guest-disk-vol" class="selectpicker col-md-12 col-lg-12"&gt;
-                        &lt;/select&gt;
-                        &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Storage volume to be attached")&lt;/p&gt;
+                    &lt;div class="template-pager"&gt;
+                        &lt;div class="page" id="new-disk-box"&gt;
+                            &lt;div class="form-group"&gt;
+                                &lt;label&gt;$_("Storage Pool")&lt;/label&gt;
+                                &lt;select id="guest-disk-pool-new" class="selectpicker col-md-12 col-lg-12"&gt;
+                                &lt;/select&gt;
+                                &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Storage pool to create the volume in")&lt;/p&gt;
+                            &lt;/div&gt;
+                            &lt;div class="form-group"&gt;
+                                &lt;label&gt;$_("Disk Size (GB)")&lt;/label&gt;
+                                &lt;input type="number" class="form-control" name="capacity" min="1" id="capacity" /&gt;
+                                &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("New disk size to be created")&lt;/p&gt;
+                            &lt;/div&gt;
+                            &lt;div class="form-group"&gt;
+                                &lt;label&gt;$_("Format")&lt;/label&gt;
+                                &lt;select id="guest-disk-format-new" class="selectpicker col-md-12 col-lg-12"&gt;
+                                &lt;/select&gt;
+                                &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Format of the new disk to be created")&lt;/p&gt;
+                            &lt;/div&gt;
+                        &lt;/div&gt;
+                        &lt;div class="page" id="existing-disk-box"&gt;
+                            &lt;div class="form-group"&gt;
+                                &lt;label&gt;$_("Storage Pool")&lt;/label&gt;
+                                &lt;select id="guest-disk-pool" class="selectpicker col-md-12 col-lg-12"&gt;
+                                &lt;/select&gt;
+                                &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Storage pool in which the volume is located in")&lt;/p&gt;
+                            &lt;/div&gt;
+                            &lt;div class="form-group"&gt;
+                                &lt;label&gt;$_("Storage Volume")&lt;/label&gt;
+                                &lt;select id="guest-disk-vol" class="selectpicker col-md-12 col-lg-12"&gt;
+                                &lt;/select&gt;
+                                &lt;p class="help-block"&gt;&lt;i class="fa fa-info-circle"&gt;&lt;/i&gt; $_("Storage volume to be attached")&lt;/p&gt;
+                            &lt;/div&gt;
+                        &lt;/div&gt;
                     &lt;/div&gt;
                 &lt;/div&gt;
                 &lt;div class="path-section form-group"&gt;
@@ -72,4 +104,4 @@
     kimchi.guest_storage_add_main();
 &lt;/script&gt;
 &lt;/body&gt;
-&lt;/html&gt;
\ No newline at end of file
+&lt;/html&gt;

</pre>
      </blockquote>
      <pre wrap="">
_______________________________________________
Kimchi-devel mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Kimchi-devel@ovirt.org">Kimchi-devel@ovirt.org</a>
<a class="moz-txt-link-freetext" href="http://lists.ovirt.org/mailman/listinfo/kimchi-devel">http://lists.ovirt.org/mailman/listinfo/kimchi-devel</a>

</pre>
    </blockquote>
    <br>
  </body>
</html>