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_
This commit is contained in:
parent
682fd02be6
commit
3f2c25a60f
|
@ -56,10 +56,10 @@ html {
|
||||||
#noVNC_view_drag_button {
|
#noVNC_view_drag_button {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
#sendCtrlAltDelButton {
|
#noVNC_sendCtrlAltDel_button {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
#fullscreenButton {
|
#noVNC_fullscreen_button {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
#noVNC_xvp_buttons {
|
#noVNC_xvp_buttons {
|
||||||
|
@ -77,13 +77,13 @@ html {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.noVNC-buttons-left {
|
.noVNC_buttons_left {
|
||||||
float: left;
|
float: left;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.noVNC-buttons-right {
|
.noVNC_buttons_right {
|
||||||
float:right;
|
float:right;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
@ -233,7 +233,7 @@ html {
|
||||||
right:85px;
|
right:85px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#keyboardinput {
|
#noVNC_keyboardinput {
|
||||||
width:1px;
|
width:1px;
|
||||||
height:1px;
|
height:1px;
|
||||||
background-color:#fff;
|
background-color:#fff;
|
||||||
|
@ -278,7 +278,7 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Control bar */
|
/* Control bar */
|
||||||
#noVNC-control-bar {
|
#noVNC_control_bar {
|
||||||
position:fixed;
|
position:fixed;
|
||||||
|
|
||||||
display:block;
|
display:block;
|
||||||
|
@ -427,11 +427,11 @@ html {
|
||||||
font-size: 180px;
|
font-size: 180px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.noVNC-buttons-left {
|
.noVNC_buttons_left {
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.noVNC-buttons-right {
|
.noVNC_buttons_right {
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -442,11 +442,11 @@ html {
|
||||||
margin-left: 0px;
|
margin-left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#toggleExtraKeysButton { display: none; }
|
#noVNC_toggleExtraKeys_button { display: none; }
|
||||||
#toggleCtrlButton { display: inline; }
|
#noVNC_toggleCtrl_button { display: inline; }
|
||||||
#toggleAltButton { display: inline; }
|
#noVNC_toggleAlt_button { display: inline; }
|
||||||
#sendTabButton { display: inline; }
|
#noVNC_sendTab_button { display: inline; }
|
||||||
#sendEscButton { display: inline; }
|
#noVNC_sendEsc_button { display: inline; }
|
||||||
|
|
||||||
/* left-align the status text on lower resolutions */
|
/* left-align the status text on lower resolutions */
|
||||||
@media screen and (max-width: 800px){
|
@media screen and (max-width: 800px){
|
||||||
|
@ -469,35 +469,35 @@ html {
|
||||||
.noVNC_status_button {
|
.noVNC_status_button {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
.noVNC-buttons-left {
|
.noVNC_buttons_left {
|
||||||
padding-left: 0px;
|
padding-left: 0px;
|
||||||
}
|
}
|
||||||
.noVNC-buttons-right {
|
.noVNC_buttons_right {
|
||||||
padding-right: 0px;
|
padding-right: 0px;
|
||||||
}
|
}
|
||||||
/* collapse the extra keys on lower resolutions */
|
/* collapse the extra keys on lower resolutions */
|
||||||
#toggleExtraKeysButton {
|
#noVNC_toggleExtraKeys_button {
|
||||||
display: inline;
|
display: inline;
|
||||||
}
|
}
|
||||||
#toggleCtrlButton {
|
#noVNC_toggleCtrl_button {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 30px;
|
top: 30px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
}
|
}
|
||||||
#toggleAltButton {
|
#noVNC_toggleAlt_button {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 65px;
|
top: 65px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
}
|
}
|
||||||
#sendTabButton {
|
#noVNC_sendTab_button {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 100px;
|
top: 100px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
}
|
}
|
||||||
#sendEscButton {
|
#noVNC_sendEsc_button {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 135px;
|
top: 135px;
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
* This file is licensed under the 2-Clause BSD license (see LICENSE.txt).
|
* This file is licensed under the 2-Clause BSD license (see LICENSE.txt).
|
||||||
*/
|
*/
|
||||||
|
|
||||||
#keyboardinput {
|
#noVNC_keyboardinput {
|
||||||
background-color:#000;
|
background-color:#000;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -58,7 +58,7 @@
|
||||||
color:#fff;
|
color:#fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
#keyboardinput {
|
#noVNC_keyboardinput {
|
||||||
background-color:#04073d;
|
background-color:#04073d;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
142
include/ui.js
142
include/ui.js
|
@ -148,7 +148,7 @@ var UI;
|
||||||
document.documentElement.mozRequestFullScreen ||
|
document.documentElement.mozRequestFullScreen ||
|
||||||
document.documentElement.webkitRequestFullscreen ||
|
document.documentElement.webkitRequestFullscreen ||
|
||||||
document.body.msRequestFullscreen)) {
|
document.body.msRequestFullscreen)) {
|
||||||
$D('fullscreenButton').style.display = "inline";
|
$D('noVNC_fullscreen_button').style.display = "inline";
|
||||||
Util.addEvent(window, 'fullscreenchange', UI.updateFullscreenButton);
|
Util.addEvent(window, 'fullscreenchange', UI.updateFullscreenButton);
|
||||||
Util.addEvent(window, 'mozfullscreenchange', UI.updateFullscreenButton);
|
Util.addEvent(window, 'mozfullscreenchange', UI.updateFullscreenButton);
|
||||||
Util.addEvent(window, 'webkitfullscreenchange', 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_button1").onclick = function () { UI.setMouseButton(2); };
|
||||||
$D("noVNC_mouse_button2").onclick = function () { UI.setMouseButton(4); };
|
$D("noVNC_mouse_button2").onclick = function () { UI.setMouseButton(4); };
|
||||||
$D("noVNC_mouse_button4").onclick = function () { UI.setMouseButton(0); };
|
$D("noVNC_mouse_button4").onclick = function () { UI.setMouseButton(0); };
|
||||||
$D("showKeyboard").onclick = UI.showKeyboard;
|
$D("noVNC_keyboard_button").onclick = UI.showKeyboard;
|
||||||
|
|
||||||
$D("keyboardinput").oninput = UI.keyInput;
|
$D("noVNC_keyboardinput").oninput = UI.keyInput;
|
||||||
$D("keyboardinput").onblur = UI.hideKeyboard;
|
$D("noVNC_keyboardinput").onblur = UI.hideKeyboard;
|
||||||
$D("keyboardinput").onsubmit = function () { return false; };
|
$D("noVNC_keyboardinput").onsubmit = function () { return false; };
|
||||||
|
|
||||||
$D("toggleExtraKeysButton").onclick = UI.toggleExtraKeys;
|
$D("noVNC_toggleExtraKeys_button").onclick = UI.toggleExtraKeys;
|
||||||
$D("toggleCtrlButton").onclick = UI.toggleCtrl;
|
$D("noVNC_toggleCtrl_button").onclick = UI.toggleCtrl;
|
||||||
$D("toggleAltButton").onclick = UI.toggleAlt;
|
$D("noVNC_toggleAlt_button").onclick = UI.toggleAlt;
|
||||||
$D("sendTabButton").onclick = UI.sendTab;
|
$D("noVNC_sendTab_button").onclick = UI.sendTab;
|
||||||
$D("sendEscButton").onclick = UI.sendEsc;
|
$D("noVNC_sendEsc_button").onclick = UI.sendEsc;
|
||||||
|
|
||||||
$D("sendCtrlAltDelButton").onclick = UI.sendCtrlAltDel;
|
$D("noVNC_sendCtrlAltDel_button").onclick = UI.sendCtrlAltDel;
|
||||||
$D("xvpShutdownButton").onclick = function() { UI.rfb.xvpShutdown(); },
|
$D("noVNC_xvpShutdown_button").onclick = function() { UI.rfb.xvpShutdown(); },
|
||||||
$D("xvpRebootButton").onclick = function() { UI.rfb.xvpReboot(); },
|
$D("noVNC_xvpReboot_button").onclick = function() { UI.rfb.xvpReboot(); },
|
||||||
$D("xvpResetButton").onclick = function() { UI.rfb.xvpReset(); },
|
$D("noVNC_xvpReset_button").onclick = function() { UI.rfb.xvpReset(); },
|
||||||
$D("noVNC_status").onclick = UI.popupStatus;
|
$D("noVNC_status").onclick = UI.popupStatus;
|
||||||
$D("noVNC_popup_status").onclick = UI.closePopup;
|
$D("noVNC_popup_status").onclick = UI.closePopup;
|
||||||
$D("xvpButton").onclick = UI.toggleXvpPanel;
|
$D("noVNC_toggleXvp_button").onclick = UI.toggleXvpPanel;
|
||||||
$D("clipboardButton").onclick = UI.toggleClipboardPanel;
|
$D("noVNC_clipboard_button").onclick = UI.toggleClipboardPanel;
|
||||||
$D("fullscreenButton").onclick = UI.toggleFullscreen;
|
$D("noVNC_fullscreen_button").onclick = UI.toggleFullscreen;
|
||||||
$D("settingsButton").onclick = UI.toggleSettingsPanel;
|
$D("noVNC_settings_button").onclick = UI.toggleSettingsPanel;
|
||||||
$D("connectButton").onclick = UI.toggleConnectPanel;
|
$D("noVNC_connectPanel_button").onclick = UI.toggleConnectPanel;
|
||||||
$D("disconnectButton").onclick = UI.disconnect;
|
$D("noVNC_disconnect_button").onclick = UI.disconnect;
|
||||||
$D("descriptionButton").onclick = UI.toggleConnectPanel;
|
$D("noVNC_description_button").onclick = UI.toggleConnectPanel;
|
||||||
|
|
||||||
$D("noVNC_clipboard_text").onfocus = UI.displayBlur;
|
$D("noVNC_clipboard_text").onfocus = UI.displayBlur;
|
||||||
$D("noVNC_clipboard_text").onblur = UI.displayFocus;
|
$D("noVNC_clipboard_text").onblur = UI.displayFocus;
|
||||||
|
@ -284,7 +284,7 @@ var UI;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (typeof(msg) !== 'undefined') {
|
if (typeof(msg) !== 'undefined') {
|
||||||
$D('noVNC-control-bar').setAttribute("class", klass);
|
$D('noVNC_control_bar').setAttribute("class", klass);
|
||||||
$D('noVNC_status').innerHTML = msg;
|
$D('noVNC_status').innerHTML = msg;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -315,16 +315,16 @@ var UI;
|
||||||
if (connected) {
|
if (connected) {
|
||||||
UI.setViewClip();
|
UI.setViewClip();
|
||||||
UI.setMouseButton(1);
|
UI.setMouseButton(1);
|
||||||
$D('clipboardButton').style.display = "inline";
|
$D('noVNC_clipboard_button').style.display = "inline";
|
||||||
$D('showKeyboard').style.display = "inline";
|
$D('noVNC_keyboard_button').style.display = "inline";
|
||||||
$D('noVNC_extra_keys').style.display = "";
|
$D('noVNC_extra_keys').style.display = "";
|
||||||
$D('sendCtrlAltDelButton').style.display = "inline";
|
$D('noVNC_sendCtrlAltDel_button').style.display = "inline";
|
||||||
} else {
|
} else {
|
||||||
UI.setMouseButton();
|
UI.setMouseButton();
|
||||||
$D('clipboardButton').style.display = "none";
|
$D('noVNC_clipboard_button').style.display = "none";
|
||||||
$D('showKeyboard').style.display = "none";
|
$D('noVNC_keyboard_button').style.display = "none";
|
||||||
$D('noVNC_extra_keys').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);
|
UI.updateXvpButton(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -336,18 +336,18 @@ var UI;
|
||||||
case 'fatal':
|
case 'fatal':
|
||||||
case 'failed':
|
case 'failed':
|
||||||
case 'disconnected':
|
case 'disconnected':
|
||||||
$D('connectButton').style.display = "";
|
$D('noVNC_connectPanel_button').style.display = "";
|
||||||
$D('disconnectButton').style.display = "none";
|
$D('noVNC_disconnect_button').style.display = "none";
|
||||||
UI.connSettingsOpen = false;
|
UI.connSettingsOpen = false;
|
||||||
UI.toggleConnectPanel();
|
UI.toggleConnectPanel();
|
||||||
break;
|
break;
|
||||||
case 'loaded':
|
case 'loaded':
|
||||||
$D('connectButton').style.display = "";
|
$D('noVNC_connectPanel_button').style.display = "";
|
||||||
$D('disconnectButton').style.display = "none";
|
$D('noVNC_disconnect_button').style.display = "none";
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
$D('connectButton').style.display = "none";
|
$D('noVNC_connectPanel_button').style.display = "none";
|
||||||
$D('disconnectButton').style.display = "";
|
$D('noVNC_disconnect_button').style.display = "";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -512,14 +512,14 @@ var UI;
|
||||||
UI.toggleXvpPanel();
|
UI.toggleXvpPanel();
|
||||||
}
|
}
|
||||||
$D('noVNC_settings').style.display = "block";
|
$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;
|
UI.settingsOpen = true;
|
||||||
},
|
},
|
||||||
|
|
||||||
// Close menu (without applying settings)
|
// Close menu (without applying settings)
|
||||||
closeSettingsMenu: function() {
|
closeSettingsMenu: function() {
|
||||||
$D('noVNC_settings').style.display = "none";
|
$D('noVNC_settings').style.display = "none";
|
||||||
$D('settingsButton').className = "noVNC_status_button";
|
$D('noVNC_settings_button').className = "noVNC_status_button";
|
||||||
UI.settingsOpen = false;
|
UI.settingsOpen = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -580,11 +580,11 @@ var UI;
|
||||||
// Toggle XVP panel
|
// Toggle XVP panel
|
||||||
if (UI.xvpOpen === true) {
|
if (UI.xvpOpen === true) {
|
||||||
$D('noVNC_xvp').style.display = "none";
|
$D('noVNC_xvp').style.display = "none";
|
||||||
$D('xvpButton').className = "noVNC_status_button";
|
$D('noVNC_toggleXvp_button').className = "noVNC_status_button";
|
||||||
UI.xvpOpen = false;
|
UI.xvpOpen = false;
|
||||||
} else {
|
} else {
|
||||||
$D('noVNC_xvp').style.display = "block";
|
$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;
|
UI.xvpOpen = true;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -592,9 +592,9 @@ var UI;
|
||||||
// Disable/enable XVP button
|
// Disable/enable XVP button
|
||||||
updateXvpButton: function(ver) {
|
updateXvpButton: function(ver) {
|
||||||
if (ver >= 1) {
|
if (ver >= 1) {
|
||||||
$D('xvpButton').style.display = 'inline';
|
$D('noVNC_toggleXvp_button').style.display = 'inline';
|
||||||
} else {
|
} else {
|
||||||
$D('xvpButton').style.display = 'none';
|
$D('noVNC_toggleXvp_button').style.display = 'none';
|
||||||
// Close XVP panel if open
|
// Close XVP panel if open
|
||||||
if (UI.xvpOpen === true) {
|
if (UI.xvpOpen === true) {
|
||||||
UI.toggleXvpPanel();
|
UI.toggleXvpPanel();
|
||||||
|
@ -628,11 +628,11 @@ var UI;
|
||||||
// Toggle Clipboard Panel
|
// Toggle Clipboard Panel
|
||||||
if (UI.clipboardOpen === true) {
|
if (UI.clipboardOpen === true) {
|
||||||
$D('noVNC_clipboard').style.display = "none";
|
$D('noVNC_clipboard').style.display = "none";
|
||||||
$D('clipboardButton').className = "noVNC_status_button";
|
$D('noVNC_clipboard_button').className = "noVNC_status_button";
|
||||||
UI.clipboardOpen = false;
|
UI.clipboardOpen = false;
|
||||||
} else {
|
} else {
|
||||||
$D('noVNC_clipboard').style.display = "block";
|
$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;
|
UI.clipboardOpen = true;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -669,7 +669,7 @@ var UI;
|
||||||
if (UI.settingsOpen === true) {
|
if (UI.settingsOpen === true) {
|
||||||
UI.settingsApply();
|
UI.settingsApply();
|
||||||
UI.closeSettingsMenu();
|
UI.closeSettingsMenu();
|
||||||
$D('connectButton').className = "noVNC_status_button";
|
$D('noVNC_connectPanel_button').className = "noVNC_status_button";
|
||||||
}
|
}
|
||||||
// Close clipboard panel if open
|
// Close clipboard panel if open
|
||||||
if (UI.clipboardOpen === true) {
|
if (UI.clipboardOpen === true) {
|
||||||
|
@ -683,7 +683,7 @@ var UI;
|
||||||
// Toggle Connection Panel
|
// Toggle Connection Panel
|
||||||
if (UI.connSettingsOpen === true) {
|
if (UI.connSettingsOpen === true) {
|
||||||
$D('noVNC_controls').style.display = "none";
|
$D('noVNC_controls').style.display = "none";
|
||||||
$D('connectButton').className = "noVNC_status_button";
|
$D('noVNC_connectPanel_button').className = "noVNC_status_button";
|
||||||
UI.connSettingsOpen = false;
|
UI.connSettingsOpen = false;
|
||||||
UI.saveSetting('host');
|
UI.saveSetting('host');
|
||||||
UI.saveSetting('port');
|
UI.saveSetting('port');
|
||||||
|
@ -691,7 +691,7 @@ var UI;
|
||||||
//UI.saveSetting('password');
|
//UI.saveSetting('password');
|
||||||
} else {
|
} else {
|
||||||
$D('noVNC_controls').style.display = "block";
|
$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;
|
UI.connSettingsOpen = true;
|
||||||
$D('noVNC_setting_host').focus();
|
$D('noVNC_setting_host').focus();
|
||||||
}
|
}
|
||||||
|
@ -796,9 +796,9 @@ var UI;
|
||||||
document.mozFullScreenElement || // currently working methods
|
document.mozFullScreenElement || // currently working methods
|
||||||
document.webkitFullscreenElement ||
|
document.webkitFullscreenElement ||
|
||||||
document.msFullscreenElement ) {
|
document.msFullscreenElement ) {
|
||||||
$D('fullscreenButton').className = "noVNC_status_button_selected";
|
$D('noVNC_fullscreen_button').className = "noVNC_status_button_selected";
|
||||||
} else {
|
} 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
|
// On touch devices, show the OS keyboard
|
||||||
showKeyboard: function() {
|
showKeyboard: function() {
|
||||||
var kbi = $D('keyboardinput');
|
var kbi = $D('noVNC_keyboardinput');
|
||||||
var skb = $D('showKeyboard');
|
var skb = $D('noVNC_keyboard_button');
|
||||||
var l = kbi.value.length;
|
var l = kbi.value.length;
|
||||||
if(UI.keyboardVisible === false) {
|
if(UI.keyboardVisible === false) {
|
||||||
kbi.focus();
|
kbi.focus();
|
||||||
|
@ -1064,7 +1064,7 @@ var UI;
|
||||||
},
|
},
|
||||||
|
|
||||||
hideKeyboard: function() {
|
hideKeyboard: function() {
|
||||||
$D('showKeyboard').className = "noVNC_status_button";
|
$D('noVNC_keyboard_button').className = "noVNC_status_button";
|
||||||
//Weird bug in iOS if you change keyboardVisible
|
//Weird bug in iOS if you change keyboardVisible
|
||||||
//here it does not actually occur so next time
|
//here it does not actually occur so next time
|
||||||
//you click keyboard icon it doesnt work.
|
//you click keyboard icon it doesnt work.
|
||||||
|
@ -1076,16 +1076,16 @@ var UI;
|
||||||
keepKeyboard: function() {
|
keepKeyboard: function() {
|
||||||
clearTimeout(UI.hideKeyboardTimeout);
|
clearTimeout(UI.hideKeyboardTimeout);
|
||||||
if(UI.keyboardVisible === true) {
|
if(UI.keyboardVisible === true) {
|
||||||
$D('keyboardinput').focus();
|
$D('noVNC_keyboardinput').focus();
|
||||||
$D('showKeyboard').className = "noVNC_status_button_selected";
|
$D('noVNC_keyboard_button').className = "noVNC_status_button_selected";
|
||||||
} else if(UI.keyboardVisible === false) {
|
} else if(UI.keyboardVisible === false) {
|
||||||
$D('keyboardinput').blur();
|
$D('noVNC_keyboardinput').blur();
|
||||||
$D('showKeyboard').className = "noVNC_status_button";
|
$D('noVNC_keyboard_button').className = "noVNC_status_button";
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
keyboardinputReset: function() {
|
keyboardinputReset: function() {
|
||||||
var kbi = $D('keyboardinput');
|
var kbi = $D('noVNC_keyboardinput');
|
||||||
kbi.value = new Array(UI.defaultKeyboardinputLen).join("_");
|
kbi.value = new Array(UI.defaultKeyboardinputLen).join("_");
|
||||||
UI.lastKeyboardinput = kbi.value;
|
UI.lastKeyboardinput = kbi.value;
|
||||||
},
|
},
|
||||||
|
@ -1164,18 +1164,18 @@ var UI;
|
||||||
toggleExtraKeys: function() {
|
toggleExtraKeys: function() {
|
||||||
UI.keepKeyboard();
|
UI.keepKeyboard();
|
||||||
if(UI.extraKeysVisible === false) {
|
if(UI.extraKeysVisible === false) {
|
||||||
$D('toggleCtrlButton').style.display = "inline";
|
$D('noVNC_toggleCtrl_button').style.display = "inline";
|
||||||
$D('toggleAltButton').style.display = "inline";
|
$D('noVNC_toggleAlt_button').style.display = "inline";
|
||||||
$D('sendTabButton').style.display = "inline";
|
$D('noVNC_sendTab_button').style.display = "inline";
|
||||||
$D('sendEscButton').style.display = "inline";
|
$D('noVNC_sendEsc_button').style.display = "inline";
|
||||||
$D('toggleExtraKeysButton').className = "noVNC_status_button_selected";
|
$D('noVNC_toggleExtraKeys_button').className = "noVNC_status_button_selected";
|
||||||
UI.extraKeysVisible = true;
|
UI.extraKeysVisible = true;
|
||||||
} else if(UI.extraKeysVisible === true) {
|
} else if(UI.extraKeysVisible === true) {
|
||||||
$D('toggleCtrlButton').style.display = "";
|
$D('noVNC_toggleCtrl_button').style.display = "";
|
||||||
$D('toggleAltButton').style.display = "";
|
$D('noVNC_toggleAlt_button').style.display = "";
|
||||||
$D('sendTabButton').style.display = "";
|
$D('noVNC_sendTab_button').style.display = "";
|
||||||
$D('sendEscButton').style.display = "";
|
$D('noVNC_sendEsc_button').style.display = "";
|
||||||
$D('toggleExtraKeysButton').className = "noVNC_status_button";
|
$D('noVNC_toggleExtraKeys_button').className = "noVNC_status_button";
|
||||||
UI.extraKeysVisible = false;
|
UI.extraKeysVisible = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -1194,11 +1194,11 @@ var UI;
|
||||||
UI.keepKeyboard();
|
UI.keepKeyboard();
|
||||||
if(UI.ctrlOn === false) {
|
if(UI.ctrlOn === false) {
|
||||||
UI.rfb.sendKey(XK_Control_L, true);
|
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;
|
UI.ctrlOn = true;
|
||||||
} else if(UI.ctrlOn === true) {
|
} else if(UI.ctrlOn === true) {
|
||||||
UI.rfb.sendKey(XK_Control_L, false);
|
UI.rfb.sendKey(XK_Control_L, false);
|
||||||
$D('toggleCtrlButton').className = "noVNC_status_button";
|
$D('noVNC_toggleCtrl_button').className = "noVNC_status_button";
|
||||||
UI.ctrlOn = false;
|
UI.ctrlOn = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -1207,11 +1207,11 @@ var UI;
|
||||||
UI.keepKeyboard();
|
UI.keepKeyboard();
|
||||||
if(UI.altOn === false) {
|
if(UI.altOn === false) {
|
||||||
UI.rfb.sendKey(XK_Alt_L, true);
|
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;
|
UI.altOn = true;
|
||||||
} else if(UI.altOn === true) {
|
} else if(UI.altOn === true) {
|
||||||
UI.rfb.sendKey(XK_Alt_L, false);
|
UI.rfb.sendKey(XK_Alt_L, false);
|
||||||
$D('toggleAltButton').className = "noVNC_status_button";
|
$D('noVNC_toggleAlt_button').className = "noVNC_status_button";
|
||||||
UI.altOn = false;
|
UI.altOn = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -1274,11 +1274,11 @@ var UI;
|
||||||
},
|
},
|
||||||
|
|
||||||
setBarPosition: function() {
|
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';
|
$D('noVNC_mobile_buttons').style.left = (window.pageXOffset) + 'px';
|
||||||
|
|
||||||
var vncwidth = $D('noVNC_container').style.offsetWidth;
|
var vncwidth = $D('noVNC_container').style.offsetWidth;
|
||||||
$D('noVNC-control-bar').style.width = vncwidth + 'px';
|
$D('noVNC_control_bar').style.width = vncwidth + 'px';
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ------^-------
|
/* ------^-------
|
||||||
|
|
44
vnc.html
44
vnc.html
|
@ -48,9 +48,9 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div id="noVNC-control-bar" class="noVNC_status_normal">
|
<div id="noVNC_control_bar" class="noVNC_status_normal">
|
||||||
<!--noVNC Mobile Device only Buttons-->
|
<!--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"
|
<input type="image" alt="viewport drag" src="images/drag.png"
|
||||||
id="noVNC_view_drag_button" class="noVNC_status_button"
|
id="noVNC_view_drag_button" class="noVNC_status_button"
|
||||||
title="Move/Drag Viewport">
|
title="Move/Drag Viewport">
|
||||||
|
@ -64,26 +64,26 @@
|
||||||
<input type="image" alt="Right mousebutton" src="images/mouse_right.png"
|
<input type="image" alt="Right mousebutton" src="images/mouse_right.png"
|
||||||
id="noVNC_mouse_button4" class="noVNC_status_button">
|
id="noVNC_mouse_button4" class="noVNC_status_button">
|
||||||
<input type="image" alt="Keyboard" src="images/keyboard.png"
|
<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"/>
|
value="Keyboard" title="Show Keyboard"/>
|
||||||
<!-- Note that Google Chrome on Android doesn't respect any of these,
|
<!-- Note that Google Chrome on Android doesn't respect any of these,
|
||||||
html attributes which attempt to disable text suggestions on the
|
html attributes which attempt to disable text suggestions on the
|
||||||
on-screen keyboard. Let's hope Chrome implements the ime-mode
|
on-screen keyboard. Let's hope Chrome implements the ime-mode
|
||||||
style for example -->
|
style for example -->
|
||||||
<textarea id="keyboardinput" autocapitalize="off"
|
<textarea id="noVNC_keyboardinput" autocapitalize="off"
|
||||||
autocorrect="off" autocomplete="off" spellcheck="false"
|
autocorrect="off" autocomplete="off" spellcheck="false"
|
||||||
mozactionhint="Enter"></textarea>
|
mozactionhint="Enter"></textarea>
|
||||||
<div id="noVNC_extra_keys">
|
<div id="noVNC_extra_keys">
|
||||||
<input type="image" alt="Extra keys" src="images/toggleextrakeys.png"
|
<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"
|
<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"
|
<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"
|
<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"
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -91,27 +91,27 @@
|
||||||
<div id="noVNC_status"></div>
|
<div id="noVNC_status"></div>
|
||||||
|
|
||||||
<!--noVNC Buttons-->
|
<!--noVNC Buttons-->
|
||||||
<div class="noVNC-buttons-right">
|
<div class="noVNC_buttons_right">
|
||||||
<input type="image" alt="Ctrl+Alt+Del" src="images/ctrlaltdel.png"
|
<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" />
|
title="Send Ctrl-Alt-Del" />
|
||||||
<input type="image" alt="Shutdown/Reboot" src="images/power.png"
|
<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..." />
|
title="Shutdown/Reboot..." />
|
||||||
<input type="image" alt="Clipboard" src="images/clipboard.png"
|
<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" />
|
title="Clipboard" />
|
||||||
<input type="image" alt="Fullscreen" src="images/fullscreen.png"
|
<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" />
|
title="Fullscreen" />
|
||||||
<input type="image" alt="Settings" src="images/settings.png"
|
<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" />
|
title="Settings" />
|
||||||
<input type="image" alt="Connect" src="images/connect.png"
|
<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" />
|
title="Connect" />
|
||||||
<input type="image" alt="Disconnect" src="images/disconnect.png"
|
<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" />
|
title="Disconnect" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -128,7 +128,7 @@
|
||||||
and <a href="http://kanaka.github.com/noVNC">website</a>
|
and <a href="http://kanaka.github.com/noVNC">website</a>
|
||||||
for more information.
|
for more information.
|
||||||
<br />
|
<br />
|
||||||
<input id="descriptionButton" type="button" value="Close">
|
<input id="noVNC_description_button" type="button" value="Close">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Popup Status -->
|
<!-- Popup Status -->
|
||||||
|
@ -147,9 +147,9 @@
|
||||||
<!-- XVP Shutdown/Reboot Panel -->
|
<!-- XVP Shutdown/Reboot Panel -->
|
||||||
<div id="noVNC_xvp" class="triangle-right top">
|
<div id="noVNC_xvp" class="triangle-right top">
|
||||||
<span id="noVNC_xvp_menu">
|
<span id="noVNC_xvp_menu">
|
||||||
<input type="button" id="xvpShutdownButton" value="Shutdown" />
|
<input type="button" id="noVNC_xvpShutdown_button" value="Shutdown" />
|
||||||
<input type="button" id="xvpRebootButton" value="Reboot" />
|
<input type="button" id="noVNC_xvpReboot_button" value="Reboot" />
|
||||||
<input type="button" id="xvpResetButton" value="Reset" />
|
<input type="button" id="noVNC_xvpReset_button" value="Reset" />
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -204,7 +204,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div> <!-- End of noVNC-control-bar -->
|
</div> <!-- End of noVNC_control_bar -->
|
||||||
|
|
||||||
|
|
||||||
<div id="noVNC_container">
|
<div id="noVNC_container">
|
||||||
|
|
Loading…
Reference in New Issue