From 7ab308361fc441964fd2311ebaef3cce5a4eb1c4 Mon Sep 17 00:00:00 2001 From: Daniel Molina Date: Wed, 3 Sep 2014 18:12:51 +0200 Subject: [PATCH] Remove service template modal --- .../public/js/plugins/oneflow-templates.js | 596 ++++++++---------- 1 file changed, 262 insertions(+), 334 deletions(-) diff --git a/src/sunstone/public/js/plugins/oneflow-templates.js b/src/sunstone/public/js/plugins/oneflow-templates.js index 423cea9b23..d1d43c955b 100644 --- a/src/sunstone/public/js/plugins/oneflow-templates.js +++ b/src/sunstone/public/js/plugins/oneflow-templates.js @@ -16,15 +16,8 @@ var selected_row_template_role_id; var last_selected_row_template_role; -var create_service_template_tmpl = '\ -
\ -
\ -

'+tr("Create Service Template")+'

\ - \ -
\ -
\ -
\ -
\ +var create_service_template_wizard_html = '\ + \
\
\
\
\
\ -
\ -
\ -
\ -
\ - '+ - ''+ - ''+ - tr("Network Configuration")+ - '\ -
\ -
\ -
\ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ - \ -
\ - \ - '+tr("Network Configuration")+'\ -
'+tr("Name")+'\ - '+tr("Description")+'\ -
\ - '+tr("Add another Network")+'\ -
\ -
\ -
\ -
\ -
\ -
\ +
\ + '+ + ''+ + ''+ + tr("Network Configuration")+ + '\ + \
\ -
\ -
\ -
\ -
\ -
\ - '+ - ''+ - ''+ - tr("Advanced Service Parameters")+ - '\ -
\ -
\ -
\ - \ - \ -
\ -
\ - \ - \ -
\ -
\ -
\ -
\ - \ - \ -
\ -
\ -
\ -
\ -
\ +
\ + '+ + ''+ + ''+ + tr("Advanced Service Parameters")+ + '\ + \
\
\ -
\
\
\

'+tr("Roles")+'

\ @@ -145,7 +116,7 @@ var create_service_template_tmpl = '\
\
\
\ -
\ +
\
\ '+tr("Add another role")+'\
\ @@ -153,16 +124,7 @@ var create_service_template_tmpl = '\
\
\
\ -
\ -
\ - \ - \ - \ -
\ -
\ - ×\ - \ -
'; + '; var role_tab_content = '\
\ @@ -213,27 +175,38 @@ var role_tab_content = '\
\
\
\ -
\
\
\
\
\ -
\
\
\
\
'; +var create_service_template_advanced_html = + '
' + + '
' + + '
' + + '

'+tr("Write the Service template here")+'

' + + '
' + + '
' + + '
' + + '
' + + '' + + '
' + + '
' + + '
'; + function generate_advanced_role_accordion(role_id, context){ context.html( - '
\ -
\ + '
\ '+ ''+ ''+ tr("Advanced Role Parameters")+ '\ -
\ + \ -
\ -
'); +
'); $(document).foundation(); } function generate_elasticity_accordion(role_id, context) { - context.html('
\ -
\ - '+ - ''+ - ''+ - tr("Role Elasticity")+ - '\ -
\ -
\ -
\ - \ - \ -
\ -
\ - \ - \ -
\ -
\ -
\ -
'); +
\ +
\ +
\ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ +
\ + '+tr("Scheduled policies")+'\ +

\ + '+tr("CHANGE: Add/substract the given number of VMs.")+'
\ + '+tr("CARDINALITY: Set the cardinality to the given number.")+'
\ + '+tr("PERCENTAGE_CHANGE: Add/substract the given percentage to the current cardinality.")+ + '" style="width:14%">'+tr("Type")+'\ +
\ + '+tr("CHANGE: -2, will substract 2 VMs from the role")+'
\ + '+tr("CARDINALITY: 8, will set carditanilty to 8")+'
\ + '+tr("PERCENTAGE_CHANGE: 20, will increment cardinality by 20%")+ + '" style="width:12%">'+tr("Adjust")+'\ + 		'+tr("Min")+'\ +
\ + '+tr("Start time: Exact time for the adjustement")+ + '" style="width:28%">'+tr("Time format")+'\ +
\ + '+tr("Recurrence: Time for recurring adjustements. Time is specified with the Unix cron syntax")+'
\ + '+tr("Start time: Exact time for the adjustement")+ + '" style="width:33%">'+tr("Time expression")+'\ +
\ + '+tr("Add another policy")+'\ +
\ +
\ +
\ +
\ +
'); $(document).foundation(); } @@ -440,45 +410,56 @@ var instantiate_service_template_tmpl ='\ var dataTable_service_templates; -var $create_service_template_dialog; var service_template_actions = { "ServiceTemplate.create" : { type: "create", call: OpenNebula.ServiceTemplate.create, - callback: function(request, response) { - //empty creation dialog roles after successful creation -/* - var dialog = $create_service_template_dialog; - $('table#current_roles tbody', dialog).empty(); - $('select[name="parents"]', dialog).empty(); - dialog.foundation('reveal', 'close'); -*/ - $create_service_template_dialog.foundation('reveal', 'close') - $create_service_template_dialog.empty(); + callback: function(request, response){ + $("a[href=back]", $("#oneflow-templates")).trigger("click"); + popFormDialog("create_service_template_form", $("#oneflow-templates")); addServiceTemplateElement(request, response); notifyCustom(tr("Service Template created"), " ID: " + response.DOCUMENT.ID, false); }, - error: onError + error: function(request, response){ + popFormDialog("create_service_template_form", $("#oneflow-templates")); + onError(request, response); + } }, "ServiceTemplate.create_dialog" : { type : "custom", - call: popUpCreateServiceTemplateDialog + call: function(){ + Sunstone.popUpFormPanel("create_service_template_form", "oneflow-templates", "create", false); + } }, "ServiceTemplate.update_dialog" : { type : "single", - call: popUpUpdateServiceTemplateDialog, + call: function(){ + var selected_nodes = getSelectedNodes(dataTable_service_templates); + if ( selected_nodes.length != 1 ) { + notifyMessage("Please select one (and just one) template to update."); + return false; + } + + // Get proper cluster_id + var template_id = ""+selected_nodes[0]; + Sunstone.runAction("ServiceTemplate.show_to_update", template_id); + }, error: onError }, "ServiceTemplate.show_to_update" : { type : "single", call: OpenNebula.ServiceTemplate.show, - callback: fillUpUpdateServiceTemplateDialog, + callback: function(request, response) { + Sunstone.popUpFormPanel("create_service_template_form", "oneflow-templates", "update", true, function(context){ + fillUpUpdateServiceTemplateDialog(response, context) + }); + }, error: onError }, @@ -486,12 +467,16 @@ var service_template_actions = { type: "single", call: OpenNebula.ServiceTemplate.update, callback: function(request,response){ - $create_service_template_dialog.foundation('reveal', 'close'); + $("a[href=back]", $("#oneflow-templates")).trigger("click"); + popFormDialog("create_service_template_form", $("#oneflow-templates")); Sunstone.runAction("ServiceTemplate.show",request.request.data[0][0]); notifyMessage(tr("ServiceTemplate updated correctly")); }, - error: onError + error: function(request, response){ + popFormDialog("create_service_template_form", $("#oneflow-templates")); + onError(request, response); + } }, "ServiceTemplate.list" : { @@ -686,7 +671,24 @@ var service_templates_tab = { \ \ \ - ' + ', + forms: { + "create_service_template_form": { + actions: { + create: { + title: tr("Create Service Template"), + submit_text: tr("Create") + }, + update: { + title: tr("Update Service Template"), + submit_text: tr("Update") + } + }, + wizard_html: create_service_template_wizard_html, + advanced_html: create_service_template_advanced_html, + setup: initialize_create_service_template_dialog + } + } } Sunstone.addActions(service_template_actions); @@ -1227,19 +1229,10 @@ function setup_role_tab_content(role_section, html_role_id) { // Prepare the creation dialog -function setupCreateServiceTemplateDialog(){ - dialogs_context.append('
'); - $create_service_template_dialog = $('#create_service_template_dialog',dialogs_context); - - var dialog = $create_service_template_dialog; - dialog.html(create_service_template_tmpl); - dialog.addClass("reveal-modal large").attr("data-reveal", ""); - +function initialize_create_service_template_dialog(dialog){ setupTips(dialog); - dialog.off(); - - dialog.on("click", ".add_service_network", function(){ + $(".add_service_network", dialog).on("click", function(){ $(".service_networks tbody").append( '\ \ @@ -1258,8 +1251,7 @@ function setupCreateServiceTemplateDialog(){ $(".add_service_network", dialog).trigger("click"); var redo_service_networks_selector = function(dialog){ - $('#roles_tabs_content .role_content', - $create_service_template_dialog).each(function(){ + $('#roles_tabs_content .role_content', dialog).each(function(){ var role_section = this; @@ -1268,8 +1260,7 @@ function setupCreateServiceTemplateDialog(){ }; var redo_service_networks_selector_role = function(dialog, role_section){ - $('#roles_tabs_content .role_content', - $create_service_template_dialog).each(function(){ + $('#roles_tabs_content .role_content', dialog).each(function(){ var role_section = this; @@ -1325,7 +1316,7 @@ function setupCreateServiceTemplateDialog(){ // Append the new div containing the tab and add the tab to the list var role_section = $('
'+ role_tab_content + - '
').appendTo($("#roles_tabs_content")); + '
').appendTo($("#roles_tabs_content", dialog)); generate_elasticity_accordion(role_id, $(".elasticity_accordion", role_section)) generate_advanced_role_accordion(role_id, $(".advanced_role_accordion", role_section)) @@ -1337,7 +1328,7 @@ function setupCreateServiceTemplateDialog(){
"+tr("Role ")+role_id+" \ \ \ - ").appendTo($("dl#roles_tabs")); + ").appendTo($("dl#roles_tabs", dialog)); $("a", a).trigger("click"); @@ -1404,29 +1395,24 @@ function setupCreateServiceTemplateDialog(){ add_role_tab(roles_index); }); - $('#create_service_template_form',dialog).on('invalid', function () { + $('#create_service_template_form_wizard',dialog).on('invalid', function () { notifyError(tr("One or more required fields are missing or malformed.")); + popFormDialog("create_service_template_form", $("#oneflow-templates")); }).on('valid', function() { - if ($('#create_service_template_form',dialog).attr("opennebula_action") == "create") { - var json_template = generate_json_service_template_from_form(); + if ($('#create_service_template_form_wizard',dialog).attr("action") == "create") { + var json_template = generate_json_service_template_from_form(this); Sunstone.runAction("ServiceTemplate.create", json_template ); return false; - } else if ($('#create_service_template_form',dialog).attr("opennebula_action") == "update") { - var json_template = generate_json_service_template_from_form(); + } else if ($('#create_service_template_form_wizard',dialog).attr("action") == "update") { + var json_template = generate_json_service_template_from_form(this); Sunstone.runAction("ServiceTemplate.update",service_template_to_update_id, JSON.stringify(json_template)); return false; } }); - $('#create_service_template_reset', dialog).click(function(){ - dialog.html(""); - setupCreateServiceTemplateDialog(); + // TODO advanced - popUpCreateServiceTemplateDialog(); - }); - - - $(document).foundation(); + dialog.foundation(); roles_index = 0; add_role_tab(roles_index); @@ -1478,12 +1464,12 @@ var removeEmptyObjects = function(obj){ return obj; } -function generate_json_service_template_from_form() { - var name = $('input[name="service_name"]', $create_service_template_dialog).val(); - var description = $('#description', $create_service_template_dialog).val(); - var deployment = $('select[name="deployment"]', $create_service_template_dialog).val(); - var shutdown_action_service = $('select[name="shutdown_action_service"]', $create_service_template_dialog).val(); - var ready_status_gate = $('input[name="ready_status_gate"]', $create_service_template_dialog).prop("checked"); +function generate_json_service_template_from_form(dialog) { + var name = $('input[name="service_name"]', dialog).val(); + var description = $('#description', dialog).val(); + var deployment = $('select[name="deployment"]', dialog).val(); + var shutdown_action_service = $('select[name="shutdown_action_service"]', dialog).val(); + var ready_status_gate = $('input[name="ready_status_gate"]', dialog).prop("checked"); var custom_attrs = {}; @@ -1498,7 +1484,7 @@ function generate_json_service_template_from_form() { var roles = []; - $('#roles_tabs_content .role_content', $create_service_template_dialog).each(function(){ + $('#roles_tabs_content .role_content', dialog).each(function(){ var role = {}; role['name'] = $('input[name="name"]', this).val(); role['cardinality'] = $('input[name="cardinality"]', this).val(); @@ -1587,58 +1573,7 @@ function generate_json_service_template_from_form() { return obj; } -function popUpCreateServiceTemplateDialog(){ - if (!$create_service_template_dialog || $create_service_template_dialog.html() == "") { - setupCreateServiceTemplateDialog(); - } - - var dialog = $create_service_template_dialog; - - dialog.die(); - - $("#create_service_template_form", dialog).attr("opennebula_action", "create"); - $("#create_service_template_header", dialog).show(); - $("#update_service_template_header", dialog).hide(); - $("#create_service_template_submit", dialog).show(); - $("#update_service_template_submit", dialog).hide(); - $("#create_service_template_reset", dialog).show(); - - $("#service_name", dialog).removeAttr("disabled"); - - dialog.foundation().foundation('reveal', 'open'); -} - -function popUpUpdateServiceTemplateDialog() { - var selected_nodes = getSelectedNodes(dataTable_service_templates); - - if ( selected_nodes.length != 1 ) - { - notifyMessage("Please select one (and just one) template to update."); - return false; - } - - if (!$create_service_template_dialog) { - setupCreateServiceTemplateDialog(); - } else { - $create_service_template_dialog.remove(); - setupCreateServiceTemplateDialog(); - } - - var template_id = ""+selected_nodes[0]; - Sunstone.runAction("ServiceTemplate.show_to_update", template_id); -} - - -function fillUpUpdateServiceTemplateDialog(request, response){ - var dialog = $('#create_service_template_dialog',dialogs_context); - - $("#create_service_template_form", dialog).attr("opennebula_action", "update"); - $("#create_service_template_header", dialog).hide(); - $("#update_service_template_header", dialog).show(); - $("#create_service_template_submit", dialog).hide(); - $("#update_service_template_submit", dialog).show(); - $("#create_service_template_reset", dialog).hide(); - +function fillUpUpdateServiceTemplateDialog(response, dialog){ var service_template = response[OpenNebula.ServiceTemplate.resource] $("#service_name", dialog).attr("disabled", "disabled"); $("#service_name", dialog).val(htmlDecode(service_template.NAME)); @@ -1683,7 +1618,7 @@ function fillUpUpdateServiceTemplateDialog(request, response){ $.each(service_template.TEMPLATE.BODY.roles, function(index, value){ more_than_one ? $("#tf_btn_roles", dialog).click() : (more_than_one = true); - var context = $('#roles_tabs_content .role_content', $create_service_template_dialog).last(); + var context = $('#roles_tabs_content .role_content', dialog).last(); $("#role_name", context).val(htmlDecode(value.name)); $("#role_name", context).change(); @@ -1766,7 +1701,7 @@ function fillUpUpdateServiceTemplateDialog(request, response){ $(tab_id+" .parent_roles_body").html(str); - var context = $('#roles_tabs_content .content#role'+index+'Tab', $create_service_template_dialog); + var context = $('#roles_tabs_content .content#role'+index+'Tab', dialog); if (value.parents) { $.each(value.parents, function(index, value){ @@ -1776,13 +1711,6 @@ function fillUpUpdateServiceTemplateDialog(request, response){ }); service_template_to_update_id = service_template.ID; - - dialog.die(); - dialog.live('closed', function () { - $create_service_template_dialog.html(""); - }); - - dialog.foundation('reveal', 'open'); } function popUpInstantiateServiceTemplateDialog(){