canvasrenderer
Advanced tools
Comparing version 0.1.2 to 0.1.3
/** | ||
* canvasrenderer v0.1.2 build Sep 18 2015 | ||
* canvasrenderer v0.1.3 build Sep 20 2015 | ||
* https://github.com/vanruesc/canvasrenderer | ||
* Copyright 2015 Raoul van Rueschen, Zlib | ||
*/ | ||
'use strict'; | ||
var CanvasRenderer = (function () { 'use strict'; | ||
/** | ||
* A canvas renderer base class. | ||
* | ||
* @class CanvasRenderer | ||
* @constructor | ||
* @param {Object} [options] - The settings. | ||
* @param {Number} [options.dt=1/60] - The update rate in seconds. | ||
* @param {Boolean} [options.clearCanvas=true] - Whether the canvas should automatically be cleared. | ||
* @param {Boolean} [options.enabled=true] - Whether the animation should be rendered. If set to false, the render function will merely update the time. | ||
* @param {Number} [options.size] - The canvas size. | ||
*/ | ||
function CanvasRenderer(options) { | ||
var self = this; | ||
/** | ||
* Delta time in milliseconds. | ||
* A canvas renderer base class. | ||
* | ||
* @property dt | ||
* @type Number | ||
* @class CanvasRenderer | ||
* @constructor | ||
* @param {Object} [options] - The settings. | ||
* @param {Number} [options.dt=1/60] - The update rate in seconds. | ||
* @param {Boolean} [options.clearCanvas=true] - Whether the canvas should automatically be cleared. | ||
* @param {Boolean} [options.enabled=true] - Whether the animation should be rendered. If set to false, the render function will merely update the time. | ||
* @param {Number} [options.size] - The canvas size. | ||
*/ | ||
this.dt = 1000.0 / 60.0; | ||
function CanvasRenderer(options) { | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property now | ||
* @type Number | ||
* @private | ||
*/ | ||
var self = this; | ||
this.now = (window.performance !== undefined) ? window.performance.now() : Date.now(); | ||
/** | ||
* Delta time in milliseconds. | ||
* | ||
* @property dt | ||
* @type Number | ||
*/ | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property then | ||
* @type Number | ||
* @private | ||
*/ | ||
this.dt = 1000.0 / 60.0; | ||
this.then = this.now; | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property now | ||
* @type Number | ||
* @private | ||
*/ | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property accumulator | ||
* @type Number | ||
* @private | ||
*/ | ||
this.now = (window.performance !== undefined) ? window.performance.now() : Date.now(); | ||
this.accumulator = 0; | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property then | ||
* @type Number | ||
* @private | ||
*/ | ||
/** | ||
* The rendering context. | ||
* | ||
* @property ctx | ||
* @type CanvasRenderingContext2D | ||
* @private | ||
*/ | ||
this.then = this.now; | ||
this.ctx = null; | ||
/** | ||
* Used for time based rendering. Milliseconds. | ||
* | ||
* @property accumulator | ||
* @type Number | ||
* @private | ||
*/ | ||
// Create an initial canvas. | ||
this.canvas = document.createElement("canvas"); | ||
this.accumulator = 0; | ||
/** | ||
* Clear flag. | ||
* | ||
* @property clearCanvas | ||
* @type Boolean | ||
*/ | ||
/** | ||
* The rendering context. | ||
* | ||
* @property ctx | ||
* @type CanvasRenderingContext2D | ||
* @private | ||
*/ | ||
this.clearCanvas = true; | ||
this.ctx = null; | ||
/** | ||
* Enabled flag. | ||
* | ||
* @property enabled | ||
* @type Boolean | ||
*/ | ||
// Create an initial canvas. | ||
this.canvas = document.createElement("canvas"); | ||
this.enabled = true; | ||
/** | ||
* Clear flag. | ||
* | ||
* @property clearCanvas | ||
* @type Boolean | ||
*/ | ||
// Overwrite the defaults. | ||
if(options !== undefined) { | ||
this.clearCanvas = true; | ||
if(options.dt !== undefined) { this.dt = options.dt * 1000.0; } | ||
if(options.canvas !== undefined) { this.canvas = options.canvas; } | ||
if(options.clearCanvas !== undefined) { this.clearCanvas = options.clearCanvas; } | ||
if(options.enabled !== undefined) { this.enabled = options.enabled; } | ||
this.size = options.size; | ||
/** | ||
* Enabled flag. | ||
* | ||
* @property enabled | ||
* @type Boolean | ||
*/ | ||
this.enabled = true; | ||
// Overwrite the defaults. | ||
if(options !== undefined) { | ||
if(options.dt !== undefined) { this.dt = options.dt * 1000.0; } | ||
if(options.canvas !== undefined) { this.canvas = options.canvas; } | ||
if(options.clearCanvas !== undefined) { this.clearCanvas = options.clearCanvas; } | ||
if(options.enabled !== undefined) { this.enabled = options.enabled; } | ||
this.size = options.size; | ||
} | ||
/** | ||
* The animation loop. | ||
* | ||
* This ugly thing will evolve into an | ||
* arrow function some day! | ||
* | ||
* @method render | ||
*/ | ||
this.render = function(now) { self._render(now); }; | ||
} | ||
/** | ||
* The animation loop. | ||
* The canvas. | ||
* | ||
* This ugly thing will evolve into an | ||
* arrow function some day! | ||
* | ||
* @method render | ||
* @property canvas | ||
* @type HTMLCanvasElement | ||
*/ | ||
this.render = function(now) { self._render(now); }; | ||
Object.defineProperty(CanvasRenderer.prototype, "canvas", { | ||
} | ||
get: function() { return this.ctx.canvas; }, | ||
/** | ||
* The canvas. | ||
* | ||
* @property canvas | ||
* @type HTMLCanvasElement | ||
*/ | ||
set: function(x) { | ||
Object.defineProperty(CanvasRenderer.prototype, "canvas", { | ||
if(x !== undefined && x.getContext !== undefined) { | ||
get: function() { return this.ctx.canvas; }, | ||
this.ctx = x.getContext("2d"); | ||
set: function(x) { | ||
} | ||
if(x !== undefined && x.getContext !== undefined) { | ||
this.ctx = x.getContext("2d"); | ||
} | ||
} | ||
}); | ||
}); | ||
/** | ||
* The size of the canvas. | ||
* | ||
* @property size | ||
* @type Array | ||
* @example | ||
* [width, height] | ||
*/ | ||
/** | ||
* The size of the canvas. | ||
* | ||
* @property size | ||
* @type Array | ||
* @example | ||
* [width, height] | ||
*/ | ||
Object.defineProperty(CanvasRenderer.prototype, "size", { | ||
Object.defineProperty(CanvasRenderer.prototype, "size", { | ||
get: function() { | ||
get: function() { | ||
return [ | ||
this.ctx.canvas.width, | ||
this.ctx.canvas.height | ||
]; | ||
return [ | ||
this.ctx.canvas.width, | ||
this.ctx.canvas.height | ||
]; | ||
}, | ||
}, | ||
set: function(x) { | ||
set: function(x) { | ||
if(x !== undefined && x.length === 2) { | ||
if(x !== undefined && x.length === 2) { | ||
this.ctx.canvas.width = x[0]; | ||
this.ctx.canvas.height = x[1]; | ||
this.ctx.canvas.width = x[0]; | ||
this.ctx.canvas.height = x[1]; | ||
} | ||
} | ||
} | ||
}); | ||
}); | ||
/** | ||
* Abstract update method. | ||
* | ||
* This method will be called by the render function | ||
* at a maximum rate of x fps where x corresponds to | ||
* the refresh rate of the used monitor. | ||
* | ||
* @method update | ||
* @param {Number} elapsed - The time since the last update call in milliseconds. | ||
* @throws An error if not implemented. | ||
*/ | ||
/** | ||
* Abstract update method. | ||
* | ||
* This method will be called by the render function | ||
* at a maximum rate of x fps where x corresponds to | ||
* the refresh rate of the used monitor. | ||
* | ||
* @method update | ||
* @param {Number} elapsed - The time since the last update call in milliseconds. | ||
*/ | ||
CanvasRenderer.prototype.update = function() { | ||
CanvasRenderer.prototype.update = function() {}; | ||
throw new Error("Not implemented."); | ||
/** | ||
* Abstract draw method. | ||
* | ||
* @method draw | ||
*/ | ||
}; | ||
CanvasRenderer.prototype.draw = function() {}; | ||
/** | ||
* Abstract draw method. | ||
* | ||
* @method draw | ||
* @throws An error if not implemented. | ||
*/ | ||
/** | ||
* Renders the animation. | ||
* | ||
* @method _render | ||
* @private | ||
* @param {DOMHighResTimeStamp} now - The time since the page was loaded. | ||
*/ | ||
CanvasRenderer.prototype.draw = function() { | ||
CanvasRenderer.prototype._render = function(now) { | ||
throw new Error("Not implemented."); | ||
var elapsed; | ||
}; | ||
if(now === undefined) { | ||
/** | ||
* Renders the animation. | ||
* | ||
* @method _render | ||
* @private | ||
* @param {DOMHighResTimeStamp} now - The time since the page was loaded. | ||
* @throws An error if update() or draw() hasn't been implemented. | ||
*/ | ||
now = (window.performance !== undefined) ? window.performance.now() : Date.now(); | ||
CanvasRenderer.prototype._render = function(now) { | ||
} | ||
var elapsed; | ||
if(this.clearCanvas) { | ||
if(now === undefined) { | ||
this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height); | ||
now = (window.performance !== undefined) ? window.performance.now() : Date.now(); | ||
} | ||
} | ||
this.now = now; | ||
elapsed = this.now - this.then; | ||
this.then = this.now; | ||
if(this.clearCanvas) { | ||
if(this.enabled) { | ||
this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height); | ||
this.accumulator += elapsed; | ||
} | ||
if(this.accumulator >= this.dt) { | ||
this.now = now; | ||
elapsed = this.now - this.then; | ||
this.then = this.now; | ||
this.update(elapsed); | ||
this.accumulator -= this.dt; | ||
if(this.enabled) { | ||
this.accumulator += elapsed; | ||
if(this.accumulator >= this.dt) { | ||
this.update(elapsed); | ||
this.accumulator -= this.dt; | ||
} | ||
this.draw(); | ||
} | ||
this.draw(); | ||
}; | ||
} | ||
return CanvasRenderer; | ||
}; | ||
module.exports = CanvasRenderer; | ||
})(); |
/** | ||
* canvasrenderer v0.1.2 build Sep 18 2015 | ||
* canvasrenderer v0.1.3 build Sep 20 2015 | ||
* https://github.com/vanruesc/canvasrenderer | ||
* Copyright 2015 Raoul van Rueschen, Zlib | ||
*/ | ||
"use strict";function CanvasRenderer(t){var e=this;this.dt=1e3/60,this.now=void 0!==window.performance?window.performance.now():Date.now(),this.then=this.now,this.accumulator=0,this.ctx=null,this.canvas=document.createElement("canvas"),this.clearCanvas=!0,this.enabled=!0,void 0!==t&&(void 0!==t.dt&&(this.dt=1e3*t.dt),void 0!==t.canvas&&(this.canvas=t.canvas),void 0!==t.clearCanvas&&(this.clearCanvas=t.clearCanvas),void 0!==t.enabled&&(this.enabled=t.enabled),this.size=t.size),this.render=function(t){e._render(t)}}Object.defineProperty(CanvasRenderer.prototype,"canvas",{get:function(){return this.ctx.canvas},set:function(t){void 0!==t&&void 0!==t.getContext&&(this.ctx=t.getContext("2d"))}}),Object.defineProperty(CanvasRenderer.prototype,"size",{get:function(){return[this.ctx.canvas.width,this.ctx.canvas.height]},set:function(t){void 0!==t&&2===t.length&&(this.ctx.canvas.width=t[0],this.ctx.canvas.height=t[1])}}),CanvasRenderer.prototype.update=function(){},CanvasRenderer.prototype.draw=function(){},CanvasRenderer.prototype._render=function(t){var e;void 0===t&&(t=void 0!==window.performance?window.performance.now():Date.now()),this.clearCanvas&&this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height),this.now=t,e=this.now-this.then,this.then=this.now,this.enabled&&(this.accumulator+=e,this.accumulator>=this.dt&&(this.update(e),this.accumulator-=this.dt),this.draw())},module.exports=CanvasRenderer; | ||
var CanvasRenderer=function(){"use strict";function t(t){var e=this;this.dt=1e3/60,this.now=void 0!==window.performance?window.performance.now():Date.now(),this.then=this.now,this.accumulator=0,this.ctx=null,this.canvas=document.createElement("canvas"),this.clearCanvas=!0,this.enabled=!0,void 0!==t&&(void 0!==t.dt&&(this.dt=1e3*t.dt),void 0!==t.canvas&&(this.canvas=t.canvas),void 0!==t.clearCanvas&&(this.clearCanvas=t.clearCanvas),void 0!==t.enabled&&(this.enabled=t.enabled),this.size=t.size),this.render=function(t){e._render(t)}}return Object.defineProperty(t.prototype,"canvas",{get:function(){return this.ctx.canvas},set:function(t){void 0!==t&&void 0!==t.getContext&&(this.ctx=t.getContext("2d"))}}),Object.defineProperty(t.prototype,"size",{get:function(){return[this.ctx.canvas.width,this.ctx.canvas.height]},set:function(t){void 0!==t&&2===t.length&&(this.ctx.canvas.width=t[0],this.ctx.canvas.height=t[1])}}),t.prototype.update=function(){throw new Error("Not implemented.")},t.prototype.draw=function(){throw new Error("Not implemented.")},t.prototype._render=function(t){var e;void 0===t&&(t=void 0!==window.performance?window.performance.now():Date.now()),this.clearCanvas&&this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height),this.now=t,e=this.now-this.then,this.then=this.now,this.enabled&&(this.accumulator+=e,this.accumulator>=this.dt&&(this.update(e),this.accumulator-=this.dt),this.draw())},t}(); |
@@ -5,3 +5,3 @@ { | ||
"description": "A base class that provides methods for canvas rendering.", | ||
"version": "0.1.2", | ||
"version": "0.1.3", | ||
"url": "https://github.com/vanruesc/canvasrenderer" | ||
@@ -188,2 +188,5 @@ }, | ||
], | ||
"throws": { | ||
"description": "An error if not implemented." | ||
}, | ||
"class": "CanvasRenderer" | ||
@@ -193,6 +196,9 @@ }, | ||
"file": "src\\canvasrenderer.js", | ||
"line": 180, | ||
"line": 185, | ||
"description": "Abstract draw method.", | ||
"itemtype": "method", | ||
"name": "draw", | ||
"throws": { | ||
"description": "An error if not implemented." | ||
}, | ||
"class": "CanvasRenderer" | ||
@@ -202,3 +208,3 @@ }, | ||
"file": "src\\canvasrenderer.js", | ||
"line": 188, | ||
"line": 198, | ||
"description": "Renders the animation.", | ||
@@ -216,2 +222,5 @@ "itemtype": "method", | ||
], | ||
"throws": { | ||
"description": "An error if update() or draw() hasn't been implemented." | ||
}, | ||
"class": "CanvasRenderer" | ||
@@ -218,0 +227,0 @@ } |
{ | ||
"name": "canvasrenderer", | ||
"version": "0.1.2", | ||
"version": "0.1.3", | ||
"description": "A base class that provides methods for canvas rendering.", | ||
@@ -35,5 +35,5 @@ "homepage": "https://github.com/vanruesc/canvasrenderer", | ||
"jshint": "npm run jshint:banner && npm run jshint:test && npm run jshint:lib", | ||
"rollup": "rollup -f cjs -n CanvasRenderer -i src/canvasrenderer.js -o build/canvasrenderer.js", | ||
"rollup": "rollup -f iife -n CanvasRenderer -i src/canvasrenderer.js -o build/canvasrenderer.js", | ||
"uglify": "uglifyjs build/canvasrenderer.js -c -m -o build/canvasrenderer.min.js", | ||
"mocha": "mocha test", | ||
"mocha": "mocha-phantomjs --setting webSecurityEnabled=false test/index.html", | ||
"yuidoc": "yuidoc src -q -c yuidoc.json", | ||
@@ -56,2 +56,4 @@ "prebuild": "npm run jshint", | ||
"mocha": "2.x.x", | ||
"mocha-phantomjs": "3.6.0", | ||
"phantomjs": "1.9.7-15", | ||
"prepend-file": "1.x.x", | ||
@@ -58,0 +60,0 @@ "rollup": "0.x.x", |
@@ -176,6 +176,11 @@ /** | ||
* @param {Number} elapsed - The time since the last update call in milliseconds. | ||
* @throws An error if not implemented. | ||
*/ | ||
CanvasRenderer.prototype.update = function() {}; | ||
CanvasRenderer.prototype.update = function() { | ||
throw new Error("Not implemented."); | ||
}; | ||
/** | ||
@@ -185,6 +190,11 @@ * Abstract draw method. | ||
* @method draw | ||
* @throws An error if not implemented. | ||
*/ | ||
CanvasRenderer.prototype.draw = function() {}; | ||
CanvasRenderer.prototype.draw = function() { | ||
throw new Error("Not implemented."); | ||
}; | ||
/** | ||
@@ -196,2 +206,3 @@ * Renders the animation. | ||
* @param {DOMHighResTimeStamp} now - The time since the page was loaded. | ||
* @throws An error if update() or draw() hasn't been implemented. | ||
*/ | ||
@@ -198,0 +209,0 @@ |
{ | ||
"name": "CanvasRenderer API", | ||
"description": "A base class that provides methods for canvas rendering.", | ||
"version": "0.1.2", | ||
"version": "0.1.3", | ||
"url": "https://github.com/vanruesc/canvasrenderer", | ||
@@ -6,0 +6,0 @@ "options": { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
163070
2011
8