1
0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-22 18:50:08 +03:00

Feature #3922: Move template instantiate to a form panel

This commit is contained in:
Carlos Martín 2015-08-07 17:19:54 +02:00
parent 21a72c51d3
commit 59fb94b39a
6 changed files with 159 additions and 151 deletions

View File

@ -8,8 +8,7 @@ define(function(require) {
var DATATABLE_ID = "dataTableTemplates";
var _dialogs = [
require('./templates-tab/dialogs/clone'),
require('./templates-tab/dialogs/instantiate')
require('./templates-tab/dialogs/clone')
];
var _panels = [
@ -19,8 +18,9 @@ define(function(require) {
var _formPanels = [
require('./templates-tab/form-panels/create'),
require('./templates-tab/form-panels/import')
]
require('./templates-tab/form-panels/import'),
require('./templates-tab/form-panels/instantiate')
];
var Tab = {
tabId: TAB_ID,

View File

@ -9,7 +9,7 @@ define(function(require) {
var TAB_ID = require('./tabId');
var CREATE_DIALOG_ID = require('./form-panels/create/formPanelId');
var CLONE_DIALOG_ID = require('./dialogs/clone/dialogId');
var INSTANTIATE_DIALOG_ID = require('./dialogs/instantiate/dialogId');
var INSTANTIATE_DIALOG_ID = require('./form-panels/instantiate/formPanelId');
var IMPORT_DIALOG_ID = require('./form-panels/import/formPanelId');
var XML_ROOT = "VMTEMPLATE"
@ -97,6 +97,7 @@ define(function(require) {
type: "multiple",
call: OpenNebulaTemplate.instantiate,
callback: function(req) {
Sunstone.hideFormPanel(TAB_ID);
OpenNebulaAction.clear_cache("VM");
},
elements: function() {
@ -109,6 +110,7 @@ define(function(require) {
type: "single",
call: OpenNebulaTemplate.instantiate,
callback: function(req) {
Sunstone.hideFormPanel(TAB_ID);
OpenNebulaAction.clear_cache("VM");
},
error: Notifier.onError
@ -116,7 +118,13 @@ define(function(require) {
"Template.instantiate_vms" : {
type: "custom",
call: function(){
Sunstone.getDialog(INSTANTIATE_DIALOG_ID).show();
//Sunstone.resetFormPanel(TAB_ID, INSTANTIATE_DIALOG_ID);
var selected_nodes = Sunstone.getDataTable(TAB_ID).elements();
Sunstone.showFormPanel(TAB_ID, INSTANTIATE_DIALOG_ID, "instantiate",
function(formPanelInstance, context) {
formPanelInstance.setTemplateIds(context, selected_nodes);
});
}
},
"Template.clone_dialog" : {

View File

@ -1,46 +0,0 @@
<div id="{{dialogId}}" class="reveal-modal large" role="dialog" data-reveal >
<div class="row">
<div class="large-12 columns">
<h3 id="create_vnet_header" class="subheader">{{tr "Instantiate VM Template"}}</h3>
</div>
</div>
<form data-abide="ajax" id="{{dialogId}}Form" action="" class="custom creation">
<div class="row">
<div class="large-4 columns">
<label for="vm_name">
{{tr "VM Name"}}
<span class="tip">
{{tr "Defaults to template name when emtpy. You can use the wildcard &#37;i. When creating several VMs, &#37;i will be replaced with a different number starting from 0 in each of them"}}.
</span>
</label>
<input type="text" name="vm_name" id="vm_name" />
</div>
<div class="large-4 columns">
<label for="vm_n_times">
{{tr "Number of instances"}}
<span class="tip">
{{tr "Number of Virtual Machines that will be created using this template"}}.
</span>
</label>
<input type="text" name="vm_n_times" id="vm_n_times" value="1">
</div>
<div class="large-4 columns">
<input type="checkbox" name="hold" id="hold"/>
<label for="hold">
{{tr "Hold"}}
<span class="tip">
{{tr "Sets the new VM to hold state, instead of pending. The scheduler will not deploy VMs in this state. It can be released later, or deployed manually."}}
</span>
</label>
</div>
</div>
<div class="row">
<div class="large-11 large-centered columns list_of_templates">
</div>
</div>
<div class="form_buttons">
<button class="button radius right success" id="instantiate_vm_template_proceed" value="Template.instantiate_vms">{{tr "Instantiate"}}</button>
</div>
<a class="close-reveal-modal">&#215;</a>
</form>
</div>

View File

@ -3,7 +3,7 @@ define(function(require) {
DEPENDENCIES
*/
var BaseDialog = require('utils/dialogs/dialog');
var BaseFormPanel = require('utils/form-panels/form-panel');
var TemplateHTML = require('hbs!./instantiate/html');
var Sunstone = require('sunstone');
var Notifier = require('utils/notifier');
@ -19,27 +19,37 @@ define(function(require) {
CONSTANTS
*/
var DIALOG_ID = require('./instantiate/dialogId');
var TEMPLATES_TAB_ID = require('tabs/templates-tab/tabId')
var FORM_PANEL_ID = require('./instantiate/formPanelId');
var TAB_ID = require('../tabId');
/*
CONSTRUCTOR
*/
function Dialog() {
this.dialogId = DIALOG_ID;
function FormPanel() {
this.formPanelId = FORM_PANEL_ID;
this.tabId = TAB_ID;
this.actions = {
'instantiate': {
'title': Locale.tr("Instantiate VM Template"),
'buttonText': Locale.tr("Instantiate"),
'resetButton': false
}
};
BaseDialog.call(this);
};
BaseFormPanel.call(this);
}
Dialog.DIALOG_ID = DIALOG_ID;
Dialog.prototype = Object.create(BaseDialog.prototype);
Dialog.prototype.constructor = Dialog;
Dialog.prototype.html = _html;
Dialog.prototype.onShow = _onShow;
Dialog.prototype.setup = _setup;
FormPanel.FORM_PANEL_ID = FORM_PANEL_ID;
FormPanel.prototype = Object.create(BaseFormPanel.prototype);
FormPanel.prototype.constructor = FormPanel;
FormPanel.prototype.setTemplateIds = _setTemplateIds;
FormPanel.prototype.htmlWizard = _html;
FormPanel.prototype.submitWizard = _submitWizard;
FormPanel.prototype.onShow = _onShow;
FormPanel.prototype.setup = _setup;
return Dialog;
return FormPanel;
/*
FUNCTION DEFINITIONS
@ -47,97 +57,88 @@ define(function(require) {
function _html() {
return TemplateHTML({
'dialogId': this.dialogId
'formPanelId': this.formPanelId
});
}
function _setup(context) {
var that = this;
context.foundation('abide', 'reflow');
context.off('invalid.fndtn.abide', '#' + DIALOG_ID + 'Form');
context.off('valid.fndtn.abide', '#' + DIALOG_ID + 'Form');
context.on('invalid.fndtn.abide', '#' + DIALOG_ID + 'Form', function(e) {
Notifier.notifyError(Locale.tr("One or more required fields are missing or malformed."));
return false;
}).on('valid.fndtn.abide', '#' + DIALOG_ID + 'Form', function(e) {
var vm_name = $('#vm_name', this).val();
var n_times = $('#vm_n_times', this).val();
var n_times_int = 1;
var hold = $('#hold', this).prop("checked");
var selected_nodes = Sunstone.getDataTable(TEMPLATES_TAB_ID).elements();
$.each(selected_nodes, function(index, template_id) {
if (n_times.length) {
n_times_int = parseInt(n_times, 10);
};
var extra_msg = "";
if (n_times_int > 1) {
extra_msg = n_times_int + " times";
}
Notifier.notifySubmit("Template.instantiate", template_id, extra_msg);
var extra_info = {
'hold': hold
};
var tmp_json = WizardFields.retrieve($(".template_user_inputs" + template_id, context));
var disks = DisksResize.retrieve($(".disksContext" + template_id, context));
if (disks.length > 0) {
tmp_json.DISK = disks;
}
capacityContext = $(".capacityContext" + template_id, context);
$.extend(tmp_json, CapacityInputs.retrieveResize(capacityContext));
extra_info['template'] = tmp_json;
if (!vm_name.length) { //empty name use OpenNebula core default
for (var i = 0; i < n_times_int; i++) {
extra_info['vm_name'] = "";
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
}
} else {
if (vm_name.indexOf("%i") == -1) {//no wildcard, all with the same name
extra_info['vm_name'] = vm_name;
for (var i = 0; i < n_times_int; i++) {
Sunstone.runAction(
"Template.instantiate_quiet",
template_id,
extra_info);
}
} else { //wildcard present: replace wildcard
for (var i = 0; i < n_times_int; i++) {
extra_info['vm_name'] = vm_name.replace(/%i/gi, i);
Sunstone.runAction(
"Template.instantiate_quiet",
template_id,
extra_info);
}
}
}
})
Sunstone.getDialog(DIALOG_ID).hide();
Sunstone.getDialog(DIALOG_ID).reset();
return false;
});
}
function _onShow(context) {
$("#instantiate_vm_template_proceed", context).attr("disabled", "disabled");
var selected_nodes = Sunstone.getDataTable(TEMPLATES_TAB_ID).elements();
function _submitWizard(context) {
var vm_name = $('#vm_name', context).val();
var n_times = $('#vm_n_times', context).val();
var n_times_int = 1;
var templatesContext = $(".list_of_templates", context)
templatesContext.html("");
var hold = $('#hold', context).prop("checked");
$.each(selected_nodes, function(index, template_id) {
$.each(this.selected_nodes, function(index, template_id) {
if (n_times.length) {
n_times_int = parseInt(n_times, 10);
}
var extra_msg = "";
if (n_times_int > 1) {
extra_msg = n_times_int + " times";
}
Notifier.notifySubmit("Template.instantiate", template_id, extra_msg);
var extra_info = {
'hold': hold
};
var tmp_json = WizardFields.retrieve($(".template_user_inputs" + template_id, context));
var disks = DisksResize.retrieve($(".disksContext" + template_id, context));
if (disks.length > 0) {
tmp_json.DISK = disks;
}
capacityContext = $(".capacityContext" + template_id, context);
$.extend(tmp_json, CapacityInputs.retrieveResize(capacityContext));
extra_info['template'] = tmp_json;
if (!vm_name.length) { //empty name use OpenNebula core default
for (var i = 0; i < n_times_int; i++) {
extra_info['vm_name'] = "";
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
}
} else {
if (vm_name.indexOf("%i") == -1) {//no wildcard, all with the same name
extra_info['vm_name'] = vm_name;
for (var i = 0; i < n_times_int; i++) {
Sunstone.runAction(
"Template.instantiate_quiet",
template_id,
extra_info);
}
} else { //wildcard present: replace wildcard
for (var i = 0; i < n_times_int; i++) {
extra_info['vm_name'] = vm_name.replace(/%i/gi, i);
Sunstone.runAction(
"Template.instantiate_quiet",
template_id,
extra_info);
}
}
}
});
return false;
}
function _setTemplateIds(context, selected_nodes) {
this.selected_nodes = selected_nodes;
var templatesContext = $(".list_of_templates", context);
var idsLength = this.selected_nodes.length;
var idsDone = 0;
$.each(this.selected_nodes, function(index, template_id) {
OpenNebulaTemplate.show({
data : {
id: template_id
@ -178,7 +179,7 @@ define(function(require) {
template_json,
{text_header: '<i class="fa fa-gears fa-lg"></i>&emsp;'+Locale.tr("Custom Attributes")});
inputs_div.data("opennebula_id", template_json.VMTEMPLATE.ID)
inputs_div.data("opennebula_id", template_json.VMTEMPLATE.ID);
capacityContext = $(".capacityContext" + template_json.VMTEMPLATE.ID, context);
CapacityInputs.setup(capacityContext);
@ -189,15 +190,25 @@ define(function(require) {
capacityContext.hide();
}
idsDone += 1;
if (idsLength == idsDone){
Sunstone.enableFormPanelSubmit(TAB_ID);
}
},
error: function(request, error_json, container) {
Notifier.onError(request, error_json, container);
$("#instantiate_vm_user_inputs", context).empty();
}
});
})
});
}
$("#instantiate_vm_template_proceed", context).removeAttr("disabled");
function _onShow(context) {
Sunstone.disableFormPanelSubmit(TAB_ID);
var templatesContext = $(".list_of_templates", context);
templatesContext.html("");
Tips.setup(context);
return false;

View File

@ -0,0 +1,35 @@
<form data-abide="ajax" id="{{formPanelId}}Wizard" class="custom creation">
<div class="row">
<div class="large-4 columns">
<label for="vm_name">
{{tr "VM Name"}}
<span class="tip">
{{tr "Defaults to template name when emtpy. You can use the wildcard &#37;i. When creating several VMs, &#37;i will be replaced with a different number starting from 0 in each of them"}}.
</span>
</label>
<input type="text" name="vm_name" id="vm_name" />
</div>
<div class="large-4 columns">
<label for="vm_n_times">
{{tr "Number of instances"}}
<span class="tip">
{{tr "Number of Virtual Machines that will be created using this template"}}.
</span>
</label>
<input type="text" name="vm_n_times" id="vm_n_times" value="1">
</div>
<div class="large-4 columns">
<input type="checkbox" name="hold" id="hold"/>
<label for="hold">
{{tr "Hold"}}
<span class="tip">
{{tr "Sets the new VM to hold state, instead of pending. The scheduler will not deploy VMs in this state. It can be released later, or deployed manually."}}
</span>
</label>
</div>
</div>
<div class="row">
<div class="large-11 large-centered columns list_of_templates">
</div>
</div>
</form>