Permalink
Browse files

Patch puts the dialogs in separate HTML and JavaScript files. The dia…

…log HTML is loaded using AJAX at runtime (Achim Hasenmueller).

git-svn-id: http://vboxweb.googlecode.com/svn/trunk@70 729376a8-6c6b-11de-afdd-bb9f892af8c1
  • Loading branch information...
vboxweb
vboxweb committed Aug 24, 2009
1 parent a04a307 commit c6abd4d80c6e30a54002dae06f7c5a2920d45c4c
Showing with 226 additions and 143 deletions.
  1. +4 −1 VBoxWebSrv.py
  2. +106 −0 www/static/js/vboxDialogs.js
  3. +1 −1 www/static/js/vboxVMToolbar.js
  4. +111 −0 www/templates/dialogs.html
  5. +4 −141 www/templates/index.html
View
@@ -604,7 +604,10 @@ def run(self):
'tools.staticdir.dir': 'www/static'},
'/images': {
'tools.staticdir.on': True,
- 'tools.staticdir.dir': 'www/static/images'}}
+ 'tools.staticdir.dir': 'www/static/images'},
+ '/html': {
+ 'tools.staticdir.on': True,
+ 'tools.staticdir.dir': 'www/templates'}}
)
if __name__ == '__main__':
@@ -0,0 +1,106 @@
+
+/* Copyright (C) 2009 Sun Microsystems, Inc.
+
+ * Permission is hereby granted, free of charge, to any person
+ * obtaining a copy of this software and associated documentation
+ * files (the "Software"), to deal in the Software without
+ * restriction, including without limitation the rights to use,
+ * copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the
+ * Software is furnished to do so, subject to the following
+ * conditions:
+
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var vboxDialogs = Class.create(
+{
+ /*
+ * This performs the initial setup work for the dialogs, like
+ * loading the HTML file and inserting it into the DOM, configuring
+ * the DIVs, etc. Called when the HTML loads.
+ */
+ initDialogs: function()
+ {
+ /* load the dialogs HTML file with a completion function */
+ jQuery.get("/html/dialogs.html", function(data) {
+ /* append the loaded HTML to the body section */
+ jQuery("body").append(data);
+
+ jQuery(function() {
+ jQuery("#poweroff-dialog").dialog({
+ bgiframe: true,
+ resizable: false,
+ height:200,
+ modal: true,
+ autoOpen: false,
+ overlay: {
+ backgroundColor: '#000',
+ opacity: 0.5
+ },
+ buttons: {
+ Ok: function() {
+ var poweroffMethod = jQuery("input[@name='poweroff-dialog-selection']:checked").val();
+ if (poweroffMethod == "savestate")
+ vbGlobal.mVirtualBox.savestateVM(vmSelWnd.curItem().id());
+ else if (poweroffMethod == "acpipoweroff")
+ vbGlobal.mVirtualBox.acpipoweroffVM(vmSelWnd.curItem().id());
+ else
+ vbGlobal.mVirtualBox.poweroffVM(vmSelWnd.curItem().id());
+ jQuery(this).dialog('close');
+ },
+ Cancel: function() {
+ jQuery(this).dialog('close');
+ }
+ }
+ });
+ });
+
+ jQuery(function(){
+ jQuery("#newvm-form").formwizard({
+ //form wizard settings
+ historyEnabled : true,
+ formPluginEnabled: true,
+ validationEnabled : true},
+ {
+ //validation settings
+ },
+ {
+ // form plugin settings
+ }
+ );
+ });
+ jQuery(function() {
+ jQuery("#newvm-dialog").dialog({
+ bgiframe: true,
+ resizable: false,
+ height: 360,
+ width: 550,
+ modal: true,
+ autoOpen: false,
+ overlay: {
+ backgroundColor: '#000',
+ opacity: 0.5
+ }
+ });
+ });
+ });
+ },
+
+ showNewVMWizard: function()
+ {
+ /** @todo go to the first page of the wizard (how?) */
+ jQuery("#newvm-dialog").dialog("open");
+ }
+
+});
@@ -63,7 +63,7 @@ var vboxVMToolbar = Class.create(
switch (event.target.id)
{
case "toolbar-button-new":
- jQuery("#newvm-dialog").dialog("open");
+ vboxDialogs.showNewVMWizard();
break;
case "toolbar-button-settings":
View
@@ -0,0 +1,111 @@
+<!--
+ * Copyright (C) 2009 Sun Microsystems, Inc.
+
+ * Permission is hereby granted, free of charge, to any person
+ * obtaining a copy of this software and associated documentation
+ * files (the "Software"), to deal in the Software without
+ * restriction, including without limitation the rights to use,
+ * copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the
+ * Software is furnished to do so, subject to the following
+ * conditions:
+
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+-->
+
+<html>
+ <head></head>
+ <body>
+ <!-- VM power off dialog, initially hidden, displayed using jQuery -->
+ <div id="poweroff-dialog" title="Close virtual machine" style="display: none;">
+ <table width="100%" cellspacing="0">
+ <tr>
+ <td><img src="/images/vbox/state_saved_16px.png" alt=""/></td>
+ <td><input type="radio" name="poweroff-dialog-selection" value="savestate" checked="checked">Save the machine state</input></td>
+ </tr>
+ <tr>
+ <td><img src="/images/vbox/state_powered_off_16px.png" alt=""/></td>
+ <td><input type="radio" name="poweroff-dialog-selection" value="acpipoweroff">Send the shutdown signal</input></td>
+ </tr>
+ <tr>
+ <td><img src="/images/vbox/poweroff_16px.png" alt=""/></td>
+ <td><input type="radio" name="poweroff-dialog-selection" value="poweroff">Power off the machine</input></td>
+ </tr>
+ </table>
+ </div>
+
+ <div id="newvm-dialog" title="Create a new Virtual Machine" style="display: none;">
+ <table width="100%">
+ <tr align="top">
+ <td style="padding-right: 10px; padding-top: 10px;">
+ <img src="/images/vbox/vmw_new_welcome.png" alt=""/>
+ </td>
+ <td valign="top" width="100%">
+ <form id="newvm-form" method="post" action="#">
+ <div class="step" style="height: 220px;">
+ <table width="100%">
+ <tr>
+ <td class="wizardpagetitle">Welcome to the New Virtual Machine Wizard!</td>
+ </tr>
+ <tr>
+ <td class="wizardform">This wizard will guide you through the steps that are necessary to create a new virtual
+ machine on your VirtualBox host.<p>
+ Use the <b>Next</b> button to go to the next page of the wizard and the <b>Back</b>
+ button to return to the previous page.</p></td>
+ </tr>
+ </table>
+ </div>
+ <div class="step" style="height: 220px;">
+ <table width="100%">
+ <tr>
+ <td class="wizardpagetitle">VM Name and OS Type</td>
+ </tr>
+ <tr>
+ <td class="wizardform"><input disabled="disabled" type="text" value="" /><br />
+ <input disabled="disabled" type="text" value="" /><br />
+ <input disabled="disabled" type="text" value="" /><br />
+ <select class="link" >
+ <option value="" >Choose the step to go to...</option>
+ <option value="step3" >Go to Step3</option>
+ <option value="step4" >Go to Step4</option>
+ </select><br /></td>
+ </tr>
+ </table>
+ </div>
+ <div id="step3" class="step" style="height: 220px;">
+ <h1>step 3 - submit step</h1>
+ <input disabled="disabled" type="text" value="" /><br />
+ <input disabled="disabled" type="text" value="" class="required"/><br />
+ <input disabled="disabled" type="hidden" class="link" value="submit_step" />
+ </div>
+ <div id="step4" class="step" style="height: 220px;">
+ <h1>step 4</h1>
+ <input disabled="disabled" type="text" value="" /><br />
+ <input disabled="disabled" type="text" name="email" class="required email" /><br />
+ </div>
+ <div id="step5" class="step" style="height: 220px;">
+ <h1>step 5 - last step</h1>
+ <input disabled="disabled" type="text" value="" /><br />
+ <input disabled="disabled" type="text" value="" /><br />
+ </div>
+ <div>
+ <input type="reset" value="Reset" />
+ <input type="submit" value="Submit" />
+ </div>
+ </form>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </body>
+</html>
Oops, something went wrong.

0 comments on commit c6abd4d

Please sign in to comment.