[PATCH] [Kimchi] Add UI netboot support for adding templates
This patch adds UI support for netboot template. Due to this, the radio buttons have been reintroduced in add template to choose between current choice (image, iso - local and remote which has been combined into one panel) and netboot template. Signed-off-by: Socorro Stoppler <socorro@linux.vnet.ibm.com> --- ui/js/src/kimchi.template_add_main.js | 73 ++++++++++++++++++++++++++++++++--- ui/pages/template-add.html.tmpl | 27 +++++++++---- 2 files changed, 87 insertions(+), 13 deletions(-) diff --git a/ui/js/src/kimchi.template_add_main.js b/ui/js/src/kimchi.template_add_main.js index 948f710..ed020d3 100644 --- a/ui/js/src/kimchi.template_add_main.js +++ b/ui/js/src/kimchi.template_add_main.js @@ -17,6 +17,7 @@ */ kimchi.template_add_main = function() { "use strict"; + var currentPage = 'iso-local-box'; $('#loading-isos').removeClass('hidden'); kimchi.deepScanHandler = null; var isos = []; @@ -53,6 +54,7 @@ kimchi.template_add_main = function() { $('#local-iso-field').hide(); $('#select-all-local-iso').prop('checked', false); $('#btn-template-local-iso-create').attr('disabled', 'disabled'); + $('#btn-template-netboot-create').attr('disabled', 'disabled'); $('#iso-search').hide(); $('#iso-more').hide(); $('#iso-search-loading').hide(); @@ -64,6 +66,7 @@ kimchi.template_add_main = function() { $('#iso-url').val(''); // 4 - Remote folder path text $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 1 - Folder path $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes }; @@ -98,6 +101,7 @@ kimchi.template_add_main = function() { $('#iso-url').val(''); $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'inline-block'); $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes }; @@ -116,6 +120,7 @@ kimchi.template_add_main = function() { } else { $('#btn-template-file-create').attr('disabled', 'disabled'); } + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot }); initLocalIsoField(); @@ -222,12 +227,11 @@ kimchi.template_add_main = function() { $('#iso-file').parent().removeClass('has-error'); $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path - $('#btn-template-local-iso-create').removeAttr('disabled').css('display', 'inline-block'); // 2 - Selected ISOs - } else { $('#btn-template-local-iso-create').attr('disabled', 'disabled'); } + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot }); $('#list-local-iso').on('click', '[type="checkbox"]', function() { @@ -238,6 +242,7 @@ kimchi.template_add_main = function() { $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot if (checkedLength) { $('#btn-template-local-iso-create').removeAttr('disabled'); @@ -250,6 +255,16 @@ kimchi.template_add_main = function() { } }); + $('#btn-template-netboot-create').click(function() { + var data = { + "source_media": {"type": "netboot"} + }; + addTemplate(data, function() { + $('#btn-template-netboot-create').text(i18n['KCHAPI6005M']); + $('#btn-template-netboot-create').prop('disabled', false); + }); + }); + $('#btn-template-local-iso-create').click(function() { $('input', '#iso-file-box').prop('disabled', true); $('#btn-template-local-iso-create').text(i18n['KCHAPI6008M']); @@ -299,11 +314,9 @@ kimchi.template_add_main = function() { $('#iso-url').val(''); $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path - $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs - + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes - $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes }; @@ -340,6 +353,56 @@ kimchi.template_add_main = function() { $('input#iso-url').parent().toggleClass('has-error', !isValid); }, 0); }); + + $('#image-src').change(function() { + if (this.checked) { + if (currentPage === 'netboot-path') { + kimchi.switchPage(currentPage, 'iso-local-box', 'right'); + } + currentPage = 'iso-local-box'; + $('#template-add-window .modal-body .template-pager').animate({ + height: "635px" + }, 400); + initLocalIsoField(); + initIsoFileField(); + $('#loading-isos').removeClass('hidden'); + kimchi.listIsos(function(local_isos) { //local ISOs + kimchi.listDistros(function(remote_isos) { //remote ISOs + isos = local_isos.concat(remote_isos); //all isos + if (isos && isos.length) { + showLocalIsoField(isos); + $('#iso-more').show(); + } else { + $('#iso-search').show(); + } + $('#loading-isos').fadeOut(100, function() {}); + }); + }, function(err) { + wok.message.error(err.responseJSON.reason, '#local-iso-error-container'); + $('#loading-isos').fadeOut(300, function() { + $('#loading-isos').addClass('hidden'); + }); + }); + setupFilters(); + enabledRemoteIso(); + } + }); + + $('#netboot-src').change(function() { + if (this.checked) { + if (currentPage === 'iso-local-box') { + kimchi.switchPage(currentPage, 'netboot-path', 'left'); + } + currentPage = 'netboot-path'; + $('#template-add-window .modal-body .template-pager').animate({ + height: "300px" + }, 400); + $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path + $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').removeAttr('disabled').css('display', 'inline-block'); // 3 - Netboot + } + }); + //do create var addTemplate = function(data, callback) { kimchi.createTemplate(data, function() { diff --git a/ui/pages/template-add.html.tmpl b/ui/pages/template-add.html.tmpl index 4226a8f..e5c7aa5 100644 --- a/ui/pages/template-add.html.tmpl +++ b/ui/pages/template-add.html.tmpl @@ -30,6 +30,13 @@ <div class="modal-body"> <div class="template-modal-container"> <div id="alert-modal-container"></div> + <div> + <h5>$_("Where is the source media for this template? ")</h5> + <input type="radio" checked="checked" name="iso-source" id="image-src" value="image-src" class="wok-radio"> + <label for="image-src">$_("Image Template")</label> + <input type="radio" name="iso-source" id="netboot-src" value="netboot-src" class="wok-radio"> + <label for="netboot-src">$_("Netboot Template")</label> + </div> </div> <div class="template-pager"> <div class="page-list"> @@ -103,16 +110,20 @@ </div> </div> </div> - </div> - </div> - <div class="modal-footer"> - <button class="btn btn-default" id="btn-template-file-create" disabled="disabled">$_("Create")</button> - <button class="btn btn-default" id="btn-template-local-iso-create" disabled="disabled">$_("Create")</button> - <button class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button> - </div> -</div> + <div class="page" id="netboot-path"> + </div> + </div> + </div> + <div class="modal-footer"> + <button class="btn btn-default" id="btn-template-file-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" id="btn-template-local-iso-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" id="btn-template-netboot-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button> + </div> + </div> <script> kimchi.template_add_main(); </script> +</div> </body> </html> -- 2.5.0
Socorro, patch looks good, but just a little thing I found during my test that would be nice you also can add into the patch: after select "Netboot Template" and move back selecting "Image Template" I could not see the "loading wheel" image (as I can see when I enter in the Add Template screen) and took few seconds to show all images available in my system. Would be nice to see the "loading wheel" again. Steps to reproduce: 1- In templates screem (Virtualization->Templates), click on "Add Template"; 2- "Loading wheel" is running and you can see all available images on your system; 3- Select "Netboot Template" option 4- Select "Image Template" option - no "loading wheel" and after few seconds you can see all available images on your system; Best regards, Paulo. On Jun 13 03:16PM, Socorro Stoppler wrote:
This patch adds UI support for netboot template. Due to this, the radio buttons have been reintroduced in add template to choose between current choice (image, iso - local and remote which has been combined into one panel) and netboot template.
Signed-off-by: Socorro Stoppler <socorro@linux.vnet.ibm.com> --- ui/js/src/kimchi.template_add_main.js | 73 ++++++++++++++++++++++++++++++++--- ui/pages/template-add.html.tmpl | 27 +++++++++---- 2 files changed, 87 insertions(+), 13 deletions(-)
diff --git a/ui/js/src/kimchi.template_add_main.js b/ui/js/src/kimchi.template_add_main.js index 948f710..ed020d3 100644 --- a/ui/js/src/kimchi.template_add_main.js +++ b/ui/js/src/kimchi.template_add_main.js @@ -17,6 +17,7 @@ */ kimchi.template_add_main = function() { "use strict"; + var currentPage = 'iso-local-box'; $('#loading-isos').removeClass('hidden'); kimchi.deepScanHandler = null; var isos = []; @@ -53,6 +54,7 @@ kimchi.template_add_main = function() { $('#local-iso-field').hide(); $('#select-all-local-iso').prop('checked', false); $('#btn-template-local-iso-create').attr('disabled', 'disabled'); + $('#btn-template-netboot-create').attr('disabled', 'disabled'); $('#iso-search').hide(); $('#iso-more').hide(); $('#iso-search-loading').hide(); @@ -64,6 +66,7 @@ kimchi.template_add_main = function() { $('#iso-url').val(''); // 4 - Remote folder path text $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 1 - Folder path $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes }; @@ -98,6 +101,7 @@ kimchi.template_add_main = function() { $('#iso-url').val(''); $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'inline-block'); $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes }; @@ -116,6 +120,7 @@ kimchi.template_add_main = function() { } else { $('#btn-template-file-create').attr('disabled', 'disabled'); } + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot });
initLocalIsoField(); @@ -222,12 +227,11 @@ kimchi.template_add_main = function() { $('#iso-file').parent().removeClass('has-error');
$('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path - $('#btn-template-local-iso-create').removeAttr('disabled').css('display', 'inline-block'); // 2 - Selected ISOs - } else { $('#btn-template-local-iso-create').attr('disabled', 'disabled'); } + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot });
$('#list-local-iso').on('click', '[type="checkbox"]', function() { @@ -238,6 +242,7 @@ kimchi.template_add_main = function() {
$('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 2 - Selected ISOs + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot
if (checkedLength) { $('#btn-template-local-iso-create').removeAttr('disabled'); @@ -250,6 +255,16 @@ kimchi.template_add_main = function() { } });
+ $('#btn-template-netboot-create').click(function() { + var data = { + "source_media": {"type": "netboot"} + }; + addTemplate(data, function() { + $('#btn-template-netboot-create').text(i18n['KCHAPI6005M']); + $('#btn-template-netboot-create').prop('disabled', false); + }); + }); + $('#btn-template-local-iso-create').click(function() { $('input', '#iso-file-box').prop('disabled', true); $('#btn-template-local-iso-create').text(i18n['KCHAPI6008M']); @@ -299,11 +314,9 @@ kimchi.template_add_main = function() { $('#iso-url').val('');
$('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path - $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs - + $('#btn-template-netboot-create').attr('disabled', 'disabled').css('display', 'none'); // 3 - Netboot $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false); // False to all select-all checkboxes - $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false); // False to all list checkboxes
}; @@ -340,6 +353,56 @@ kimchi.template_add_main = function() { $('input#iso-url').parent().toggleClass('has-error', !isValid); }, 0); }); + + $('#image-src').change(function() { + if (this.checked) { + if (currentPage === 'netboot-path') { + kimchi.switchPage(currentPage, 'iso-local-box', 'right'); + } + currentPage = 'iso-local-box'; + $('#template-add-window .modal-body .template-pager').animate({ + height: "635px" + }, 400); + initLocalIsoField(); + initIsoFileField(); + $('#loading-isos').removeClass('hidden'); + kimchi.listIsos(function(local_isos) { //local ISOs + kimchi.listDistros(function(remote_isos) { //remote ISOs + isos = local_isos.concat(remote_isos); //all isos + if (isos && isos.length) { + showLocalIsoField(isos); + $('#iso-more').show(); + } else { + $('#iso-search').show(); + } + $('#loading-isos').fadeOut(100, function() {}); + }); + }, function(err) { + wok.message.error(err.responseJSON.reason, '#local-iso-error-container'); + $('#loading-isos').fadeOut(300, function() { + $('#loading-isos').addClass('hidden'); + }); + }); + setupFilters(); + enabledRemoteIso(); + } + }); + + $('#netboot-src').change(function() { + if (this.checked) { + if (currentPage === 'iso-local-box') { + kimchi.switchPage(currentPage, 'netboot-path', 'left'); + } + currentPage = 'netboot-path'; + $('#template-add-window .modal-body .template-pager').animate({ + height: "300px" + }, 400); + $('#btn-template-file-create').attr('disabled', 'disabled').css('display', 'none'); // 1 - Folder path + $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs + $('#btn-template-netboot-create').removeAttr('disabled').css('display', 'inline-block'); // 3 - Netboot + } + }); + //do create var addTemplate = function(data, callback) { kimchi.createTemplate(data, function() { diff --git a/ui/pages/template-add.html.tmpl b/ui/pages/template-add.html.tmpl index 4226a8f..e5c7aa5 100644 --- a/ui/pages/template-add.html.tmpl +++ b/ui/pages/template-add.html.tmpl @@ -30,6 +30,13 @@ <div class="modal-body"> <div class="template-modal-container"> <div id="alert-modal-container"></div> + <div> + <h5>$_("Where is the source media for this template? ")</h5> + <input type="radio" checked="checked" name="iso-source" id="image-src" value="image-src" class="wok-radio"> + <label for="image-src">$_("Image Template")</label> + <input type="radio" name="iso-source" id="netboot-src" value="netboot-src" class="wok-radio"> + <label for="netboot-src">$_("Netboot Template")</label> + </div> </div> <div class="template-pager"> <div class="page-list"> @@ -103,16 +110,20 @@ </div> </div> </div> - </div> - </div> - <div class="modal-footer"> - <button class="btn btn-default" id="btn-template-file-create" disabled="disabled">$_("Create")</button> - <button class="btn btn-default" id="btn-template-local-iso-create" disabled="disabled">$_("Create")</button> - <button class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button> - </div> -</div> + <div class="page" id="netboot-path"> + </div> + </div> + </div> + <div class="modal-footer"> + <button class="btn btn-default" id="btn-template-file-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" id="btn-template-local-iso-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" id="btn-template-netboot-create" disabled="disabled">$_("Create")</button> + <button class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button> + </div> + </div> <script> kimchi.template_add_main(); </script> +</div> </body> </html> -- 2.5.0
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
-- Paulo Ricardo Paz Vital Linux Technology Center, IBM Systems http://www.ibm.com/linux/ltc/
participants (2)
-
Paulo Ricardo Paz Vital -
Socorro Stoppler