window.onresize screen rescaling with auto-refresh feature. The rescale function is still a little buggy - need to figure out how to move the canvas after a resize.
This commit is contained in:
daniel kho
parent
14f745f57b
commit
9623234eb1
|
|
@ -223,10 +223,10 @@ rescale = function(factor) {
|
|||
factor = 0.1;
|
||||
}
|
||||
|
||||
if (conf.scale === factor) {
|
||||
/* if (conf.scale === factor) {
|
||||
//Util.Debug("Display already scaled to '" + factor + "'");
|
||||
return;
|
||||
}
|
||||
} */
|
||||
|
||||
conf.scale = factor;
|
||||
x = c.width - c.width * factor;
|
||||
|
|
@ -264,8 +264,7 @@ setFillColor = function(color) {
|
|||
//
|
||||
// Public API interface functions
|
||||
//
|
||||
|
||||
/* that.resize1 = function(width, height) {
|
||||
that.resize = function(width, height) {
|
||||
var c = conf.target;
|
||||
|
||||
c_prevStyle = "";
|
||||
|
|
@ -277,7 +276,41 @@ setFillColor = function(color) {
|
|||
c_height = c.offsetHeight;
|
||||
|
||||
rescale(conf.scale);
|
||||
}; */
|
||||
};
|
||||
|
||||
that.resizeAuto = function() {
|
||||
var c=$D('vnc');
|
||||
var v = viewport,
|
||||
cw = c.offsetWidth,
|
||||
ch = c.offsetHeight;
|
||||
|
||||
UI.message("container: " + cw + "," + ch);
|
||||
|
||||
if (cw > fb_width) {
|
||||
cw = fb_width;
|
||||
}
|
||||
if (ch > fb_height) {
|
||||
ch = fb_height;
|
||||
}
|
||||
if ((cw !== v.w) || (ch !== v.h)) {
|
||||
v.w = cw;
|
||||
v.h = ch;
|
||||
UI.message("new viewport: " + v.w + "," + v.h);
|
||||
|
||||
c = conf.target;
|
||||
c.width = v.w;
|
||||
c.height = v.h;
|
||||
|
||||
conf.scale=v.w/fb_width;
|
||||
UI.message("fb_width: "+fb_width+", c.width: "+c.offsetWidth+", viewport width: "+v.w+", scale: "+conf.scale);
|
||||
UI.rfb.get_display().set_scale(conf.scale);
|
||||
UI.rfb.get_mouse().set_scale(conf.scale);
|
||||
rescale(conf.scale);
|
||||
//rescale(1.0);
|
||||
that.refresh();
|
||||
}
|
||||
UI.message("framebuffer: "+fb_width+","+fb_height+"; viewport: "+v.w+","+v.h);
|
||||
};
|
||||
|
||||
/* Test graphics (repeating pattern). */
|
||||
that.drawArea = function(x, y, w, h) {
|
||||
|
|
@ -299,111 +332,11 @@ that.drawArea = function(x, y, w, h) {
|
|||
//UI.message("i: " + i + ", j: " + j + ", pixel: " + pixel);
|
||||
ctx.putImageData(imgData, x, y);
|
||||
};
|
||||
|
||||
that.resize = function() {
|
||||
//UI.message("width: "+width+"; height: "+height);
|
||||
//alert("width: "+width+"; height: "+height);
|
||||
|
||||
/* Save current image data. */
|
||||
var d = c_ctx.getImageData(0, 0, conf.target.width,conf.target.height);
|
||||
|
||||
//if (!width && !height) {
|
||||
//var v = viewport,
|
||||
// cw = $D('vnc').offsetWidth,
|
||||
// ch = $D('vnc').offsetHeight;
|
||||
var c=$D('vnc');
|
||||
//conf.target=c;
|
||||
var v = viewport,
|
||||
cw = c.offsetWidth,
|
||||
ch = c.offsetHeight;
|
||||
|
||||
UI.message("container: " + cw + "," + ch);
|
||||
|
||||
if (cw > fb_width) {
|
||||
cw = fb_width;
|
||||
}
|
||||
if (ch > fb_height) {
|
||||
ch = fb_height;
|
||||
}
|
||||
if ((cw !== v.w) || (ch !== v.h)) {
|
||||
v.w = cw;
|
||||
v.h = ch;
|
||||
UI.message("new viewport: " + v.w + "," + v.h);
|
||||
//$D('VNC_canvas').resize(v.w, v.h);
|
||||
//UI.canvas.resize(v.w, v.h);
|
||||
//UI.rfb.get_display().resize(v.w, v.h);
|
||||
//that.resize1(v.w, v.h);
|
||||
//UI.rfb.get_display().get_context().updateState
|
||||
//UI.updateState("loaded");
|
||||
//UI.drawArea(0, 0, v.w, v.h);
|
||||
|
||||
c = conf.target;
|
||||
|
||||
//c_prevStyle = "";
|
||||
|
||||
c.width = v.w;
|
||||
c.height = v.h;
|
||||
|
||||
//c_width = c.offsetWidth;
|
||||
//c_height = c.offsetHeight;
|
||||
|
||||
rescale(conf.scale);
|
||||
//that.refresh();
|
||||
//that.clear();
|
||||
//c_ctx.putImageData(d, 0, 0);
|
||||
//c_rgbxImage(0, 0, v.w, v.h, c.data, 0);
|
||||
//rgbxImageData(0, 0, v.w, v.h, c.data, 0);
|
||||
}
|
||||
UI.message("framebuffer: "+fb_width+","+fb_height+"; viewport: "+v.w+","+v.h);
|
||||
//} else {
|
||||
/* var c = conf.target;
|
||||
|
||||
c_prevStyle = "";
|
||||
|
||||
c.width = width;
|
||||
c.height = height;
|
||||
|
||||
c_width = c.offsetWidth;
|
||||
c_height = c.offsetHeight;
|
||||
|
||||
rescale(conf.scale); */
|
||||
//}
|
||||
};
|
||||
|
||||
/* Screen refresh. */
|
||||
that.refresh = function() {
|
||||
//that=new Display({'target': conf.target});
|
||||
//c_rgbxImage = rgbxImageData;
|
||||
//c_rgbxImage(0, 0, conf.target.width, conf.target.height); //,conf.target.data,0);
|
||||
//if (UI.rfb) {
|
||||
//UI.rfb.disconnect();
|
||||
//UI.message("host: "+UI.rfb.rfb_host+", port: "+UI.rfb.rfb_port+", password: "+UI.rfb.rfb_password+", uri: "+UI.rfb.rfb_uri);
|
||||
//UI.rfb.connect(UI.rfb.rfb_host, UI.rfb.rfb_port, UI.rfb.rfb_password, UI.rfb.rfb_uri);
|
||||
//}
|
||||
UI.message("host: "+UI.host+", port: "+UI.port+", password: "+UI.password);
|
||||
//UI.message(UI.connect);
|
||||
//UI.connect();
|
||||
//if (UI.rfb) {UI.message('rfb.connect: '+UI.rfb.connect);}
|
||||
//UI.message(typeof(UI.rfb.connect));
|
||||
//UI.connect();
|
||||
|
||||
//if (UI.rfb && UI.rfb.connect) {
|
||||
//UI.disconnect();
|
||||
|
||||
if (UI.rfb) {
|
||||
//alert('about to refresh...');
|
||||
UI.rfb.refresh();
|
||||
//UI.rfb.connect(UI.host,UI.port,UI.password);
|
||||
//UI.rfb.sendPassword(UI.password);
|
||||
}
|
||||
|
||||
//var d = c_ctx.getImageData(0, 0, conf.target.width,conf.target.height);
|
||||
//c_ctx.putImageData(d, 0, 0);
|
||||
//if(conf.logo) {
|
||||
//that.blitStringImage(conf.logo.data, 0, 0);
|
||||
//}
|
||||
if (UI.rfb) {UI.rfb.refresh();}
|
||||
|
||||
UI.message('screen refreshed.');
|
||||
Util.Debug('screen refreshed.');
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -440,7 +440,8 @@ updateState = function(state, statusMsg) {
|
|||
|
||||
|
||||
case 'disconnect':
|
||||
|
||||
rfb_password='';
|
||||
|
||||
if (! test_mode) {
|
||||
disconnTimer = setTimeout(function () {
|
||||
fail("Disconnect timeout");
|
||||
|
|
@ -448,7 +449,8 @@ updateState = function(state, statusMsg) {
|
|||
}
|
||||
|
||||
print_stats();
|
||||
|
||||
display.clear();
|
||||
|
||||
// WebSocket.onclose transitions to 'disconnected'
|
||||
break;
|
||||
|
||||
|
|
@ -1505,15 +1507,13 @@ that.sendPassword = function(passwd) {
|
|||
};
|
||||
|
||||
that.refresh = function() {
|
||||
//that.disconnect();
|
||||
/* updateState('connect','refreshing...');
|
||||
if (rfb_state!=='normal') {
|
||||
//setTimeout(function () {that.refresh();}, conf.connectTimeout * 1000);
|
||||
setTimeout(function () {that.refresh();}, 1000);
|
||||
} */
|
||||
|
||||
setTimeout(function () {updateState('connect','refreshing...');}, 10);
|
||||
if (rfb_state!=='normal') {that.refresh();}
|
||||
// Refresh only when already connected, i.e. don't refresh during disconnected or loaded states.
|
||||
if (rfb_state!='loaded' && rfb_password.length>0) {
|
||||
updateState('connect','refreshing...');
|
||||
setTimeout(function () {
|
||||
if (rfb_state!=='normal') {that.refresh();}
|
||||
}, 1000);
|
||||
}
|
||||
UI.message('state: '+rfb_state);
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -28,10 +28,6 @@ var UI = {
|
|||
|
||||
settingsOpen : false,
|
||||
|
||||
host: '',
|
||||
port: '',
|
||||
password: '',
|
||||
|
||||
// Render default UI and initialize settings menu
|
||||
load: function(target) {
|
||||
if (Util.Engine.trident) {
|
||||
|
|
@ -181,8 +177,11 @@ load: function(target) {
|
|||
UI.initSetting('host', '');
|
||||
UI.initSetting('port', '');
|
||||
UI.initSetting('password', '');
|
||||
//TODO: Dynamically detect URI to determine encryption mode.
|
||||
//UI.initSetting('encrypt', false);
|
||||
UI.initSetting('encrypt', false);
|
||||
UI.initSetting('true_color', true);
|
||||
//UI.initSetting('true_color', true);
|
||||
UI.initSetting('true_color', false);
|
||||
UI.initSetting('cursor', false);
|
||||
UI.initSetting('shared', true);
|
||||
UI.initSetting('connectTimeout', 2);
|
||||
|
|
@ -190,7 +189,9 @@ load: function(target) {
|
|||
UI.rfb = RFB({'target': $D('VNC_canvas'),
|
||||
'onUpdateState': UI.updateState,
|
||||
'onClipboard': UI.clipReceive});
|
||||
|
||||
|
||||
UI.message('uri: '+UI.rfb.rfb_uri);
|
||||
|
||||
// Unfocus clipboard when over the VNC area
|
||||
$D('VNC_screen').onmousemove = function () {
|
||||
var keyboard = UI.rfb.get_keyboard();
|
||||
|
|
@ -206,6 +207,7 @@ load: function(target) {
|
|||
}
|
||||
|
||||
ctx=UI.rfb.get_display().get_context();
|
||||
UI.rfb.get_display().resizeAuto();
|
||||
},
|
||||
|
||||
// Read form control compatible setting from cookie
|
||||
|
|
@ -350,9 +352,10 @@ settingsApply: function() {
|
|||
// Settings with immediate (non-connected related) effect
|
||||
if (UI.rfb) {
|
||||
//Util.Debug("scale: " + scale);
|
||||
//UI.rfb.get_display().set_scale(UI.getSetting('scale'));
|
||||
//UI.rfb.get_mouse().set_scale(UI.getSetting('scale'));
|
||||
UI.rfb.get_display().resize();
|
||||
UI.rfb.get_display().set_scale(UI.getSetting('scale'));
|
||||
UI.rfb.get_mouse().set_scale(UI.getSetting('scale'));
|
||||
//UI.rfb.get_display().resize();
|
||||
UI.rfb.get_display().resizeAuto();
|
||||
}
|
||||
WebUtil.selectStylesheet(UI.getSetting('stylesheet'));
|
||||
WebUtil.init_logging(UI.getSetting('logging'));
|
||||
|
|
@ -505,43 +508,7 @@ connect: function() {
|
|||
return false;
|
||||
},
|
||||
|
||||
/* connect: function() {
|
||||
UI.closeSettingsMenu();
|
||||
//UI.rfb.disconnect();
|
||||
|
||||
// Reconnect using existing credentials when they are available, otherwise set credentials and connect.
|
||||
// Upon disconnect or on page load, the credentials will not be available, and user will be shown a login screen,
|
||||
// where the proper credentials must be supplied.
|
||||
UI.message("!password? "+!UI.password);
|
||||
if (!UI.host || !UI.port || !UI.password) {
|
||||
//if ($D('VNC_host').value.length>0 && $D('VNC_port').value.length>0 && $D('VNC_password').value.length>0) {
|
||||
UI.host = $D('VNC_host').value;
|
||||
UI.port = $D('VNC_port').value;
|
||||
UI.password = $D('VNC_password').value;
|
||||
if ((!UI.host) || (!UI.port)) {
|
||||
throw("Must set host and port");
|
||||
}
|
||||
UI.message("password: "+UI.password);
|
||||
|
||||
UI.rfb.set_encrypt(UI.getSetting('encrypt'));
|
||||
UI.rfb.set_true_color(UI.getSetting('true_color'));
|
||||
UI.rfb.set_local_cursor(UI.getSetting('cursor'));
|
||||
UI.rfb.set_shared(UI.getSetting('shared'));
|
||||
UI.rfb.set_connectTimeout(UI.getSetting('connectTimeout'));
|
||||
|
||||
//UI.rfb.disconnect();
|
||||
UI.rfb.connect(UI.host, UI.port, UI.password);
|
||||
|
||||
//UI.message("resizing...");
|
||||
//UI.rfb.get_display().resize();
|
||||
//}
|
||||
}
|
||||
|
||||
return false;
|
||||
}, */
|
||||
|
||||
disconnect: function() {
|
||||
UI.password=null;
|
||||
UI.closeSettingsMenu();
|
||||
UI.rfb.disconnect();
|
||||
},
|
||||
|
|
|
|||
4
vnc.html
4
vnc.html
|
|
@ -28,8 +28,8 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
window.onresize=function() {UI.rfb.get_display().resize(); UI.rfb.get_display().refresh();};
|
||||
//window.onresize=function() {UI.rfb.get_display().resize();};
|
||||
//window.onresize=function() {UI.rfb.get_display().resize(); UI.rfb.get_display().refresh();};
|
||||
window.onresize=function() {UI.rfb.get_display().resizeAuto();};
|
||||
window.onload=function() {UI.load('vnc');};
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue