Use a consistent naming convention for elements

* Element names we use "_" as word-delimiter, not "-"
* Element names use less camel-case
* Element names end with the type
* Element names always start with noVNC_

include/base.css

@@ -56,10 +56,10 @@ html {
 #noVNC_view_drag_button {
   display: none;
 }
-#sendCtrlAltDelButton {
+#noVNC_sendCtrlAltDel_button {
   display: none;
 }
-#fullscreenButton {
+#noVNC_fullscreen_button {
   display: none;
 }
 #noVNC_xvp_buttons {
@@ -77,13 +77,13 @@ html {
   position: relative;
 }
 
-.noVNC-buttons-left {
+.noVNC_buttons_left {
   float: left;
   z-index: 1;
   position: relative;
 }
 
-.noVNC-buttons-right {
+.noVNC_buttons_right {
   float:right;
   right: 0px;
   z-index: 2;
@@ -233,7 +233,7 @@ html {
   right:85px;
 }
 
-#keyboardinput {
+#noVNC_keyboardinput {
   width:1px;
   height:1px;
   background-color:#fff;
@@ -278,7 +278,7 @@ html {
 }
 
 /* Control bar */
-#noVNC-control-bar {
+#noVNC_control_bar {
   position:fixed;
   
   display:block;
@@ -427,11 +427,11 @@ html {
   font-size: 180px;
 }
 
-.noVNC-buttons-left {
+.noVNC_buttons_left {
   padding-left: 10px;
 }
 
-.noVNC-buttons-right {
+.noVNC_buttons_right {
   padding-right: 10px;
 }
 
@@ -442,11 +442,11 @@ html {
   margin-left: 0px;
 }
 
-#toggleExtraKeysButton { display: none; }
-#toggleCtrlButton { display: inline; }
-#toggleAltButton {  display: inline; }
-#sendTabButton { display: inline; }
-#sendEscButton { display: inline; }
+#noVNC_toggleExtraKeys_button { display: none; }
+#noVNC_toggleCtrl_button { display: inline; }
+#noVNC_toggleAlt_button {  display: inline; }
+#noVNC_sendTab_button { display: inline; }
+#noVNC_sendEsc_button { display: inline; }
 
 /* left-align the status text on lower resolutions */
 @media screen and (max-width: 800px){
@@ -469,35 +469,35 @@ html {
   .noVNC_status_button {
     font-size: 10px;
   }
-  .noVNC-buttons-left {
+  .noVNC_buttons_left {
     padding-left: 0px;
   }
-  .noVNC-buttons-right {
+  .noVNC_buttons_right {
     padding-right: 0px;
   }
   /* collapse the extra keys on lower resolutions */
-  #toggleExtraKeysButton {
+  #noVNC_toggleExtraKeys_button {
     display: inline;
   }
-  #toggleCtrlButton {
+  #noVNC_toggleCtrl_button {
     display: none;
     position: absolute;
     top: 30px;
     left: 0px;
   }
-  #toggleAltButton {
+  #noVNC_toggleAlt_button {
     display: none;
     position: absolute;
     top: 65px;
     left: 0px;
   }
-  #sendTabButton {
+  #noVNC_sendTab_button {
     display: none;
     position: absolute;
     top: 100px;
     left: 0px;
   }
-  #sendEscButton {
+  #noVNC_sendEsc_button {
     display: none;
     position: absolute;
     top: 135px;

include/black.css

@@ -6,7 +6,7 @@
  * This file is licensed under the 2-Clause BSD license (see LICENSE.txt).
  */
 
-#keyboardinput {
+#noVNC_keyboardinput {
   background-color:#000;
 }
 

include/blue.css

@@ -58,7 +58,7 @@
   color:#fff;
 }
 
-#keyboardinput {
+#noVNC_keyboardinput {
   background-color:#04073d;
 }
 

include/ui.js

@@ -148,7 +148,7 @@ var UI;
                  document.documentElement.mozRequestFullScreen ||
                  document.documentElement.webkitRequestFullscreen ||
                  document.body.msRequestFullscreen)) {
-                $D('fullscreenButton').style.display = "inline";
+                $D('noVNC_fullscreen_button').style.display = "inline";
                 Util.addEvent(window, 'fullscreenchange', UI.updateFullscreenButton);
                 Util.addEvent(window, 'mozfullscreenchange', UI.updateFullscreenButton);
                 Util.addEvent(window, 'webkitfullscreenchange', UI.updateFullscreenButton);
@@ -205,31 +205,31 @@ var UI;
             $D("noVNC_mouse_button1").onclick = function () { UI.setMouseButton(2); };
             $D("noVNC_mouse_button2").onclick = function () { UI.setMouseButton(4); };
             $D("noVNC_mouse_button4").onclick = function () { UI.setMouseButton(0); };
-            $D("showKeyboard").onclick = UI.showKeyboard;
-
-            $D("keyboardinput").oninput = UI.keyInput;
-            $D("keyboardinput").onblur = UI.hideKeyboard;
-            $D("keyboardinput").onsubmit = function () { return false; };
-
-            $D("toggleExtraKeysButton").onclick = UI.toggleExtraKeys;
-            $D("toggleCtrlButton").onclick = UI.toggleCtrl;
-            $D("toggleAltButton").onclick = UI.toggleAlt;
-            $D("sendTabButton").onclick = UI.sendTab;
-            $D("sendEscButton").onclick = UI.sendEsc;
-
-            $D("sendCtrlAltDelButton").onclick = UI.sendCtrlAltDel;
-            $D("xvpShutdownButton").onclick = function() { UI.rfb.xvpShutdown(); },
-            $D("xvpRebootButton").onclick = function() { UI.rfb.xvpReboot(); },
-            $D("xvpResetButton").onclick = function() { UI.rfb.xvpReset(); },
+            $D("noVNC_keyboard_button").onclick = UI.showKeyboard;
+
+            $D("noVNC_keyboardinput").oninput = UI.keyInput;
+            $D("noVNC_keyboardinput").onblur = UI.hideKeyboard;
+            $D("noVNC_keyboardinput").onsubmit = function () { return false; };
+
+            $D("noVNC_toggleExtraKeys_button").onclick = UI.toggleExtraKeys;
+            $D("noVNC_toggleCtrl_button").onclick = UI.toggleCtrl;
+            $D("noVNC_toggleAlt_button").onclick = UI.toggleAlt;
+            $D("noVNC_sendTab_button").onclick = UI.sendTab;
+            $D("noVNC_sendEsc_button").onclick = UI.sendEsc;
+
+            $D("noVNC_sendCtrlAltDel_button").onclick = UI.sendCtrlAltDel;
+            $D("noVNC_xvpShutdown_button").onclick = function() { UI.rfb.xvpShutdown(); },
+            $D("noVNC_xvpReboot_button").onclick = function() { UI.rfb.xvpReboot(); },
+            $D("noVNC_xvpReset_button").onclick = function() { UI.rfb.xvpReset(); },
             $D("noVNC_status").onclick = UI.popupStatus;
             $D("noVNC_popup_status").onclick = UI.closePopup;
-            $D("xvpButton").onclick = UI.toggleXvpPanel;
-            $D("clipboardButton").onclick = UI.toggleClipboardPanel;
-            $D("fullscreenButton").onclick = UI.toggleFullscreen;
-            $D("settingsButton").onclick = UI.toggleSettingsPanel;
-            $D("connectButton").onclick = UI.toggleConnectPanel;
-            $D("disconnectButton").onclick = UI.disconnect;
-            $D("descriptionButton").onclick = UI.toggleConnectPanel;
+            $D("noVNC_toggleXvp_button").onclick = UI.toggleXvpPanel;
+            $D("noVNC_clipboard_button").onclick = UI.toggleClipboardPanel;
+            $D("noVNC_fullscreen_button").onclick = UI.toggleFullscreen;
+            $D("noVNC_settings_button").onclick = UI.toggleSettingsPanel;
+            $D("noVNC_connectPanel_button").onclick = UI.toggleConnectPanel;
+            $D("noVNC_disconnect_button").onclick = UI.disconnect;
+            $D("noVNC_description_button").onclick = UI.toggleConnectPanel;
 
             $D("noVNC_clipboard_text").onfocus = UI.displayBlur;
             $D("noVNC_clipboard_text").onblur = UI.displayFocus;
@@ -284,7 +284,7 @@ var UI;
             }
 
             if (typeof(msg) !== 'undefined') {
-                $D('noVNC-control-bar').setAttribute("class", klass);
+                $D('noVNC_control_bar').setAttribute("class", klass);
                 $D('noVNC_status').innerHTML = msg;
             }
 
@@ -315,16 +315,16 @@ var UI;
             if (connected) {
                 UI.setViewClip();
                 UI.setMouseButton(1);
-                $D('clipboardButton').style.display = "inline";
-                $D('showKeyboard').style.display = "inline";
+                $D('noVNC_clipboard_button').style.display = "inline";
+                $D('noVNC_keyboard_button').style.display = "inline";
                 $D('noVNC_extra_keys').style.display = "";
-                $D('sendCtrlAltDelButton').style.display = "inline";
+                $D('noVNC_sendCtrlAltDel_button').style.display = "inline";
             } else {
                 UI.setMouseButton();
-                $D('clipboardButton').style.display = "none";
-                $D('showKeyboard').style.display = "none";
+                $D('noVNC_clipboard_button').style.display = "none";
+                $D('noVNC_keyboard_button').style.display = "none";
                 $D('noVNC_extra_keys').style.display = "none";
-                $D('sendCtrlAltDelButton').style.display = "none";
+                $D('noVNC_sendCtrlAltDel_button').style.display = "none";
                 UI.updateXvpButton(0);
             }
 
@@ -336,18 +336,18 @@ var UI;
                 case 'fatal':
                 case 'failed':
                 case 'disconnected':
-                    $D('connectButton').style.display = "";
-                    $D('disconnectButton').style.display = "none";
+                    $D('noVNC_connectPanel_button').style.display = "";
+                    $D('noVNC_disconnect_button').style.display = "none";
                     UI.connSettingsOpen = false;
                     UI.toggleConnectPanel();
                     break;
                 case 'loaded':
-                    $D('connectButton').style.display = "";
-                    $D('disconnectButton').style.display = "none";
+                    $D('noVNC_connectPanel_button').style.display = "";
+                    $D('noVNC_disconnect_button').style.display = "none";
                     break;
                 default:
-                    $D('connectButton').style.display = "none";
-                    $D('disconnectButton').style.display = "";
+                    $D('noVNC_connectPanel_button').style.display = "none";
+                    $D('noVNC_disconnect_button').style.display = "";
                     break;
             }
 
@@ -512,14 +512,14 @@ var UI;
                 UI.toggleXvpPanel();
             }
             $D('noVNC_settings').style.display = "block";
-            $D('settingsButton').className = "noVNC_status_button_selected";
+            $D('noVNC_settings_button').className = "noVNC_status_button_selected";
             UI.settingsOpen = true;
         },
 
         // Close menu (without applying settings)
         closeSettingsMenu: function() {
             $D('noVNC_settings').style.display = "none";
-            $D('settingsButton').className = "noVNC_status_button";
+            $D('noVNC_settings_button').className = "noVNC_status_button";
             UI.settingsOpen = false;
         },
 
@@ -580,11 +580,11 @@ var UI;
             // Toggle XVP panel
             if (UI.xvpOpen === true) {
                 $D('noVNC_xvp').style.display = "none";
-                $D('xvpButton').className = "noVNC_status_button";
+                $D('noVNC_toggleXvp_button').className = "noVNC_status_button";
                 UI.xvpOpen = false;
             } else {
                 $D('noVNC_xvp').style.display = "block";
-                $D('xvpButton').className = "noVNC_status_button_selected";
+                $D('noVNC_toggleXvp_button').className = "noVNC_status_button_selected";
                 UI.xvpOpen = true;
             }
         },
@@ -592,9 +592,9 @@ var UI;
         // Disable/enable XVP button
         updateXvpButton: function(ver) {
             if (ver >= 1) {
-                $D('xvpButton').style.display = 'inline';
+                $D('noVNC_toggleXvp_button').style.display = 'inline';
             } else {
-                $D('xvpButton').style.display = 'none';
+                $D('noVNC_toggleXvp_button').style.display = 'none';
                 // Close XVP panel if open
                 if (UI.xvpOpen === true) {
                     UI.toggleXvpPanel();
@@ -628,11 +628,11 @@ var UI;
             // Toggle Clipboard Panel
             if (UI.clipboardOpen === true) {
                 $D('noVNC_clipboard').style.display = "none";
-                $D('clipboardButton').className = "noVNC_status_button";
+                $D('noVNC_clipboard_button').className = "noVNC_status_button";
                 UI.clipboardOpen = false;
             } else {
                 $D('noVNC_clipboard').style.display = "block";
-                $D('clipboardButton').className = "noVNC_status_button_selected";
+                $D('noVNC_clipboard_button').className = "noVNC_status_button_selected";
                 UI.clipboardOpen = true;
             }
         },
@@ -669,7 +669,7 @@ var UI;
             if (UI.settingsOpen === true) {
                 UI.settingsApply();
                 UI.closeSettingsMenu();
-                $D('connectButton').className = "noVNC_status_button";
+                $D('noVNC_connectPanel_button').className = "noVNC_status_button";
             }
             // Close clipboard panel if open
             if (UI.clipboardOpen === true) {
@@ -683,7 +683,7 @@ var UI;
             // Toggle Connection Panel
             if (UI.connSettingsOpen === true) {
                 $D('noVNC_controls').style.display = "none";
-                $D('connectButton').className = "noVNC_status_button";
+                $D('noVNC_connectPanel_button').className = "noVNC_status_button";
                 UI.connSettingsOpen = false;
                 UI.saveSetting('host');
                 UI.saveSetting('port');
@@ -691,7 +691,7 @@ var UI;
                 //UI.saveSetting('password');
             } else {
                 $D('noVNC_controls').style.display = "block";
-                $D('connectButton').className = "noVNC_status_button_selected";
+                $D('noVNC_connectPanel_button').className = "noVNC_status_button_selected";
                 UI.connSettingsOpen = true;
                 $D('noVNC_setting_host').focus();
             }
@@ -796,9 +796,9 @@ var UI;
                 document.mozFullScreenElement || // currently working methods
                 document.webkitFullscreenElement ||
                 document.msFullscreenElement ) {
-                $D('fullscreenButton').className = "noVNC_status_button_selected";
+                $D('noVNC_fullscreen_button').className = "noVNC_status_button_selected";
             } else {
-                $D('fullscreenButton').className = "noVNC_status_button";
+                $D('noVNC_fullscreen_button').className = "noVNC_status_button";
             }
         },
 
@@ -1047,8 +1047,8 @@ var UI;
 
         // On touch devices, show the OS keyboard
         showKeyboard: function() {
-            var kbi = $D('keyboardinput');
-            var skb = $D('showKeyboard');
+            var kbi = $D('noVNC_keyboardinput');
+            var skb = $D('noVNC_keyboard_button');
             var l = kbi.value.length;
             if(UI.keyboardVisible === false) {
                 kbi.focus();
@@ -1064,7 +1064,7 @@ var UI;
         },
 
         hideKeyboard: function() {
-            $D('showKeyboard').className = "noVNC_status_button";
+            $D('noVNC_keyboard_button').className = "noVNC_status_button";
             //Weird bug in iOS if you change keyboardVisible
             //here it does not actually occur so next time
             //you click keyboard icon it doesnt work.
@@ -1076,16 +1076,16 @@ var UI;
         keepKeyboard: function() {
             clearTimeout(UI.hideKeyboardTimeout);
             if(UI.keyboardVisible === true) {
-                $D('keyboardinput').focus();
-                $D('showKeyboard').className = "noVNC_status_button_selected";
+                $D('noVNC_keyboardinput').focus();
+                $D('noVNC_keyboard_button').className = "noVNC_status_button_selected";
             } else if(UI.keyboardVisible === false) {
-                $D('keyboardinput').blur();
-                $D('showKeyboard').className = "noVNC_status_button";
+                $D('noVNC_keyboardinput').blur();
+                $D('noVNC_keyboard_button').className = "noVNC_status_button";
             }
         },
 
         keyboardinputReset: function() {
-            var kbi = $D('keyboardinput');
+            var kbi = $D('noVNC_keyboardinput');
             kbi.value = new Array(UI.defaultKeyboardinputLen).join("_");
             UI.lastKeyboardinput = kbi.value;
         },
@@ -1164,18 +1164,18 @@ var UI;
         toggleExtraKeys: function() {
             UI.keepKeyboard();
             if(UI.extraKeysVisible === false) {
-                $D('toggleCtrlButton').style.display = "inline";
-                $D('toggleAltButton').style.display = "inline";
-                $D('sendTabButton').style.display = "inline";
-                $D('sendEscButton').style.display = "inline";
-                $D('toggleExtraKeysButton').className = "noVNC_status_button_selected";
+                $D('noVNC_toggleCtrl_button').style.display = "inline";
+                $D('noVNC_toggleAlt_button').style.display = "inline";
+                $D('noVNC_sendTab_button').style.display = "inline";
+                $D('noVNC_sendEsc_button').style.display = "inline";
+                $D('noVNC_toggleExtraKeys_button').className = "noVNC_status_button_selected";
                 UI.extraKeysVisible = true;
             } else if(UI.extraKeysVisible === true) {
-                $D('toggleCtrlButton').style.display = "";
-                $D('toggleAltButton').style.display = "";
-                $D('sendTabButton').style.display = "";
-                $D('sendEscButton').style.display = "";
-                $D('toggleExtraKeysButton').className = "noVNC_status_button";
+                $D('noVNC_toggleCtrl_button').style.display = "";
+                $D('noVNC_toggleAlt_button').style.display = "";
+                $D('noVNC_sendTab_button').style.display = "";
+                $D('noVNC_sendEsc_button').style.display = "";
+                $D('noVNC_toggleExtraKeys_button').className = "noVNC_status_button";
                 UI.extraKeysVisible = false;
             }
         },
@@ -1194,11 +1194,11 @@ var UI;
             UI.keepKeyboard();
             if(UI.ctrlOn === false) {
                 UI.rfb.sendKey(XK_Control_L, true);
-                $D('toggleCtrlButton').className = "noVNC_status_button_selected";
+                $D('noVNC_toggleCtrl_button').className = "noVNC_status_button_selected";
                 UI.ctrlOn = true;
             } else if(UI.ctrlOn === true) {
                 UI.rfb.sendKey(XK_Control_L, false);
-                $D('toggleCtrlButton').className = "noVNC_status_button";
+                $D('noVNC_toggleCtrl_button').className = "noVNC_status_button";
                 UI.ctrlOn = false;
             }
         },
@@ -1207,11 +1207,11 @@ var UI;
             UI.keepKeyboard();
             if(UI.altOn === false) {
                 UI.rfb.sendKey(XK_Alt_L, true);
-                $D('toggleAltButton').className = "noVNC_status_button_selected";
+                $D('noVNC_toggleAlt_button').className = "noVNC_status_button_selected";
                 UI.altOn = true;
             } else if(UI.altOn === true) {
                 UI.rfb.sendKey(XK_Alt_L, false);
-                $D('toggleAltButton').className = "noVNC_status_button";
+                $D('noVNC_toggleAlt_button').className = "noVNC_status_button";
                 UI.altOn = false;
             }
         },
@@ -1274,11 +1274,11 @@ var UI;
         },
 
         setBarPosition: function() {
-            $D('noVNC-control-bar').style.top = (window.pageYOffset) + 'px';
+            $D('noVNC_control_bar').style.top = (window.pageYOffset) + 'px';
             $D('noVNC_mobile_buttons').style.left = (window.pageXOffset) + 'px';
 
             var vncwidth = $D('noVNC_container').style.offsetWidth;
-            $D('noVNC-control-bar').style.width = vncwidth + 'px';
+            $D('noVNC_control_bar').style.width = vncwidth + 'px';
         }
 
 /* ------^-------

vnc.html

@@ -48,9 +48,9 @@
 </head>
 
 <body>
-    <div id="noVNC-control-bar" class="noVNC_status_normal">
+    <div id="noVNC_control_bar" class="noVNC_status_normal">
         <!--noVNC Mobile Device only Buttons-->
-        <div class="noVNC-buttons-left">
+        <div class="noVNC_buttons_left">
             <input type="image" alt="viewport drag" src="images/drag.png"
                 id="noVNC_view_drag_button" class="noVNC_status_button"
                 title="Move/Drag Viewport">
@@ -64,26 +64,26 @@
                 <input type="image" alt="Right mousebutton" src="images/mouse_right.png"
                     id="noVNC_mouse_button4" class="noVNC_status_button">
                 <input type="image" alt="Keyboard" src="images/keyboard.png"
-                    id="showKeyboard" class="noVNC_status_button"
+                    id="noVNC_keyboard_button" class="noVNC_status_button"
                     value="Keyboard" title="Show Keyboard"/>
                 <!-- Note that Google Chrome on Android doesn't respect any of these,
                      html attributes which attempt to disable text suggestions on the
                      on-screen keyboard. Let's hope Chrome implements the ime-mode
                      style for example -->
-                <textarea id="keyboardinput" autocapitalize="off"
+                <textarea id="noVNC_keyboardinput" autocapitalize="off"
                     autocorrect="off" autocomplete="off" spellcheck="false"
                     mozactionhint="Enter"></textarea>
                 <div id="noVNC_extra_keys">
                     <input type="image" alt="Extra keys" src="images/toggleextrakeys.png"
-                        id="toggleExtraKeysButton" class="noVNC_status_button">
+                        id="noVNC_toggleExtraKeys_button" class="noVNC_status_button">
                     <input type="image" alt="Ctrl" src="images/ctrl.png"
-                        id="toggleCtrlButton" class="noVNC_status_button">
+                        id="noVNC_toggleCtrl_button" class="noVNC_status_button">
                     <input type="image" alt="Alt" src="images/alt.png"
-                        id="toggleAltButton" class="noVNC_status_button">
+                        id="noVNC_toggleAlt_button" class="noVNC_status_button">
                     <input type="image" alt="Tab" src="images/tab.png"
-                        id="sendTabButton" class="noVNC_status_button">
+                        id="noVNC_sendTab_button" class="noVNC_status_button">
                     <input type="image" alt="Esc" src="images/esc.png"
-                        id="sendEscButton" class="noVNC_status_button">
+                        id="noVNC_sendEsc_button" class="noVNC_status_button">
                 </div>
             </div>
         </div>
@@ -91,27 +91,27 @@
         <div id="noVNC_status"></div>
 
         <!--noVNC Buttons-->
-        <div class="noVNC-buttons-right">
+        <div class="noVNC_buttons_right">
             <input type="image" alt="Ctrl+Alt+Del" src="images/ctrlaltdel.png"
-                id="sendCtrlAltDelButton" class="noVNC_status_button"
+                id="noVNC_sendCtrlAltDel_button" class="noVNC_status_button"
                 title="Send Ctrl-Alt-Del" />
             <input type="image" alt="Shutdown/Reboot" src="images/power.png"
-                id="xvpButton" class="noVNC_status_button"
+                id="noVNC_toggleXvp_button" class="noVNC_status_button"
                 title="Shutdown/Reboot..." />
             <input type="image" alt="Clipboard" src="images/clipboard.png"
-                id="clipboardButton" class="noVNC_status_button"
+                id="noVNC_clipboard_button" class="noVNC_status_button"
                 title="Clipboard" />
             <input type="image" alt="Fullscreen" src="images/fullscreen.png"
-                id="fullscreenButton" class="noVNC_status_button"
+                id="noVNC_fullscreen_button" class="noVNC_status_button"
                 title="Fullscreen" />
             <input type="image" alt="Settings" src="images/settings.png"
-                id="settingsButton" class="noVNC_status_button"
+                id="noVNC_settings_button" class="noVNC_status_button"
                 title="Settings" />
             <input type="image" alt="Connect" src="images/connect.png"
-                id="connectButton" class="noVNC_status_button"
+                id="noVNC_connectPanel_button" class="noVNC_status_button"
                 title="Connect" />
             <input type="image" alt="Disconnect" src="images/disconnect.png"
-                id="disconnectButton" class="noVNC_status_button"
+                id="noVNC_disconnect_button" class="noVNC_status_button"
                 title="Disconnect" />
         </div>
 
@@ -128,7 +128,7 @@
             and <a href="http://kanaka.github.com/noVNC">website</a>
             for more information.
             <br />
-            <input id="descriptionButton" type="button" value="Close">
+            <input id="noVNC_description_button" type="button" value="Close">
         </div>
 
         <!-- Popup Status -->
@@ -147,9 +147,9 @@
         <!-- XVP Shutdown/Reboot Panel -->
         <div id="noVNC_xvp" class="triangle-right top">
             <span id="noVNC_xvp_menu">
-                <input type="button" id="xvpShutdownButton" value="Shutdown" />
-                <input type="button" id="xvpRebootButton" value="Reboot" />
-                <input type="button" id="xvpResetButton" value="Reset" />
+                <input type="button" id="noVNC_xvpShutdown_button" value="Shutdown" />
+                <input type="button" id="noVNC_xvpReboot_button" value="Reboot" />
+                <input type="button" id="noVNC_xvpReset_button" value="Reset" />
             </span>
         </div>
 
@@ -204,7 +204,7 @@
             </ul>
         </div>
 
-    </div> <!-- End of noVNC-control-bar -->
+    </div> <!-- End of noVNC_control_bar -->
 
 
     <div id="noVNC_container">