🚧 Linting and prettier code style
This commit is contained in:
parent
1f10829426
commit
568d0cdc4d
14 changed files with 3395 additions and 335 deletions
8
.eslintrc.js
Normal file
8
.eslintrc.js
Normal file
|
@ -0,0 +1,8 @@
|
|||
module.exports = {
|
||||
plugins: ["prettier"],
|
||||
rules: {
|
||||
"prettier/prettier": "error"
|
||||
},
|
||||
extends: "plugin:prettier/recommended",
|
||||
parser: "babel-eslint"
|
||||
};
|
3081
package-lock.json
generated
3081
package-lock.json
generated
File diff suppressed because it is too large
Load diff
20
package.json
20
package.json
|
@ -4,8 +4,11 @@
|
|||
"description": "A library for creating made-to-measure sewing patterns",
|
||||
"main": "src/index.js",
|
||||
"scripts": {
|
||||
"precommit": "npm run pretty && lint-staged",
|
||||
"test": "mocha -r ts-node/register tests/*.test.js",
|
||||
"clean": "rimraf dist",
|
||||
"pretty": "npx prettier --write \"src/*.js\"",
|
||||
"lint": "eslint --fix \"src/*.js\"",
|
||||
"browserbuild": "rollup -c rollup.browser.js",
|
||||
"nodebuild": "rollup -c rollup.node.js",
|
||||
"build": "npm run clean && npm run browserbuild && npm run nodebuild"
|
||||
|
@ -19,6 +22,17 @@
|
|||
"bugs": {
|
||||
"url": "https://github.com/joostdecock/freesewing/issues"
|
||||
},
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged"
|
||||
}
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.{js,json}": [
|
||||
"prettier --write",
|
||||
"git add"
|
||||
]
|
||||
},
|
||||
"homepage": "https://github.com/joostdecock/freesewing#readme",
|
||||
"dependencies": {
|
||||
"bezier-js": "^2.2.13",
|
||||
|
@ -26,7 +40,13 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.26.3",
|
||||
"babel-eslint": "^8.2.6",
|
||||
"chai": "^4.1.2",
|
||||
"eslint": "^5.2.0",
|
||||
"eslint-config-prettier": "^2.9.0",
|
||||
"eslint-plugin-prettier": "^2.6.2",
|
||||
"husky": "^0.14.3",
|
||||
"lint-staged": "^7.2.0",
|
||||
"mocha": "^5.2.0",
|
||||
"prettier": "^1.13.7",
|
||||
"rimraf": "^2.6.2",
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
function attributes (init = false)
|
||||
{
|
||||
if(init) {
|
||||
function attributes(init = false) {
|
||||
if (init) {
|
||||
for (let key in init) {
|
||||
let val = init[key];
|
||||
this.add(key, val);
|
||||
|
@ -10,48 +9,44 @@ function attributes (init = false)
|
|||
return this;
|
||||
|
||||
/** Adds an attribute */
|
||||
this.prototype.add = function (name, value)
|
||||
{
|
||||
if(typeof this.list[name] === 'undefined') {
|
||||
this.prototype.add = function(name, value) {
|
||||
if (typeof this.list[name] === "undefined") {
|
||||
this.list[name] = [];
|
||||
}
|
||||
this.list[name].push(value);
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Retrieves an attribute */
|
||||
this.prototype.get = function (name)
|
||||
{
|
||||
if(typeof this.list[name] === 'undefined') return false;
|
||||
else return this.list[name].join(' ');
|
||||
}
|
||||
this.prototype.get = function(name) {
|
||||
if (typeof this.list[name] === "undefined") return false;
|
||||
else return this.list[name].join(" ");
|
||||
};
|
||||
|
||||
/** Returns SVG code for attributes */
|
||||
this.prototype.render = function ()
|
||||
{
|
||||
let svg = '';
|
||||
this.prototype.render = function() {
|
||||
let svg = "";
|
||||
for (let key in this.list) {
|
||||
svg += ` ${key}="${this.list[key].join(' ')}"`;
|
||||
svg += ` ${key}="${this.list[key].join(" ")}"`;
|
||||
}
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for attributes with a fiven prefix
|
||||
* typically used for data-text*/
|
||||
this.prototype.renderIfPrefixIs = function (prefix = '')
|
||||
{
|
||||
let svg = '';
|
||||
this.prototype.renderIfPrefixIs = function(prefix = "") {
|
||||
let svg = "";
|
||||
let prefixLen = prefix.length;
|
||||
for (let key in this.list) {
|
||||
if(key.substr(0,prefixLen) === prefix) {
|
||||
svg += ` ${key.substr(prefixLen)}="${this.list[key].join(' ')}"`;
|
||||
if (key.substr(0, prefixLen) === prefix) {
|
||||
svg += ` ${key.substr(prefixLen)}="${this.list[key].join(" ")}"`;
|
||||
}
|
||||
}
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default attributes;
|
||||
|
|
21
src/hooks.js
21
src/hooks.js
|
@ -1,22 +1,19 @@
|
|||
export default function hooks ()
|
||||
{
|
||||
export default function hooks() {
|
||||
this._hooks = {};
|
||||
this.all = ['preRenderSvg', 'postRenderSvg', 'insertText'];
|
||||
this.all = ["preRenderSvg", "postRenderSvg", "insertText"];
|
||||
|
||||
this.prototype.list = function (hook)
|
||||
{
|
||||
if(typeof this._hooks[hook] === 'undefined') {
|
||||
this.prototype.list = function(hook) {
|
||||
if (typeof this._hooks[hook] === "undefined") {
|
||||
return false;
|
||||
}
|
||||
|
||||
return this._hooks[hook];
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.attach = function (hook, obj)
|
||||
{
|
||||
if(typeof this._hooks[hook] === 'undefined') return;
|
||||
for(let func of this._hooks[hook]) {
|
||||
this.prototype.attach = function(hook, obj) {
|
||||
if (typeof this._hooks[hook] === "undefined") return;
|
||||
for (let func of this._hooks[hook]) {
|
||||
obj.pre(hook, func);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
24
src/index.js
24
src/index.js
|
@ -1,14 +1,14 @@
|
|||
import pattern from './pattern'
|
||||
import point from './point'
|
||||
import path from './path'
|
||||
import snippet from './snippet'
|
||||
import * as utils from './utils'
|
||||
import pattern from "./pattern";
|
||||
import point from "./point";
|
||||
import path from "./path";
|
||||
import snippet from "./snippet";
|
||||
import * as utils from "./utils";
|
||||
|
||||
export default {
|
||||
version: require('../package.json').version
|
||||
, pattern
|
||||
, point
|
||||
, path
|
||||
, snippet
|
||||
, utils
|
||||
}
|
||||
version: require("../package.json").version,
|
||||
pattern,
|
||||
point,
|
||||
path,
|
||||
snippet,
|
||||
utils
|
||||
};
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
function option (config)
|
||||
{
|
||||
function option(config) {
|
||||
this.id = config.id;
|
||||
this.config = config;
|
||||
this.val = config.val;
|
||||
|
|
27
src/part.js
27
src/part.js
|
@ -1,35 +1,32 @@
|
|||
import { macroName } from './utils';
|
||||
import point from './point'
|
||||
import * as hooklib from 'hooks'
|
||||
import { macroName } from "./utils";
|
||||
import point from "./point";
|
||||
import * as hooklib from "hooks";
|
||||
|
||||
function part (id)
|
||||
{
|
||||
function part(id) {
|
||||
attributes = new Attributes();
|
||||
|
||||
this.points = {};
|
||||
this.paths = {};
|
||||
this.snippets = {};
|
||||
this.id = id;
|
||||
this.render = (id.substr(0,1) === '_') ? false : true;
|
||||
this.points.origin = new point(0,0);
|
||||
for(let k in hooklib) this[k] = hooklib[k];
|
||||
this.render = id.substr(0, 1) === "_" ? false : true;
|
||||
this.points.origin = new point(0, 0);
|
||||
for (let k in hooklib) this[k] = hooklib[k];
|
||||
|
||||
return this;
|
||||
|
||||
this.prototype.macroRunner = function (args)
|
||||
{
|
||||
this.prototype.macroRunner = function(args) {
|
||||
let self = this;
|
||||
let data = args;
|
||||
let method = function (key, data)
|
||||
{
|
||||
let method = function(key, data) {
|
||||
let macro = macroName(key);
|
||||
if(typeof self[macro] === 'function') {
|
||||
if (typeof self[macro] === "function") {
|
||||
self[macro](data);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return method;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default part;
|
||||
|
|
61
src/path.js
61
src/path.js
|
@ -1,67 +1,62 @@
|
|||
import attributes from './attributes'
|
||||
import attributes from "./attributes";
|
||||
|
||||
function path ()
|
||||
{
|
||||
function path() {
|
||||
this.render = true;
|
||||
this.attributes = new attributes();
|
||||
|
||||
/** Adds a move operation to Point to */
|
||||
this.prototype.move = function (to)
|
||||
{
|
||||
this.ops.push({type: "move", to});
|
||||
this.prototype.move = function(to) {
|
||||
this.ops.push({ type: "move", to });
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Adds a line operation to Point to */
|
||||
this.prototype.line = function (to)
|
||||
{
|
||||
this.ops.push({type: "line", to});
|
||||
this.prototype.line = function(to) {
|
||||
this.ops.push({ type: "line", to });
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Adds a line operation to Point to */
|
||||
this.prototype.curve = function (cp1, cp2, to)
|
||||
{
|
||||
this.ops.push({type: "curve", cp1, cp2, to});
|
||||
this.prototype.curve = function(cp1, cp2, to) {
|
||||
this.ops.push({ type: "curve", cp1, cp2, to });
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Adds a close operation */
|
||||
this.prototype.close = function ()
|
||||
{
|
||||
this.ops.push({type: "close"});
|
||||
this.prototype.close = function() {
|
||||
this.ops.push({ type: "close" });
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Adds an attribute. This is here to make this call chainable in assignment */
|
||||
this.prototype.attr = function (name, value)
|
||||
{
|
||||
this.prototype.attr = function(name, value) {
|
||||
this.attributes.add(name, value);
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG pathstring for this path */
|
||||
this.prototype.asPathstring = function ()
|
||||
{
|
||||
let d = '';
|
||||
for(let op of this.ops) {
|
||||
this.prototype.asPathstring = function() {
|
||||
let d = "";
|
||||
for (let op of this.ops) {
|
||||
switch (op.type) {
|
||||
case 'move':
|
||||
case "move":
|
||||
d += `M ${op.to.x},${op.to.y}`;
|
||||
break;
|
||||
case 'line':
|
||||
case "line":
|
||||
d += ` L ${op.to.x},${op.to.y}`;
|
||||
break;
|
||||
case 'curve':
|
||||
d += ` C ${op.cp1.x},${op.cp1.y} ${op.cp2.x},${op.cp2.y} ${op.to.x},${op.to.y}`;
|
||||
case "curve":
|
||||
d += ` C ${op.cp1.x},${op.cp1.y} ${op.cp2.x},${op.cp2.y} ${op.to.x},${
|
||||
op.to.y
|
||||
}`;
|
||||
break;
|
||||
case 'close':
|
||||
d += ' z';
|
||||
case "close":
|
||||
d += " z";
|
||||
break;
|
||||
default:
|
||||
throw `${op.type} is not a valid path command`;
|
||||
|
@ -70,7 +65,7 @@ function path ()
|
|||
}
|
||||
|
||||
return d;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default path;
|
||||
|
|
|
@ -1,21 +1,24 @@
|
|||
import { macroName } from './utils';
|
||||
import part from './part'
|
||||
import svg from './svg'
|
||||
import hooks from './hooks'
|
||||
import { macroName } from "./utils";
|
||||
import part from "./part";
|
||||
import svg from "./svg";
|
||||
import hooks from "./hooks";
|
||||
|
||||
export default function pattern (config = false)
|
||||
{
|
||||
export default function pattern(config = false) {
|
||||
// Allow no-config patterns
|
||||
if(!config) {
|
||||
if (!config) {
|
||||
this.config = {
|
||||
parts: ['part'],
|
||||
parts: ["part"],
|
||||
measurements: {},
|
||||
options: {}
|
||||
}
|
||||
};
|
||||
} else {
|
||||
this.config = config;
|
||||
}
|
||||
if(typeof config.parts === 'undefined' || !config.parts || config.parts.length < 1) {
|
||||
if (
|
||||
typeof config.parts === "undefined" ||
|
||||
!config.parts ||
|
||||
config.parts.length < 1
|
||||
) {
|
||||
throw "Could not create pattern: You should define at least one part in your pattern config";
|
||||
}
|
||||
|
||||
|
@ -35,9 +38,9 @@ export default function pattern (config = false)
|
|||
this.parts[id] = new part(id);
|
||||
}
|
||||
this.options = {};
|
||||
if(typeof config.options !== 'undefined' && config.options.length > 0) {
|
||||
if (typeof config.options !== "undefined" && config.options.length > 0) {
|
||||
for (let conf of config.options) {
|
||||
if(conf.type === 'percentage') this.options[conf.id] = conf.val/100;
|
||||
if (conf.type === "percentage") this.options[conf.id] = conf.val / 100;
|
||||
else this.options[conf.id] = conf.val;
|
||||
}
|
||||
}
|
||||
|
@ -48,69 +51,65 @@ export default function pattern (config = false)
|
|||
options: this.options,
|
||||
values: this.values,
|
||||
config: this.config
|
||||
}
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
/**
|
||||
* @throws Will throw an error when called
|
||||
*/
|
||||
this.prototype.draft = function ()
|
||||
{
|
||||
throw Error('You have to implement the draft() method in your Pattern instance.');
|
||||
}
|
||||
this.prototype.draft = function() {
|
||||
throw Error(
|
||||
"You have to implement the draft() method in your Pattern instance."
|
||||
);
|
||||
};
|
||||
|
||||
this.prototype.render = function()
|
||||
{
|
||||
this.hooks.attach('preRenderSvg', this.svg);
|
||||
this.hooks.attach('postRenderSvg', this.svg);
|
||||
this.prototype.render = function() {
|
||||
this.hooks.attach("preRenderSvg", this.svg);
|
||||
this.hooks.attach("postRenderSvg", this.svg);
|
||||
//this.hooks.attach('insertText', this.svg);
|
||||
|
||||
return this.svg.render(this);
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.on = function (hook, method)
|
||||
{
|
||||
if(typeof this.hooks._hooks[hook] === 'undefined') {
|
||||
this.prototype.on = function(hook, method) {
|
||||
if (typeof this.hooks._hooks[hook] === "undefined") {
|
||||
this.hooks._hooks[hook] = [];
|
||||
}
|
||||
this.hooks._hooks[hook].push(method);
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.macro = function (key, method)
|
||||
{
|
||||
this.prototype.macro = function(key, method) {
|
||||
let name = macroName(key);
|
||||
this.on(name, method);
|
||||
for(let partId in this.parts) {
|
||||
for (let partId in this.parts) {
|
||||
let part = this.parts[partId];
|
||||
part[name] = () => null;
|
||||
this.hooks.attach(name, part);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.withPlugin(plugin)
|
||||
this.prototype.withPlugin(plugin);
|
||||
{
|
||||
if(plugin.hooks) this.loadPluginHooks(plugin);
|
||||
if(plugin.macros) this.loadPluginMacros(plugin);
|
||||
if (plugin.hooks) this.loadPluginHooks(plugin);
|
||||
if (plugin.macros) this.loadPluginMacros(plugin);
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
this.prototype.loadPluginHooks = function (plugin)
|
||||
{
|
||||
for(let hook of this.hooks.all) {
|
||||
if(typeof plugin.hooks[hook] === 'function') {
|
||||
this.prototype.loadPluginHooks = function(plugin) {
|
||||
for (let hook of this.hooks.all) {
|
||||
if (typeof plugin.hooks[hook] === "function") {
|
||||
this.on(hook, plugin.hooks[hook]);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.loadPluginMacros = function (plugin)
|
||||
{
|
||||
for(let macro in plugin.macros) {
|
||||
if(typeof plugin.macros[macro] === 'function') {
|
||||
this.prototype.loadPluginMacros = function(plugin) {
|
||||
for (let macro in plugin.macros) {
|
||||
if (typeof plugin.macros[macro] === "function") {
|
||||
this.macro(macro, plugin.macros[macro]);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
94
src/point.js
94
src/point.js
|
@ -1,7 +1,6 @@
|
|||
import attributes from './attributes'
|
||||
import attributes from "./attributes";
|
||||
|
||||
function point (x, y)
|
||||
{
|
||||
function point(x, y) {
|
||||
this.x = this.round(x);
|
||||
this.y = this.round(y);
|
||||
this.attributes = new attributes();
|
||||
|
@ -9,128 +8,111 @@ function point (x, y)
|
|||
return this;
|
||||
|
||||
/** Rounds a value to PRECISION */
|
||||
this.prototype.round = function (value)
|
||||
{
|
||||
this.prototype.round = function(value) {
|
||||
return Math.round(value * 1e2) / 1e2;
|
||||
}
|
||||
};
|
||||
|
||||
/** Radians to degrees */
|
||||
this.prototype.rad2deg = function (radians)
|
||||
{
|
||||
this.prototype.rad2deg = function(radians) {
|
||||
return radians * 57.29577951308232;
|
||||
}
|
||||
};
|
||||
|
||||
/** Degrees to radians */
|
||||
this.prototype.deg2rad (degrees)
|
||||
this.prototype.deg2rad(degrees);
|
||||
{
|
||||
return degrees / 57.29577951308232;
|
||||
}
|
||||
|
||||
/** Adds an attribute. This is here to make this call chainable in assignment */
|
||||
this.prototype.attr = function (name, value)
|
||||
{
|
||||
this.prototype.attr = function(name, value) {
|
||||
this.attributes.add(name, value);
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns the distance between this point and that point */
|
||||
this.prototype.dist = function (that)
|
||||
{
|
||||
this.prototype.dist = function(that) {
|
||||
let dx = this.x - that.x;
|
||||
let dy = this.y - that.y;
|
||||
|
||||
return this.round(Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2)));
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns slope of a line made by this point and that point */
|
||||
this.prototype.slope = function (that)
|
||||
{
|
||||
this.prototype.slope = function(that) {
|
||||
return (that.y - this.y) / (that.x - this.x);
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns the x-delta between this point and that point */
|
||||
this.prototype.dx = function (that)
|
||||
{
|
||||
this.prototype.dx = function(that) {
|
||||
return that.x - this.x;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns the y-delta between this point and that point */
|
||||
this.prototype.dy = function (that)
|
||||
{
|
||||
this.prototype.dy = function(that) {
|
||||
return that.y - this.y;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns the angle between this point and that point */
|
||||
this.prototype.angle = function (that)
|
||||
{
|
||||
this.prototype.angle = function(that) {
|
||||
let rad = Math.atan2(-1 * this.dy(that), this.dx(that));
|
||||
while (rad < 0) rad += 2 * Math.PI;
|
||||
|
||||
return this.rad2deg(rad);
|
||||
}
|
||||
};
|
||||
|
||||
/** Rotate this point deg around that point */
|
||||
this.prototype.rotate = function (deg, that)
|
||||
{
|
||||
this.prototype.rotate = function(deg, that) {
|
||||
let radius = this.dist(that);
|
||||
let angle = this.angle(that);
|
||||
let x = that.x + radius * Math.cos(this.deg2rad(angle + deg)) * -1;
|
||||
let y = that.y + radius * Math.sin(this.deg2rad(angle + deg));
|
||||
|
||||
return new Point(x, y);
|
||||
}
|
||||
};
|
||||
|
||||
/** returns an identical copy of this point */
|
||||
this.prototype.copy = function ()
|
||||
{
|
||||
this.prototype.copy = function() {
|
||||
return new Point(this.x, this.y);
|
||||
}
|
||||
};
|
||||
|
||||
/** checks whether this point is equal to that point */
|
||||
this.prototype.equals = function (that)
|
||||
{
|
||||
return (this.x === that.x && this.y === that.y) ? true : false;
|
||||
}
|
||||
this.prototype.equals = function(that) {
|
||||
return this.x === that.x && this.y === that.y ? true : false;
|
||||
};
|
||||
|
||||
/** Mirrors this point around X value of that point */
|
||||
this.prototype.flipX = function (that)
|
||||
{
|
||||
this.prototype.flipX = function(that) {
|
||||
return new Point(that.x + this.dx(that), that.y);
|
||||
}
|
||||
};
|
||||
|
||||
/** Mirrors this point around Y value of that point */
|
||||
this.prototype.flipY = function (that)
|
||||
{
|
||||
this.prototype.flipY = function(that) {
|
||||
return new Point(that.x, that.y + this.dy(that));
|
||||
}
|
||||
};
|
||||
|
||||
/** Shifts this point distance in the deg direction */
|
||||
this.prototype.shift = function (deg, distance)
|
||||
{
|
||||
this.prototype.shift = function(deg, distance) {
|
||||
let p = this.copy();
|
||||
p.x += distance;
|
||||
|
||||
return p.rotate(deg, this);
|
||||
}
|
||||
};
|
||||
|
||||
/** Shifts this point distance in the direction of that point */
|
||||
this.prototype.shiftTowards = function (that, distance)
|
||||
{
|
||||
this.prototype.shiftTowards = function(that, distance) {
|
||||
return this.shift(this.angle(that), distance);
|
||||
}
|
||||
};
|
||||
|
||||
/** Shifts this point fraction of the distance towards that point */
|
||||
this.prototype.shiftFractionTowards = function (that, fraction)
|
||||
{
|
||||
this.prototype.shiftFractionTowards = function(that, fraction) {
|
||||
return this.shiftTowards(that, this.dist(that) * fraction);
|
||||
}
|
||||
};
|
||||
|
||||
/** Shifts this point distance beyond that point */
|
||||
this.prototype.shiftOutwards = function (that, distance)
|
||||
{
|
||||
this.prototype.shiftOutwards = function(that, distance) {
|
||||
return this.shiftTowards(that, this.dist(that) + distance);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default point;
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
import attributes from './attributes'
|
||||
import attributes from "./attributes";
|
||||
|
||||
function snippet (def, anchor, description = '')
|
||||
{
|
||||
function snippet(def, anchor, description = "") {
|
||||
this.def = def;
|
||||
this.anchor = anchor;
|
||||
this.description = description;
|
||||
|
|
207
src/svg.js
207
src/svg.js
|
@ -1,15 +1,14 @@
|
|||
import attributes from './attributes'
|
||||
import * as hooklib from 'hooks'
|
||||
import hooks from './hooks'
|
||||
import attributes from "./attributes";
|
||||
import * as hooklib from "hooks";
|
||||
import hooks from "./hooks";
|
||||
|
||||
function svg (pattern)
|
||||
{
|
||||
this.body = '';
|
||||
this.style = '';
|
||||
this.script = '';
|
||||
this.header = '';
|
||||
this.footer = '';
|
||||
this.defs = '';
|
||||
function svg(pattern) {
|
||||
this.body = "";
|
||||
this.style = "";
|
||||
this.script = "";
|
||||
this.header = "";
|
||||
this.footer = "";
|
||||
this.defs = "";
|
||||
this.pattern = pattern; // Needed to expose pattern to hooks
|
||||
this.prefix = '<?xml version="1.0" encoding="UTF-8" standalone="no"?>';
|
||||
this.attributes = new attributes();
|
||||
|
@ -17,8 +16,8 @@ function svg (pattern)
|
|||
this.attributes.add("xmlns:svg", "http://www.w3.org/2000/svg");
|
||||
this.attributes.add("xmlns:xlink", "http://www.w3.org/1999/xlink");
|
||||
this.hooks = hooks.all;
|
||||
for(let k in hooklib) this[k] = hooklib[k];
|
||||
for(let k in this.hooks) this.hook(k, this[k]);
|
||||
for (let k in hooklib) this[k] = hooklib[k];
|
||||
for (let k in this.hooks) this.hook(k, this[k]);
|
||||
|
||||
return this;
|
||||
|
||||
|
@ -32,8 +31,7 @@ function svg (pattern)
|
|||
this.prototype.insertText = function() {};
|
||||
|
||||
/** Renders a draft object as SVG */
|
||||
this.prototype.render = function (pattern)
|
||||
{
|
||||
this.prototype.render = function(pattern) {
|
||||
this.preRenderSvg();
|
||||
this.svg = this.prefix;
|
||||
this.svg += this.renderComments(this.header);
|
||||
|
@ -41,7 +39,7 @@ function svg (pattern)
|
|||
this.svg += this.renderStyle();
|
||||
this.svg += this.renderScript();
|
||||
this.svg += this.renderDefs();
|
||||
this.svg += this.openGroup('draftContainer');
|
||||
this.svg += this.openGroup("draftContainer");
|
||||
for (let partId in pattern.parts) {
|
||||
let part = pattern.parts[partId];
|
||||
if (part.render) {
|
||||
|
@ -51,75 +49,72 @@ function svg (pattern)
|
|||
}
|
||||
}
|
||||
this.svg += this.closeGroup();
|
||||
this.svg += this.nl()+'</svg>';
|
||||
this.svg += this.nl() + "</svg>";
|
||||
this.svg += this.renderComments(this.footer);
|
||||
this.postRenderSvg();
|
||||
return this.svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for the opening SVG tag */
|
||||
this.prototype.renderSvgTag = funtion (pattern)
|
||||
this.prototype.renderSvgTag = funtion(pattern);
|
||||
{
|
||||
let svg = '<svg';
|
||||
let svg = "<svg";
|
||||
this.indent();
|
||||
svg += this.nl()+this.attributes.render();
|
||||
svg += this.nl() + this.attributes.render();
|
||||
this.outdent();
|
||||
svg += this.nl()+'>'+this.nl();
|
||||
svg += this.nl() + ">" + this.nl();
|
||||
|
||||
return svg;
|
||||
}
|
||||
|
||||
/** Returns SVG code for the style block */
|
||||
this.prototype.renderStyle = function ()
|
||||
{
|
||||
this.prototype.renderStyle = function() {
|
||||
let svg = '<style type="text/css"> <![CDATA[ ';
|
||||
this.indent();
|
||||
svg += this.nl()+this.style;
|
||||
svg += this.nl() + this.style;
|
||||
this.outdent();
|
||||
svg += this.nl()+']]>'+this.nl()+'</style>'+this.nl();
|
||||
svg += this.nl() + "]]>" + this.nl() + "</style>" + this.nl();
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for the script block */
|
||||
this.prototype.renderScript = function ()
|
||||
{
|
||||
this.prototype.renderScript = function() {
|
||||
let svg = '<script type="text/javascript"> <![CDATA[';
|
||||
this.indent();
|
||||
svg += this.nl()+this.script;
|
||||
svg += this.nl() + this.script;
|
||||
this.outdent();
|
||||
svg += this.nl()+']]>'+this.nl()+'</script>'+this.nl();
|
||||
svg += this.nl() + "]]>" + this.nl() + "</script>" + this.nl();
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for the defs block */
|
||||
this.prototype.renderDefs = function ()
|
||||
{
|
||||
this.prototype.renderDefs = function() {
|
||||
let svg = '<defs id="defs">';
|
||||
this.indent();
|
||||
svg += this.nl()+this.defs;
|
||||
svg += this.nl() + this.defs;
|
||||
this.outdent();
|
||||
svg += this.nl()+'</defs>'+this.nl();
|
||||
svg += this.nl() + "</defs>" + this.nl();
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for a comment block */
|
||||
this.prototype.renderComments = function (comments)
|
||||
{
|
||||
return this.nl()+this.nl()+'<!--'+this.nl()+comments+this.nl()+'-->';
|
||||
}
|
||||
this.prototype.renderComments = function(comments) {
|
||||
return (
|
||||
this.nl() + this.nl() + "<!--" + this.nl() + comments + this.nl() + "-->"
|
||||
);
|
||||
};
|
||||
|
||||
/** Returns SVG code for a Part object */
|
||||
this.prototype.renderPart = function (part)
|
||||
{
|
||||
let svg = '';
|
||||
this.prototype.renderPart = function(part) {
|
||||
let svg = "";
|
||||
for (let key in part.paths) {
|
||||
let path = part.paths[key];
|
||||
if(path.render) svg += this.renderPath(path);
|
||||
if (path.render) svg += this.renderPath(path);
|
||||
}
|
||||
for (let key in part.points) {
|
||||
if(part.points[key].attributes.get('data-text')) {
|
||||
if (part.points[key].attributes.get("data-text")) {
|
||||
svg += this.renderPoint(part.points[key]);
|
||||
}
|
||||
}
|
||||
|
@ -129,75 +124,75 @@ function svg (pattern)
|
|||
}
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for a Point object */
|
||||
this.prototype.renderPoint = function (point)
|
||||
{
|
||||
let svg = ''
|
||||
if(point.attributes.get('data-text')) svg += this.renderText(point);
|
||||
this.prototype.renderPoint = function(point) {
|
||||
let svg = "";
|
||||
if (point.attributes.get("data-text")) svg += this.renderText(point);
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for a Path object */
|
||||
this.prototype.renderPath = function (path)
|
||||
{
|
||||
if(!path.attributes.get('id')) path.attributes.add('id', this.getUid());
|
||||
path.attributes.add('d', path.asPathstring());
|
||||
this.prototype.renderPath = function(path) {
|
||||
if (!path.attributes.get("id")) path.attributes.add("id", this.getUid());
|
||||
path.attributes.add("d", path.asPathstring());
|
||||
|
||||
return `${this.nl()}<path ${path.attributes.render()} />${this.renderPathText(path)}`;
|
||||
}
|
||||
return `${this.nl()}<path ${path.attributes.render()} />${this.renderPathText(
|
||||
path
|
||||
)}`;
|
||||
};
|
||||
|
||||
this.prototype.renderPathText = function (path)
|
||||
{
|
||||
let text = path.attributes.get('data-text');
|
||||
if(!text) return false;
|
||||
let attributes = path.attributes.renderIfPrefixIs('data-text-');
|
||||
let svg = this.nl()+'<text>';
|
||||
this.prototype.renderPathText = function(path) {
|
||||
let text = path.attributes.get("data-text");
|
||||
if (!text) return false;
|
||||
let attributes = path.attributes.renderIfPrefixIs("data-text-");
|
||||
let svg = this.nl() + "<text>";
|
||||
this.indent();
|
||||
svg += `<textPath xlink:href="#${path.attributes.get('id')}" startOffset="50%"><tspan ${attributes}>${text}</tspan></textPath>`;
|
||||
svg += `<textPath xlink:href="#${path.attributes.get(
|
||||
"id"
|
||||
)}" startOffset="50%"><tspan ${attributes}>${text}</tspan></textPath>`;
|
||||
this.outdent();
|
||||
svg += this.nl()+'</text>';
|
||||
svg += this.nl() + "</text>";
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
this.prototype.renderText = function (point)
|
||||
{
|
||||
let text = point.attributes.get('data-text');
|
||||
if(!text) return false;
|
||||
this.prototype.renderText = function(point) {
|
||||
let text = point.attributes.get("data-text");
|
||||
if (!text) return false;
|
||||
|
||||
point.attributes.add('data-text-x', point.x);
|
||||
point.attributes.add('data-text-y', point.y);
|
||||
let attributes = point.attributes.renderIfPrefixIs('data-text-');
|
||||
let svg = `${this.nl()}<text ${point.attributes.renderIfPrefixIs('data-text-')}>`;
|
||||
point.attributes.add("data-text-x", point.x);
|
||||
point.attributes.add("data-text-y", point.y);
|
||||
let attributes = point.attributes.renderIfPrefixIs("data-text-");
|
||||
let svg = `${this.nl()}<text ${point.attributes.renderIfPrefixIs(
|
||||
"data-text-"
|
||||
)}>`;
|
||||
this.indent();
|
||||
svg += `<tspan>${text}</tspan>`;
|
||||
this.outdent();
|
||||
svg += this.nl()+'</text>';
|
||||
svg += this.nl() + "</text>";
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code for a snippet */
|
||||
this.prototype.renderSnippet = function (snippet)
|
||||
{
|
||||
this.prototype.renderSnippet = function(snippet) {
|
||||
let svg = this.nl();
|
||||
svg += `<use x="${snippet.anchor.x}" y="${snippet.anchor.y}" `
|
||||
svg += `<use x="${snippet.anchor.x}" y="${snippet.anchor.y}" `;
|
||||
svg += `xlink:href="#${snippet.def}" ${snippet.attributes.render()}>`;
|
||||
if(snippet.description) {
|
||||
if (snippet.description) {
|
||||
svg += `<title>${snippet.description}</title>`;
|
||||
}
|
||||
svg += '</use>';
|
||||
svg += "</use>";
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code to open a group */
|
||||
this.prototype.openGroup = function (id)
|
||||
{
|
||||
let svg = this.nl()+this.nl();
|
||||
this.prototype.openGroup = function(id) {
|
||||
let svg = this.nl() + this.nl();
|
||||
svg += `<!-- Start of group #${id} -->`;
|
||||
svg += this.nl();
|
||||
svg += `<g id="${id}">`;
|
||||
|
@ -205,52 +200,46 @@ function svg (pattern)
|
|||
this.openGroups.push(id);
|
||||
|
||||
return svg;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns SVG code to close a group */
|
||||
this.prototype.closeGroup = function ()
|
||||
{
|
||||
this.prototype.closeGroup = function() {
|
||||
this.outdent();
|
||||
|
||||
return `${this.nl()}</g>${this.nl()}<!-- end of group #${this.openGroups.pop()} -->`;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns a linebreak + identation */
|
||||
this.prototype.nl = function ()
|
||||
{
|
||||
return "\n"+this.tab();
|
||||
}
|
||||
this.prototype.nl = function() {
|
||||
return "\n" + this.tab();
|
||||
};
|
||||
|
||||
/** Returns indentation */
|
||||
this.prototype.tab = function ()
|
||||
{
|
||||
let space = '';
|
||||
this.prototype.tab = function() {
|
||||
let space = "";
|
||||
for (let i = 0; i < this.tabs; i++) {
|
||||
space += ' ';
|
||||
space += " ";
|
||||
}
|
||||
|
||||
return space;
|
||||
}
|
||||
};
|
||||
|
||||
/** Increases indentation by 1 */
|
||||
this.prototype.indent = function ()
|
||||
{
|
||||
this.prototype.indent = function() {
|
||||
this.tabs += 1;
|
||||
}
|
||||
};
|
||||
|
||||
/** Decreases indentation by 1 */
|
||||
this.prototype.outdent = function ()
|
||||
{
|
||||
this.prototype.outdent = function() {
|
||||
this.tabs -= 1;
|
||||
}
|
||||
};
|
||||
|
||||
/** Returns an unused ID */
|
||||
this.prototype.getUid = function ()
|
||||
{
|
||||
this.prototype.getUid = function() {
|
||||
this.freeId += 1;
|
||||
|
||||
return ''+this.freeId;
|
||||
}
|
||||
return "" + this.freeId;
|
||||
};
|
||||
}
|
||||
|
||||
export default svg;
|
||||
|
|
51
src/utils.js
51
src/utils.js
|
@ -1,35 +1,37 @@
|
|||
import point from './point'
|
||||
import point from "./point";
|
||||
|
||||
/** Returns internal hook name for a macro */
|
||||
export function macroName (name)
|
||||
{
|
||||
export function macroName(name) {
|
||||
return `_macro_${name}`;
|
||||
}
|
||||
|
||||
/** Find intersection of two (endless) lines */
|
||||
export function beamsCross (a1, a2, b1, b2)
|
||||
{
|
||||
export function beamsCross(a1, a2, b1, b2) {
|
||||
let slopeA = a1.slope(a2);
|
||||
let slopeB = b1.slope(b2);
|
||||
if(slopeA === slopeB) return false; // Parallel lines
|
||||
if (slopeA === slopeB) return false; // Parallel lines
|
||||
|
||||
if(a1.x === a2.x) return new point(a1.x, slopeB * a1.x + (b1.y - (slopeB * b1.x))); // Vertical line A
|
||||
else if(b1.x === b2.x) return new point(b1.x, slopeA * b1.x + (a1.y - (slopeA * a1.x))); // Vertical line B
|
||||
if (a1.x === a2.x)
|
||||
return new point(a1.x, slopeB * a1.x + (b1.y - slopeB * b1.x));
|
||||
// Vertical line A
|
||||
else if (b1.x === b2.x)
|
||||
return new point(b1.x, slopeA * b1.x + (a1.y - slopeA * a1.x));
|
||||
// Vertical line B
|
||||
else {
|
||||
// Swap points if line A or B goes from right to left
|
||||
if(a1.x > a2.x) {
|
||||
if (a1.x > a2.x) {
|
||||
let tmp = a1.copy();
|
||||
a1 = a2.copy();
|
||||
a2 = tmp;
|
||||
}
|
||||
if(b1.x > b2.x) {
|
||||
if (b1.x > b2.x) {
|
||||
let tmp = b1.copy();
|
||||
b1 = b2.copy();
|
||||
b2 = tmp;
|
||||
}
|
||||
// Find y intercept
|
||||
let iA = a1.y - (slopeA * a1.x);
|
||||
let iB = b1.y - (slopeB * b1.x);
|
||||
let iA = a1.y - slopeA * a1.x;
|
||||
let iB = b1.y - slopeB * b1.x;
|
||||
|
||||
// Find intersection
|
||||
let x = (iB - iA) / (slopeA - slopeB);
|
||||
|
@ -40,10 +42,9 @@ export function beamsCross (a1, a2, b1, b2)
|
|||
}
|
||||
|
||||
/** Find intersection of two line segments */
|
||||
export function linesCross (a1, a2, b1, b2)
|
||||
{
|
||||
let p = beamsCross(a1,a2,b1,b2);
|
||||
if(p) {
|
||||
export function linesCross(a1, a2, b1, b2) {
|
||||
let p = beamsCross(a1, a2, b1, b2);
|
||||
if (p) {
|
||||
let lenA = a1.dist(a2);
|
||||
let lenB = b1.dist(b2);
|
||||
let lenC = a1.dist(p) + p.dist(a2);
|
||||
|
@ -54,20 +55,18 @@ export function linesCross (a1, a2, b1, b2)
|
|||
}
|
||||
|
||||
/** Find where an (endless) line crosses a certain Y-value */
|
||||
export function beamCrossesY (from, to, y)
|
||||
{
|
||||
if(from.y === to.y) return false; // Horizontal line
|
||||
let left = new point(-10,y);
|
||||
let right = new point(10,y);
|
||||
export function beamCrossesY(from, to, y) {
|
||||
if (from.y === to.y) return false; // Horizontal line
|
||||
let left = new point(-10, y);
|
||||
let right = new point(10, y);
|
||||
|
||||
return beamsCross(from, to, left, right);
|
||||
}
|
||||
|
||||
/** Returns an object with shorthand access for pattern design */
|
||||
export function shorthand(part, context)
|
||||
{
|
||||
let final = (context.settings.mode === 'draft') ? true : false;
|
||||
let paperless = (context.settings.paperless === true) ? true : false;
|
||||
export function shorthand(part, context) {
|
||||
let final = context.settings.mode === "draft" ? true : false;
|
||||
let paperless = context.settings.paperless === true ? true : false;
|
||||
return {
|
||||
measurements: context.settings.measurements || {},
|
||||
options: context.options || {},
|
||||
|
@ -78,5 +77,5 @@ export function shorthand(part, context)
|
|||
macro: part.macroRunner(),
|
||||
final,
|
||||
paperless
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue