mirror of
https://github.com/kasmtech/KasmVNC.git
synced 2025-02-18 19:30:48 +01:00
Standardize on camelCase in Display
This commit is contained in:
parent
b837bd6f59
commit
69b945fc87
@ -18,14 +18,14 @@ export default class Display {
|
|||||||
this._flushing = false;
|
this._flushing = false;
|
||||||
|
|
||||||
// the full frame buffer (logical canvas) size
|
// the full frame buffer (logical canvas) size
|
||||||
this._fb_width = 0;
|
this._fbWidth = 0;
|
||||||
this._fb_height = 0;
|
this._fbHeight = 0;
|
||||||
|
|
||||||
this._prevDrawStyle = "";
|
this._prevDrawStyle = "";
|
||||||
this._tile = null;
|
this._tile = null;
|
||||||
this._tile16x16 = null;
|
this._tile16x16 = null;
|
||||||
this._tile_x = 0;
|
this._tileX = 0;
|
||||||
this._tile_y = 0;
|
this._tileY = 0;
|
||||||
|
|
||||||
Log.Debug(">> Display.constructor");
|
Log.Debug(">> Display.constructor");
|
||||||
|
|
||||||
@ -94,11 +94,11 @@ export default class Display {
|
|||||||
}
|
}
|
||||||
|
|
||||||
get width() {
|
get width() {
|
||||||
return this._fb_width;
|
return this._fbWidth;
|
||||||
}
|
}
|
||||||
|
|
||||||
get height() {
|
get height() {
|
||||||
return this._fb_height;
|
return this._fbHeight;
|
||||||
}
|
}
|
||||||
|
|
||||||
// ===== PUBLIC METHODS =====
|
// ===== PUBLIC METHODS =====
|
||||||
@ -121,15 +121,15 @@ export default class Display {
|
|||||||
if (deltaX < 0 && vp.x + deltaX < 0) {
|
if (deltaX < 0 && vp.x + deltaX < 0) {
|
||||||
deltaX = -vp.x;
|
deltaX = -vp.x;
|
||||||
}
|
}
|
||||||
if (vx2 + deltaX >= this._fb_width) {
|
if (vx2 + deltaX >= this._fbWidth) {
|
||||||
deltaX -= vx2 + deltaX - this._fb_width + 1;
|
deltaX -= vx2 + deltaX - this._fbWidth + 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (vp.y + deltaY < 0) {
|
if (vp.y + deltaY < 0) {
|
||||||
deltaY = -vp.y;
|
deltaY = -vp.y;
|
||||||
}
|
}
|
||||||
if (vy2 + deltaY >= this._fb_height) {
|
if (vy2 + deltaY >= this._fbHeight) {
|
||||||
deltaY -= (vy2 + deltaY - this._fb_height + 1);
|
deltaY -= (vy2 + deltaY - this._fbHeight + 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (deltaX === 0 && deltaY === 0) {
|
if (deltaX === 0 && deltaY === 0) {
|
||||||
@ -152,18 +152,18 @@ export default class Display {
|
|||||||
typeof(height) === "undefined") {
|
typeof(height) === "undefined") {
|
||||||
|
|
||||||
Log.Debug("Setting viewport to full display region");
|
Log.Debug("Setting viewport to full display region");
|
||||||
width = this._fb_width;
|
width = this._fbWidth;
|
||||||
height = this._fb_height;
|
height = this._fbHeight;
|
||||||
}
|
}
|
||||||
|
|
||||||
width = Math.floor(width);
|
width = Math.floor(width);
|
||||||
height = Math.floor(height);
|
height = Math.floor(height);
|
||||||
|
|
||||||
if (width > this._fb_width) {
|
if (width > this._fbWidth) {
|
||||||
width = this._fb_width;
|
width = this._fbWidth;
|
||||||
}
|
}
|
||||||
if (height > this._fb_height) {
|
if (height > this._fbHeight) {
|
||||||
height = this._fb_height;
|
height = this._fbHeight;
|
||||||
}
|
}
|
||||||
|
|
||||||
const vp = this._viewportLoc;
|
const vp = this._viewportLoc;
|
||||||
@ -203,8 +203,8 @@ export default class Display {
|
|||||||
resize(width, height) {
|
resize(width, height) {
|
||||||
this._prevDrawStyle = "";
|
this._prevDrawStyle = "";
|
||||||
|
|
||||||
this._fb_width = width;
|
this._fbWidth = width;
|
||||||
this._fb_height = height;
|
this._fbHeight = height;
|
||||||
|
|
||||||
const canvas = this._backbuffer;
|
const canvas = this._backbuffer;
|
||||||
if (canvas.width !== width || canvas.height !== height) {
|
if (canvas.width !== width || canvas.height !== height) {
|
||||||
@ -252,9 +252,9 @@ export default class Display {
|
|||||||
|
|
||||||
// Update the visible canvas with the contents of the
|
// Update the visible canvas with the contents of the
|
||||||
// rendering canvas
|
// rendering canvas
|
||||||
flip(from_queue) {
|
flip(fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'flip'
|
'type': 'flip'
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
@ -310,9 +310,9 @@ export default class Display {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
fillRect(x, y, width, height, color, from_queue) {
|
fillRect(x, y, width, height, color, fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'fill',
|
'type': 'fill',
|
||||||
'x': x,
|
'x': x,
|
||||||
'y': y,
|
'y': y,
|
||||||
@ -327,14 +327,14 @@ export default class Display {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
copyImage(old_x, old_y, new_x, new_y, w, h, from_queue) {
|
copyImage(oldX, oldY, newX, newY, w, h, fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'copy',
|
'type': 'copy',
|
||||||
'old_x': old_x,
|
'oldX': oldX,
|
||||||
'old_y': old_y,
|
'oldY': oldY,
|
||||||
'x': new_x,
|
'x': newX,
|
||||||
'y': new_y,
|
'y': newY,
|
||||||
'width': w,
|
'width': w,
|
||||||
'height': h,
|
'height': h,
|
||||||
});
|
});
|
||||||
@ -352,9 +352,9 @@ export default class Display {
|
|||||||
this._drawCtx.imageSmoothingEnabled = false;
|
this._drawCtx.imageSmoothingEnabled = false;
|
||||||
|
|
||||||
this._drawCtx.drawImage(this._backbuffer,
|
this._drawCtx.drawImage(this._backbuffer,
|
||||||
old_x, old_y, w, h,
|
oldX, oldY, w, h,
|
||||||
new_x, new_y, w, h);
|
newX, newY, w, h);
|
||||||
this._damage(new_x, new_y, w, h);
|
this._damage(newX, newY, w, h);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -367,7 +367,7 @@ export default class Display {
|
|||||||
const img = new Image();
|
const img = new Image();
|
||||||
img.src = "data: " + mime + ";base64," + Base64.encode(arr);
|
img.src = "data: " + mime + ";base64," + Base64.encode(arr);
|
||||||
|
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'img',
|
'type': 'img',
|
||||||
'img': img,
|
'img': img,
|
||||||
'x': x,
|
'x': x,
|
||||||
@ -379,8 +379,8 @@ export default class Display {
|
|||||||
|
|
||||||
// start updating a tile
|
// start updating a tile
|
||||||
startTile(x, y, width, height, color) {
|
startTile(x, y, width, height, color) {
|
||||||
this._tile_x = x;
|
this._tileX = x;
|
||||||
this._tile_y = y;
|
this._tileY = y;
|
||||||
if (width === 16 && height === 16) {
|
if (width === 16 && height === 16) {
|
||||||
this._tile = this._tile16x16;
|
this._tile = this._tile16x16;
|
||||||
} else {
|
} else {
|
||||||
@ -423,21 +423,21 @@ export default class Display {
|
|||||||
|
|
||||||
// draw the current tile to the screen
|
// draw the current tile to the screen
|
||||||
finishTile() {
|
finishTile() {
|
||||||
this._drawCtx.putImageData(this._tile, this._tile_x, this._tile_y);
|
this._drawCtx.putImageData(this._tile, this._tileX, this._tileY);
|
||||||
this._damage(this._tile_x, this._tile_y,
|
this._damage(this._tileX, this._tileY,
|
||||||
this._tile.width, this._tile.height);
|
this._tile.width, this._tile.height);
|
||||||
}
|
}
|
||||||
|
|
||||||
blitImage(x, y, width, height, arr, offset, from_queue) {
|
blitImage(x, y, width, height, arr, offset, fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
||||||
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
||||||
// this probably isn't getting called *nearly* as much
|
// this probably isn't getting called *nearly* as much
|
||||||
const new_arr = new Uint8Array(width * height * 4);
|
const newArr = new Uint8Array(width * height * 4);
|
||||||
new_arr.set(new Uint8Array(arr.buffer, 0, new_arr.length));
|
newArr.set(new Uint8Array(arr.buffer, 0, newArr.length));
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'blit',
|
'type': 'blit',
|
||||||
'data': new_arr,
|
'data': newArr,
|
||||||
'x': x,
|
'x': x,
|
||||||
'y': y,
|
'y': y,
|
||||||
'width': width,
|
'width': width,
|
||||||
@ -448,16 +448,16 @@ export default class Display {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
blitRgbImage(x, y, width, height, arr, offset, from_queue) {
|
blitRgbImage(x, y, width, height, arr, offset, fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
||||||
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
||||||
// this probably isn't getting called *nearly* as much
|
// this probably isn't getting called *nearly* as much
|
||||||
const new_arr = new Uint8Array(width * height * 3);
|
const newArr = new Uint8Array(width * height * 3);
|
||||||
new_arr.set(new Uint8Array(arr.buffer, 0, new_arr.length));
|
newArr.set(new Uint8Array(arr.buffer, 0, newArr.length));
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'blitRgb',
|
'type': 'blitRgb',
|
||||||
'data': new_arr,
|
'data': newArr,
|
||||||
'x': x,
|
'x': x,
|
||||||
'y': y,
|
'y': y,
|
||||||
'width': width,
|
'width': width,
|
||||||
@ -468,16 +468,16 @@ export default class Display {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
blitRgbxImage(x, y, width, height, arr, offset, from_queue) {
|
blitRgbxImage(x, y, width, height, arr, offset, fromQueue) {
|
||||||
if (this._renderQ.length !== 0 && !from_queue) {
|
if (this._renderQ.length !== 0 && !fromQueue) {
|
||||||
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
// NB(directxman12): it's technically more performant here to use preallocated arrays,
|
||||||
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
// but it's a lot of extra work for not a lot of payoff -- if we're using the render queue,
|
||||||
// this probably isn't getting called *nearly* as much
|
// this probably isn't getting called *nearly* as much
|
||||||
const new_arr = new Uint8Array(width * height * 4);
|
const newArr = new Uint8Array(width * height * 4);
|
||||||
new_arr.set(new Uint8Array(arr.buffer, 0, new_arr.length));
|
newArr.set(new Uint8Array(arr.buffer, 0, newArr.length));
|
||||||
this._renderQ_push({
|
this._renderQPush({
|
||||||
'type': 'blitRgbx',
|
'type': 'blitRgbx',
|
||||||
'data': new_arr,
|
'data': newArr,
|
||||||
'x': x,
|
'x': x,
|
||||||
'y': y,
|
'y': y,
|
||||||
'width': width,
|
'width': width,
|
||||||
@ -586,23 +586,23 @@ export default class Display {
|
|||||||
this._damage(x, y, img.width, img.height);
|
this._damage(x, y, img.width, img.height);
|
||||||
}
|
}
|
||||||
|
|
||||||
_renderQ_push(action) {
|
_renderQPush(action) {
|
||||||
this._renderQ.push(action);
|
this._renderQ.push(action);
|
||||||
if (this._renderQ.length === 1) {
|
if (this._renderQ.length === 1) {
|
||||||
// If this can be rendered immediately it will be, otherwise
|
// If this can be rendered immediately it will be, otherwise
|
||||||
// the scanner will wait for the relevant event
|
// the scanner will wait for the relevant event
|
||||||
this._scan_renderQ();
|
this._scanRenderQ();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_resume_renderQ() {
|
_resumeRenderQ() {
|
||||||
// "this" is the object that is ready, not the
|
// "this" is the object that is ready, not the
|
||||||
// display object
|
// display object
|
||||||
this.removeEventListener('load', this._noVNC_display._resume_renderQ);
|
this.removeEventListener('load', this._noVNCDisplay._resumeRenderQ);
|
||||||
this._noVNC_display._scan_renderQ();
|
this._noVNCDisplay._scanRenderQ();
|
||||||
}
|
}
|
||||||
|
|
||||||
_scan_renderQ() {
|
_scanRenderQ() {
|
||||||
let ready = true;
|
let ready = true;
|
||||||
while (ready && this._renderQ.length > 0) {
|
while (ready && this._renderQ.length > 0) {
|
||||||
const a = this._renderQ[0];
|
const a = this._renderQ[0];
|
||||||
@ -611,7 +611,7 @@ export default class Display {
|
|||||||
this.flip(true);
|
this.flip(true);
|
||||||
break;
|
break;
|
||||||
case 'copy':
|
case 'copy':
|
||||||
this.copyImage(a.old_x, a.old_y, a.x, a.y, a.width, a.height, true);
|
this.copyImage(a.oldX, a.oldY, a.x, a.y, a.width, a.height, true);
|
||||||
break;
|
break;
|
||||||
case 'fill':
|
case 'fill':
|
||||||
this.fillRect(a.x, a.y, a.width, a.height, a.color, true);
|
this.fillRect(a.x, a.y, a.width, a.height, a.color, true);
|
||||||
@ -630,8 +630,8 @@ export default class Display {
|
|||||||
if (a.img.complete && (a.img.width !== 0) && (a.img.height !== 0)) {
|
if (a.img.complete && (a.img.width !== 0) && (a.img.height !== 0)) {
|
||||||
this.drawImage(a.img, a.x, a.y, a.w, a.h);
|
this.drawImage(a.img, a.x, a.y, a.w, a.h);
|
||||||
} else {
|
} else {
|
||||||
a.img._noVNC_display = this;
|
a.img._noVNCDisplay = this;
|
||||||
a.img.addEventListener('load', this._resume_renderQ);
|
a.img.addEventListener('load', this._resumeRenderQ);
|
||||||
// We need to wait for this image to 'load'
|
// We need to wait for this image to 'load'
|
||||||
// to keep things in-order
|
// to keep things in-order
|
||||||
ready = false;
|
ready = false;
|
||||||
|
@ -4,28 +4,28 @@ import Base64 from '../core/base64.js';
|
|||||||
import Display from '../core/display.js';
|
import Display from '../core/display.js';
|
||||||
|
|
||||||
describe('Display/Canvas Helper', function () {
|
describe('Display/Canvas Helper', function () {
|
||||||
const checked_data = new Uint8Array([
|
const checkedData = new Uint8Array([
|
||||||
0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255, 0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255,
|
0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255, 0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255,
|
||||||
0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255, 0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255,
|
0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255, 0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255,
|
||||||
0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255,
|
0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255,
|
||||||
0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255
|
0x00, 0xff, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0x00, 0x00, 0xff, 255
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const basic_data = new Uint8Array([0xff, 0x00, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0xff, 0xff, 0xff, 255]);
|
const basicData = new Uint8Array([0xff, 0x00, 0x00, 255, 0x00, 0xff, 0x00, 255, 0x00, 0x00, 0xff, 255, 0xff, 0xff, 0xff, 255]);
|
||||||
|
|
||||||
function make_image_canvas(input_data) {
|
function makeImageCanvas(inputData) {
|
||||||
const canvas = document.createElement('canvas');
|
const canvas = document.createElement('canvas');
|
||||||
canvas.width = 4;
|
canvas.width = 4;
|
||||||
canvas.height = 4;
|
canvas.height = 4;
|
||||||
const ctx = canvas.getContext('2d');
|
const ctx = canvas.getContext('2d');
|
||||||
const data = ctx.createImageData(4, 4);
|
const data = ctx.createImageData(4, 4);
|
||||||
for (let i = 0; i < checked_data.length; i++) { data.data[i] = input_data[i]; }
|
for (let i = 0; i < checkedData.length; i++) { data.data[i] = inputData[i]; }
|
||||||
ctx.putImageData(data, 0, 0);
|
ctx.putImageData(data, 0, 0);
|
||||||
return canvas;
|
return canvas;
|
||||||
}
|
}
|
||||||
|
|
||||||
function make_image_png(input_data) {
|
function makeImagePng(inputData) {
|
||||||
const canvas = make_image_canvas(input_data);
|
const canvas = makeImageCanvas(inputData);
|
||||||
const url = canvas.toDataURL();
|
const url = canvas.toDataURL();
|
||||||
const data = url.split(",")[1];
|
const data = url.split(",")[1];
|
||||||
return Base64.decode(data);
|
return Base64.decode(data);
|
||||||
@ -44,11 +44,11 @@ describe('Display/Canvas Helper', function () {
|
|||||||
it('should take viewport location into consideration when drawing images', function () {
|
it('should take viewport location into consideration when drawing images', function () {
|
||||||
display.resize(4, 4);
|
display.resize(4, 4);
|
||||||
display.viewportChangeSize(2, 2);
|
display.viewportChangeSize(2, 2);
|
||||||
display.drawImage(make_image_canvas(basic_data), 1, 1);
|
display.drawImage(makeImageCanvas(basicData), 1, 1);
|
||||||
display.flip();
|
display.flip();
|
||||||
|
|
||||||
const expected = new Uint8Array(16);
|
const expected = new Uint8Array(16);
|
||||||
for (let i = 0; i < 8; i++) { expected[i] = basic_data[i]; }
|
for (let i = 0; i < 8; i++) { expected[i] = basicData[i]; }
|
||||||
for (let i = 8; i < 16; i++) { expected[i] = 0; }
|
for (let i = 8; i < 16; i++) { expected[i] = 0; }
|
||||||
expect(display).to.have.displayed(expected);
|
expect(display).to.have.displayed(expected);
|
||||||
});
|
});
|
||||||
@ -123,8 +123,8 @@ describe('Display/Canvas Helper', function () {
|
|||||||
|
|
||||||
it('should change the size of the logical canvas', function () {
|
it('should change the size of the logical canvas', function () {
|
||||||
display.resize(5, 7);
|
display.resize(5, 7);
|
||||||
expect(display._fb_width).to.equal(5);
|
expect(display._fbWidth).to.equal(5);
|
||||||
expect(display._fb_height).to.equal(7);
|
expect(display._fbHeight).to.equal(7);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should keep the framebuffer data', function () {
|
it('should keep the framebuffer data', function () {
|
||||||
@ -275,7 +275,7 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.flip();
|
display.flip();
|
||||||
display.fillRect(0, 0, 4, 4, [0, 0xff, 0]);
|
display.fillRect(0, 0, 4, 4, [0, 0xff, 0]);
|
||||||
const expected = [];
|
const expected = [];
|
||||||
for (let i = 0; i < 4 * display._fb_width * display._fb_height; i += 4) {
|
for (let i = 0; i < 4 * display._fbWidth * display._fbHeight; i += 4) {
|
||||||
expected[i] = 0xff;
|
expected[i] = 0xff;
|
||||||
expected[i+1] = expected[i+2] = 0;
|
expected[i+1] = expected[i+2] = 0;
|
||||||
expected[i+3] = 0xff;
|
expected[i+3] = 0xff;
|
||||||
@ -288,7 +288,7 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.fillRect(0, 0, 2, 2, [0xff, 0, 0]);
|
display.fillRect(0, 0, 2, 2, [0xff, 0, 0]);
|
||||||
display.fillRect(2, 2, 2, 2, [0xff, 0, 0]);
|
display.fillRect(2, 2, 2, 2, [0xff, 0, 0]);
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support copying an portion of the canvas via #copyImage', function () {
|
it('should support copying an portion of the canvas via #copyImage', function () {
|
||||||
@ -296,14 +296,14 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.fillRect(0, 0, 2, 2, [0xff, 0, 0x00]);
|
display.fillRect(0, 0, 2, 2, [0xff, 0, 0x00]);
|
||||||
display.copyImage(0, 0, 2, 2, 2, 2);
|
display.copyImage(0, 0, 2, 2, 2, 2);
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support drawing images via #imageRect', function (done) {
|
it('should support drawing images via #imageRect', function (done) {
|
||||||
display.imageRect(0, 0, 4, 4, "image/png", make_image_png(checked_data));
|
display.imageRect(0, 0, 4, 4, "image/png", makeImagePng(checkedData));
|
||||||
display.flip();
|
display.flip();
|
||||||
display.onflush = () => {
|
display.onflush = () => {
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
done();
|
done();
|
||||||
};
|
};
|
||||||
display.flush();
|
display.flush();
|
||||||
@ -315,12 +315,12 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.subTile(2, 2, 2, 2, [0xff, 0, 0]);
|
display.subTile(2, 2, 2, 2, [0xff, 0, 0]);
|
||||||
display.finishTile();
|
display.finishTile();
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
// We have a special cache for 16x16 tiles that we need to test
|
// We have a special cache for 16x16 tiles that we need to test
|
||||||
it('should support drawing a 16x16 tile', function () {
|
it('should support drawing a 16x16 tile', function () {
|
||||||
const large_checked_data = new Uint8Array(16*16*4);
|
const largeCheckedData = new Uint8Array(16*16*4);
|
||||||
display.resize(16, 16);
|
display.resize(16, 16);
|
||||||
|
|
||||||
for (let y = 0;y < 16;y++) {
|
for (let y = 0;y < 16;y++) {
|
||||||
@ -328,11 +328,11 @@ describe('Display/Canvas Helper', function () {
|
|||||||
let pixel;
|
let pixel;
|
||||||
if ((x < 4) && (y < 4)) {
|
if ((x < 4) && (y < 4)) {
|
||||||
// NB: of course IE11 doesn't support #slice on ArrayBufferViews...
|
// NB: of course IE11 doesn't support #slice on ArrayBufferViews...
|
||||||
pixel = Array.prototype.slice.call(checked_data, (y*4+x)*4, (y*4+x+1)*4);
|
pixel = Array.prototype.slice.call(checkedData, (y*4+x)*4, (y*4+x+1)*4);
|
||||||
} else {
|
} else {
|
||||||
pixel = [0, 0xff, 0, 255];
|
pixel = [0, 0xff, 0, 255];
|
||||||
}
|
}
|
||||||
large_checked_data.set(pixel, (y*16+x)*4);
|
largeCheckedData.set(pixel, (y*16+x)*4);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -341,39 +341,39 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.subTile(2, 2, 2, 2, [0xff, 0, 0]);
|
display.subTile(2, 2, 2, 2, [0xff, 0, 0]);
|
||||||
display.finishTile();
|
display.finishTile();
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(large_checked_data);
|
expect(display).to.have.displayed(largeCheckedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support drawing BGRX blit images with true color via #blitImage', function () {
|
it('should support drawing BGRX blit images with true color via #blitImage', function () {
|
||||||
const data = [];
|
const data = [];
|
||||||
for (let i = 0; i < 16; i++) {
|
for (let i = 0; i < 16; i++) {
|
||||||
data[i * 4] = checked_data[i * 4 + 2];
|
data[i * 4] = checkedData[i * 4 + 2];
|
||||||
data[i * 4 + 1] = checked_data[i * 4 + 1];
|
data[i * 4 + 1] = checkedData[i * 4 + 1];
|
||||||
data[i * 4 + 2] = checked_data[i * 4];
|
data[i * 4 + 2] = checkedData[i * 4];
|
||||||
data[i * 4 + 3] = checked_data[i * 4 + 3];
|
data[i * 4 + 3] = checkedData[i * 4 + 3];
|
||||||
}
|
}
|
||||||
display.blitImage(0, 0, 4, 4, data, 0);
|
display.blitImage(0, 0, 4, 4, data, 0);
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support drawing RGB blit images with true color via #blitRgbImage', function () {
|
it('should support drawing RGB blit images with true color via #blitRgbImage', function () {
|
||||||
const data = [];
|
const data = [];
|
||||||
for (let i = 0; i < 16; i++) {
|
for (let i = 0; i < 16; i++) {
|
||||||
data[i * 3] = checked_data[i * 4];
|
data[i * 3] = checkedData[i * 4];
|
||||||
data[i * 3 + 1] = checked_data[i * 4 + 1];
|
data[i * 3 + 1] = checkedData[i * 4 + 1];
|
||||||
data[i * 3 + 2] = checked_data[i * 4 + 2];
|
data[i * 3 + 2] = checkedData[i * 4 + 2];
|
||||||
}
|
}
|
||||||
display.blitRgbImage(0, 0, 4, 4, data, 0);
|
display.blitRgbImage(0, 0, 4, 4, data, 0);
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support drawing an image object via #drawImage', function () {
|
it('should support drawing an image object via #drawImage', function () {
|
||||||
const img = make_image_canvas(checked_data);
|
const img = makeImageCanvas(checkedData);
|
||||||
display.drawImage(img, 0, 0);
|
display.drawImage(img, 0, 0);
|
||||||
display.flip();
|
display.flip();
|
||||||
expect(display).to.have.displayed(checked_data);
|
expect(display).to.have.displayed(checkedData);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -382,18 +382,18 @@ describe('Display/Canvas Helper', function () {
|
|||||||
beforeEach(function () {
|
beforeEach(function () {
|
||||||
display = new Display(document.createElement('canvas'));
|
display = new Display(document.createElement('canvas'));
|
||||||
display.resize(4, 4);
|
display.resize(4, 4);
|
||||||
sinon.spy(display, '_scan_renderQ');
|
sinon.spy(display, '_scanRenderQ');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should try to process an item when it is pushed on, if nothing else is on the queue', function () {
|
it('should try to process an item when it is pushed on, if nothing else is on the queue', function () {
|
||||||
display._renderQ_push({ type: 'noop' }); // does nothing
|
display._renderQPush({ type: 'noop' }); // does nothing
|
||||||
expect(display._scan_renderQ).to.have.been.calledOnce;
|
expect(display._scanRenderQ).to.have.been.calledOnce;
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should not try to process an item when it is pushed on if we are waiting for other items', function () {
|
it('should not try to process an item when it is pushed on if we are waiting for other items', function () {
|
||||||
display._renderQ.length = 2;
|
display._renderQ.length = 2;
|
||||||
display._renderQ_push({ type: 'noop' });
|
display._renderQPush({ type: 'noop' });
|
||||||
expect(display._scan_renderQ).to.not.have.been.called;
|
expect(display._scanRenderQ).to.not.have.been.called;
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should wait until an image is loaded to attempt to draw it and the rest of the queue', function () {
|
it('should wait until an image is loaded to attempt to draw it and the rest of the queue', function () {
|
||||||
@ -403,13 +403,13 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.drawImage = sinon.spy();
|
display.drawImage = sinon.spy();
|
||||||
display.fillRect = sinon.spy();
|
display.fillRect = sinon.spy();
|
||||||
|
|
||||||
display._scan_renderQ();
|
display._scanRenderQ();
|
||||||
expect(display.drawImage).to.not.have.been.called;
|
expect(display.drawImage).to.not.have.been.called;
|
||||||
expect(display.fillRect).to.not.have.been.called;
|
expect(display.fillRect).to.not.have.been.called;
|
||||||
expect(img.addEventListener).to.have.been.calledOnce;
|
expect(img.addEventListener).to.have.been.calledOnce;
|
||||||
|
|
||||||
display._renderQ[0].img.complete = true;
|
display._renderQ[0].img.complete = true;
|
||||||
display._scan_renderQ();
|
display._scanRenderQ();
|
||||||
expect(display.drawImage).to.have.been.calledOnce;
|
expect(display.drawImage).to.have.been.calledOnce;
|
||||||
expect(display.fillRect).to.have.been.calledOnce;
|
expect(display.fillRect).to.have.been.calledOnce;
|
||||||
expect(img.addEventListener).to.have.been.calledOnce;
|
expect(img.addEventListener).to.have.been.calledOnce;
|
||||||
@ -422,7 +422,7 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display.drawImage = sinon.spy();
|
display.drawImage = sinon.spy();
|
||||||
display.fillRect = sinon.spy();
|
display.fillRect = sinon.spy();
|
||||||
|
|
||||||
display._scan_renderQ();
|
display._scanRenderQ();
|
||||||
expect(display.drawImage).to.not.have.been.called;
|
expect(display.drawImage).to.not.have.been.called;
|
||||||
expect(display.fillRect).to.not.have.been.called;
|
expect(display.fillRect).to.not.have.been.called;
|
||||||
expect(img.addEventListener).to.have.been.calledOnce;
|
expect(img.addEventListener).to.have.been.calledOnce;
|
||||||
@ -430,7 +430,7 @@ describe('Display/Canvas Helper', function () {
|
|||||||
display._renderQ[0].img.complete = true;
|
display._renderQ[0].img.complete = true;
|
||||||
display._renderQ[0].img.width = 4;
|
display._renderQ[0].img.width = 4;
|
||||||
display._renderQ[0].img.height = 4;
|
display._renderQ[0].img.height = 4;
|
||||||
display._scan_renderQ();
|
display._scanRenderQ();
|
||||||
expect(display.drawImage).to.have.been.calledOnce;
|
expect(display.drawImage).to.have.been.calledOnce;
|
||||||
expect(display.fillRect).to.have.been.calledOnce;
|
expect(display.fillRect).to.have.been.calledOnce;
|
||||||
expect(img.addEventListener).to.have.been.calledOnce;
|
expect(img.addEventListener).to.have.been.calledOnce;
|
||||||
@ -446,35 +446,35 @@ describe('Display/Canvas Helper', function () {
|
|||||||
|
|
||||||
it('should draw a blit image on type "blit"', function () {
|
it('should draw a blit image on type "blit"', function () {
|
||||||
display.blitImage = sinon.spy();
|
display.blitImage = sinon.spy();
|
||||||
display._renderQ_push({ type: 'blit', x: 3, y: 4, width: 5, height: 6, data: [7, 8, 9] });
|
display._renderQPush({ type: 'blit', x: 3, y: 4, width: 5, height: 6, data: [7, 8, 9] });
|
||||||
expect(display.blitImage).to.have.been.calledOnce;
|
expect(display.blitImage).to.have.been.calledOnce;
|
||||||
expect(display.blitImage).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9], 0);
|
expect(display.blitImage).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9], 0);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should draw a blit RGB image on type "blitRgb"', function () {
|
it('should draw a blit RGB image on type "blitRgb"', function () {
|
||||||
display.blitRgbImage = sinon.spy();
|
display.blitRgbImage = sinon.spy();
|
||||||
display._renderQ_push({ type: 'blitRgb', x: 3, y: 4, width: 5, height: 6, data: [7, 8, 9] });
|
display._renderQPush({ type: 'blitRgb', x: 3, y: 4, width: 5, height: 6, data: [7, 8, 9] });
|
||||||
expect(display.blitRgbImage).to.have.been.calledOnce;
|
expect(display.blitRgbImage).to.have.been.calledOnce;
|
||||||
expect(display.blitRgbImage).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9], 0);
|
expect(display.blitRgbImage).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9], 0);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should copy a region on type "copy"', function () {
|
it('should copy a region on type "copy"', function () {
|
||||||
display.copyImage = sinon.spy();
|
display.copyImage = sinon.spy();
|
||||||
display._renderQ_push({ type: 'copy', x: 3, y: 4, width: 5, height: 6, old_x: 7, old_y: 8 });
|
display._renderQPush({ type: 'copy', x: 3, y: 4, width: 5, height: 6, oldX: 7, oldY: 8 });
|
||||||
expect(display.copyImage).to.have.been.calledOnce;
|
expect(display.copyImage).to.have.been.calledOnce;
|
||||||
expect(display.copyImage).to.have.been.calledWith(7, 8, 3, 4, 5, 6);
|
expect(display.copyImage).to.have.been.calledWith(7, 8, 3, 4, 5, 6);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should fill a rect with a given color on type "fill"', function () {
|
it('should fill a rect with a given color on type "fill"', function () {
|
||||||
display.fillRect = sinon.spy();
|
display.fillRect = sinon.spy();
|
||||||
display._renderQ_push({ type: 'fill', x: 3, y: 4, width: 5, height: 6, color: [7, 8, 9]});
|
display._renderQPush({ type: 'fill', x: 3, y: 4, width: 5, height: 6, color: [7, 8, 9]});
|
||||||
expect(display.fillRect).to.have.been.calledOnce;
|
expect(display.fillRect).to.have.been.calledOnce;
|
||||||
expect(display.fillRect).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9]);
|
expect(display.fillRect).to.have.been.calledWith(3, 4, 5, 6, [7, 8, 9]);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should draw an image from an image object on type "img" (if complete)', function () {
|
it('should draw an image from an image object on type "img" (if complete)', function () {
|
||||||
display.drawImage = sinon.spy();
|
display.drawImage = sinon.spy();
|
||||||
display._renderQ_push({ type: 'img', x: 3, y: 4, img: { complete: true } });
|
display._renderQPush({ type: 'img', x: 3, y: 4, img: { complete: true } });
|
||||||
expect(display.drawImage).to.have.been.calledOnce;
|
expect(display.drawImage).to.have.been.calledOnce;
|
||||||
expect(display.drawImage).to.have.been.calledWith({ complete: true }, 3, 4);
|
expect(display.drawImage).to.have.been.calledWith({ complete: true }, 3, 4);
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user