mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-23 22:50:09 +03:00
feature #2166: Add easy provisioning button to vm and template tabs
This commit is contained in:
Daniel Molina
parent
a345a7c23b
commit
f8f5be2de2
@ -113,6 +113,7 @@ tabs:
|
||||
actions:
|
||||
VM.refresh: true
|
||||
VM.create_dialog: true
|
||||
VM.easy_provision: false
|
||||
VM.chown: true
|
||||
VM.chgrp: true
|
||||
VM.chmod: true
|
||||
@ -160,6 +161,7 @@ tabs:
|
||||
actions:
|
||||
Template.refresh: true
|
||||
Template.create_dialog: true
|
||||
Template.easy_provision: false
|
||||
Template.update_dialog: true
|
||||
Template.instantiate_vms: true
|
||||
Template.chown: true
|
||||
|
||||
@ -114,6 +114,7 @@ tabs:
|
||||
actions:
|
||||
VM.refresh: true
|
||||
VM.create_dialog: true
|
||||
VM.easy_provision: false
|
||||
VM.chown: false
|
||||
VM.chgrp: false
|
||||
VM.chmod: true
|
||||
@ -161,6 +162,7 @@ tabs:
|
||||
actions:
|
||||
Template.refresh: true
|
||||
Template.create_dialog: true
|
||||
Template.easy_provision: false
|
||||
Template.update_dialog: true
|
||||
Template.instantiate_vms: true
|
||||
Template.chown: false
|
||||
|
||||
@ -89,54 +89,203 @@ var vms_tab_content = '\
|
||||
</table>\
|
||||
</form>';
|
||||
|
||||
//var create_vm_tmpl ='\
|
||||
// <div class="panel">\
|
||||
// <h3>\
|
||||
// <small id="create_vnet_header">'+tr("Create Virtual Machine")+'</small>\
|
||||
// </h3>\
|
||||
// </div>\
|
||||
// <form id="create_vm_form" action="">\
|
||||
// <div class="row centered">\
|
||||
// <div class="four columns">\
|
||||
// <label class="inline right" for="vm_name">'+tr("VM Name")+':</label>\
|
||||
// </div>\
|
||||
// <div class="seven columns">\
|
||||
// <input type="text" name="vm_name" id="vm_name" />\
|
||||
// </div>\
|
||||
// <div class="one columns">\
|
||||
// <div class="tip">'+tr("Defaults to template name when emtpy")+'.</div>\
|
||||
// </div>\
|
||||
// </div>\
|
||||
// <div class="row centered">\
|
||||
// <div class="four columns">\
|
||||
// <label class="inline right" for="template_id">'+tr("Select template")+':</label>\
|
||||
// </div>\
|
||||
// <div class="seven columns">\
|
||||
// <select id="template_id">\
|
||||
// </select>\
|
||||
// </div>\
|
||||
// <div class="one columns">\
|
||||
// <div class=""></div>\
|
||||
// </div>\
|
||||
// </div>\
|
||||
// <div class="row centered">\
|
||||
// <div class="four columns">\
|
||||
// <label class="inline right" for="vm_n_times">'+tr("Deploy # VMs")+':</label>\
|
||||
// </div>\
|
||||
// <div class="seven columns">\
|
||||
// <input type="text" name="vm_n_times" id="vm_n_times" value="1">\
|
||||
// </div>\
|
||||
// <div class="one columns">\
|
||||
// <div class="tip">'+tr("You can use the wildcard %i. When creating several VMs, %i will be replaced with a different number starting from 0 in each of them")+'.</div>\
|
||||
// </div>\
|
||||
// </div>\
|
||||
// <hr>\
|
||||
// <div class="form_buttons">\
|
||||
// <button class="button radius right success" id="create_vm_proceed" value="VM.create">'+tr("Create")+'</button>\
|
||||
// <button class="close-reveal-modal button secondary radius" type="button" value="close">' + tr("Close") + '</button>\
|
||||
// </div>\
|
||||
//<a class="close-reveal-modal">×</a>\
|
||||
//</form>';
|
||||
|
||||
var create_vm_tmpl ='\
|
||||
<div class="panel">\
|
||||
<h3>\
|
||||
<small id="create_vnet_header">'+tr("Create Virtual Machine")+'</small>\
|
||||
</h3>\
|
||||
<div class="panel">\
|
||||
<h3>\
|
||||
<small id="create_vnet_header">'+tr("Create Virtual Machine")+'</small>\
|
||||
</h3>\
|
||||
</div>\
|
||||
<div class="reveal-body">\
|
||||
<form id="create_vm_form" action="">\
|
||||
<div class="row">\
|
||||
<fieldset>\
|
||||
<legend>'+tr("Step 1: Specify a name and the number of instances")+'</legend>\
|
||||
<div class="seven columns">\
|
||||
<div class="four columns">\
|
||||
<label class="inline right" for="vm_name">'+tr("VM Name")+':</label>\
|
||||
</div>\
|
||||
<div class="seven columns">\
|
||||
<input type="text" name="vm_name" id="vm_name" />\
|
||||
</div>\
|
||||
<div class="one columns">\
|
||||
<div class="tip">'+tr("Defaults to template name when emtpy. You can use the wildcard %i. When creating several VMs, %i will be replaced with a different number starting from 0 in each of them")+'.</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<form id="create_vm_form" action="">\
|
||||
<div class="row centered">\
|
||||
<div class="four columns">\
|
||||
<label class="inline right" for="vm_name">'+tr("VM Name")+':</label>\
|
||||
</div>\
|
||||
<div class="seven columns">\
|
||||
<input type="text" name="vm_name" id="vm_name" />\
|
||||
</div>\
|
||||
<div class="one columns">\
|
||||
<div class="tip">'+tr("Defaults to template name when emtpy")+'.</div>\
|
||||
</div>\
|
||||
<div class="five columns">\
|
||||
<div class="six columns">\
|
||||
<label class="inline right" for="vm_n_times">'+tr("# VMs")+':</label>\
|
||||
</div>\
|
||||
<div class="row centered">\
|
||||
<div class="four columns">\
|
||||
<label class="inline right" for="template_id">'+tr("Select template")+':</label>\
|
||||
</div>\
|
||||
<div class="seven columns">\
|
||||
<select id="template_id">\
|
||||
</select>\
|
||||
</div>\
|
||||
<div class="one columns">\
|
||||
<div class=""></div>\
|
||||
</div>\
|
||||
<div class="five columns">\
|
||||
<input type="text" name="vm_n_times" id="vm_n_times" value="1">\
|
||||
</div>\
|
||||
<div class="row centered">\
|
||||
<div class="four columns">\
|
||||
<label class="inline right" for="vm_n_times">'+tr("Deploy # VMs")+':</label>\
|
||||
</div>\
|
||||
<div class="seven columns">\
|
||||
<input type="text" name="vm_n_times" id="vm_n_times" value="1">\
|
||||
</div>\
|
||||
<div class="one columns">\
|
||||
<div class="tip">'+tr("You can use the wildcard %i. When creating several VMs, %i will be replaced with a different number starting from 0 in each of them")+'.</div>\
|
||||
</div>\
|
||||
<div class="one columns">\
|
||||
<div class="tip">'+tr("Number of Virtual Machines that will be created using this template")+'.</div>\
|
||||
</div>\
|
||||
<hr>\
|
||||
<div class="form_buttons">\
|
||||
<button class="button radius right success" id="create_vm_proceed" value="VM.create">'+tr("Create")+'</button>\
|
||||
<button class="close-reveal-modal button secondary radius" type="button" value="close">' + tr("Close") + '</button>\
|
||||
</div>\
|
||||
<a class="close-reveal-modal">×</a>\
|
||||
</form>';
|
||||
</fieldset>\
|
||||
</div>\
|
||||
<br>\
|
||||
<br>\
|
||||
<br>\
|
||||
<div class="row">\
|
||||
<fieldset>\
|
||||
<legend>'+tr("Step 2: Select a type of instance")+'</legend>\
|
||||
<div class="row collapse">\
|
||||
<div class="seven columns">\
|
||||
<button id="refresh_template_templates_table_button_class" type="button" class="button small radius secondary"><i class="icon-refresh" /></button>\
|
||||
</div>\
|
||||
<div class="five columns">\
|
||||
<input id="template_templates_table_search" type="text" placeholder="'+tr("Search")+'"/>\
|
||||
</div>\
|
||||
</div>\
|
||||
<table id="template_templates_table" class="datatable twelve">\
|
||||
<thead>\
|
||||
<tr>\
|
||||
<th></th>\
|
||||
<th>'+tr("ID")+'</th>\
|
||||
<th>'+tr("Owner")+'</th>\
|
||||
<th>'+tr("Group")+'</th>\
|
||||
<th>'+tr("Name")+'</th>\
|
||||
<th>'+tr("Registration time")+'</th>\
|
||||
</tr>\
|
||||
</thead>\
|
||||
<tbody id="tbodytemplates">\
|
||||
</tbody>\
|
||||
</table>\
|
||||
<div class="row hidden">\
|
||||
<div class="four columns">\
|
||||
<label class="right inline" for="TEMPLATE_ID">'+tr("TEMPLATE_ID")+':</label>\
|
||||
</div>\
|
||||
<div class="six columns">\
|
||||
<input type="text" id="TEMPLATE_ID" name="TEMPLATE_ID"/>\
|
||||
</div>\
|
||||
<div class="two columns">\
|
||||
<div class="tip">\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<br>\
|
||||
<div id="selected_template" class="vm_param kvm_opt xen_opt vmware_opt">\
|
||||
<span id="select_template" class="radius secondary label">'+tr("Please select a template from the list")+'</span>\
|
||||
<span id="template_selected" class="radius secondary label hidden">'+tr("You selected the following template:")+'</span>\
|
||||
<span class="radius label" type="text" id="TEMPLATE_NAME" name="template"></span>\
|
||||
</div>\
|
||||
</fieldset>\
|
||||
</div>\
|
||||
<br>\
|
||||
<br>\
|
||||
<br>\
|
||||
<div id="select_image_step" class="row">\
|
||||
<fieldset>\
|
||||
<legend>'+tr("Step 3: Select an operation system")+'</legend>\
|
||||
<div class="row collapse">\
|
||||
<div class="seven columns">\
|
||||
<button id="refresh_template_images_table_button_class" type="button" class="button small radius secondary"><i class="icon-refresh" /></button>\
|
||||
</div>\
|
||||
<div class="five columns">\
|
||||
<input id="template_images_table_search" type="text" placeholder="'+tr("Search")+'"/>\
|
||||
</div>\
|
||||
</div>\
|
||||
<table id="template_images_table" class="datatable twelve">\
|
||||
<thead>\
|
||||
<tr>\
|
||||
<th></th>\
|
||||
<th>'+tr("ID")+'</th>\
|
||||
<th>'+tr("Owner")+'</th>\
|
||||
<th>'+tr("Group")+'</th>\
|
||||
<th>'+tr("Name")+'</th>\
|
||||
<th>'+tr("Datastore")+'</th>\
|
||||
<th>'+tr("Size")+'</th>\
|
||||
<th>'+tr("Type")+'</th>\
|
||||
<th>'+tr("Registration time")+'</th>\
|
||||
<th>'+tr("Persistent")+'</th>\
|
||||
<th>'+tr("Status")+'</th>\
|
||||
<th>'+tr("#VMS")+'</th>\
|
||||
<th>'+tr("Target")+'</th>\
|
||||
</tr>\
|
||||
</thead>\
|
||||
<tbody id="tbodyimages">\
|
||||
</tbody>\
|
||||
</table>\
|
||||
<div class="row hidden">\
|
||||
<div class="four columns">\
|
||||
<label class="right inline" for="IMAGE_ID">'+tr("IMAGE_ID")+':</label>\
|
||||
</div>\
|
||||
<div class="six columns">\
|
||||
<input type="text" id="IMAGE_ID" name="IMAGE_ID"/>\
|
||||
</div>\
|
||||
<div class="two columns">\
|
||||
<div class="tip">\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<br>\
|
||||
<div id="selected_image" class="vm_param kvm_opt xen_opt vmware_opt">\
|
||||
<span id="select_image" class="radius secondary label">'+tr("Please select an image from the list")+'</span>\
|
||||
<span id="image_selected" class="radius secondary label hidden">'+tr("You selected the following image:")+'</span>\
|
||||
<span class="radius label" type="text" id="IMAGE_NAME" name="image"></span>\
|
||||
</div>\
|
||||
</fieldset>\
|
||||
</div>\
|
||||
<div class="form_buttons reveal-footer">\
|
||||
<hr>\
|
||||
<div class="form_buttons">\
|
||||
<button class="button radius right success" id="instantiate_vm_tenplate_proceed" value="Template.instantiate_vms">'+tr("Create")+'</button>\
|
||||
<button class="close-reveal-modal button secondary radius" type="button" value="close">' + tr("Close") + '</button>\
|
||||
</div>\
|
||||
</div>\
|
||||
<a class="close-reveal-modal">×</a>\
|
||||
</form>\
|
||||
</div>';
|
||||
|
||||
var vmachine_list_json = {};
|
||||
var dataTable_vMachines;
|
||||
@ -157,7 +306,16 @@ var vm_actions = {
|
||||
|
||||
"VM.create_dialog" : {
|
||||
type: "custom",
|
||||
call: popUpCreateVMDialog
|
||||
call: function(){
|
||||
popUpCreateVMDialog(false);
|
||||
}
|
||||
},
|
||||
|
||||
"VM.easy_provision" : {
|
||||
type: "custom",
|
||||
call: function(){
|
||||
popUpCreateVMDialog(true);
|
||||
}
|
||||
},
|
||||
|
||||
"VM.list" : {
|
||||
@ -692,6 +850,12 @@ var vm_buttons = {
|
||||
layout: "create",
|
||||
alwaysActive: true
|
||||
},
|
||||
"VM.easy_provision" : {
|
||||
type: "action",
|
||||
layout: "create",
|
||||
text: tr("Launch"),
|
||||
alwaysActive: true
|
||||
},
|
||||
"VM.chown" : {
|
||||
type: "confirm_with_select",
|
||||
text: tr("Change owner"),
|
||||
@ -2732,28 +2896,123 @@ function setup_vm_snapshot_tab(){
|
||||
|
||||
// Sets up the create-template dialog and all the processing associated to it,
|
||||
// which is a lot.
|
||||
function setupCreateVMDialog(){
|
||||
function setupCreateVMDialog(include_select_image){
|
||||
|
||||
dialogs_context.append('<div title=\"'+tr("Create Virtual Machine")+'\" id="create_vm_dialog"></div>');
|
||||
//Insert HTML in place
|
||||
$create_vm_dialog = $('#create_vm_dialog')
|
||||
var dialog = $create_vm_dialog;
|
||||
dialog.html(create_vm_tmpl);
|
||||
dialog.addClass("reveal-modal large max-height");
|
||||
|
||||
//Prepare jquery dialog
|
||||
//dialog.dialog({
|
||||
// autoOpen: false,
|
||||
// modal: true,
|
||||
// width: 400
|
||||
//});
|
||||
dialog.addClass("reveal-modal");
|
||||
var dataTable_template_templates = $('#template_templates_table', dialog).dataTable({
|
||||
"iDisplayLength": 4,
|
||||
"bAutoWidth":false,
|
||||
"sDom" : '<"H">t<"F"p>',
|
||||
"aoColumnDefs": [
|
||||
{ "sWidth": "35px", "aTargets": [0,1] },
|
||||
{ "bVisible": false, "aTargets": [1,2,3,5]}
|
||||
],
|
||||
"fnDrawCallback": function(oSettings) {
|
||||
var nodes = this.fnGetNodes();
|
||||
$.each(nodes, function(){
|
||||
if ($(this).find("td:eq(1)").html() == $('#TEMPLATE_ID', dialog).val()) {
|
||||
$("td", this).addClass('markrow');
|
||||
$('input.check_item', this).attr('checked','checked');
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
|
||||
// Retrieve the images to fill the datatable
|
||||
update_datatable_template_templates(dataTable_template_templates);
|
||||
|
||||
$('#template_templates_table_search', dialog).keyup(function(){
|
||||
dataTable_template_templates.fnFilter( $(this).val() );
|
||||
})
|
||||
|
||||
$('#template_templates_table tbody', dialog).delegate("tr", "click", function(e){
|
||||
var aData = dataTable_template_templates.fnGetData(this);
|
||||
|
||||
$("td.markrow", dataTable_template_templates).removeClass('markrow');
|
||||
$('tbody input.check_item', dataTable_template_templates).removeAttr('checked');
|
||||
|
||||
$('#template_selected', dialog).show();
|
||||
$('#select_template', dialog).hide();
|
||||
$('.alert-box', dialog).hide();
|
||||
|
||||
$("td", this).addClass('markrow');
|
||||
$('input.check_item', this).attr('checked','checked');
|
||||
|
||||
$('#TEMPLATE_NAME', dialog).text(aData[4]);
|
||||
$('#TEMPLATE_ID', dialog).val(aData[1]);
|
||||
return true;
|
||||
});
|
||||
|
||||
$("#refresh_template_templates_table_button_class").die();
|
||||
$("#refresh_template_templates_table_button_class").live('click', function(){
|
||||
update_datatable_template_templates($('#template_templates_table').dataTable());
|
||||
});
|
||||
|
||||
if (include_select_image) {
|
||||
$("#select_image_step", dialog).show();
|
||||
var dataTable_template_images = $('#template_images_table', dialog).dataTable({
|
||||
"iDisplayLength": 4,
|
||||
"bAutoWidth":false,
|
||||
"sDom" : '<"H">t<"F"p>',
|
||||
"aoColumnDefs": [
|
||||
{ "sWidth": "35px", "aTargets": [0,1] },
|
||||
{ "bVisible": false, "aTargets": [2,3,7,8,5,9,12]}
|
||||
],
|
||||
"fnDrawCallback": function(oSettings) {
|
||||
var nodes = this.fnGetNodes();
|
||||
$.each(nodes, function(){
|
||||
if ($(this).find("td:eq(1)").html() == $('#IMAGE_ID', dialog).val()) {
|
||||
$("td", this).addClass('markrow');
|
||||
$('input.check_item', this).attr('checked','checked');
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
|
||||
// Retrieve the images to fill the datatable
|
||||
update_datatable_template_images(dataTable_template_images);
|
||||
|
||||
$('#template_images_table_search', dialog).keyup(function(){
|
||||
dataTable_template_images.fnFilter( $(this).val() );
|
||||
})
|
||||
|
||||
$('#template_images_table tbody', dialog).delegate("tr", "click", function(e){
|
||||
var aData = dataTable_template_images.fnGetData(this);
|
||||
|
||||
$("td.markrow", dataTable_template_images).removeClass('markrow');
|
||||
$('tbody input.check_item', dataTable_template_images).removeAttr('checked');
|
||||
|
||||
$('#image_selected', dialog).show();
|
||||
$('#select_image', dialog).hide();
|
||||
$('.alert-box', dialog).hide();
|
||||
|
||||
$("td", this).addClass('markrow');
|
||||
$('input.check_item', this).attr('checked','checked');
|
||||
|
||||
$('#IMAGE_NAME', dialog).text(aData[4]);
|
||||
$('#IMAGE_ID', dialog).val(aData[1]);
|
||||
return true;
|
||||
});
|
||||
|
||||
$("#refresh_template_images_table_button_class").die();
|
||||
$("#refresh_template_images_table_button_class").live('click', function(){
|
||||
update_datatable_template_images($('#template_images_table').dataTable());
|
||||
});
|
||||
} else {
|
||||
$("#select_image_step", dialog).hide();
|
||||
}
|
||||
|
||||
//$('button',dialog).button();
|
||||
setupTips(dialog);
|
||||
|
||||
$('#create_vm_form',dialog).submit(function(){
|
||||
var vm_name = $('#vm_name',this).val();
|
||||
var template_id = $('#template_id',this).val();
|
||||
var template_id = $('#TEMPLATE_ID',this).val();
|
||||
var n_times = $('#vm_n_times',this).val();
|
||||
var n_times_int=1;
|
||||
|
||||
@ -2766,29 +3025,40 @@ function setupCreateVMDialog(){
|
||||
n_times_int=parseInt(n_times,10);
|
||||
};
|
||||
|
||||
var extra_info = "";
|
||||
var extra_msg = "";
|
||||
if (n_times_int > 1) {
|
||||
extra_info = n_times_int+" times";
|
||||
extra_msg = n_times_int+" times";
|
||||
}
|
||||
|
||||
notifySubmit("Template.instantiate",template_id, extra_info);
|
||||
notifySubmit("Template.instantiate",template_id, extra_msg);
|
||||
|
||||
var extra_info = {};
|
||||
if ($("#IMAGE_ID", this).val()) {
|
||||
image_id = $("#IMAGE_ID", this).val();
|
||||
extra_info['template'] = {
|
||||
'disk': {
|
||||
'image_id': image_id
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!vm_name.length){ //empty name use OpenNebula core default
|
||||
for (var i=0; i< n_times_int; i++){
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, "");
|
||||
extra_info['vm_name'] = "";
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
|
||||
};
|
||||
}
|
||||
else
|
||||
{
|
||||
if (vm_name.indexOf("%i") == -1){ //no wildcard
|
||||
if (vm_name.indexOf("%i") == -1){//no wildcard, all with the same name
|
||||
for (var i=0; i< n_times_int; i++){
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, vm_name);
|
||||
extra_info['vm_name'] = vm_name;
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
|
||||
};
|
||||
} else { //wildcard present: replace wildcard
|
||||
var name = "";
|
||||
for (var i=0; i< n_times_int; i++){
|
||||
name = vm_name.replace(/%i/gi,i);
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, name);
|
||||
extra_info['vm_name'] = vm_name.replace(/%i/gi,i);
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
|
||||
};
|
||||
};
|
||||
}
|
||||
@ -2802,7 +3072,8 @@ function setupCreateVMDialog(){
|
||||
}
|
||||
|
||||
// Open creation dialog
|
||||
function popUpCreateVMDialog(){
|
||||
function popUpCreateVMDialog(include_select_image){
|
||||
setupCreateVMDialog(include_select_image);
|
||||
$create_vm_dialog.reveal();
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user