[Kimchi-devel] [PATCH] [Kimchi] Create Template UI adjustments based on feedback
Socorro Stoppler
socorro at linux.vnet.ibm.com
Wed Apr 20 14:51:00 UTC 2016
Signed-off-by: Socorro Stoppler <socorro at linux.vnet.ibm.com>
---
ui/css/kimchi.css | 29 +++
ui/css/src/modules/_templates.scss | 24 +++
ui/js/src/kimchi.template_add_main.js | 334 ++++++----------------------------
ui/pages/template-add.html.tmpl | 80 +-------
4 files changed, 118 insertions(+), 349 deletions(-)
diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
index 5afa55d..4049f0a 100644
--- a/ui/css/kimchi.css
+++ b/ui/css/kimchi.css
@@ -1628,6 +1628,35 @@ 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;
+}
+
/* 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..c15e100 100644
--- a/ui/css/src/modules/_templates.scss
+++ b/ui/css/src/modules/_templates.scss
@@ -217,6 +217,30 @@
&.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;
+ }
}
diff --git a/ui/js/src/kimchi.template_add_main.js b/ui/js/src/kimchi.template_add_main.js
index fa5c847..ec6dca4 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,18 +64,19 @@ 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;
@@ -114,31 +85,19 @@ kimchi.template_add_main = function() {
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 +111,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 +118,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 +220,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 +233,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 +247,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 +262,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 +271,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 +289,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 +319,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 +344,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/template-add.html.tmpl b/ui/pages/template-add.html.tmpl
index 2926cfa..073679c 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>
@@ -58,6 +48,13 @@
<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 +63,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>
@@ -77,6 +74,7 @@
<input type="checkbox" class="iso-checkbox-hidden" name="iso" value="{isoId}">
<span class="box-iso-border">
<span class="box-iso-inner">
+ <span><i class="{icon}"></i></span>
<h3 class="iso-title {os_distro}" title="{name}">
{name}
</h3>
@@ -108,69 +106,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>
--
2.5.0
More information about the Kimchi-devel
mailing list