mirror of
https://github.com/apache/cloudstack.git
synced 2025-11-02 20:02:29 +01:00
new UI - Add Zone Wizard - implement close button, next button and previous button.
This commit is contained in:
Jessica Wang
parent
b1194e68f7
commit
546db0715c
@ -34,7 +34,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="dbrow_cell" style="width: 10%; border: none;">
|
||||
<div class="resadd_button" title="Add Zone"></div>
|
||||
<div id="add_zone_shortcut" class="resadd_button" title="Add Zone"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dbrow odd" style="margin-top:10px; border:1px solid #CCC;">
|
||||
@ -49,7 +49,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="dbrow_cell" style="width: 10%; border: none;">
|
||||
<div class="resadd_button" title="Add Pod"></div>
|
||||
<div id="add_pod_shortcut" class="resadd_button" title="Add Pod"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -66,7 +66,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="dbrow_cell" style="width: 10%; border: none;">
|
||||
<div class="resadd_button" title="Add Host"></div>
|
||||
<div id="add_host_shortcut" class="resadd_button" title="Add Host"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -83,7 +83,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="dbrow_cell" style="width: 10%; border: none;">
|
||||
<div class="resadd_button" title="Add Primary Storage"></div>
|
||||
<div id="add_primarystorage_shortcut" class="resadd_button" title="Add Primary Storage"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -93,8 +93,10 @@
|
||||
|
||||
|
||||
<!-- Zone wizard (begin)-->
|
||||
<div class="ui-widget-overlay" style="display:none;"></div>
|
||||
<div class="zonepopup_container" style="display: none">
|
||||
<div id="wizard_overlay" class="ui-widget-overlay" style="display:none;"></div>
|
||||
|
||||
<div id="add_zone_wizard" class="zonepopup_container" style="display: none">
|
||||
<!-- step 1 (begin) -->
|
||||
<div id="step1" style="display: block;">
|
||||
<div class="zonepopup_container_top">
|
||||
<div class="vmpopup_steps" style="color: #FFF; background: url(images/step1_bg.png) no-repeat top left">
|
||||
@ -148,10 +150,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_prevbutton" id="prev_step" style="display: none;">
|
||||
</div>
|
||||
<div class="vmpop_nextbutton" id="next_step">
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_nextbutton" id="go_to_step_2">
|
||||
Go to Step 2</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -159,8 +159,9 @@
|
||||
<div class="zonepopup_container_bot">
|
||||
</div>
|
||||
</div>
|
||||
<!-- step 1 (end) -->
|
||||
|
||||
|
||||
<!-- step 2 (begin) -->
|
||||
<div id="step2" style="display: none;">
|
||||
<div class="zonepopup_container_top">
|
||||
<div class="vmpopup_steps" style="background: url(images/step1_bg_unselected.png) no-repeat top left">
|
||||
@ -245,10 +246,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_prevbutton" id="prev_step" style="display: block;">
|
||||
<div class="vmpop_prevbutton" id="back_to_step_1" style="display: block;">
|
||||
Back
|
||||
</div>
|
||||
<div class="vmpop_nextbutton" id="next_step">
|
||||
<div class="vmpop_nextbutton" id="go_to_step_3">
|
||||
Go to Step 3</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -256,9 +257,9 @@
|
||||
<div class="zonepopup_container_bot">
|
||||
</div>
|
||||
</div>
|
||||
<!-- step 2 (end) -->
|
||||
|
||||
|
||||
|
||||
<!-- step 3 (begin) -->
|
||||
<div id="step3" style="display: none;">
|
||||
<div class="zonepopup_container_top">
|
||||
<div class="vmpopup_steps" style="background: url(images/step1_bg_unselected.png) no-repeat top left">
|
||||
@ -321,20 +322,22 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_prevbutton" id="prev_step" style="display: block;">
|
||||
Back
|
||||
<div class="vmpop_prevbutton" id="back_to_step_2" style="display: block;">
|
||||
Back
|
||||
</div>
|
||||
<div class="vmpop_nextbutton" id="submit_button">
|
||||
Submit
|
||||
</div>
|
||||
<div class="vmpop_nextbutton" id="next_step">
|
||||
Submit</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zonepopup_container_bot">
|
||||
</div>
|
||||
</div>
|
||||
<!-- step 3 (end) -->
|
||||
|
||||
|
||||
<div id="step4" style="display: none;">
|
||||
<!-- after submit screen (begin) -->
|
||||
<div id="after_submit_screen" style="display: none;">
|
||||
<div class="zonepopup_container_top">
|
||||
<div class="vmpopup_steps" style="background: url(images/step1_bg_unselected.png) no-repeat top left">
|
||||
Step 1</div>
|
||||
@ -351,25 +354,23 @@
|
||||
<div class="zonepopup_maincontentarea">
|
||||
|
||||
<div class="zonepopup_contentpanel">
|
||||
<div class="zonepoup_loadingbox" style="display:none;">
|
||||
<div id="spinning_wheel" class="zonepoup_loadingbox" style="display:none;">
|
||||
<div class="zonepoup_loader"></div>
|
||||
<p> Adding Zone to Physical Resources</p>
|
||||
</div>
|
||||
|
||||
<div class="zonepoup_msgbox"> Confirmation msg will appear here</div>
|
||||
<div id="confirmation_message" class="zonepoup_msgbox"> Confirmation msg will appear here</div>
|
||||
</div>
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_prevbutton" id="prev_step" style="display: block;">
|
||||
Cancel
|
||||
</div>
|
||||
<div class="vmpop_nextbutton" id="next_step">
|
||||
OK</div>
|
||||
<div class="zonepopup_navigationpanel">
|
||||
<div class="vmpop_nextbutton" id="close_button">
|
||||
Close</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zonepopup_container_bot">
|
||||
</div>
|
||||
</div>
|
||||
<!-- after submit screen (end) -->
|
||||
|
||||
</div>
|
||||
<!-- Zone wizard (end)-->
|
||||
|
||||
@ -249,8 +249,12 @@ function afterLoadResourceJSP($midmenuItem1) {
|
||||
initAddZoneButton($("#midmenu_add_link"));
|
||||
initUpdateConsoleCertButton($("#midmenu_add2_link"));
|
||||
initDialog("dialog_add_zone");
|
||||
initDialog("dialog_update_cert", 450);
|
||||
|
||||
initDialog("dialog_update_cert", 450);
|
||||
resourceCountTotal();
|
||||
initAddZoneShortcut();
|
||||
}
|
||||
|
||||
function resourceCountTotal() {
|
||||
$.ajax({
|
||||
data: createURL("command=listZones&available=true"),
|
||||
dataType: "json",
|
||||
@ -295,7 +299,67 @@ function afterLoadResourceJSP($midmenuItem1) {
|
||||
$("#primarystorage_total").text(items.length.toString());
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function refreshAddZoneWizard() {
|
||||
$("#add_zone_wizard").find("#step2, #step3, #after_submit_screen").hide();
|
||||
$("#add_zone_wizard").find("#step1").show();
|
||||
}
|
||||
|
||||
function openAddZoneWizard() {
|
||||
refreshAddZoneWizard();
|
||||
$("#add_zone_wizard").show();
|
||||
$("#wizard_overlay").show();
|
||||
}
|
||||
|
||||
function closeAddZoneWizard() {
|
||||
$("#add_zone_wizard").hide();
|
||||
$("#wizard_overlay").hide();
|
||||
}
|
||||
|
||||
function initAddZoneShortcut() {
|
||||
$("#add_zone_shortcut").unbind("click").bind("click", function(event) {
|
||||
openAddZoneWizard();
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#add_zone_wizard").unbind("click").bind("click", function(event) {
|
||||
var $thisWizard = $(this);
|
||||
var $target = $(event.target);
|
||||
switch($target.attr("id")) {
|
||||
case "close_button":
|
||||
closeAddZoneWizard();
|
||||
break;
|
||||
|
||||
case "go_to_step_2": //step 1 => step 2
|
||||
$thisWizard.find("#step1").hide();
|
||||
$thisWizard.find("#step2").show();
|
||||
break;
|
||||
|
||||
case "go_to_step_3": //step 2 => step 3
|
||||
$thisWizard.find("#step2").hide();
|
||||
$thisWizard.find("#step3").show();
|
||||
break;
|
||||
|
||||
case "submit_button": //step 3 => spinning wheel
|
||||
$thisWizard.find("#step3").hide();
|
||||
$thisWizard.find("#after_submit_screen").show();
|
||||
break;
|
||||
|
||||
case "back_to_step_2": //step 3 => step 2
|
||||
$thisWizard.find("#step3").hide();
|
||||
$thisWizard.find("#step2").show();
|
||||
break;
|
||||
|
||||
case "back_to_step_1": //step 2 => step 1
|
||||
$thisWizard.find("#step2").hide();
|
||||
$thisWizard.find("#step1").show();
|
||||
break;
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
function initUpdateConsoleCertButton($midMenuAddLink2) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user