From 7c23ffdb9366b963903e5042cd5850e557cfee20 Mon Sep 17 00:00:00 2001 From: Jessica Wang Date: Sun, 24 Oct 2010 23:14:25 -0700 Subject: [PATCH] new UI - instance page - implement Start VM button (multiple-selection in middle menu). --- ui/new/scripts/cloud.core2.instance.js | 61 +++++++++++++++++++------- ui/new/scripts/cloud.core2.js | 25 ++++++----- 2 files changed, 61 insertions(+), 25 deletions(-) diff --git a/ui/new/scripts/cloud.core2.instance.js b/ui/new/scripts/cloud.core2.instance.js index 5bb7fbdb20c..a35fc229bd6 100644 --- a/ui/new/scripts/cloud.core2.instance.js +++ b/ui/new/scripts/cloud.core2.instance.js @@ -61,16 +61,58 @@ function afterLoadInstanceJSP() { $("#midmenu_add_link").find("#label").text("Add VM"); $("#midmenu_add_link").show(); - //action menu + //middle menu actions + /* $("#midmenu_action_link").show(); $("#action_menu #action_list").empty(); for(var label in vmActionMapForMidMenu) buildActionLinkForMidMenu(label, vmActionMapForMidMenu, $("#action_menu")); + */ if (isAdmin() || isDomainAdmin()) $("#right_panel_content").find("#tab_router,#tab_router").show(); - - initDialog("dialog_detach_iso_from_vm"); + + //Start VM button + $("#midmenu_startvm_link").show(); + $("#midmenu_startvm_link").bind("click", function(event) { + var itemCounts = 0; + for(var id in selectedItemsInMidMenu) { + itemCounts ++; + } + if(itemCounts == 0) { + $("#dialog_info_please_select_one_item_in_middle_menu").dialog("open"); + return; + } + + for(var id in selectedItemsInMidMenu) { + var apiCommand = "command=startVirtualMachine&id="+id; + var apiInfo = { + label: "Start Instance", + isAsyncJob: true, + asyncJobResponse: "startvirtualmachineresponse", + afterActionSeccessFn: function(json, $midmenuItem1, id) { + var jsonObj = json.queryasyncjobresultresponse.jobresult.startvirtualmachineresponse; + vmToMidmenu(jsonObj, $midmenuItem1); + vmToRightPanel($midmenuItem1); + } + } + doActionForMidMenu(id, apiInfo, apiCommand); + } + + selectedItemsInMidMenu = {}; //clear selected items for action + return false; + }); + + // switch between different tabs + var tabArray = [$("#tab_details"), $("#tab_volume"), $("#tab_statistics"), $("#tab_router")]; + var tabContentArray = [$("#tab_content_details"), $("#tab_content_volume"), $("#tab_content_statistics"), $("#tab_content_router")]; + switchBetweenDifferentTabs(tabArray, tabContentArray); + + //initialize VM Wizard + initVMWizard(); + + // dialogs + initDialog("dialog_detach_iso_from_vm"); initDialog("dialog_attach_iso"); initDialog("dialog_change_name"); initDialog("dialog_change_group"); @@ -79,18 +121,7 @@ function afterLoadInstanceJSP() { initDialog("dialog_confirmation_enable_ha"); initDialog("dialog_confirmation_disable_ha"); initDialog("dialog_create_template", 400); - - //***** switch between different tabs (begin) ******************************************************************** - var tabArray = [$("#tab_details"), $("#tab_volume"), $("#tab_statistics"), $("#tab_router")]; - var tabContentArray = [$("#tab_content_details"), $("#tab_content_volume"), $("#tab_content_statistics"), $("#tab_content_router")]; - switchBetweenDifferentTabs(tabArray, tabContentArray); - //***** switch between different tabs (end) ********************************************************************** - - //***** VM Wizard (begin) ****************************************************************************** - initVMWizard(); - //***** VM Wizard (end) ******************************************************************************** - - //***** Volume tab (begin) ***************************************************************************** + $.ajax({ data: createURL("command=listOsTypes&response=json"), dataType: "json", diff --git a/ui/new/scripts/cloud.core2.js b/ui/new/scripts/cloud.core2.js index 1c3413cdb76..b6bda6a682e 100644 --- a/ui/new/scripts/cloud.core2.js +++ b/ui/new/scripts/cloud.core2.js @@ -285,12 +285,17 @@ function buildActionLinkForMidMenu(label, actionMap, $actionMenu) { var $listItem = $("#action_list_item_middle_menu").clone(); $actionMenu.find("#action_list").append($listItem.show()); var $link = $listItem.find("#link").text(label); + $link.data("apiInfo", apiInfo); + + /* $link.data("label", label); - $link.data("api", apiInfo.api); + $link.data("api",apiInfo .api); $link.data("isAsyncJob", apiInfo.isAsyncJob); $link.data("asyncJobResponse", apiInfo.asyncJobResponse); $link.data("afterActionSeccessFn", apiInfo.afterActionSeccessFn); $link.data("dialogBeforeActionFn", apiInfo.dialogBeforeActionFn); + */ + $link.bind("click", function(event) { $actionMenu.hide(); @@ -308,11 +313,11 @@ function buildActionLinkForMidMenu(label, actionMap, $actionMenu) { if(dialogBeforeActionFn == null) { for(var id in selectedItemsInMidMenu) { var apiCommand = "command="+$actionLink.data("api")+"&id="+id; - doActionForMidMenu(id, $actionLink, apiCommand); + doActionForMidMenu(id, apiInfo, apiCommand); } } else { - dialogBeforeActionFn($actionLink, selectedItemsInMidMenu); + dialogBeforeActionFn(apiInfo, selectedItemsInMidMenu); } selectedItemsInMidMenu = {}; //clear selected items for action @@ -320,11 +325,11 @@ function buildActionLinkForMidMenu(label, actionMap, $actionMenu) { }); } -function doActionForMidMenu(id, $actionLink, apiCommand) { - var label = $actionLink.data("label"); - var isAsyncJob = $actionLink.data("isAsyncJob"); - var asyncJobResponse = $actionLink.data("asyncJobResponse"); - var afterActionSeccessFn = $actionLink.data("afterActionSeccessFn"); +function doActionForMidMenu(id, apiInfo, apiCommand) { + var label = apiInfo.label; + var isAsyncJob = apiInfo.isAsyncJob; + var asyncJobResponse = apiInfo.asyncJobResponse; + var afterActionSeccessFn = apiInfo.afterActionSeccessFn; var $midmenuItem1 = $("#midmenuItem_"+id); $midmenuItem1.find("#content").removeClass("selected").addClass("inaction"); @@ -357,7 +362,7 @@ function doActionForMidMenu(id, $actionLink, apiCommand) { if (result.jobstatus == 1) { // Succeeded $midmenuItem1.find("#info_icon").removeClass("error").show(); $midmenuItem1.data("afterActionInfo", (label + " action succeeded.")); - afterActionSeccessFn(json, $midmenuItem1); + afterActionSeccessFn(json, $midmenuItem1, id); } else if (result.jobstatus == 2) { // Failed $midmenuItem1.find("#info_icon").addClass("error").show(); $midmenuItem1.data("afterActionInfo", (label + " action failed. Reason: " + fromdb(result.jobresult))); @@ -391,7 +396,7 @@ function doActionForMidMenu(id, $actionLink, apiCommand) { $midmenuItem1.find("#spinning_wheel").hide(); $midmenuItem1.find("#info_icon").removeClass("error").show(); $midmenuItem1.data("afterActionInfo", (label + " action succeeded.")); - afterActionSeccessFn(json, $midmenuItem1); + afterActionSeccessFn(json, $midmenuItem1, id); }, error: function(XMLHttpResponse) { handleErrorInMidMenu(XMLHttpResponse, $midmenuItem1);