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:
Joel Martin 2011-09-08 10:00:09 -05:00
parent 0911173a89
commit 01a9eee991
5 changed files with 422 additions and 415 deletions

View File

@ -1,62 +1,62 @@
body { body {
margin:0; margin:0;
padding:0; padding:0;
font-family: Helvetica; font-family: Helvetica;
/*Background image with light grey curve.*/ /*Background image with light grey curve.*/
background-color:#494949; background-color:#494949;
background-repeat:no-repeat; background-repeat:no-repeat;
background-position:right bottom; background-position:right bottom;
height:100%; height:100%;
} }
html { html {
height:100%; height:100%;
} }
#noVNC_controls ul { #noVNC_controls ul {
list-style: none; list-style: none;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
} }
#noVNC_controls li { #noVNC_controls li {
padding-bottom:8px; padding-bottom:8px;
} }
#noVNC_host { #noVNC_host {
width:150px; width:150px;
} }
#noVNC_port { #noVNC_port {
width: 80px; width: 80px;
} }
#noVNC_password { #noVNC_password {
width: 150px; width: 150px;
} }
#noVNC_encrypt { #noVNC_encrypt {
} }
#noVNC_connectTimeout { #noVNC_connectTimeout {
width: 30px; width: 30px;
} }
#noVNC_connect_button { #noVNC_connect_button {
width: 110px; width: 110px;
float:right; float:right;
} }
/*Mobile buttons bar.*/ /*Mobile buttons bar.*/
#noVNC-control-bar { #noVNC-control-bar {
position:fixed; position:fixed;
background-color:#6d84a2; background-color:#6d84a2;
background-image: -webkit-gradient( background-image: -webkit-gradient(
linear, linear,
left bottom, left bottom,
left top, left top,
color-stop(0.5, rgb(109,132,162)), color-stop(0.5, rgb(109,132,162)),
color-stop(1, rgb(140,157,179)) color-stop(1, rgb(140,157,179))
); );
background-image: -moz-linear-gradient( background-image: -moz-linear-gradient(
center bottom, center bottom,
rgb(109,132,162) 50%, rgb(109,132,162) 50%,
rgb(140,157,179) 100% rgb(140,157,179) 100%
); );
display:block; display:block;
height:44px; height:44px;
left:0; left:0;
@ -66,182 +66,182 @@ html {
} }
#noVNC_mobile_buttons { #noVNC_mobile_buttons {
position:fixed; position:fixed;
padding-left:10px; padding-left:10px;
padding-top:9px; padding-top:9px;
display: none; display: none;
} }
.noVNC_mobile_buttons_right { .noVNC_mobile_buttons_right {
position:fixed; position:fixed;
padding-right:10px; padding-right:10px;
padding-top:9px; padding-top:9px;
right:0; right:0;
} }
#noVNC_status_bar { #noVNC_status_bar {
margin-top: 15px; margin-top: 15px;
padding: 0px; padding: 0px;
} }
#noVNC_status_bar div { #noVNC_status_bar div {
font-size: 12px; font-size: 12px;
padding-top: 4px; padding-top: 4px;
width:100%; width:100%;
margin-top: 2px; margin-top: 2px;
} }
.VNC_status_button, #clipboardbutton, #connectbutton { .VNC_status_button, #clipboardbutton, #connectbutton {
font-size: 14px; font-size: 14px;
} }
#noVNC_status { #noVNC_status {
height:20px; height:20px;
text-align: center; text-align: center;
} }
#noVNC_settings_menu { #noVNC_settings_menu {
margin: 3px; margin: 3px;
text-align: left; text-align: left;
} }
#noVNC_settings_menu ul { #noVNC_settings_menu ul {
list-style: none; list-style: none;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
} }
#noVNC_apply { #noVNC_apply {
float:right; float:right;
} }
.VNC_buttons_right { .VNC_buttons_right {
text-align: right; text-align: right;
} }
.VNC_buttons_left { .VNC_buttons_left {
text-align: left; text-align: left;
} }
.noVNC_status_normal { .noVNC_status_normal {
background: #eee; background: #eee;
} }
.noVNC_status_error { .noVNC_status_error {
background: #f44; background: #f44;
} }
.norVNC_status_warn { .noVNC_status_warn {
background: #ff4; background: #ff4;
} }
/* Do not set width/height for VNC_screen or VNC_canvas or incorrect /* Do not set width/height for VNC_screen or VNC_canvas or incorrect
* scaling will occur. Canvas resizes to remote VNC settings */ * scaling will occur. Canvas resizes to remote VNC settings */
#noVNC_screen { #noVNC_screen {
padding-top:40px; padding-top:40px;
text-align: center; text-align: center;
display: table; display: table;
width:100%; width:100%;
height:100%; height:100%;
background-color:#313131; background-color:#313131;
border-bottom-right-radius: 800px 600px; border-bottom-right-radius: 800px 600px;
/*border-top-left-radius: 800px 600px;*/ /*border-top-left-radius: 800px 600px;*/
} }
#VNC_canvas { #VNC_canvas {
background: #eee; background: #eee;
} }
#VNC_clipboard_clear_button { #VNC_clipboard_clear_button {
float:right; float:right;
} }
#VNC_clipboard_text { #VNC_clipboard_text {
font-size: 11px; font-size: 11px;
} }
#noVNC_Settings { #noVNC_Settings {
width:200px; width:200px;
} }
#noVNC_clipboard_clear_button { #noVNC_clipboard_clear_button {
float:right; float:right;
} }
/*Settings Bubble*/ /*Settings Bubble*/
.triangle-right { .triangle-right {
position:relative; position:relative;
padding:15px; padding:15px;
margin:1em 0 3em; margin:1em 0 3em;
color:#fff; color:#fff;
background:#fff; /* default background for browsers without gradient support */ background:#fff; /* default background for browsers without gradient support */
/* css3 */ /* css3 */
/*background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698)); /*background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
background:-moz-linear-gradient(#2e88c4, #075698); background:-moz-linear-gradient(#2e88c4, #075698);
background:-o-linear-gradient(#2e88c4, #075698); background:-o-linear-gradient(#2e88c4, #075698);
background:linear-gradient(#2e88c4, #075698);*/ background:linear-gradient(#2e88c4, #075698);*/
-webkit-border-radius:10px; -webkit-border-radius:10px;
-moz-border-radius:10px; -moz-border-radius:10px;
border-radius:10px; border-radius:10px;
color:#000; color:#000;
border:2px solid #E0E0E0; border:2px solid #E0E0E0;
} }
.triangle-right.top:after { .triangle-right.top:after {
border-color: transparent #E0E0E0; border-color: transparent #E0E0E0;
border-width: 20px 20px 0 0; border-width: 20px 20px 0 0;
bottom: auto; bottom: auto;
left: auto; left: auto;
right: 50px; right: 50px;
top: -20px; top: -20px;
} }
.triangle-right:after { .triangle-right:after {
content:""; content:"";
position:absolute; position:absolute;
bottom:-20px; /* value = - border-top-width - border-bottom-width */ bottom:-20px; /* value = - border-top-width - border-bottom-width */
left:50px; /* controls horizontal position */ left:50px; /* controls horizontal position */
border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */ border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */
border-style:solid; border-style:solid;
border-color:#E0E0E0 transparent; border-color:#E0E0E0 transparent;
/* reduce the damage in FF3.0 */ /* reduce the damage in FF3.0 */
display:block; display:block;
width:0; width:0;
} }
.triangle-right.top:after { .triangle-right.top:after {
top:-40px; /* value = - border-top-width - border-bottom-width */ top:-40px; /* value = - border-top-width - border-bottom-width */
right:50px; /* controls horizontal position */ right:50px; /* controls horizontal position */
bottom:auto; bottom:auto;
left:auto; left:auto;
border-width:40px 40px 0 0; /* vary these values to change the angle of the vertex */ border-width:40px 40px 0 0; /* vary these values to change the angle of the vertex */
border-color:transparent #E0E0E0; border-color:transparent #E0E0E0;
} }
/*Bubble contents divs*/ /*Bubble contents divs*/
#noVNC_Settings { #noVNC_Settings {
margin-top:72px; margin-top:72px;
position:fixed; position:fixed;
right:100px; right:100px;
display:none; display:none;
} }
#noVNC_controls { #noVNC_controls {
margin-top:72px; margin-top:72px;
position:fixed; position:fixed;
right:10px; right:10px;
} }
#noVNC_clipboard { #noVNC_clipboard {
display:none; display:none;
margin-top:72px; margin-top:72px;
position:fixed; position:fixed;
right:180px; right:180px;
} }
/*Default noVNC screen.*/ /*Default noVNC screen.*/
#noVNC_defaultScreen { #noVNC_defaultScreen {
width:400px; width:400px;
margin-left:auto; margin-left:auto;
margin-right:auto; margin-right:auto;
font-size:160px; font-size:160px;
color:yellow; color:yellow;
text-align:left; text-align:left;
font-family: 'Orbitron', sans-serif; font-family: 'Orbitron', sans-serif;
line-height:90%; line-height:90%;
text-shadow: text-shadow:
5px 5px 0 #000, 5px 5px 0 #000,
-1px -1px 0 #000, -1px -1px 0 #000,
1px -1px 0 #000, 1px -1px 0 #000,
@ -250,16 +250,16 @@ html {
} }
#noVNC_defaultScreen span{ #noVNC_defaultScreen span{
color:green; color:green;
} }
#keyboardinput { #keyboardinput {
width:0px; width:0px;
height:0px; height:0px;
background-color:#313131; background-color:#313131;
border:0; border:0;
} }
.noVNC_status_warn { .noVNC_status_warn {
background-color:yellow; background-color:yellow;
} }

View File

@ -1,21 +1,21 @@
#noVNC-control-bar { #noVNC-control-bar {
background-color:#000; background-color:#000;
background-image: -webkit-gradient( background-image: -webkit-gradient(
linear, linear,
left bottom, left bottom,
left top, left top,
color-stop(0.5, rgb(0,0,0)), color-stop(0.5, rgb(0,0,0)),
color-stop(0.5, rgb(20,20,20)) color-stop(0.5, rgb(20,20,20))
); );
background-image: -moz-linear-gradient( background-image: -moz-linear-gradient(
center bottom, center bottom,
rgb(0,0,0) 50%, rgb(0,0,0) 50%,
rgb(20,20,20) 50% rgb(20,20,20) 50%
); );
} }
.triangle-right { .triangle-right {
border:2px solid #fff; border:2px solid #fff;
background:#000; background:#000;
color:#fff; color:#fff;
} }

View File

@ -1,22 +1,22 @@
#noVNC-control-bar { #noVNC-control-bar {
background-color:#04073d; background-color:#04073d;
background-image: -webkit-gradient( background-image: -webkit-gradient(
linear, linear,
left bottom, left bottom,
left top, left top,
color-stop(0.54, rgb(10,15,79)), color-stop(0.54, rgb(10,15,79)),
color-stop(0.5, rgb(4,7,61)) color-stop(0.5, rgb(4,7,61))
); );
background-image: -moz-linear-gradient( background-image: -moz-linear-gradient(
center bottom, center bottom,
rgb(10,15,79) 54%, rgb(10,15,79) 54%,
rgb(4,7,61) 50% rgb(4,7,61) 50%
); );
} }
.triangle-right { .triangle-right {
border:2px solid #fff; border:2px solid #fff;
background:#04073d; background:#04073d;
color:#fff; color:#fff;
} }

View File

@ -24,13 +24,13 @@ load: function() {
sheet = WebUtil.selectStylesheet(); sheet = WebUtil.selectStylesheet();
sheets = WebUtil.getStylesheets(); sheets = WebUtil.getStylesheets();
for (i = 0; i < sheets.length; i += 1) { 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 // Logging selection dropdown
llevels = ['error', 'warn', 'info', 'debug']; llevels = ['error', 'warn', 'info', 'debug'];
for (i = 0; i < llevels.length; i += 1) { 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 // Settings with immediate effects
@ -39,7 +39,7 @@ load: function() {
UI.initSetting('stylesheet', 'default'); UI.initSetting('stylesheet', 'default');
WebUtil.selectStylesheet(null); WebUtil.selectStylesheet(null);
// call twice to get around webkit bug // call twice to get around webkit bug
WebUtil.selectStylesheet(UI.getSetting('stylesheet')); WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
/* Populate the controls if defaults are provided in the URL */ /* Populate the controls if defaults are provided in the URL */
@ -68,19 +68,19 @@ load: function() {
if ('ontouchstart' in document.documentElement) { if ('ontouchstart' in document.documentElement) {
$D('noVNC_mobile_buttons').style.display = "inline"; $D('noVNC_mobile_buttons').style.display = "inline";
UI.setMouseButton(); UI.setMouseButton();
window.scrollTo(0, 1); window.scrollTo(0, 1);
} }
//iOS Safari does not support CSS position:fixed. //iOS Safari does not support CSS position:fixed.
//This detects iOS devices and enables javascript workaround. //This detects iOS devices and enables javascript workaround.
if((navigator.userAgent.match(/iPhone/i)) if ((navigator.userAgent.match(/iPhone/i)) ||
||(navigator.userAgent.match(/iPod/i)) (navigator.userAgent.match(/iPod/i)) ||
|| (navigator.userAgent.match(/iPad/i))) { (navigator.userAgent.match(/iPad/i))) {
UI.setOnscroll(); UI.setOnscroll();
UI.setResize(); UI.setResize();
} }
$D('noVNC_host').focus(); $D('noVNC_host').focus();
}, },
// Read form control compatible setting from cookie // Read form control compatible setting from cookie
@ -106,11 +106,7 @@ updateSetting: function(name, value) {
if (typeof value !== 'undefined') { if (typeof value !== 'undefined') {
WebUtil.createCookie(name, value); WebUtil.createCookie(name, value);
} }
if(name === 'host')
{
}
// Update the settings control // Update the settings control
value = UI.getSetting(name); value = UI.getSetting(name);
@ -125,12 +121,11 @@ updateSetting: function(name, value) {
} }
} }
} else { } else {
/*Weird IE9 error leads to 'null' appearring /*Weird IE9 error leads to 'null' appearring
in textboxes instead of ''.*/ in textboxes instead of ''.*/
if(value === null) if (value === null) {
{ value = "";
value = ""; }
}
ctrl.value = value; ctrl.value = value;
} }
}, },
@ -193,15 +188,14 @@ clickSettingsMenu: function() {
// Open menu // Open menu
openSettingsMenu: function() { openSettingsMenu: function() {
if(UI.clipboardOpen == true) if (UI.clipboardOpen == true) {
{ UI.showClipboard();
UI.showClipboard(); }
} //Close connection settings if open
//Close connection settings if open if (UI.connSettingsOpen == true) {
if(UI.connSettingsOpen == true) { UI.connectPanelbutton();
UI.connectPanelbutton(); }
} $D('noVNC_Settings').style.display = "block";
$D('noVNC_Settings').style.display = "block";
UI.settingsOpen = true; UI.settingsOpen = true;
}, },
@ -250,11 +244,11 @@ settingsApply: function() {
setPassword: function() { setPassword: function() {
UI.rfb.sendPassword($D('noVNC_password').value); UI.rfb.sendPassword($D('noVNC_password').value);
//Reset connect button. //Reset connect button.
$D('noVNC_connect_button').value = "Connect"; $D('noVNC_connect_button').value = "Connect";
$D('noVNC_connect_button').onclick = UI.Connect; $D('noVNC_connect_button').onclick = UI.Connect;
//Hide connection panel. //Hide connection panel.
UI.connectPanelbutton(); UI.connectPanelbutton();
return false; return false;
}, },
@ -313,8 +307,8 @@ updateState: function(rfb, state, oldstate, msg) {
klass = "noVNC_status_normal"; klass = "noVNC_status_normal";
break; break;
case 'disconnected': case 'disconnected':
$D('noVNC_defaultScreen').style.display = "block"; $D('noVNC_defaultScreen').style.display = "block";
c.value = "Connection"; c.value = "Connection";
c.onclick = UI.connectPanelbutton; c.onclick = UI.connectPanelbutton;
case 'loaded': case 'loaded':
c.value = "Connection"; c.value = "Connection";
@ -325,11 +319,11 @@ updateState: function(rfb, state, oldstate, msg) {
klass = "noVNC_status_normal"; klass = "noVNC_status_normal";
break; break;
case 'password': case 'password':
UI.connectPanelbutton(); UI.connectPanelbutton();
$D('noVNC_connect_button').value = "Send Password"; $D('noVNC_connect_button').value = "Send Password";
$D('noVNC_connect_button').onclick = UI.setPassword; $D('noVNC_connect_button').onclick = UI.setPassword;
$D('noVNC_password').focus(); $D('noVNC_password').focus();
c.disabled = false; c.disabled = false;
cad.style.display = "none"; cad.style.display = "none";
@ -363,7 +357,7 @@ connect: function() {
var host, port, password; var host, port, password;
UI.closeSettingsMenu(); UI.closeSettingsMenu();
UI.connectPanelbutton(); UI.connectPanelbutton();
host = $D('noVNC_host').value; host = $D('noVNC_host').value;
port = $D('noVNC_port').value; port = $D('noVNC_port').value;
@ -379,18 +373,18 @@ connect: function() {
UI.rfb.set_connectTimeout(UI.getSetting('connectTimeout')); UI.rfb.set_connectTimeout(UI.getSetting('connectTimeout'));
UI.rfb.connect(host, port, password); UI.rfb.connect(host, port, password);
//Close dialog. //Close dialog.
setTimeout("setBarPosition()",100); setTimeout("setBarPosition()",100);
$D('noVNC_defaultScreen').style.display = "none"; $D('noVNC_defaultScreen').style.display = "none";
}, },
disconnect: function() { disconnect: function() {
UI.closeSettingsMenu(); UI.closeSettingsMenu();
UI.rfb.disconnect(); UI.rfb.disconnect();
$D('noVNC_defaultScreen').style.display = "block"; $D('noVNC_defaultScreen').style.display = "block";
UI.connSettingsOpen = false; UI.connSettingsOpen = false;
UI.connectPanelbutton(); UI.connectPanelbutton();
}, },
displayBlur: function() { displayBlur: function() {
@ -416,38 +410,38 @@ clipSend: function() {
}, },
showClipboard: function() { showClipboard: function() {
//Close settings if open //Close settings if open
if(UI.settingsOpen == true) { if (UI.settingsOpen == true) {
UI.closeSettingsMenu(); UI.closeSettingsMenu();
} }
//Close connection settings if open //Close connection settings if open
if(UI.connSettingsOpen == true) { if (UI.connSettingsOpen == true) {
UI.connectPanelbutton(); UI.connectPanelbutton();
} }
//Toggle Connection Panel //Toggle Connection Panel
if(UI.clipboardOpen == true) if (UI.clipboardOpen == true) {
{ $D('noVNC_clipboard').style.display = "none"; $D('noVNC_clipboard').style.display = "none";
UI.clipboardOpen = false; UI.clipboardOpen = false;
} else { } else {
$D('noVNC_clipboard').style.display = "block"; $D('noVNC_clipboard').style.display = "block";
UI.clipboardOpen = true; UI.clipboardOpen = true;
} }
}, },
showKeyboard: function() { showKeyboard: function() {
//Get Current Scroll Position //Get Current Scroll Position
var scrollx = var scrollx =
(document.all)?document.body.scrollLeft:window.pageXOffset; (document.all)?document.body.scrollLeft:window.pageXOffset;
var scrolly = var scrolly =
(document.all)?document.body.scrollTop:window.pageYOffset; (document.all)?document.body.scrollTop:window.pageYOffset;
//Stop browser zooming on textbox. //Stop browser zooming on textbox.
UI.zoomDisable(); UI.zoomDisable();
$D('keyboardinput').focus(); $D('keyboardinput').focus();
scroll(scrollx,scrolly); scroll(scrollx,scrolly);
//Renable user zoom. //Renable user zoom.
UI.zoomEnable(); UI.zoomEnable();
}, },
zoomDisable: function() { zoomDisable: function() {
@ -462,73 +456,71 @@ zoomEnable: function(){
changeViewportMeta: function (newattributes) { changeViewportMeta: function (newattributes) {
// First, get the array of meta-tag elements // First, get the array of meta-tag elements
var metatags = document.getElementsByTagName("meta"); var metatags = document.getElementsByTagName("meta");
// Update only the Viewport meta tag // Update only the Viewport meta tag
for (var cnt = 0; cnt < metatags.length; cnt++) for (var cnt = 0; cnt < metatags.length; cnt++)
{ {
var name = metatags[cnt].getAttribute("name"); var name = metatags[cnt].getAttribute("name");
var content = metatags[cnt].getAttribute("content"); var content = metatags[cnt].getAttribute("content");
// Update the Viewport meta tag // Update the Viewport meta tag
if (metatags[cnt].getAttribute("name") == "viewport") if (metatags[cnt].getAttribute("name") == "viewport") {
metatags[cnt].setAttribute("content", newattributes); metatags[cnt].setAttribute("content", newattributes);
}
} }
}, },
//iOS < Version 5 does not support position fixed. Javascript workaround: //iOS < Version 5 does not support position fixed. Javascript workaround:
setOnscroll: function() { setOnscroll: function() {
window.onscroll = function() { window.onscroll = function() {
UI.setBarPosition(); UI.setBarPosition();
}; };
}, },
setResize: function () { setResize: function () {
window.onResize = function() { window.onResize = function() {
UI.setBarPosition(); UI.setBarPosition();
}; };
}, },
//Helper to add options to dropdown. //Helper to add options to dropdown.
addOption: function(selectbox,text,value ) addOption: function(selectbox,text,value )
{ {
var optn = document.createElement("OPTION"); var optn = document.createElement("OPTION");
optn.text = text; optn.text = text;
optn.value = value; optn.value = value;
selectbox.options.add(optn); selectbox.options.add(optn);
}, },
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';
$D('noVNC_mobile_buttons_right').style.right = 0 + 'px'; $D('noVNC_mobile_buttons_right').style.right = 0 + 'px';
var vncwidth = $('#noVNC_screen').width(); var vncwidth = $('#noVNC_screen').width();
$D('noVNC-control-bar').style.width = vncwidth + 'px'; $D('noVNC-control-bar').style.width = vncwidth + 'px';
}, },
connectPanelbutton: function() { connectPanelbutton: function() {
//Close connection settings if open //Close connection settings if open
if(UI.settingsOpen == true) { if (UI.settingsOpen == true) {
UI.closeSettingsMenu(); UI.closeSettingsMenu();
} }
if(UI.clipboardOpen == true) if (UI.clipboardOpen == true) {
{ UI.showClipboard();
UI.showClipboard(); }
}
//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"; UI.connSettingsOpen = false;
UI.connSettingsOpen = false; } else {
} else { $D('noVNC_controls').style.display = "block";
$D('noVNC_controls').style.display = "block"; UI.connSettingsOpen = true;
UI.connSettingsOpen = true; $D('noVNC_host').focus();
$D('noVNC_host').focus(); }
}
} }
}; };

229
vnc.html
View File

@ -7,135 +7,150 @@
Copyright (C) 2011 Joel Martin Copyright (C) 2011 Joel Martin
Licensed under LGPL-3 (see LICENSE.txt) Licensed under LGPL-3 (see LICENSE.txt)
--> -->
<title>noVNC</title>
<meta charset="utf-8"> <meta charset="utf-8">
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess --> Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<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> <!-- Stylesheets -->
<link rel="stylesheet" href="include/base.css" />
<meta name="viewport" content="user-scalable=1" />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
<!-- Stylesheets -->
<link rel="stylesheet" href="include/base.css" />
<link rel="alternate stylesheet" href="include/black.css" TITLE="Black" /> <link rel="alternate stylesheet" href="include/black.css" TITLE="Black" />
<link rel="alternate stylesheet" href="include/blue.css" TITLE="Blue" /> <link rel="alternate stylesheet" href="include/blue.css" TITLE="Blue" />
<!-- Google web fonts --> <!-- 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'> <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 -->
<script type='text/javascript' <link rel="apple-touch-icon" href="images/mobileicon.png">
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script> <link rel="apple-touch-icon-precomposed" href="images/mobileicon.png" />
-->
<script src="include/vnc.js"></script> <!--
<script src="include/ui.js"></script> <script type='text/javascript'
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
-->
<meta name="apple-mobile-web-app-capable" content="yes" /> <script src="include/vnc.js"></script>
<!-- <script src="include/ui.js"></script>
<meta name="viewport" content="width=device-width,height=device-height" />
-->
<!-- 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" />
</head> </head>
<body> <body>
<div id="noVNC-control-bar"> <div id="noVNC-control-bar">
<!--noVNC Mobile Device only Buttons--> <!--noVNC Mobile Device only Buttons-->
<div id="noVNC_mobile_buttons"> <div id="noVNC_mobile_buttons">
<nobr> <nobr>
<span class="noVNC_mouse_buttons"> <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"
<input type="button" class="noVNC_status_button" id="noVNC_mouse_button2" value="M" onclick="UI.setMouseButton(2);"> id="noVNC_mouse_button1" value="L"
<input type="button" class="noVNC_status_button" id="noVNC_mouse_button4" value="R" onclick="UI.setMouseButton(4);"> onclick="UI.setMouseButton(1);">
<input type="button" id="showKeyboard" onclick="UI.showKeyboard()" value="Keyboard" class="noVNC_status_button"/> <input type="button" class="noVNC_status_button"
</span> id="noVNC_mouse_button2" value="M"
</nobr> onclick="UI.setMouseButton(2);">
</div> <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>
<!--noVNC Buttons--> <!--noVNC Buttons-->
<div class="noVNC_mobile_buttons_right"> <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" class="noVNC_status_button"
<input type="button" id="clipboardbutton" onclick="UI.showClipboard();" value="Clipboard" /> style="float:left;" value="CtrlAltDel" id="sendCtrlAltDelButton"
<input type="button" class="VNC_status_button" value="Settings" id="menuButton" onclick="UI.clickSettingsMenu();"> onclick="UI.sendCtrlAltDel();">
<input type="button" id="connectPanelbutton" class="VNC_status_button" style="width:100px;" onclick="UI.connectPanelbutton()" value="Connection" /> <input type="button" id="clipboardbutton" value="Clipboard"
</div> 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 --> <!-- Clipboard Panel -->
<div id="noVNC_clipboard" class="triangle-right top"> <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 id="noVNC_clipboard_text" cols=88 rows=5
</textarea> onfocus="UI.displayBlur();" onblur="UI.displayFocus();"
<br /> onchange="UI.clipSend();">
<input id="noVNC_clipboard_clear_button" type="button" value="Clear" onclick="UI.clipClear();"> </textarea>
</div> <br />
<input id="noVNC_clipboard_clear_button" type="button"
value="Clear" onclick="UI.clipClear();">
</div>
<!-- Settings Panel --> <!-- Settings Panel -->
<div id="noVNC_Settings" class="triangle-right top"> <div id="noVNC_Settings" class="triangle-right top">
<span id="noVNC_settings_menu" onmouseover="UI.displayBlur();" onmouseout="UI.displayFocus();"> <span id="noVNC_settings_menu" onmouseover="UI.displayBlur();"
<ul> onmouseout="UI.displayFocus();">
<li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li> <ul>
<li><input id="noVNC_true_color" type="checkbox" checked> True Color</li> <li><input id="noVNC_encrypt" type="checkbox"> Encrypt</li>
<li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li> <li><input id="noVNC_true_color" type="checkbox" checked> True Color</li>
<li><input id="noVNC_shared" type="checkbox"> Shared Mode</li> <li><input id="noVNC_cursor" type="checkbox"> Local Cursor</li>
<li><input id="noVNC_connectTimeout" type="input"> Connect Timeout (s)</li> <li><input id="noVNC_shared" type="checkbox"> Shared Mode</li>
<hr> <li><input id="noVNC_connectTimeout" type="input"> Connect Timeout (s)</li>
<!-- Stylesheet selection dropdown --> <hr>
<li><label><strong>Style: </strong> <!-- Stylesheet selection dropdown -->
<select id="noVNC_stylesheet" name="vncStyle"> <li><label><strong>Style: </strong>
<option value="default">default</option> <select id="noVNC_stylesheet" name="vncStyle">
</select></label> <option value="default">default</option>
</li> </select></label>
</li>
<!-- Logging selection dropdown --> <!-- Logging selection dropdown -->
<li><label><strong>Logging: </strong> <li><label><strong>Logging: </strong>
<select id="noVNC_logging" name="vncLogging"> <select id="noVNC_logging" name="vncLogging">
</select></label> </select></label>
</li> </li>
<hr> <hr>
<li><input type="button" id="noVNC_apply" value="Apply" onclick="UI.settingsApply()"></li> <li><input type="button" id="noVNC_apply" value="Apply"
</ul> onclick="UI.settingsApply()"></li>
</span> </ul>
</div> </span>
</div>
<!-- Connection Panel --> <!-- Connection Panel -->
<div id="noVNC_controls" class="triangle-right top"> <div id="noVNC_controls" class="triangle-right top">
<ul> <ul>
<li><label><strong>Host: </strong><input id="noVNC_host" /></label></li> <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>Port: </strong><input id="noVNC_port" /></label></li>
<li><label><strong>Password: </strong><input id="noVNC_password" type="password" /></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> <li><input id="noVNC_connect_button" type="button" value="Connect" onclick="UI.connect();"></li>
</ul> </ul>
</div> </div>
</div> </div> <!-- End of noVNC-control-bar -->
<div id="noVNC_screen"> <div id="noVNC_screen">
<div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;"> <div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
<div id="noVNC_status">Loading</div> <div id="noVNC_status">Loading</div>
</div> </div>
<!-- HTML5 Canvas --> <!-- HTML5 Canvas -->
<h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1> <h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1>
<canvas id="noVNC_canvas" width="640px" height="20px"> <canvas id="noVNC_canvas" width="640px" height="20px">
Canvas not supported. Canvas not supported.
</canvas> </canvas>
<input id="keyboardinput" type="text" onKeyDown="onKeyDown(event);"/> <input id="keyboardinput" type="text" onKeyDown="onKeyDown(event);"/>
</div> </div>
<script> <script>
window.onload = UI.load; window.onload = UI.load;
</script> </script>
</body> </body>
</html> </html>