Initial commit
commit
420a4d079a
@ -0,0 +1,2 @@
|
||||
/node_modules/
|
||||
/lib/
|
@ -0,0 +1 @@
|
||||
/node_modules/
|
@ -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
|
@ -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"]);
|
@ -0,0 +1,3 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = require("./lib");
|
@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "canvassed-line",
|
||||
"version": "1.0.0",
|
||||
"description": "Line shape for `canvassed`",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "http://git.cryto.net/joepie91/canvassed-line.git"
|
||||
},
|
||||
"keywords": [
|
||||
"canvassed",
|
||||
"shape",
|
||||
"line"
|
||||
],
|
||||
"author": "Sven Slootweg",
|
||||
"license": "WTFPL",
|
||||
"dependencies": {
|
||||
},
|
||||
"devDependencies": {
|
||||
"@joepie91/gulp-preset-es2015": "^1.0.1",
|
||||
"babel-preset-es2015": "^6.6.0",
|
||||
"gulp": "^3.9.1"
|
||||
}
|
||||
}
|
@ -0,0 +1,40 @@
|
||||
'use strict';
|
||||
|
||||
const canvassed = require("canvassed");
|
||||
|
||||
module.exports = function createLine(options = {}) {
|
||||
return canvassed.createObject(Object.assign({
|
||||
type: "line",
|
||||
sizeBustingProperties: ["x1", "y1", "x2", "y2", "width"],
|
||||
cacheBustingProperties: ["color", "cap"],
|
||||
requiredProperties: ["x1", "y1", "x2", "y2"],
|
||||
color: "red",
|
||||
width: 1,
|
||||
cap: "butt",
|
||||
onRecalculateSize: function onRecalculateSize() {
|
||||
this.offsetX = Math.min(this.x1, this.x2);
|
||||
this.offsetY = Math.min(this.y1, this.y2);
|
||||
|
||||
return {
|
||||
width: Math.abs(this.x2 - this.x1) + this.width,
|
||||
height: Math.abs(this.y2 - this.y1) + this.width,
|
||||
underdrawX: this.width / 2,
|
||||
underdrawY: this.width / 2,
|
||||
overdrawX: this.width / 2,
|
||||
overdrawY: this.width / 2
|
||||
}
|
||||
},
|
||||
onRender: function onRender(context) {
|
||||
let lineWidthOffset = this.width / 2;
|
||||
|
||||
context.strokeStyle = this.color;
|
||||
context.lineWidth = this.width;
|
||||
context.lineCap = this.cap;
|
||||
|
||||
context.beginPath();
|
||||
context.moveTo(this.x1 - this.offsetX + this.renderUnderdrawX, this.y1 - this.offsetY + this.renderUnderdrawY);
|
||||
context.lineTo(this.x2 - this.offsetX + this.renderUnderdrawX, this.y2 - this.offsetY + this.renderUnderdrawY);
|
||||
context.stroke();
|
||||
}
|
||||
}, options));
|
||||
}
|
Loading…
Reference in New Issue