HTML, CSS and Javascript indent/formatting.
- 4 space indenting for HTML and Javascript. - 2 space indenting for CSS - Use hanging start curly for conditional blocks
This commit is contained in:
parent
0911173a89
commit
01a9eee991
278
include/base.css
278
include/base.css
|
@ -1,62 +1,62 @@
|
|||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
font-family: Helvetica;
|
||||
/*Background image with light grey curve.*/
|
||||
background-color:#494949;
|
||||
background-repeat:no-repeat;
|
||||
background-position:right bottom;
|
||||
height:100%;
|
||||
margin:0;
|
||||
padding:0;
|
||||
font-family: Helvetica;
|
||||
/*Background image with light grey curve.*/
|
||||
background-color:#494949;
|
||||
background-repeat:no-repeat;
|
||||
background-position:right bottom;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
html {
|
||||
height:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
#noVNC_controls ul {
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
#noVNC_controls li {
|
||||
padding-bottom:8px;
|
||||
padding-bottom:8px;
|
||||
}
|
||||
|
||||
#noVNC_host {
|
||||
width:150px;
|
||||
}
|
||||
width:150px;
|
||||
}
|
||||
#noVNC_port {
|
||||
width: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
#noVNC_password {
|
||||
width: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
#noVNC_encrypt {
|
||||
}
|
||||
#noVNC_connectTimeout {
|
||||
width: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
#noVNC_connect_button {
|
||||
width: 110px;
|
||||
float:right;
|
||||
width: 110px;
|
||||
float:right;
|
||||
}
|
||||
|
||||
/*Mobile buttons bar.*/
|
||||
#noVNC-control-bar {
|
||||
position:fixed;
|
||||
background-color:#6d84a2;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.5, rgb(109,132,162)),
|
||||
color-stop(1, rgb(140,157,179))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(109,132,162) 50%,
|
||||
rgb(140,157,179) 100%
|
||||
);
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.5, rgb(109,132,162)),
|
||||
color-stop(1, rgb(140,157,179))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(109,132,162) 50%,
|
||||
rgb(140,157,179) 100%
|
||||
);
|
||||
display:block;
|
||||
height:44px;
|
||||
left:0;
|
||||
|
@ -66,182 +66,182 @@ html {
|
|||
}
|
||||
|
||||
#noVNC_mobile_buttons {
|
||||
position:fixed;
|
||||
padding-left:10px;
|
||||
padding-top:9px;
|
||||
display: none;
|
||||
position:fixed;
|
||||
padding-left:10px;
|
||||
padding-top:9px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.noVNC_mobile_buttons_right {
|
||||
position:fixed;
|
||||
padding-right:10px;
|
||||
padding-top:9px;
|
||||
right:0;
|
||||
position:fixed;
|
||||
padding-right:10px;
|
||||
padding-top:9px;
|
||||
right:0;
|
||||
}
|
||||
|
||||
#noVNC_status_bar {
|
||||
margin-top: 15px;
|
||||
padding: 0px;
|
||||
margin-top: 15px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
#noVNC_status_bar div {
|
||||
font-size: 12px;
|
||||
padding-top: 4px;
|
||||
width:100%;
|
||||
margin-top: 2px;
|
||||
font-size: 12px;
|
||||
padding-top: 4px;
|
||||
width:100%;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.VNC_status_button, #clipboardbutton, #connectbutton {
|
||||
font-size: 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#noVNC_status {
|
||||
height:20px;
|
||||
text-align: center;
|
||||
height:20px;
|
||||
text-align: center;
|
||||
}
|
||||
#noVNC_settings_menu {
|
||||
margin: 3px;
|
||||
text-align: left;
|
||||
margin: 3px;
|
||||
text-align: left;
|
||||
}
|
||||
#noVNC_settings_menu ul {
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
#noVNC_apply {
|
||||
float:right;
|
||||
float:right;
|
||||
}
|
||||
|
||||
.VNC_buttons_right {
|
||||
text-align: right;
|
||||
text-align: right;
|
||||
}
|
||||
.VNC_buttons_left {
|
||||
text-align: left;
|
||||
text-align: left;
|
||||
}
|
||||
.noVNC_status_normal {
|
||||
background: #eee;
|
||||
background: #eee;
|
||||
}
|
||||
.noVNC_status_error {
|
||||
background: #f44;
|
||||
background: #f44;
|
||||
}
|
||||
.norVNC_status_warn {
|
||||
background: #ff4;
|
||||
.noVNC_status_warn {
|
||||
background: #ff4;
|
||||
}
|
||||
|
||||
/* Do not set width/height for VNC_screen or VNC_canvas or incorrect
|
||||
* scaling will occur. Canvas resizes to remote VNC settings */
|
||||
#noVNC_screen {
|
||||
padding-top:40px;
|
||||
text-align: center;
|
||||
display: table;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-color:#313131;
|
||||
border-bottom-right-radius: 800px 600px;
|
||||
/*border-top-left-radius: 800px 600px;*/
|
||||
padding-top:40px;
|
||||
text-align: center;
|
||||
display: table;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-color:#313131;
|
||||
border-bottom-right-radius: 800px 600px;
|
||||
/*border-top-left-radius: 800px 600px;*/
|
||||
}
|
||||
#VNC_canvas {
|
||||
background: #eee;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
#VNC_clipboard_clear_button {
|
||||
float:right;
|
||||
float:right;
|
||||
}
|
||||
#VNC_clipboard_text {
|
||||
font-size: 11px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#noVNC_Settings {
|
||||
width:200px;
|
||||
width:200px;
|
||||
}
|
||||
|
||||
#noVNC_clipboard_clear_button {
|
||||
float:right;
|
||||
float:right;
|
||||
}
|
||||
|
||||
/*Settings Bubble*/
|
||||
.triangle-right {
|
||||
position:relative;
|
||||
padding:15px;
|
||||
margin:1em 0 3em;
|
||||
color:#fff;
|
||||
background:#fff; /* default background for browsers without gradient support */
|
||||
/* css3 */
|
||||
/*background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
|
||||
background:-moz-linear-gradient(#2e88c4, #075698);
|
||||
background:-o-linear-gradient(#2e88c4, #075698);
|
||||
background:linear-gradient(#2e88c4, #075698);*/
|
||||
-webkit-border-radius:10px;
|
||||
-moz-border-radius:10px;
|
||||
border-radius:10px;
|
||||
color:#000;
|
||||
border:2px solid #E0E0E0;
|
||||
position:relative;
|
||||
padding:15px;
|
||||
margin:1em 0 3em;
|
||||
color:#fff;
|
||||
background:#fff; /* default background for browsers without gradient support */
|
||||
/* css3 */
|
||||
/*background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
|
||||
background:-moz-linear-gradient(#2e88c4, #075698);
|
||||
background:-o-linear-gradient(#2e88c4, #075698);
|
||||
background:linear-gradient(#2e88c4, #075698);*/
|
||||
-webkit-border-radius:10px;
|
||||
-moz-border-radius:10px;
|
||||
border-radius:10px;
|
||||
color:#000;
|
||||
border:2px solid #E0E0E0;
|
||||
}
|
||||
|
||||
.triangle-right.top:after {
|
||||
border-color: transparent #E0E0E0;
|
||||
border-width: 20px 20px 0 0;
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
right: 50px;
|
||||
top: -20px;
|
||||
border-color: transparent #E0E0E0;
|
||||
border-width: 20px 20px 0 0;
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
right: 50px;
|
||||
top: -20px;
|
||||
}
|
||||
|
||||
.triangle-right:after {
|
||||
content:"";
|
||||
position:absolute;
|
||||
bottom:-20px; /* value = - border-top-width - border-bottom-width */
|
||||
left:50px; /* controls horizontal position */
|
||||
border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */
|
||||
border-style:solid;
|
||||
border-color:#E0E0E0 transparent;
|
||||
/* reduce the damage in FF3.0 */
|
||||
display:block;
|
||||
width:0;
|
||||
content:"";
|
||||
position:absolute;
|
||||
bottom:-20px; /* value = - border-top-width - border-bottom-width */
|
||||
left:50px; /* controls horizontal position */
|
||||
border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */
|
||||
border-style:solid;
|
||||
border-color:#E0E0E0 transparent;
|
||||
/* reduce the damage in FF3.0 */
|
||||
display:block;
|
||||
width:0;
|
||||
}
|
||||
|
||||
.triangle-right.top:after {
|
||||
top:-40px; /* value = - border-top-width - border-bottom-width */
|
||||
right:50px; /* controls horizontal position */
|
||||
bottom:auto;
|
||||
left:auto;
|
||||
border-width:40px 40px 0 0; /* vary these values to change the angle of the vertex */
|
||||
border-color:transparent #E0E0E0;
|
||||
top:-40px; /* value = - border-top-width - border-bottom-width */
|
||||
right:50px; /* controls horizontal position */
|
||||
bottom:auto;
|
||||
left:auto;
|
||||
border-width:40px 40px 0 0; /* vary these values to change the angle of the vertex */
|
||||
border-color:transparent #E0E0E0;
|
||||
}
|
||||
|
||||
/*Bubble contents divs*/
|
||||
#noVNC_Settings {
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:100px;
|
||||
display:none;
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:100px;
|
||||
display:none;
|
||||
}
|
||||
|
||||
#noVNC_controls {
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:10px;
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:10px;
|
||||
}
|
||||
|
||||
#noVNC_clipboard {
|
||||
display:none;
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:180px;
|
||||
display:none;
|
||||
margin-top:72px;
|
||||
position:fixed;
|
||||
right:180px;
|
||||
}
|
||||
|
||||
/*Default noVNC screen.*/
|
||||
#noVNC_defaultScreen {
|
||||
width:400px;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
font-size:160px;
|
||||
color:yellow;
|
||||
text-align:left;
|
||||
font-family: 'Orbitron', sans-serif;
|
||||
line-height:90%;
|
||||
text-shadow:
|
||||
width:400px;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
font-size:160px;
|
||||
color:yellow;
|
||||
text-align:left;
|
||||
font-family: 'Orbitron', sans-serif;
|
||||
line-height:90%;
|
||||
text-shadow:
|
||||
5px 5px 0 #000,
|
||||
-1px -1px 0 #000,
|
||||
1px -1px 0 #000,
|
||||
|
@ -250,16 +250,16 @@ html {
|
|||
}
|
||||
|
||||
#noVNC_defaultScreen span{
|
||||
color:green;
|
||||
color:green;
|
||||
}
|
||||
|
||||
#keyboardinput {
|
||||
width:0px;
|
||||
height:0px;
|
||||
background-color:#313131;
|
||||
border:0;
|
||||
width:0px;
|
||||
height:0px;
|
||||
background-color:#313131;
|
||||
border:0;
|
||||
}
|
||||
|
||||
.noVNC_status_warn {
|
||||
background-color:yellow;
|
||||
}
|
||||
background-color:yellow;
|
||||
}
|
||||
|
|
|
@ -1,21 +1,21 @@
|
|||
#noVNC-control-bar {
|
||||
background-color:#000;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.5, rgb(0,0,0)),
|
||||
color-stop(0.5, rgb(20,20,20))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(0,0,0) 50%,
|
||||
rgb(20,20,20) 50%
|
||||
);
|
||||
background-color:#000;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.5, rgb(0,0,0)),
|
||||
color-stop(0.5, rgb(20,20,20))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(0,0,0) 50%,
|
||||
rgb(20,20,20) 50%
|
||||
);
|
||||
}
|
||||
|
||||
.triangle-right {
|
||||
border:2px solid #fff;
|
||||
background:#000;
|
||||
color:#fff;
|
||||
}
|
||||
border:2px solid #fff;
|
||||
background:#000;
|
||||
color:#fff;
|
||||
}
|
||||
|
|
|
@ -1,22 +1,22 @@
|
|||
|
||||
#noVNC-control-bar {
|
||||
background-color:#04073d;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.54, rgb(10,15,79)),
|
||||
color-stop(0.5, rgb(4,7,61))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(10,15,79) 54%,
|
||||
rgb(4,7,61) 50%
|
||||
);
|
||||
background-color:#04073d;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0.54, rgb(10,15,79)),
|
||||
color-stop(0.5, rgb(4,7,61))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
center bottom,
|
||||
rgb(10,15,79) 54%,
|
||||
rgb(4,7,61) 50%
|
||||
);
|
||||
}
|
||||
|
||||
.triangle-right {
|
||||
border:2px solid #fff;
|
||||
background:#04073d;
|
||||
color:#fff;
|
||||
}
|
||||
border:2px solid #fff;
|
||||
background:#04073d;
|
||||
color:#fff;
|
||||
}
|
||||
|
|
234
include/ui.js
234
include/ui.js
|
@ -20,26 +20,26 @@ clipboardOpen: false,
|
|||
load: function() {
|
||||
var html = '', i, sheet, sheets, llevels;
|
||||
|
||||
// Stylesheet selection dropdown
|
||||
// Stylesheet selection dropdown
|
||||
sheet = WebUtil.selectStylesheet();
|
||||
sheets = WebUtil.getStylesheets();
|
||||
for (i = 0; i < sheets.length; i += 1) {
|
||||
UI.addOption($D('noVNC_stylesheet'),sheets[i].title, sheets[i].title);
|
||||
UI.addOption($D('noVNC_stylesheet'),sheets[i].title, sheets[i].title);
|
||||
}
|
||||
|
||||
// Logging selection dropdown
|
||||
llevels = ['error', 'warn', 'info', 'debug'];
|
||||
for (i = 0; i < llevels.length; i += 1) {
|
||||
UI.addOption($D('noVNC_logging'),llevels[i], llevels[i]);
|
||||
UI.addOption($D('noVNC_logging'),llevels[i], llevels[i]);
|
||||
}
|
||||
|
||||
|
||||
// Settings with immediate effects
|
||||
UI.initSetting('logging', 'warn');
|
||||
WebUtil.init_logging(UI.getSetting('logging'));
|
||||
UI.initSetting('stylesheet', 'default');
|
||||
|
||||
WebUtil.selectStylesheet(null);
|
||||
// call twice to get around webkit bug
|
||||
// call twice to get around webkit bug
|
||||
WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
|
||||
|
||||
/* Populate the controls if defaults are provided in the URL */
|
||||
|
@ -63,24 +63,24 @@ load: function() {
|
|||
// $D('VNC_clipboard_text').blur();
|
||||
// }
|
||||
// };
|
||||
|
||||
|
||||
// Show mouse selector buttons on touch screen devices
|
||||
if ('ontouchstart' in document.documentElement) {
|
||||
$D('noVNC_mobile_buttons').style.display = "inline";
|
||||
UI.setMouseButton();
|
||||
window.scrollTo(0, 1);
|
||||
window.scrollTo(0, 1);
|
||||
}
|
||||
|
||||
//iOS Safari does not support CSS position:fixed.
|
||||
//This detects iOS devices and enables javascript workaround.
|
||||
if((navigator.userAgent.match(/iPhone/i))
|
||||
||(navigator.userAgent.match(/iPod/i))
|
||||
|| (navigator.userAgent.match(/iPad/i))) {
|
||||
UI.setOnscroll();
|
||||
UI.setResize();
|
||||
}
|
||||
|
||||
$D('noVNC_host').focus();
|
||||
//iOS Safari does not support CSS position:fixed.
|
||||
//This detects iOS devices and enables javascript workaround.
|
||||
if ((navigator.userAgent.match(/iPhone/i)) ||
|
||||
(navigator.userAgent.match(/iPod/i)) ||
|
||||
(navigator.userAgent.match(/iPad/i))) {
|
||||
UI.setOnscroll();
|
||||
UI.setResize();
|
||||
}
|
||||
|
||||
$D('noVNC_host').focus();
|
||||
},
|
||||
|
||||
// Read form control compatible setting from cookie
|
||||
|
@ -106,17 +106,13 @@ updateSetting: function(name, value) {
|
|||
if (typeof value !== 'undefined') {
|
||||
WebUtil.createCookie(name, value);
|
||||
}
|
||||
if(name === 'host')
|
||||
{
|
||||
|
||||
|
||||
}
|
||||
|
||||
// Update the settings control
|
||||
value = UI.getSetting(name);
|
||||
|
||||
if (ctrl.type === 'checkbox') {
|
||||
ctrl.checked = value;
|
||||
|
||||
|
||||
} else if (typeof ctrl.options !== 'undefined') {
|
||||
for (i = 0; i < ctrl.options.length; i += 1) {
|
||||
if (ctrl.options[i].value === value) {
|
||||
|
@ -125,12 +121,11 @@ updateSetting: function(name, value) {
|
|||
}
|
||||
}
|
||||
} else {
|
||||
/*Weird IE9 error leads to 'null' appearring
|
||||
in textboxes instead of ''.*/
|
||||
if(value === null)
|
||||
{
|
||||
value = "";
|
||||
}
|
||||
/*Weird IE9 error leads to 'null' appearring
|
||||
in textboxes instead of ''.*/
|
||||
if (value === null) {
|
||||
value = "";
|
||||
}
|
||||
ctrl.value = value;
|
||||
}
|
||||
},
|
||||
|
@ -193,15 +188,14 @@ clickSettingsMenu: function() {
|
|||
|
||||
// Open menu
|
||||
openSettingsMenu: function() {
|
||||
if(UI.clipboardOpen == true)
|
||||
{
|
||||
UI.showClipboard();
|
||||
}
|
||||
//Close connection settings if open
|
||||
if(UI.connSettingsOpen == true) {
|
||||
UI.connectPanelbutton();
|
||||
}
|
||||
$D('noVNC_Settings').style.display = "block";
|
||||
if (UI.clipboardOpen == true) {
|
||||
UI.showClipboard();
|
||||
}
|
||||
//Close connection settings if open
|
||||
if (UI.connSettingsOpen == true) {
|
||||
UI.connectPanelbutton();
|
||||
}
|
||||
$D('noVNC_Settings').style.display = "block";
|
||||
UI.settingsOpen = true;
|
||||
},
|
||||
|
||||
|
@ -250,11 +244,11 @@ settingsApply: function() {
|
|||
|
||||
setPassword: function() {
|
||||
UI.rfb.sendPassword($D('noVNC_password').value);
|
||||
//Reset connect button.
|
||||
$D('noVNC_connect_button').value = "Connect";
|
||||
//Reset connect button.
|
||||
$D('noVNC_connect_button').value = "Connect";
|
||||
$D('noVNC_connect_button').onclick = UI.Connect;
|
||||
//Hide connection panel.
|
||||
UI.connectPanelbutton();
|
||||
//Hide connection panel.
|
||||
UI.connectPanelbutton();
|
||||
return false;
|
||||
},
|
||||
|
||||
|
@ -304,7 +298,7 @@ updateState: function(rfb, state, oldstate, msg) {
|
|||
UI.settingsDisabled(true, rfb);
|
||||
klass = "noVNC_status_error";
|
||||
break;
|
||||
case 'normal':
|
||||
case 'normal':
|
||||
c.value = "Disconnect";
|
||||
c.onclick = UI.disconnect;
|
||||
c.disabled = false;
|
||||
|
@ -313,8 +307,8 @@ updateState: function(rfb, state, oldstate, msg) {
|
|||
klass = "noVNC_status_normal";
|
||||
break;
|
||||
case 'disconnected':
|
||||
$D('noVNC_defaultScreen').style.display = "block";
|
||||
c.value = "Connection";
|
||||
$D('noVNC_defaultScreen').style.display = "block";
|
||||
c.value = "Connection";
|
||||
c.onclick = UI.connectPanelbutton;
|
||||
case 'loaded':
|
||||
c.value = "Connection";
|
||||
|
@ -325,12 +319,12 @@ updateState: function(rfb, state, oldstate, msg) {
|
|||
klass = "noVNC_status_normal";
|
||||
break;
|
||||
case 'password':
|
||||
UI.connectPanelbutton();
|
||||
UI.connectPanelbutton();
|
||||
|
||||
$D('noVNC_connect_button').value = "Send Password";
|
||||
$D('noVNC_connect_button').onclick = UI.setPassword;
|
||||
$D('noVNC_password').focus();
|
||||
|
||||
$D('noVNC_password').focus();
|
||||
|
||||
c.disabled = false;
|
||||
cad.style.display = "none";
|
||||
UI.settingsDisabled(true, rfb);
|
||||
|
@ -363,7 +357,7 @@ connect: function() {
|
|||
var host, port, password;
|
||||
|
||||
UI.closeSettingsMenu();
|
||||
UI.connectPanelbutton();
|
||||
UI.connectPanelbutton();
|
||||
|
||||
host = $D('noVNC_host').value;
|
||||
port = $D('noVNC_port').value;
|
||||
|
@ -379,18 +373,18 @@ connect: function() {
|
|||
UI.rfb.set_connectTimeout(UI.getSetting('connectTimeout'));
|
||||
|
||||
UI.rfb.connect(host, port, password);
|
||||
//Close dialog.
|
||||
setTimeout("setBarPosition()",100);
|
||||
$D('noVNC_defaultScreen').style.display = "none";
|
||||
//Close dialog.
|
||||
setTimeout("setBarPosition()",100);
|
||||
$D('noVNC_defaultScreen').style.display = "none";
|
||||
},
|
||||
|
||||
disconnect: function() {
|
||||
UI.closeSettingsMenu();
|
||||
UI.rfb.disconnect();
|
||||
|
||||
$D('noVNC_defaultScreen').style.display = "block";
|
||||
UI.connSettingsOpen = false;
|
||||
UI.connectPanelbutton();
|
||||
|
||||
$D('noVNC_defaultScreen').style.display = "block";
|
||||
UI.connSettingsOpen = false;
|
||||
UI.connectPanelbutton();
|
||||
},
|
||||
|
||||
displayBlur: function() {
|
||||
|
@ -416,38 +410,38 @@ clipSend: function() {
|
|||
},
|
||||
|
||||
showClipboard: function() {
|
||||
//Close settings if open
|
||||
if(UI.settingsOpen == true) {
|
||||
UI.closeSettingsMenu();
|
||||
}
|
||||
//Close connection settings if open
|
||||
if(UI.connSettingsOpen == true) {
|
||||
UI.connectPanelbutton();
|
||||
}
|
||||
//Toggle Connection Panel
|
||||
if(UI.clipboardOpen == true)
|
||||
{ $D('noVNC_clipboard').style.display = "none";
|
||||
UI.clipboardOpen = false;
|
||||
} else {
|
||||
$D('noVNC_clipboard').style.display = "block";
|
||||
UI.clipboardOpen = true;
|
||||
}
|
||||
//Close settings if open
|
||||
if (UI.settingsOpen == true) {
|
||||
UI.closeSettingsMenu();
|
||||
}
|
||||
//Close connection settings if open
|
||||
if (UI.connSettingsOpen == true) {
|
||||
UI.connectPanelbutton();
|
||||
}
|
||||
//Toggle Connection Panel
|
||||
if (UI.clipboardOpen == true) {
|
||||
$D('noVNC_clipboard').style.display = "none";
|
||||
UI.clipboardOpen = false;
|
||||
} else {
|
||||
$D('noVNC_clipboard').style.display = "block";
|
||||
UI.clipboardOpen = true;
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
showKeyboard: function() {
|
||||
//Get Current Scroll Position
|
||||
var scrollx =
|
||||
(document.all)?document.body.scrollLeft:window.pageXOffset;
|
||||
var scrolly =
|
||||
(document.all)?document.body.scrollTop:window.pageYOffset;
|
||||
//Get Current Scroll Position
|
||||
var scrollx =
|
||||
(document.all)?document.body.scrollLeft:window.pageXOffset;
|
||||
var scrolly =
|
||||
(document.all)?document.body.scrollTop:window.pageYOffset;
|
||||
|
||||
//Stop browser zooming on textbox.
|
||||
UI.zoomDisable();
|
||||
$D('keyboardinput').focus();
|
||||
scroll(scrollx,scrolly);
|
||||
//Renable user zoom.
|
||||
UI.zoomEnable();
|
||||
//Stop browser zooming on textbox.
|
||||
UI.zoomDisable();
|
||||
$D('keyboardinput').focus();
|
||||
scroll(scrollx,scrolly);
|
||||
//Renable user zoom.
|
||||
UI.zoomEnable();
|
||||
},
|
||||
|
||||
zoomDisable: function() {
|
||||
|
@ -462,73 +456,71 @@ zoomEnable: function(){
|
|||
|
||||
changeViewportMeta: function (newattributes) {
|
||||
|
||||
// First, get the array of meta-tag elements
|
||||
// First, get the array of meta-tag elements
|
||||
var metatags = document.getElementsByTagName("meta");
|
||||
|
||||
// Update only the Viewport meta tag
|
||||
for (var cnt = 0; cnt < metatags.length; cnt++)
|
||||
{
|
||||
|
||||
var name = metatags[cnt].getAttribute("name");
|
||||
var content = metatags[cnt].getAttribute("content");
|
||||
|
||||
// Update the Viewport meta tag
|
||||
if (metatags[cnt].getAttribute("name") == "viewport")
|
||||
metatags[cnt].setAttribute("content", newattributes);
|
||||
if (metatags[cnt].getAttribute("name") == "viewport") {
|
||||
metatags[cnt].setAttribute("content", newattributes);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
//iOS < Version 5 does not support position fixed. Javascript workaround:
|
||||
setOnscroll: function() {
|
||||
window.onscroll = function() {
|
||||
UI.setBarPosition();
|
||||
};
|
||||
window.onscroll = function() {
|
||||
UI.setBarPosition();
|
||||
};
|
||||
},
|
||||
|
||||
setResize: function () {
|
||||
window.onResize = function() {
|
||||
UI.setBarPosition();
|
||||
};
|
||||
window.onResize = function() {
|
||||
UI.setBarPosition();
|
||||
};
|
||||
},
|
||||
|
||||
//Helper to add options to dropdown.
|
||||
addOption: function(selectbox,text,value )
|
||||
{
|
||||
var optn = document.createElement("OPTION");
|
||||
optn.text = text;
|
||||
optn.value = value;
|
||||
selectbox.options.add(optn);
|
||||
var optn = document.createElement("OPTION");
|
||||
optn.text = text;
|
||||
optn.value = value;
|
||||
selectbox.options.add(optn);
|
||||
},
|
||||
|
||||
setBarPosition: function() {
|
||||
$D('noVNC-control-bar').style.top = (window.pageYOffset) + 'px';
|
||||
$D('noVNC_mobile_buttons').style.left = (window.pageXOffset) + 'px';
|
||||
$D('noVNC_mobile_buttons_right').style.right = 0 + 'px';
|
||||
|
||||
var vncwidth = $('#noVNC_screen').width();
|
||||
$D('noVNC-control-bar').style.width = vncwidth + 'px';
|
||||
$D('noVNC-control-bar').style.top = (window.pageYOffset) + 'px';
|
||||
$D('noVNC_mobile_buttons').style.left = (window.pageXOffset) + 'px';
|
||||
$D('noVNC_mobile_buttons_right').style.right = 0 + 'px';
|
||||
|
||||
var vncwidth = $('#noVNC_screen').width();
|
||||
$D('noVNC-control-bar').style.width = vncwidth + 'px';
|
||||
},
|
||||
|
||||
connectPanelbutton: function() {
|
||||
//Close connection settings if open
|
||||
if(UI.settingsOpen == true) {
|
||||
UI.closeSettingsMenu();
|
||||
}
|
||||
if(UI.clipboardOpen == true)
|
||||
{
|
||||
UI.showClipboard();
|
||||
}
|
||||
//Close connection settings if open
|
||||
if (UI.settingsOpen == true) {
|
||||
UI.closeSettingsMenu();
|
||||
}
|
||||
if (UI.clipboardOpen == true) {
|
||||
UI.showClipboard();
|
||||
}
|
||||
|
||||
//Toggle Connection Panel
|
||||
if(UI.connSettingsOpen == true)
|
||||
{
|
||||
$D('noVNC_controls').style.display = "none";
|
||||
UI.connSettingsOpen = false;
|
||||
} else {
|
||||
$D('noVNC_controls').style.display = "block";
|
||||
UI.connSettingsOpen = true;
|
||||
$D('noVNC_host').focus();
|
||||
}
|
||||
//Toggle Connection Panel
|
||||
if (UI.connSettingsOpen == true) {
|
||||
$D('noVNC_controls').style.display = "none";
|
||||
UI.connSettingsOpen = false;
|
||||
} else {
|
||||
$D('noVNC_controls').style.display = "block";
|
||||
UI.connSettingsOpen = true;
|
||||
$D('noVNC_host').focus();
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
|
257
vnc.html
257
vnc.html
|
@ -7,135 +7,150 @@
|
|||
Copyright (C) 2011 Joel Martin
|
||||
Licensed under LGPL-3 (see LICENSE.txt)
|
||||
-->
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>noVNC</title>
|
||||
|
||||
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
||||
Remove this if you use the .htaccess -->
|
||||
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta charset="utf-8">
|
||||
|
||||
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
||||
Remove this if you use the .htaccess -->
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<meta name="viewport" content="user-scalable=1" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<!--
|
||||
<meta name="viewport" content="width=device-width,height=device-height" />
|
||||
-->
|
||||
|
||||
<title>noVNC</title>
|
||||
|
||||
<meta name="viewport" content="user-scalable=1" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
|
||||
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="include/base.css" />
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="include/base.css" />
|
||||
<link rel="alternate stylesheet" href="include/black.css" TITLE="Black" />
|
||||
<link rel="alternate stylesheet" href="include/blue.css" TITLE="Blue" />
|
||||
|
||||
<!-- Google web fonts -->
|
||||
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz|Nova+Square|Orbitron:400,500,700,900|Nova+Round|Nova+Mono|Nova+Slim|Nova+Oval|Nova+Flat|Nova+Cut' rel='stylesheet' type='text/css'>
|
||||
|
||||
<!--
|
||||
<script type='text/javascript'
|
||||
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
|
||||
-->
|
||||
|
||||
<script src="include/vnc.js"></script>
|
||||
<script src="include/ui.js"></script>
|
||||
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<!--
|
||||
<meta name="viewport" content="width=device-width,height=device-height" />
|
||||
-->
|
||||
|
||||
<!-- App Start Icon -->
|
||||
<link rel="apple-touch-startup-image" href="images/screen_640x435.png" />
|
||||
<link rel="alternate stylesheet" href="include/blue.css" TITLE="Blue" />
|
||||
|
||||
<!-- Google web fonts -->
|
||||
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz|Nova+Square|Orbitron:400,500,700,900|Nova+Round|Nova+Mono|Nova+Slim|Nova+Oval|Nova+Flat|Nova+Cut' rel='stylesheet' type='text/css'>
|
||||
<!-- App Start Icon -->
|
||||
<link rel="apple-touch-startup-image" href="images/screen_640x435.png" />
|
||||
|
||||
<!-- For iOS devices set the icon to use if user bookmarks app on their homescreen -->
|
||||
<link rel="apple-touch-icon" href="images/mobileicon.png">
|
||||
<link rel="apple-touch-icon-precomposed" href="images/mobileicon.png" />
|
||||
|
||||
<!--
|
||||
<script type='text/javascript'
|
||||
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
|
||||
-->
|
||||
|
||||
<script src="include/vnc.js"></script>
|
||||
<script src="include/ui.js"></script>
|
||||
|
||||
<!-- For iOS devices set the icon to use if user bookmarks app on their homescreen -->
|
||||
<link rel="apple-touch-icon" href="images/mobileicon.png">
|
||||
<link rel="apple-touch-icon-precomposed" href="images/mobileicon.png" />
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="noVNC-control-bar">
|
||||
<!--noVNC Mobile Device only Buttons-->
|
||||
<div id="noVNC_mobile_buttons">
|
||||
<nobr>
|
||||
<span class="noVNC_mouse_buttons">
|
||||
<input type="button" class="noVNC_status_button" id="noVNC_mouse_button1" value="L" onclick="UI.setMouseButton(1);">
|
||||
<input type="button" class="noVNC_status_button" id="noVNC_mouse_button2" value="M" onclick="UI.setMouseButton(2);">
|
||||
<input type="button" class="noVNC_status_button" id="noVNC_mouse_button4" value="R" onclick="UI.setMouseButton(4);">
|
||||
<input type="button" id="showKeyboard" onclick="UI.showKeyboard()" value="Keyboard" class="noVNC_status_button"/>
|
||||
</span>
|
||||
</nobr>
|
||||
</div>
|
||||
|
||||
<!--noVNC Buttons-->
|
||||
<div class="noVNC_mobile_buttons_right">
|
||||
<input type="button" class="noVNC_status_button" style="float:left;" value="CtrlAltDel" id="sendCtrlAltDelButton" onclick="UI.sendCtrlAltDel();">
|
||||
<input type="button" id="clipboardbutton" onclick="UI.showClipboard();" value="Clipboard" />
|
||||
<input type="button" class="VNC_status_button" value="Settings" id="menuButton" onclick="UI.clickSettingsMenu();">
|
||||
<input type="button" id="connectPanelbutton" class="VNC_status_button" style="width:100px;" onclick="UI.connectPanelbutton()" value="Connection" />
|
||||
</div>
|
||||
|
||||
<!-- Clipboard Panel -->
|
||||
<div id="noVNC_clipboard" class="triangle-right top">
|
||||
<textarea id="noVNC_clipboard_text" cols=88 rows=5 onfocus="UI.displayBlur();" onblur="UI.displayFocus();" onchange="UI.clipSend();">
|
||||
</textarea>
|
||||
<br />
|
||||
<input id="noVNC_clipboard_clear_button" type="button" value="Clear" onclick="UI.clipClear();">
|
||||
</div>
|
||||
|
||||
<!-- Settings Panel -->
|
||||
<div id="noVNC_Settings" class="triangle-right top">
|
||||
<span id="noVNC_settings_menu" onmouseover="UI.displayBlur();" onmouseout="UI.displayFocus();">
|
||||
<ul>
|
||||
<li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li>
|
||||
<li><input id="noVNC_true_color" type="checkbox" checked> True Color</li>
|
||||
<li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li>
|
||||
<li><input id="noVNC_shared" type="checkbox"> Shared Mode</li>
|
||||
<li><input id="noVNC_connectTimeout" type="input"> Connect Timeout (s)</li>
|
||||
<hr>
|
||||
<!-- Stylesheet selection dropdown -->
|
||||
<li><label><strong>Style: </strong>
|
||||
<select id="noVNC_stylesheet" name="vncStyle">
|
||||
<option value="default">default</option>
|
||||
</select></label>
|
||||
</li>
|
||||
<div id="noVNC-control-bar">
|
||||
<!--noVNC Mobile Device only Buttons-->
|
||||
<div id="noVNC_mobile_buttons">
|
||||
<nobr>
|
||||
<span class="noVNC_mouse_buttons">
|
||||
<input type="button" class="noVNC_status_button"
|
||||
id="noVNC_mouse_button1" value="L"
|
||||
onclick="UI.setMouseButton(1);">
|
||||
<input type="button" class="noVNC_status_button"
|
||||
id="noVNC_mouse_button2" value="M"
|
||||
onclick="UI.setMouseButton(2);">
|
||||
<input type="button" class="noVNC_status_button"
|
||||
id="noVNC_mouse_button4" value="R"
|
||||
onclick="UI.setMouseButton(4);">
|
||||
<input type="button" id="showKeyboard"
|
||||
value="Keyboard" class="noVNC_status_button"
|
||||
onclick="UI.showKeyboard()"/>
|
||||
</span>
|
||||
</nobr>
|
||||
</div>
|
||||
|
||||
<!-- Logging selection dropdown -->
|
||||
<li><label><strong>Logging: </strong>
|
||||
<select id="noVNC_logging" name="vncLogging">
|
||||
</select></label>
|
||||
</li>
|
||||
<hr>
|
||||
<li><input type="button" id="noVNC_apply" value="Apply" onclick="UI.settingsApply()"></li>
|
||||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Connection Panel -->
|
||||
<div id="noVNC_controls" class="triangle-right top">
|
||||
<ul>
|
||||
<li><label><strong>Host: </strong><input id="noVNC_host" /></label></li>
|
||||
<li><label><strong>Port: </strong><input id="noVNC_port" /></label></li>
|
||||
<li><label><strong>Password: </strong><input id="noVNC_password" type="password" /></label></li>
|
||||
<li><input id="noVNC_connect_button" type="button" value="Connect" onclick="UI.connect();"></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="noVNC_screen">
|
||||
<div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
|
||||
<div id="noVNC_status">Loading</div>
|
||||
</div>
|
||||
|
||||
<!-- HTML5 Canvas -->
|
||||
<h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1>
|
||||
<canvas id="noVNC_canvas" width="640px" height="20px">
|
||||
Canvas not supported.
|
||||
</canvas>
|
||||
|
||||
<input id="keyboardinput" type="text" onKeyDown="onKeyDown(event);"/>
|
||||
</div>
|
||||
<!--noVNC Buttons-->
|
||||
<div class="noVNC_mobile_buttons_right">
|
||||
<input type="button" class="noVNC_status_button"
|
||||
style="float:left;" value="CtrlAltDel" id="sendCtrlAltDelButton"
|
||||
onclick="UI.sendCtrlAltDel();">
|
||||
<input type="button" id="clipboardbutton" value="Clipboard"
|
||||
onclick="UI.showClipboard();"/>
|
||||
<input type="button" class="VNC_status_button"
|
||||
value="Settings" id="menuButton"
|
||||
onclick="UI.clickSettingsMenu();">
|
||||
<input type="button" id="connectPanelbutton"
|
||||
class="VNC_status_button" style="width:100px;"
|
||||
onclick="UI.connectPanelbutton()" value="Connection" />
|
||||
</div>
|
||||
|
||||
<!-- Clipboard Panel -->
|
||||
<div id="noVNC_clipboard" class="triangle-right top">
|
||||
<textarea id="noVNC_clipboard_text" cols=88 rows=5
|
||||
onfocus="UI.displayBlur();" onblur="UI.displayFocus();"
|
||||
onchange="UI.clipSend();">
|
||||
</textarea>
|
||||
<br />
|
||||
<input id="noVNC_clipboard_clear_button" type="button"
|
||||
value="Clear" onclick="UI.clipClear();">
|
||||
</div>
|
||||
|
||||
<!-- Settings Panel -->
|
||||
<div id="noVNC_Settings" class="triangle-right top">
|
||||
<span id="noVNC_settings_menu" onmouseover="UI.displayBlur();"
|
||||
onmouseout="UI.displayFocus();">
|
||||
<ul>
|
||||
<li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li>
|
||||
<li><input id="noVNC_true_color" type="checkbox" checked> True Color</li>
|
||||
<li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li>
|
||||
<li><input id="noVNC_shared" type="checkbox"> Shared Mode</li>
|
||||
<li><input id="noVNC_connectTimeout" type="input"> Connect Timeout (s)</li>
|
||||
<hr>
|
||||
<!-- Stylesheet selection dropdown -->
|
||||
<li><label><strong>Style: </strong>
|
||||
<select id="noVNC_stylesheet" name="vncStyle">
|
||||
<option value="default">default</option>
|
||||
</select></label>
|
||||
</li>
|
||||
|
||||
<!-- Logging selection dropdown -->
|
||||
<li><label><strong>Logging: </strong>
|
||||
<select id="noVNC_logging" name="vncLogging">
|
||||
</select></label>
|
||||
</li>
|
||||
<hr>
|
||||
<li><input type="button" id="noVNC_apply" value="Apply"
|
||||
onclick="UI.settingsApply()"></li>
|
||||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Connection Panel -->
|
||||
<div id="noVNC_controls" class="triangle-right top">
|
||||
<ul>
|
||||
<li><label><strong>Host: </strong><input id="noVNC_host" /></label></li>
|
||||
<li><label><strong>Port: </strong><input id="noVNC_port" /></label></li>
|
||||
<li><label><strong>Password: </strong><input id="noVNC_password" type="password" /></label></li>
|
||||
<li><input id="noVNC_connect_button" type="button" value="Connect" onclick="UI.connect();"></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div> <!-- End of noVNC-control-bar -->
|
||||
|
||||
<div id="noVNC_screen">
|
||||
<div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
|
||||
<div id="noVNC_status">Loading</div>
|
||||
</div>
|
||||
|
||||
<!-- HTML5 Canvas -->
|
||||
<h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1>
|
||||
<canvas id="noVNC_canvas" width="640px" height="20px">
|
||||
Canvas not supported.
|
||||
</canvas>
|
||||
|
||||
<input id="keyboardinput" type="text" onKeyDown="onKeyDown(event);"/>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
window.onload = UI.load;
|
||||
</script>
|
||||
<script>
|
||||
window.onload = UI.load;
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue