commit 935da294b48893a84165d7ab8d89bad01809f28d Author: Sven Slootweg Date: Sat Mar 4 20:15:24 2017 +0100 Initial commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8f028e4 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +/node_modules/ +/lib/ diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..096746c --- /dev/null +++ b/.npmignore @@ -0,0 +1 @@ +/node_modules/ \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..aa16d77 --- /dev/null +++ b/README.md @@ -0,0 +1,37 @@ +# packagename + +packagedescription + +## License + +[WTFPL](http://www.wtfpl.net/txt/copying/) or [CC0](https://creativecommons.org/publicdomain/zero/1.0/), whichever you prefer. A donation and/or attribution are appreciated, but not required. + +## Donate + +Maintaining open-source projects takes a lot of time, and the more donations I receive, the more time I can dedicate to open-source. If this module is useful to you, consider [making a donation](http://cryto.net/~joepie91/donate.html)! + +You can donate using Bitcoin, PayPal, Flattr, cash-in-mail, SEPA transfers, and pretty much anything else. Thank you! + +## Contributing + +Pull requests welcome. Please make sure your modifications are in line with the overall code style, and ensure that you're editing the files in `src/`, not those in `lib/`. + +Build tool of choice is `gulp`; simply run `gulp` while developing, and it will watch for changes. + +Be aware that by making a pull request, you agree to release your modifications under the licenses stated above. + +## Usage + +usagetext + +```javascript +usagecode +``` + +## API + +### functionName(arg) + +functiondescription + +* __arg__: argumentdescription diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..1769501 --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,18 @@ +var gulp = require("gulp"); +var presetES2015 = require("@joepie91/gulp-preset-es2015"); + +var source = ["src/**/*.js"] + +gulp.task('babel', function() { + return gulp.src(source) + .pipe(presetES2015({ + basePath: __dirname + })) + .pipe(gulp.dest("lib/")); +}); + +gulp.task("watch", function () { + gulp.watch(source, ["babel"]); +}); + +gulp.task("default", ["babel", "watch"]); \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..507257b --- /dev/null +++ b/index.js @@ -0,0 +1,3 @@ +'use strict'; + +module.exports = require("./lib"); \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..be78a13 --- /dev/null +++ b/package.json @@ -0,0 +1,30 @@ +{ + "name": "canvassed", + "version": "1.0.0", + "description": "High-level canvas drawing primitives", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1", + "gulp": "gulp" + }, + "repository": { + "type": "git", + "url": "http://git.cryto.net/joepie91/canvassed.git" + }, + "keywords": [ + "canvas", + "drawing", + "shapes" + ], + "author": "Sven Slootweg", + "license": "WTFPL", + "dependencies": { + "checkit": "^0.7.0", + "default-value": "^1.0.0" + }, + "devDependencies": { + "@joepie91/gulp-preset-es2015": "^1.0.1", + "babel-preset-es2015": "^6.6.0", + "gulp": "^3.9.1" + } +} diff --git a/src/create-object.js b/src/create-object.js new file mode 100644 index 0000000..5369c69 --- /dev/null +++ b/src/create-object.js @@ -0,0 +1,93 @@ +'use strict'; + +const createEventEmitter = require("create-event-emitter"); +const defaultValue = require("default-value"); + +const validateSync = require("./validate-sync"); + +module.exports = function createObject(options) { + validateSync(options, { + type: "required", + onRecalculateSize: "required" + }); + + let object = createEventEmitter(Object.assign({ + isCached: false, + cacheCanvas: document.createElement("canvas"), + flipX: false, + flipY: false, + scaleX: 1, + scaleY: 1, + opacity: 1, + set: function setProperties(properties) { + Object.assign(this, properties); + + if (properties.some(property => this.sizeBustingProperties.includes(property))) { + this.emit("bustedSize"); + this.recalculateSize(); + } + + if (properties.some(property => this.cacheBustingProperties.includes(property))) { + this.emit("bustedCache"); + this.isCached = false; + } + }, + render: function renderObject(context, options = {}) { + if (this.isCached === false) { + this.renderToCache(this.cacheCanvas); + // TODO: render cached canvas + } + + this.emit("rendering"); + + context.drawImage(this.cacheCanvas, defaultValue(options.x, 0), defaultValue(options.y, 0)); + + this.emit("rendered"); + }, + recalculateSize: function recalculateSize() { + this.emit("recalculatingSize"); + + let newSize = this.onRecalculateSize(); + + this.renderWidth = newSize.width * this.scaleX; + this.renderHeight = newSize.height * this.scaleY; + + this.cacheCanvas.width = this.width; + this.cacheCanvas.height = this.height; + + // TODO: bounding box? + + this.emit("recalculatedSize"); + }, + renderToCache: function renderToCache(targetCanvas) { + let context = targetCanvas.getContext("2d", { + alpha: true + }); + + context.save(); + + this.emit("renderingToCache"); + + let scaleX = (this.flipX === false) ? this.scaleX : (0 - this.scaleX); + let scaleY = (this.flipY === false) ? this.scaleY : (0 - this.scaleY); + + context.scale(scaleX, scaleY); + context.globalAlpha = this.opacity; + + this.onRender(context); + + this.emit("renderedToCache"); + + context.restore(); + } + }, options, { + cacheBustingProperties: ["scaleX", "scaleY", "opacity", "flipX", "flipY"].concat(options.cacheBustingProperties), + sizeBustingProperties: ["scaleX", "scaleY"].concat(options.sizeBustingProperties) + })); + + object.recalculateSize(); + + // ... + + return object; +}; diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..780e19b --- /dev/null +++ b/src/index.js @@ -0,0 +1,6 @@ +'use strict'; + +module.exports = { + validateSync: require("./validate-sync"), + createObject: require("./create-object") +} diff --git a/src/validate-sync.js b/src/validate-sync.js new file mode 100644 index 0000000..a581e70 --- /dev/null +++ b/src/validate-sync.js @@ -0,0 +1,13 @@ +'use strict'; + +const checkit = require("checkit"); + +module.exports = function(object, rules) { + let [error, validated] = checkit(rules).runSync(object); + + if (error != null) { + throw error; + } else { + return validated; + } +};