Fix ordering of tightPNG fills.
This addresses issue #65: https://github.com/kanaka/noVNC/issues/65 When tightPNG encoded rects were received, any fill types were immediately drawn to the canvas while images (PNG, JPEGs) were queued for loading. This can cause screen corruption when things are changing rapidly due to the misordering of fills vs images. Also, remove the onload setting in each image on the queue and instead decrease the tight image queue scanning interval (to 40ms or 25 scans per second).
This commit is contained in:
parent
c6fd71536f
commit
a4ff1f573d
|
@ -96,7 +96,7 @@ var that = {}, // Public API methods
|
|||
fb_height = 0,
|
||||
fb_name = "",
|
||||
|
||||
scan_imgQ_rate = 100,
|
||||
scan_imgQ_rate = 40, // 25 times per second or so
|
||||
last_req_time = 0,
|
||||
rre_chunk_sz = 100,
|
||||
|
||||
|
@ -1244,7 +1244,14 @@ encHandlers.TIGHT_PNG = function display_tight_png() {
|
|||
case "fill":
|
||||
ws.rQshift8(); // shift off ctl
|
||||
color = ws.rQshiftBytes(fb_depth);
|
||||
display.fillRect(FBU.x, FBU.y, FBU.width, FBU.height, color);
|
||||
FBU.imgQ.push({
|
||||
'type': 'fill',
|
||||
'img': {'complete': true},
|
||||
'x': FBU.x,
|
||||
'y': FBU.y,
|
||||
'width': FBU.width,
|
||||
'height': FBU.height,
|
||||
'color': color});
|
||||
break;
|
||||
case "jpeg":
|
||||
case "png":
|
||||
|
@ -1256,8 +1263,12 @@ encHandlers.TIGHT_PNG = function display_tight_png() {
|
|||
//Util.Debug(" png, ws.rQlen(): " + ws.rQlen() + ", clength[0]: " + clength[0] + ", clength[1]: " + clength[1]);
|
||||
ws.rQshiftBytes(1 + clength[0]); // shift off ctl + compact length
|
||||
img = new Image();
|
||||
img.onload = scan_tight_imgQ;
|
||||
FBU.imgQ.push([img, FBU.x, FBU.y]);
|
||||
//img.onload = scan_tight_imgQ;
|
||||
FBU.imgQ.push({
|
||||
'type': 'img',
|
||||
'img': img,
|
||||
'x': FBU.x,
|
||||
'y': FBU.y});
|
||||
img.src = "data:image/" + cmode +
|
||||
extract_data_uri(ws.rQshiftBytes(clength[1]));
|
||||
img = null;
|
||||
|
@ -1280,13 +1291,17 @@ extract_data_uri = function(arr) {
|
|||
};
|
||||
|
||||
scan_tight_imgQ = function() {
|
||||
var img, imgQ, ctx;
|
||||
var data, imgQ, ctx;
|
||||
ctx = display.get_context();
|
||||
if (rfb_state === 'normal') {
|
||||
imgQ = FBU.imgQ;
|
||||
while ((imgQ.length > 0) && (imgQ[0][0].complete)) {
|
||||
img = imgQ.shift();
|
||||
ctx.drawImage(img[0], img[1], img[2]);
|
||||
while ((imgQ.length > 0) && (imgQ[0].img.complete)) {
|
||||
data = imgQ.shift();
|
||||
if (data['type'] === 'fill') {
|
||||
display.fillRect(data.x, data.y, data.width, data.height, data.color);
|
||||
} else {
|
||||
ctx.drawImage(data.img, data.x, data.y);
|
||||
}
|
||||
}
|
||||
setTimeout(scan_tight_imgQ, scan_imgQ_rate);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue