The Swiss Army Knife of Vector Graphics Scripting – Scriptographer ported to JavaScript and the browser, using HTML5 Canvas. Created by @lehni & @puckey
I wrote a PaperJS script and it worked fine, but I'm looking to move it into RequireJS to make my app a little neater.
I have added the PaperJS library ath in my RequireJS config and it loads OK.
However, I'm struggling to convert my script to require. I am hooking tinot the onMouse events and I'm unsure how to port these over so they can still be used.
Below is my original PaperJS script.
var sessionId = <RANDOM_NUMBER>;
var paths = {};
function onMouseDown(event) {
startPath(event.point.x, event.point.y, colour, width, sessionId);
}
function onMouseDrag(event) {
continuePath(event.point.x, event.point.y, sessionId);
}
function onMouseUp(event) {
endPath(event.point.x, event.point.y, sessionId);
}
function startPath(x, y, colour, width, sessionId) {
paths[sessionId] = new Path();
paths[sessionId].strokeColor = colour;
paths[sessionId].strokeWidth = width;
paths[sessionId].strokeCap = 'round';
paths[sessionId].strokeJoin = 'round';
paths[sessionId].add({x: x, y: y});
}
function continuePath(x, y, sessionId) {
var path = paths[sessionId];
path.add({x: x, y: y});
}
function endPath(x, y, sessionId) {
var path = paths[sessionId];
path.add({x: x, y: y});
path.simplify(true);
delete paths[sessionId];
}
I wrote a PaperJS script and it worked fine, but I'm looking to move it into RequireJS to make my app a little neater.
I have added the PaperJS library ath in my RequireJS config and it loads OK.
However, I'm struggling to convert my script to require. I am hooking tinot the onMouse events and I'm unsure how to port these over so they can still be used.
Below is my original PaperJS script.