jcarr
/
noVNC
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed bugs with connection panel, and moved functions into UI class.

This commit is contained in:
Chris Gordon 2011-09-08 11:25:52 +10:00 committed by Joel Martin
parent c1e8b30877
commit 8e0f008841
2 changed files with 122 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

202
include/ui.js
View File

@ -13,7 +13,7 @@
var UI = {
settingsOpen : false,
ConnSettingsOpen : true,
connSettingsOpen : true,
clipboardOpen: false,
// Render default UI and initialize settings menu
@ -24,13 +24,13 @@ load: function() {
sheet = WebUtil.selectStylesheet();
sheets = WebUtil.getStylesheets();
for (i = 0; i < sheets.length; i += 1) {
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) {
addOption($D('noVNC_logging'),llevels[i], llevels[i]);
UI.addOption($D('noVNC_logging'),llevels[i], llevels[i]);
}
// Settings with immediate effects
@ -38,7 +38,8 @@ load: function() {
WebUtil.init_logging(UI.getSetting('logging'));
UI.initSetting('stylesheet', 'default');
WebUtil.selectStylesheet(null); // call twice to get around webkit bug
WebUtil.selectStylesheet(null);
// call twice to get around webkit bug
WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
/* Populate the controls if defaults are provided in the URL */
@ -70,12 +71,16 @@ load: function() {
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))) {
setOnscroll();
setResize();
//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
@ -120,7 +125,8 @@ updateSetting: function(name, value) {
}
}
} else {
/*Weird IE9 error leads to 'null' appearring in textboxes instead of ''.*/
/*Weird IE9 error leads to 'null' appearring
in textboxes instead of ''.*/
if(value === null)
{
value = "";
@ -154,7 +160,7 @@ initSetting: function(name, defVal) {
val = WebUtil.readCookie(name, defVal);
}
UI.updateSetting(name, val);
//Util.Debug("Setting '" + name + "' initialized to '" + val + "'");
//Util.Debug("Setting '" + name + "' initialized to '" + val + "'");
return val;
},
@ -192,8 +198,8 @@ openSettingsMenu: function() {
UI.showClipboard();
}
//Close connection settings if open
if(UI.ConnSettingsOpen == true) {
connectPanelbutton();
if(UI.connSettingsOpen == true) {
UI.connectPanelbutton();
}
$D('noVNC_Settings').style.display = "block";
UI.settingsOpen = true;
@ -244,6 +250,11 @@ settingsApply: function() {
setPassword: function() {
UI.rfb.sendPassword($D('noVNC_password').value);
//Reset connect button.
$D('noVNC_connect_button').value = "Connect";
$D('noVNC_connect_button').onclick = UI.Connect;
//Hide connection panel.
UI.connectPanelbutton();
return false;
},
@ -283,47 +294,51 @@ updateState: function(rfb, state, oldstate, msg) {
var s, sb, c, cad, klass;
s = $D('noVNC_status');
sb = $D('noVNC_status_bar');
c = $D('noVNC_connect_button');
c = $D('connectPanelbutton');
cad = $D('sendCtrlAltDelButton');
switch (state) {
case 'failed':
case 'fatal':
c.disabled = true;
cad.disabled = true;
cad.style.display = "none";
UI.settingsDisabled(true, rfb);
klass = "noVNC_status_error";
break;
case 'normal':
case 'normal':
c.value = "Disconnect";
c.onclick = UI.disconnect;
c.disabled = false;
cad.disabled = false;
cad.style.display = "block";
UI.settingsDisabled(true, rfb);
klass = "noVNC_status_normal";
break;
case 'disconnected':
$D('noVNC_defaultScreen').style.display = "block";
$D('noVNC_defaultScreen').style.display = "block";
c.value = "Connection";
c.onclick = UI.connectPanelbutton;
case 'loaded':
c.value = "Connect";
c.onclick = UI.connect;
c.value = "Connection";
c.onclick = UI.connectPanelbutton;
c.disabled = false;
cad.disabled = true;
cad.style.display = "none";
UI.settingsDisabled(false, rfb);
klass = "noVNC_status_normal";
break;
case 'password':
c.value = "Send Password";
c.onclick = UI.setPassword;
UI.connectPanelbutton();
$D('noVNC_connect_button').value = "Send Password";
$D('noVNC_connect_button').onclick = UI.setPassword;
$D('noVNC_password').focus();
c.disabled = false;
cad.disabled = true;
cad.style.display = "none";
UI.settingsDisabled(true, rfb);
klass = "noVNC_status_warn";
break;
default:
c.disabled = true;
cad.disabled = true;
cad.style.display = "none";
UI.settingsDisabled(true, rfb);
klass = "noVNC_status_warn";
break;
@ -348,7 +363,8 @@ connect: function() {
var host, port, password;
UI.closeSettingsMenu();
connectPanelbutton();
UI.connectPanelbutton();
host = $D('noVNC_host').value;
port = $D('noVNC_port').value;
password = $D('noVNC_password').value;
@ -371,8 +387,10 @@ connect: function() {
disconnect: function() {
UI.closeSettingsMenu();
UI.rfb.disconnect();
$D('noVNC_defaultScreen').style.display = "block";
UI.openSettingsMenu();
UI.connSettingsOpen = false;
UI.connectPanelbutton();
},
displayBlur: function() {
@ -403,8 +421,8 @@ showClipboard: function() {
UI.closeSettingsMenu();
}
//Close connection settings if open
if(UI.ConnSettingsOpen == true) {
connectPanelbutton();
if(UI.connSettingsOpen == true) {
UI.connectPanelbutton();
}
//Toggle Connection Panel
if(UI.clipboardOpen == true)
@ -414,58 +432,38 @@ showClipboard: function() {
$D('noVNC_clipboard').style.display = "block";
UI.clipboardOpen = true;
}
}
},
};
function connectPanelbutton() {
//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;
}
}
showKeyboard: function() {
//Get Current Scroll Position
var scrollx =
(document.all)?document.body.scrollLeft:window.pageXOffset;
var scrolly =
(document.all)?document.body.scrollTop:window.pageYOffset;
function showkeyboard(){
//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.
zoomDisable();
$D('keyboardinput').focus();
scroll(scrollx,scrolly);
//Renable user zoom.
zoomEnable();
}
function zoomDisable(){
zoomDisable: function() {
//Change viewport meta data to disable zooming.
changeViewportMeta("user-scalable=0");
}
UI.changeViewportMeta("user-scalable=0");
},
function zoomEnable(){
zoomEnable: function(){
//Change viewport meta data to enable user zooming.
changeViewportMeta("user-scalable=1");
}
UI.changeViewportMeta("user-scalable=1");
},
function changeViewportMeta(newattributes) {
changeViewportMeta: function (newattributes) {
// First, get the array of meta-tag elements
var metatags = document.getElementsByTagName("meta");
var metatags = document.getElementsByTagName("meta");
// Update only the Viewport meta tag
for (var cnt = 0; cnt < metatags.length; cnt++)
@ -478,35 +476,63 @@ function changeViewportMeta(newattributes) {
if (metatags[cnt].getAttribute("name") == "viewport")
metatags[cnt].setAttribute("content", newattributes);
}
}
},
//iOS < Version 5 does not support position fixed. Javascript workaround:
function setOnscroll() {
setOnscroll: function() {
window.onscroll = function() {
setBarPosition();
UI.setBarPosition();
};
}
},
function setResize() {
setResize: function () {
window.onResize = function() {
setBarPosition();
UI.setBarPosition();
};
}
},
function 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);
},
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';
},
connectPanelbutton: function() {
//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();
}
}
//Helper to add options to dropdown.
function addOption(selectbox,text,value )
{
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
selectbox.options.add(optn);
}
};

15
vnc.html
View File

@ -23,7 +23,8 @@
<!-- 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'>
@ -58,18 +59,18 @@
<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" class="noVNC_status_button" value="CtrlAltDel" id="sendCtrlAltDelButton" onclick="UI.sendCtrlAltDel();">
<input type="button" id="showKeyboard" onclick="showkeyboard()" value="Keyboard" class="noVNC_status_button"/>
<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" onclick="connectPanelbutton()" value="Connection" />
</div>
<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">
@ -113,7 +114,7 @@
<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="Loading" disabled></li>
<li><input id="noVNC_connect_button" type="button" value="Connect" onclick="UI.connect();"></li>
</ul>
</div>
@ -130,7 +131,7 @@
Canvas not supported.
</canvas>
<input id="keyboardinput" style="width:0px;height:0px;background-color:#313131;" type="text" onKeyDown="onKeyDown(event);"/>
<input id="keyboardinput" type="text" onKeyDown="onKeyDown(event);"/>
</div>
<script>