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

Switch names between the container and the screen 

The noVNC_container now contains the logo and the screen. While the
noVNC_screen in turn contains the canvas.
This commit is contained in:
samhed 2016-04-26 17:27:17 +02:00
parent f52105bc88
commit 553864e858
3 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
include/base.css
View File

@ -113,9 +113,7 @@ html {
float:right; float:right;
} }
/* Do not set width/height for VNC_screen or VNC_canvas or incorrect #noVNC_container {
* scaling will occur. Canvas resizes to remote VNC settings */
#noVNC_screen {
display: table; display: table;
width:100%; width:100%;
height:100%; height:100%;
@ -124,7 +122,7 @@ html {
/*border-top-left-radius: 800px 600px;*/ /*border-top-left-radius: 800px 600px;*/
} }
#noVNC_container { #noVNC_screen {
display: none; display: none;
position: absolute; position: absolute;
margin: 0px; margin: 0px;
@ -137,6 +135,9 @@ html {
height: auto; height: auto;
} }
/* Do not set width/height for VNC_canvas or incorrect
* scaling will occur. Canvas size depends on remote VNC
* settings and noVNC settings. */
#noVNC_canvas { #noVNC_canvas {
position: absolute; position: absolute;
left: 0; left: 0;

28
include/ui.js
View File

@ -248,7 +248,7 @@ var UI;
onresize: function (callback) { onresize: function (callback) {
if (!UI.rfb) return; if (!UI.rfb) return;
var size = UI.getCanvasLimit(); var size = UI.screenSize();
if (size && UI.rfb_state === 'normal' && UI.rfb.get_display()) { if (size && UI.rfb_state === 'normal' && UI.rfb.get_display()) {
var display = UI.rfb.get_display(); var display = UI.rfb.get_display();
@ -278,17 +278,19 @@ var UI;
} }
}, },
getCanvasLimit: function () { // The screen is always the same size as the available
var container = $D('noVNC_container'); // viewport minus the height of the control bar
screenSize: function () {
var screen = $D('noVNC_screen');
// Hide the scrollbars until the size is calculated // Hide the scrollbars until the size is calculated
container.style.overflow = "hidden"; screen.style.overflow = "hidden";
var pos = Util.getPosition(container); var pos = Util.getPosition(screen);
var w = pos.width; var w = pos.width;
var h = pos.height; var h = pos.height;
container.style.overflow = "visible"; screen.style.overflow = "visible";
if (isNaN(w) || isNaN(h)) { if (isNaN(w) || isNaN(h)) {
return false; return false;
@ -687,7 +689,7 @@ var UI;
break; break;
case 'disconnected': case 'disconnected':
$D('noVNC_logo').style.display = "block"; $D('noVNC_logo').style.display = "block";
$D('noVNC_container').style.display = "none"; $D('noVNC_screen').style.display = "none";
/* falls through */ /* falls through */
case 'loaded': case 'loaded':
klass = "noVNC_status_normal"; klass = "noVNC_status_normal";
@ -844,7 +846,7 @@ var UI;
//Close dialog. //Close dialog.
setTimeout(UI.setBarPosition, 100); setTimeout(UI.setBarPosition, 100);
$D('noVNC_logo').style.display = "none"; $D('noVNC_logo').style.display = "none";
$D('noVNC_container').style.display = "inline"; $D('noVNC_screen').style.display = "inline";
}, },
disconnect: function() { disconnect: function() {
@ -855,7 +857,7 @@ var UI;
UI.rfb.set_onFBUComplete(UI.FBUComplete); UI.rfb.set_onFBUComplete(UI.FBUComplete);
$D('noVNC_logo').style.display = "block"; $D('noVNC_logo').style.display = "block";
$D('noVNC_container').style.display = "none"; $D('noVNC_screen').style.display = "none";
// Don't display the connection settings until we're actually disconnected // Don't display the connection settings until we're actually disconnected
}, },
@ -919,19 +921,19 @@ var UI;
// If clipping, update clipping settings // If clipping, update clipping settings
display.set_viewport(true); display.set_viewport(true);
var size = UI.getCanvasLimit(); var size = UI.screenSize();
if (size) { if (size) {
display.set_maxWidth(size.w); display.set_maxWidth(size.w);
display.set_maxHeight(size.h); display.set_maxHeight(size.h);
// Hide potential scrollbars that can skew the position // Hide potential scrollbars that can skew the position
$D('noVNC_container').style.overflow = "hidden"; $D('noVNC_screen').style.overflow = "hidden";
// The x position marks the left margin of the canvas, // The x position marks the left margin of the canvas,
// remove the margin from both sides to keep it centered // remove the margin from both sides to keep it centered
var new_w = size.w - (2 * Util.getPosition($D('noVNC_canvas')).x); var new_w = size.w - (2 * Util.getPosition($D('noVNC_canvas')).x);
$D('noVNC_container').style.overflow = "visible"; $D('noVNC_screen').style.overflow = "visible";
display.viewportChangeSize(new_w, size.h); display.viewportChangeSize(new_w, size.h);
} }
@ -1218,7 +1220,7 @@ var UI;
$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_screen').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';
} }

4
vnc.html
View File

@ -207,11 +207,11 @@
</div> <!-- End of noVNC-control-bar --> </div> <!-- End of noVNC-control-bar -->
<div id="noVNC_screen"> <div id="noVNC_container">
<h1 id="noVNC_logo"><span>no</span><br />VNC</h1> <h1 id="noVNC_logo"><span>no</span><br />VNC</h1>
<!-- HTML5 Canvas --> <!-- HTML5 Canvas -->
<div id="noVNC_container"> <div id="noVNC_screen">
<canvas id="noVNC_canvas" width="0" height="0"> <canvas id="noVNC_canvas" width="0" height="0">
Canvas not supported. Canvas not supported.
</canvas> </canvas>