[Kimchi-devel] [PATCH] [Kimchi] Create Template UI adjustments based on feedback; added Not Available to be displayed for Size when there's no size and move remote/local iso icon to bottom right
Ramon Medeiros
ramonn at linux.vnet.ibm.com
Wed Apr 20 19:50:21 UTC 2016
Reviewed-By: Ramon Medeiros <ramonn at br.ibm.com>
Tested-By: Ramon Medeiros <ramonn at br.ibm.com>
Just a question, why is taking so long to discover remote and local
templates?
On 04/20/2016 04:23 PM, Socorro Stoppler wrote:
> Signed-off-by: Socorro Stoppler <socorro at linux.vnet.ibm.com>
> ---
> ui/css/kimchi.css | 36 ++++
> ui/css/src/modules/_templates.scss | 30 +++
> ui/js/src/kimchi.template_add_main.js | 337 ++++++----------------------------
> ui/pages/i18n.json.tmpl | 1 +
> ui/pages/template-add.html.tmpl | 81 ++------
> 5 files changed, 136 insertions(+), 349 deletions(-)
>
> diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
> index 5afa55d..1d33d45 100644
> --- a/ui/css/kimchi.css
> +++ b/ui/css/kimchi.css
> @@ -1628,6 +1628,42 @@ body.wok-gallery {
> left: 0;
> }
>
> +#template-add-window .filter {
> + height: 40px;
> + overflow: visible;
> + clear: both;
> +}
> +
> +#template-add-window .pull-right .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
> + width: 133px;
> +}
> +
> +#template-add-window .filter input[type="text"].form-control {
> + width: 460px;
> + height: 40px;
> + float: right;
> + border-top-left-radius: 0;
> + border-bottom-left-radius: 0;
> +}
> +
> +#template-add-window .filter .bootstrap-select.btn-group .btn .caret {
> + border-left: 0;
> +}
> +
> +#template-add-window .filter button.btn.dropdown-toggle.form-control.selectpicker.btn-default {
> + border-top-right-radius: 0 !important;
> + border-bottom-right-radius: 0 !important;
> + background: #fcfcfc;
> + border-right: 0;
> +}
> +
> +#template-add-window span.iso-image-indicator {
> + position: absolute;
> + bottom: 10px;
> + right: 10px;
> + font-size: 32px;
> +}
> +
> /* VM List View classes*/
> #templates-root-container .grid-control input[type="text"] {
> height: 38px;
> diff --git a/ui/css/src/modules/_templates.scss b/ui/css/src/modules/_templates.scss
> index 86b9305..a9f0e8f 100644
> --- a/ui/css/src/modules/_templates.scss
> +++ b/ui/css/src/modules/_templates.scss
> @@ -217,6 +217,36 @@
> &.modal-content div#iso-local-box {
> left: 0;
> }
> + .filter {
> + height: 40px;
> + overflow: visible;
> + clear: both;
> + }
> + .pull-right .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
> + width: 133px;
> + }
> + .filter input[type="text"].form-control {
> + width: 460px;
> + height: 40px;
> + float: right;
> + border-top-left-radius: 0;
> + border-bottom-left-radius: 0;
> + }
> + .filter .bootstrap-select.btn-group .btn .caret {
> + border-left: 0;
> + }
> + .filter button.btn.dropdown-toggle.form-control.selectpicker.btn-default {
> + border-top-right-radius: 0 !important;
> + border-bottom-right-radius: 0 !important;
> + background: $table-bg-accent;
> + border-right: 0;
> + }
> + span.iso-image-indicator {
> + position: absolute;
> + bottom: 10px;
> + right: 10px;
> + font-size: 32px;
> + }
> }
>
>
> diff --git a/ui/js/src/kimchi.template_add_main.js b/ui/js/src/kimchi.template_add_main.js
> index fa5c847..c3dd014 100644
> --- a/ui/js/src/kimchi.template_add_main.js
> +++ b/ui/js/src/kimchi.template_add_main.js
> @@ -15,41 +15,12 @@
> * 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.template_add_main = function() {
> "use strict";
> - var currentPage = 'iso-local-box';
> kimchi.deepScanHandler = null;
> + var isos = [];
> + var local_isos = [];
> + var remote_isos = [];
>
> var deepScan = function(button) {
> kimchi.deepScanHandler = kimchi.stepListDeepScanIsos(function(isos, isFinished) {
> @@ -76,7 +47,6 @@ kimchi.template_add_main = function() {
> });
> };
>
> - //1-1-1 local iso list
> var initLocalIsoField = function() {
> kimchi.isoInfo = {};
> $('#local-iso-field').hide();
> @@ -94,51 +64,43 @@ 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
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> $('#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
> -
> };
>
> var showLocalIsoField = function(isos) {
> var html = '';
> var template = $('#tmpl-list-local-iso').html();
> $.each(isos, function(index, volume) {
> + if ((volume.path).indexOf('http') === -1) { // Didn't find 'http', so must be local
> + volume.icon = 'fa fa-hdd-o';
> + } else {
> + volume.icon = 'fa fa-globe';
> + }
> var isoId = volume.os_distro + '*' + volume.name + '*' + volume.os_version;
> if (!kimchi.isoInfo[isoId]) {
> volume.isoId = isoId;
> volume.capacity = wok.changetoProperUnit(volume.capacity, 1);
> + if (volume.capacity === "") {
> + volume.capacity = i18n['KCHTMPL6006M'];
> + }
> kimchi.isoInfo[isoId] = volume;
> html += wok.substitute(template, volume);
> }
> });
> +
> $('#list-local-iso').append(html);
> $('#local-iso-field').show();
> };
>
> -
> - //1-1-2 local iso file
> var initIsoFileField = function() {
> - //$('#iso-file-check').prop('checked', false);
> $('#iso-file').val('');
> $('vm-image-local-text').val('');
> $('#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
> -
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> $('#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
> -
> };
>
> $('#iso-file').on('input propertychange keyup focus cut paste click', function() {
> @@ -152,9 +114,6 @@ kimchi.template_add_main = function() {
> }, 0);
> if ($('#iso-file').val()) {
> $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> } else {
> $('#btn-template-file-create').attr('disabled', 'disabled');
> }
> @@ -162,57 +121,58 @@ kimchi.template_add_main = function() {
>
> initLocalIsoField();
> initIsoFileField();
> - kimchi.listIsos(function(isos) {
> - if (isos && isos.length) {
> - showLocalIsoField(isos);
> - $('#iso-more').show();
> - } else {
> - $('#iso-search').show();
> - }
> +
> + 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();
> + }
> + });
> }, function(err) {
> wok.message.error(err.responseJSON.reason, '#local-iso-error-container');
> });
> +
> $('#template-add-window .modal-body .template-pager').animate({
> height: "689px"
> }, 400);
>
> - // 1-1 local iso
> - $('#iso-local').change(function() {
> - if (this.checked) {
> - if (currentPage === 'vm-image-local-box') {
> - kimchi.switchPage(currentPage, 'iso-local-box', 'right');
> - } else if (currentPage === 'iso-remote-box') {
> - kimchi.switchPage(currentPage, 'iso-local-box', 'right');
> + var filterISOs = function(group, text) {
> + text = text.trim().split(" ");
> + var list = $('#isoRow').find('li');
> + if(text === ""){
> + list.show();
> + return;
> + }
> + list.hide();
> +
> + list.filter(function(index, value){
> + var $li = $(this);
> + for (var i = 0; i < text.length; ++i){
> + if ($li.is(":containsNC('" + text[i] + "')")) {
> + if (group === 'all') {
> + return true;
> + } else if (group === 'local') {
> + return true;
> + } else if (group === 'remote') {
> + return true;
> + }
> + }
> }
> - currentPage = 'iso-local-box';
> - $('#template-add-window .modal-body .template-pager').animate({
> - height: "689px"
> - }, 400);
> - initLocalIsoField();
> - initIsoFileField();
> -
> - $('#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
> -
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> + return false;
> + }).show();
> + };
>
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> + var setupFilters = function() {
> + $('input#template-add-iso-filter', '#form-template-add').on('keyup', function() {
> + filterISOs("all", $(this).val()); // Default to 'all' for now
> + });
> + };
>
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> - kimchi.listIsos(function(isos) {
> - if (isos && isos.length) {
> - showLocalIsoField(isos);
> - $('#iso-more').show();
> - } else {
> - $('#iso-search').show();
> - }
> - }, function(err) {
> - wok.message.error(err.responseJSON.reason, '#local-iso-error-container');
> - });
> - }
> - });
> + setupFilters();
>
> $('#iso-search').click(function() {
> var settings = {
> @@ -263,12 +223,6 @@ kimchi.template_add_main = function() {
>
> $('#btn-template-local-iso-create').removeAttr('disabled').css('display', 'inline-block'); // 2 - Selected ISOs
>
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> } else {
> $('#btn-template-local-iso-create').attr('disabled', 'disabled');
> }
> @@ -282,14 +236,8 @@ 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', 'inline-block'); // 2 - Selected ISOs
>
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> if (checkedLength) {
> $('#btn-template-local-iso-create').removeAttr('disabled');
> var length = $('#list-local-iso [type="checkbox"]').length;
> @@ -302,12 +250,11 @@ kimchi.template_add_main = function() {
> });
>
> $('#btn-template-local-iso-create').click(function() {
> - submitIso('form-local-iso');
> + submitIso();
> });
>
> $('#btn-template-file-create').click(function() {
> var isoFile = $('#iso-file').val();
> - $('vm-image-local-text').val('');
> if (!kimchi.template_check_path(isoFile)) {
> wok.message.error(i18n['KCHAPI6003E'],'#local-iso-error-container');
> return;
> @@ -318,9 +265,6 @@ kimchi.template_add_main = function() {
> addTemplate(data);
> });
>
> - //1-2 remote iso
> - $('#iso-remote').attr("disabled", true).css('cursor', 'not-allowed');
> -
> var enabledRemoteIso = function() {
> if (kimchi.capabilities === undefined) {
> setTimeout(enabledRemoteIso, 2000);
> @@ -330,36 +274,15 @@ kimchi.template_add_main = function() {
> if (kimchi.capabilities.qemu_stream !== true) {
> return;
> }
> -
> - $('#iso-remote').attr("disabled", false).css('cursor', 'pointer');
> - $('#iso-remote').change(function() {
> - if (this.checked) {
> - if (currentPage === 'iso-local-box') { // slide twice
> - kimchi.switchPage(currentPage, 'iso-remote-box', 'left');
> - } else if (currentPage === 'vm-image-local-box') { // slide once
> - kimchi.switchPage(currentPage, 'iso-remote-box', 'left');
> - }
> - currentPage = 'iso-remote-box';
> - $('#template-add-window .modal-body .template-pager').animate({
> - height: "635px"
> - }, 400);
> - initRemoteIsoField();
> - initIsoUrlField();
> - kimchi.listDistros(function(isos) {
> - showRemoteIsoField(isos);
> - }, function() {});
> - }
> - });
> };
> +
> enabledRemoteIso();
>
> - //1-2-1 remote iso list
> var initRemoteIsoField = function() {
> $('#load-remote-iso').show();
> $('#remote-iso-field').hide();
> $('#iso-url-field').hide();
> $('#select-all-remote-iso').prop('checked', false);
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled');
>
> $('#iso-file').val('');
> $('vm-image-local-text').val('');
> @@ -369,12 +292,6 @@ kimchi.template_add_main = function() {
>
> $('#btn-template-local-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 2 - Selected ISOs
>
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> $('#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
> @@ -405,152 +322,14 @@ kimchi.template_add_main = function() {
> }
> };
>
> - $('#select-all-remote-iso').click(function() {
> - $('#list-remote-iso [type="checkbox"]').prop('checked', $(this).prop('checked'));
> - if ($(this).prop('checked')) {
> -
> - $('#iso-file').val('');
> - $('vm-image-local-text').val('');
> - $('#iso-url').val('');
> - $('#iso-url').parent().removeClass('has-error');
> -
> - $('#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
> -
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').removeAttr('disabled').css('display', 'inline-block'); // 5 - Remote selected isos
> -
> - } else {
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled');
> - }
> - });
> -
> - $('#list-remote-iso').on('click', '[type="checkbox"]', function() {
> - $('#iso-url').parent().removeClass('has-error');
> - var checkedLength = $('#list-remote-iso [type="checkbox"]:checked').length;
> - if (checkedLength) {
> - $('#btn-template-remote-iso-create').removeAttr('disabled');
> - var length = $('#list-remote-iso [type="checkbox"]').length;
> - $('#select-all-remote-iso').prop('checked', length === checkedLength);
> -
> - $('#iso-file').val('');
> - $('vm-image-local-text').val('');
> - $('#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
> -
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').removeAttr('disabled').css('display', 'inline-block'); // 5 - Remote selected isos
> -
> - } else {
> - $('#select-all-remote-iso').prop('checked', false);
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled');
> - }
> - });
> -
> - $('#btn-template-remote-iso-create').click(function() {
> - submitIso('form-remote-iso');
> - });
> -
> - //1-2-2 remote iso url
> - var initIsoUrlField = function() {
> -
> - $('#iso-file').val('');
> - $('vm-image-local-text').val('');
> - $('#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
> -
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'none'); // 3 - File path
> -
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'inline-block'); // 4 - Remote folder path
> -
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> - };
> -
> $('#iso-url').on('input propertychange keyup focus cut paste click', function() {
> $('#select-all-local-iso, #select-all-remote-iso').prop('checked', false);
> $('#list-local-iso [type="checkbox"], #list-remote-iso [type="checkbox"]').prop('checked', false);
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'inline-block');
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none');
> setTimeout(function() {
> var isValid = kimchi.template_check_url($('input#iso-url').val());
> $('input#iso-url').parent().toggleClass('has-error', !isValid);
> - $('#btn-template-url-create').attr('disabled', (isValid ? false : true));
> }, 0);
> });
> -
> - $('#vm-image-local').change(function() {
> - if (this.checked) {
> - if (currentPage === 'iso-local-box') {
> - kimchi.switchPage(currentPage, 'vm-image-local-box', 'left');
> - } else if (currentPage === 'iso-remote-box') {
> - kimchi.switchPage(currentPage, 'vm-image-local-box', 'right');
> - }
> - currentPage = 'vm-image-local-box';
> - $('#template-add-window .modal-body .template-pager').animate({
> - height: "100px"
> - }, 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
> - $('#vm-image-local-box-button').attr('disabled', 'disabled').css('display', 'inline-block'); // 3 - File path
> - $('#btn-template-url-create').attr('disabled', 'disabled').css('display', 'none'); // 4 - Remote folder path
> - $('#btn-template-remote-iso-create').attr('disabled', 'disabled').css('display', 'none'); // 5 - Remote selected isos
> -
> - }
> - });
> - $('input', '#vm-image-local-box').on('input propertychange keyup focus cut paste click', function() {
> - setTimeout(function() {
> - var isValid = kimchi.template_check_path($('input', '#vm-image-local-box').val());
> - $('input', '#vm-image-local-box').parent().toggleClass('has-error', !isValid);
> - $('#vm-image-local-box-button').attr('disabled', (isValid ? false : true));
> - }, 0);
> - });
> - $('input', '#vm-image-local-box').on('input propertychange keyup focus cut paste click', function() {
> - setTimeout(function() {
> - var isValid = kimchi.template_check_path($('input', '#vm-image-local-box').val());
> - $('input', '#vm-image-local-box').parent().toggleClass('has-error', !isValid);
> - $('#vm-image-local-box-button').attr('disabled', (isValid ? false : true));
> - }, 0);
> - });
> - $('#vm-image-local-box-button').on('click', function(){
> - $('input', '#vm-image-local-box').prop('disabled', true);
> - $('#vm-image-local-box-button').text(i18n['KCHAPI6008M']);
> - $('#vm-image-local-box-button').prop('disabled', true);
> - addTemplate({
> - source_media: $('input', '#vm-image-local-box').val()
> - }, function() {
> - $('input', '#vm-image-local-box').prop('disabled', false);
> - $('#vm-image-local-box-button').text(i18n['KCHAPI6005M']);
> - $('#vm-image-local-box-button').prop('disabled', false);
> - });
> - });
> -
> - $('#btn-template-url-create').click(function() {
> - var isoUrl = $('#iso-url').val();
> - if (!kimchi.template_check_url(isoUrl)) {
> - wok.message.error.code('KCHAPI6004E');
> - return;
> - }
> - var data = {
> - "source_media": isoUrl
> - };
> - addTemplate(data);
> - });
> -
> //do create
> var addTemplate = function(data, callback) {
> kimchi.createTemplate(data, function() {
> @@ -568,8 +347,8 @@ kimchi.template_add_main = function() {
> });
> };
>
> - var submitIso = function(formId) {
> - var formData = $('#' + formId).serializeObject();
> + var submitIso = function() {
> + var formData = $('#form-local-iso').serializeObject();
> if (formData.iso) {
> var length = 0;
> var successNum = 0;
> diff --git a/ui/pages/i18n.json.tmpl b/ui/pages/i18n.json.tmpl
> index 24abeb6..e030a45 100644
> --- a/ui/pages/i18n.json.tmpl
> +++ b/ui/pages/i18n.json.tmpl
> @@ -51,6 +51,7 @@
> "KCHTMPL6003M": "$_("This will permanently delete the template. Would you like to continue?")",
> "KCHTMPL6004M": "$_("View Table")",
> "KCHTMPL6005M": "$_("View Gallery")",
> + "KCHTMPL6006M": "$_("Not Available")",
>
> "KCHVM6001M": "$_("This will delete the virtual machine and its virtual disks. This operation cannot be undone. Would you like to continue?")",
> "KCHVM6002M": "$_("Power off Confirmation")",
> diff --git a/ui/pages/template-add.html.tmpl b/ui/pages/template-add.html.tmpl
> index 2926cfa..670c7a2 100644
> --- a/ui/pages/template-add.html.tmpl
> +++ b/ui/pages/template-add.html.tmpl
> @@ -29,16 +29,6 @@
> </div>
> <div class="modal-body">
> <div class="template-modal-container">
> - <div>
> - <span id="alert-modal-container"></span>
> - <h5>$_("Where is the source media for this template? ")</h5>
> - <input type="radio" checked="checked" name="iso-source" id="iso-local" value="iso-local" class="wok-radio">
> - <label for="iso-local">$_("Local ISO Image")</label>
> - <input type="radio" name="iso-source" id="vm-image-local" value="vm-image-local" class="wok-radio">
> - <label for="vm-image-local">$_("Local Image File")</label>
> - <input type="radio" name="iso-source" id="iso-remote" value="iso-remote" class="wok-radio">
> - <label for="iso-remote">$_("Remote ISO Image")</label>
> - </div>
> </div>
> <div class="template-pager">
> <div class="page-list">
> @@ -47,7 +37,7 @@
> <div id="iso-file-field">
> <div id="iso-file-box" class="custom-iso-field">
> <div class="form-group">
> - <label for="iso-file">$_("Provide a File Path for a specific ISO image:")</label>
> + <label for="iso-file">$_("File Path:")</label>
> <input type="text" class="form-control" id="iso-file" name="iso-file">
> </div>
> </div>
> @@ -56,8 +46,16 @@
> <span id="local-iso-error-container"></span>
> <button class="btn btn-primary" id="iso-search" style="display: none">$_("Search ISOs")</button>
> <button class="btn btn-primary" id="iso-search-loading" style="display: none"><span class="wok-loading-icon"></span> $_("Please, wait...")</button>
> +
> <!-- 1-1-1 -->
> <div id="local-iso-field" class="iso-field" style="display: none;">
> + <form id="form-template-add">
> + <div class="filter">
> + <div class="form-group pull-right">
> + <input type="text" class="form-control" id="template-add-iso-filter" placeholder="$_("Filter")" />
> + </div>
> + </div>
> + </form>
> <div class="row">
> <p>$_("The following ISOs are available:")</p>
> </div>
> @@ -66,7 +64,7 @@
> <input type="checkbox" id="select-all-local-iso">$_("All")
> </label>
> </div>
> - <div class="row">
> + <div class="row" id="isoRow">
> <form id="form-local-iso">
> <ul id="list-local-iso" class="list-iso">
> </ul>
> @@ -88,6 +86,7 @@
> <dt>{capacity}</dt>
> <dd>$_("Size")</dd>
> </dl>
> + <span class="iso-image-indicator"><i class="{icon}"></i></span>
> </span>
> </span>
> </label>
> @@ -108,69 +107,11 @@
> </div>
> </div>
>
> - <!-- 1-2 -->
> - <div class="page" id="iso-remote-box">
> - <!-- 1-2-2 -->
> - <div id="iso-url-field" style="display: none;">
> - <div id="iso-url-box" class="form-group">
> - <label for="iso-url">$_("Provide a URL for a specific ISO image:")</label>
> - <input type="text" class="form-control" id="iso-url" name="iso-url">
> - </div>
> - </div>
> - <!-- 1-2-0 -->
> - <div id="load-remote-iso">
> - <p><span class="wok-loading-icon"></span> $_("Loading default remote ISOs ...")</p>
> - </div>
> - <span id="remote-iso-warning-container"></span>
> - <span id="remote-iso-error-container"></span>
> - <!-- 1-2-1 -->
> - <div id="remote-iso-field" class="iso-field" style="display: none;">
> - <div class="row">
> - <p>$_("The following ISOs are available:")</p>
> - </div>
> - <div class="checkbox">
> - <label class="check-all">
> - <input type="checkbox" id="select-all-remote-iso">$_("All")
> - </label>
> - </div>
> - <div class="row">
> - <form id="form-remote-iso">
> - <ul id="list-remote-iso" class="list-iso">
> - </ul>
> - </form>
> - <script id="tmpl-list-remote-iso" type="text/html">
> - <li class="col-md-3">
> - <label class="box-iso-outer">
> - <input type="checkbox" class="iso-checkbox-hidden" name="iso" value="{isoId}">
> - <span class="box-iso-border">
> - <span class="box-iso-inner">
> - <h3 class="iso-title {os_distro}" title="{name}">
> - {name}
> - </h3>
> - <dl class="iso-info">
> - <dt>{os_distro}</dt>
> - <dd>$_("OS")</dd>
> - <dt>{os_version}</dt>
> - <dd>$_("Version")</dd>
> - <dt>{os_arch}</dt>
> - <dd>$_("Arch")</dd>
> - </dl>
> - </span>
> - </span>
> - </label>
> - </li>
> - </script>
> - </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 id="vm-image-local-box-button" class="btn btn-default ui-button-primary">$_("Create")</button>
> - <button class="btn btn-default" id="btn-template-url-create" disabled="disabled">$_("Create")</button>
> - <button class="btn btn-default" id="btn-template-remote-iso-create" disabled="disabled">$_("Create")</button>
> <button class="btn btn-default" data-dismiss="modal" type="button">$_("Cancel")</button>
> </div>
> </div>
--
Ramon Nunes Medeiros
Kimchi Developer
Linux Technology Center Brazil
IBM Systems & Technology Group
Phone : +55 19 2132 7878
ramonn at br.ibm.com
More information about the Kimchi-devel
mailing list