git @ Cat's Eye Technologies yoob.js / b2d03ca
PlayfieldCanvasView doesn't necessarily resize canvas each time. Chris Pressey 6 years ago
2 changed file(s) with 16 addition(s) and 5 deletion(s). Raw diff Collapse all Expand all
88 improves upon `sliderPlusTextInput` by adding optional increment and
99 decrement buttons, and taking a configuration object as a parameter
1010 for construction.
11
12 `yoob.PlayfieldCanvasView` now accepts `resizeCanvas` argument,
13 which defaults to true, but can be set to false to suppress the
14 default behaviour of resizing the canvas to fit the playfield
15 just before each time it is drawn.
1116
1217 * version 0.11
1318
00 /*
1 * This file is part of yoob.js version 0.11
1 * This file is part of yoob.js version 0.12-PRE
22 * Available from https://github.com/catseye/yoob.js/
33 * This file is in the public domain. See http://unlicense.org/ for details.
44 */
1414 * If the cell values are solid and fill the entire cell, drawCursorsFirst: false
1515 * may be in order.
1616 *
17 * TODO: don't necesarily resize canvas each time?
17 * resizeCanvas defaults to true. If set to false, the canvas element will
18 * not be resized before each draw. You may wish to do this yourself in your
19 * code which calls playfieldCanvasView.draw().
20 *
1821 */
1922 yoob.PlayfieldCanvasView = function() {
2023 this.init = function(cfg) {
2528 this.fixedSizeCanvas = !!cfg.fixedSizeCanvas;
2629 this.drawCursorsFirst = (cfg.drawCursorsFirst === undefined) ? true : !!cfg.drawCursorsFirst;
2730 this.setCellDimensions(cfg.cellWidth || 8, cfg.cellHeight || 8);
31 this.resizeCanvas = cfg.resizeCanvas === false ? false : true;
2832 return this;
2933 };
3034
115119
116120 /*
117121 * Draw the Playfield, and its set of Cursors, on the canvas element.
118 * Resizes the canvas to the needed dimensions first.
122 * Optionally resizes the canvas to the needed dimensions first.
119123 */
120124 this.draw = function() {
121125 var canvas = this.canvas;
125129 var width = this.pf.getCursoredExtentX();
126130 var height = this.pf.getCursoredExtentY();
127131
128 canvas.width = width * cellWidth;
129 canvas.height = height * cellHeight;
132 if (this.resizeCanvas) {
133 canvas.width = width * cellWidth;
134 canvas.height = height * cellHeight;
135 }
130136 var ctx = this.ctx;
131137
132138 ctx.textBaseline = "top";