🚧 Fixing prototype issues

package.json

@@ -51,6 +51,7 @@
     "mocha": "^5.2.0",
     "prettier": "^1.13.7",
     "rimraf": "^2.6.2",
+    "rollup": "0.63.4",
     "rollup-plugin-babel": "^3.0.7",
     "rollup-plugin-commonjs": "^9.1.3",
     "rollup-plugin-filesize": "^4.0.1",

src/attributes.js

@@ -1,13 +1,15 @@
 function attributes(init = false) {
+  this.list = {};
   if (init) {
     for (let key in init) {
       let val = init[key];
       this.add(key, val);
     }
   }
+}
 
 /** Adds an attribute */
-  this.prototype.add = function(name, value) {
+attributes.prototype.add = function(name, value) {
   if (typeof this.list[name] === "undefined") {
     this.list[name] = [];
   }
@@ -17,13 +19,13 @@ function attributes(init = false) {
 };
 
 /** Retrieves an attribute */
-  this.prototype.get = function(name) {
+attributes.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() {
+attributes.prototype.render = function() {
   let svg = "";
   for (let key in this.list) {
     svg += ` ${key}="${this.list[key].join(" ")}"`;
@@ -34,7 +36,7 @@ function attributes(init = false) {
 
 /** Returns SVG code for attributes with a fiven prefix
  * typically used for data-text*/
-  this.prototype.renderIfPrefixIs = function(prefix = "") {
+attributes.prototype.renderIfPrefixIs = function(prefix = "") {
   let svg = "";
   let prefixLen = prefix.length;
   for (let key in this.list) {
@@ -46,7 +48,4 @@ function attributes(init = false) {
   return svg;
 };
 
-  return this;
-}
-
 export default attributes;

src/hooks.js

@@ -1,8 +1,9 @@
 export default function hooks() {
   this._hooks = {};
   this.all = ["preRenderSvg", "postRenderSvg", "insertText"];
+}
 
-  this.prototype.list = function(hook) {
+hooks.prototype.list = function(hook) {
   if (typeof this._hooks[hook] === "undefined") {
     return false;
   }
@@ -10,10 +11,9 @@ export default function hooks() {
   return this._hooks[hook];
 };
 
-  this.prototype.attach = function(hook, obj) {
+hooks.prototype.attach = function(hook, obj) {
   if (typeof this._hooks[hook] === "undefined") return;
   for (let func of this._hooks[hook]) {
     obj.pre(hook, func);
   }
 };
-}

src/part.js

@@ -1,9 +1,10 @@
 import { macroName } from "./utils";
 import point from "./point";
+import attributes from "./attributes";
 import * as hooklib from "hooks";
 
 function part(id) {
-  this.attributes = new Attributes();
+  this.attributes = new attributes();
   this.points = {};
   this.paths = {};
   this.snippets = {};
@@ -12,7 +13,10 @@ function part(id) {
   this.points.origin = new point(0, 0);
   for (let k in hooklib) this[k] = hooklib[k];
 
-  this.prototype.macroRunner = function(args) {
+  return this;
+}
+
+part.prototype.macroRunner = function(args) {
   let self = this;
   let data = args;
   let method = function(key, data) {
@@ -25,7 +29,4 @@ function part(id) {
   return method;
 };
 
-  return this;
-}
-
 export default part;

src/path.js

@@ -3,44 +3,45 @@ import attributes from "./attributes";
 function path() {
   this.render = true;
   this.attributes = new attributes();
+}
 
 /** Adds a move operation to Point to */
-  this.prototype.move = function(to) {
+path.prototype.move = function(to) {
   this.ops.push({ type: "move", to });
 
   return this;
 };
 
 /** Adds a line operation to Point to */
-  this.prototype.line = function(to) {
+path.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) {
+path.prototype.curve = function(cp1, cp2, to) {
   this.ops.push({ type: "curve", cp1, cp2, to });
 
   return this;
 };
 
 /** Adds a close operation */
-  this.prototype.close = function() {
+path.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) {
+path.prototype.attr = function(name, value) {
   this.attributes.add(name, value);
 
   return this;
 };
 
 /** Returns SVG pathstring for this path */
-  this.prototype.asPathstring = function() {
+path.prototype.asPathstring = function() {
   let d = "";
   for (let op of this.ops) {
     switch (op.type) {
@@ -67,7 +68,4 @@ function path() {
   return d;
 };
 
-  return this;
-}
-
 export default path;

src/pattern.js

@@ -1,5 +1,8 @@
 import { macroName } from "./utils";
 import part from "./part";
+import point from "./point";
+import path from "./path";
+import snippet from "./snippet";
 import svg from "./svg";
 import hooks from "./hooks";
 
@@ -52,17 +55,18 @@ export default function pattern(config = false) {
     values: this.values,
     config: this.config
   };
+}
 
 /**
  * @throws Will throw an error when called
  */
-  this.prototype.draft = function() {
+pattern.prototype.draft = function() {
   throw Error(
     "You have to implement the draft() method in your Pattern instance."
   );
 };
 
-  this.prototype.render = function() {
+pattern.prototype.render = function() {
   this.hooks.attach("preRenderSvg", this.svg);
   this.hooks.attach("postRenderSvg", this.svg);
   //this.hooks.attach('insertText', this.svg);
@@ -70,14 +74,14 @@ export default function pattern(config = false) {
   return this.svg.render(this);
 };
 
-  this.prototype.on = function(hook, method) {
+pattern.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) {
+pattern.prototype.macro = function(key, method) {
   let name = macroName(key);
   this.on(name, method);
   for (let partId in this.parts) {
@@ -87,15 +91,14 @@ export default function pattern(config = false) {
   }
 };
 
-  this.prototype.withPlugin(plugin);
+pattern.prototype.withPlugin = function(plugin) {
-  {
   if (plugin.hooks) this.loadPluginHooks(plugin);
   if (plugin.macros) this.loadPluginMacros(plugin);
 
   return this;
-  }
+};
 
-  this.prototype.loadPluginHooks = function(plugin) {
+pattern.prototype.loadPluginHooks = function(plugin) {
   for (let hook of this.hooks.all) {
     if (typeof plugin.hooks[hook] === "function") {
       this.on(hook, plugin.hooks[hook]);
@@ -103,13 +106,10 @@ export default function pattern(config = false) {
   }
 };
 
-  this.prototype.loadPluginMacros = function(plugin) {
+pattern.prototype.loadPluginMacros = function(plugin) {
   for (let macro in plugin.macros) {
     if (typeof plugin.macros[macro] === "function") {
       this.macro(macro, plugin.macros[macro]);
     }
   }
 };
-
-  return this;
-}

src/point.js

@@ -4,32 +4,32 @@ function point(x, y) {
   this.x = this.round(x);
   this.y = this.round(y);
   this.attributes = new attributes();
+}
 
 /** Rounds a value to PRECISION */
-  this.prototype.round = function(value) {
+point.prototype.round = function(value) {
   return Math.round(value * 1e2) / 1e2;
 };
 
 /** Radians to degrees */
-  this.prototype.rad2deg = function(radians) {
+point.prototype.rad2deg = function(radians) {
   return radians * 57.29577951308232;
 };
 
 /** Degrees to radians */
-  this.prototype.deg2rad(degrees);
+point.prototype.deg2rad = function(degrees) {
-  {
   return degrees / 57.29577951308232;
-  }
+};
 
 /** Adds an attribute. This is here to make this call chainable in assignment */
-  this.prototype.attr = function(name, value) {
+point.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) {
+point.prototype.dist = function(that) {
   let dx = this.x - that.x;
   let dy = this.y - that.y;
 
@@ -37,22 +37,22 @@ function point(x, y) {
 };
 
 /** Returns slope of a line made by this point and that point */
-  this.prototype.slope = function(that) {
+point.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) {
+point.prototype.dx = function(that) {
   return that.x - this.x;
 };
 
 /** Returns the y-delta between this point and that point */
-  this.prototype.dy = function(that) {
+point.prototype.dy = function(that) {
   return that.y - this.y;
 };
 
 /** Returns the angle between this point and that point */
-  this.prototype.angle = function(that) {
+point.prototype.angle = function(that) {
   let rad = Math.atan2(-1 * this.dy(that), this.dx(that));
   while (rad < 0) rad += 2 * Math.PI;
 
@@ -60,7 +60,7 @@ function point(x, y) {
 };
 
 /** Rotate this point deg around that point */
-  this.prototype.rotate = function(deg, that) {
+point.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;
@@ -70,27 +70,27 @@ function point(x, y) {
 };
 
 /** returns an identical copy of this point */
-  this.prototype.copy = function() {
+point.prototype.copy = function() {
   return new Point(this.x, this.y);
 };
 
 /** checks whether this point is equal to that point */
-  this.prototype.equals = function(that) {
+point.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) {
+point.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) {
+point.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) {
+point.prototype.shift = function(deg, distance) {
   let p = this.copy();
   p.x += distance;
 
@@ -98,21 +98,18 @@ function point(x, y) {
 };
 
 /** Shifts this point distance in the direction of that point */
-  this.prototype.shiftTowards = function(that, distance) {
+point.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) {
+point.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) {
+point.prototype.shiftOutwards = function(that, distance) {
   return this.shiftTowards(that, this.dist(that) + distance);
 };
 
-  return this;
-}
-
 export default point;

src/svg.js

@@ -25,18 +25,19 @@ function svg(pattern) {
   this.hooks = hooks.all;
   for (let k in hooklib) this[k] = hooklib[k];
   for (let k in this.hooks) this.hook(k, this[k]);
+}
 
 /** Method to attach preRenderSvg hooks on */
-  this.prototype.preRenderSvg = function() {};
+svg.prototype.preRenderSvg = function() {};
 
 /** Method to attach postRenderSvg hooks on */
-  this.prototype.postRenderSvg = function() {};
+svg.prototype.postRenderSvg = function() {};
 
 /** Method to attach insertText hooks on */
-  this.prototype.insertText = function() {};
+svg.prototype.insertText = function() {};
 
 /** Renders a draft object as SVG */
-  this.prototype.render = function(pattern) {
+svg.prototype.render = function(pattern) {
   this.preRenderSvg();
   this.svg = this.prefix;
   this.svg += this.renderComments(this.header);
@@ -61,8 +62,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for the opening SVG tag */
-  this.prototype.renderSvgTag = funtion(pattern);
+svg.prototype.renderSvgTag = function(pattern) {
-  {
   let svg = "<svg";
   this.indent();
   svg += this.nl() + this.attributes.render();
@@ -70,10 +70,10 @@ function svg(pattern) {
   svg += this.nl() + ">" + this.nl();
 
   return svg;
-  }
+};
 
 /** Returns SVG code for the style block */
-  this.prototype.renderStyle = function() {
+svg.prototype.renderStyle = function() {
   let svg = '<style type="text/css"> <![CDATA[ ';
   this.indent();
   svg += this.nl() + this.style;
@@ -83,7 +83,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for the script block */
-  this.prototype.renderScript = function() {
+svg.prototype.renderScript = function() {
   let svg = '<script type="text/javascript"> <![CDATA[';
   this.indent();
   svg += this.nl() + this.script;
@@ -94,7 +94,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for the defs block */
-  this.prototype.renderDefs = function() {
+svg.prototype.renderDefs = function() {
   let svg = '<defs id="defs">';
   this.indent();
   svg += this.nl() + this.defs;
@@ -105,14 +105,14 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for a comment block */
-  this.prototype.renderComments = function(comments) {
+svg.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) {
+svg.prototype.renderPart = function(part) {
   let svg = "";
   for (let key in part.paths) {
     let path = part.paths[key];
@@ -132,7 +132,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for a Point object */
-  this.prototype.renderPoint = function(point) {
+svg.prototype.renderPoint = function(point) {
   let svg = "";
   if (point.attributes.get("data-text")) svg += this.renderText(point);
 
@@ -140,7 +140,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for a Path object */
-  this.prototype.renderPath = function(path) {
+svg.prototype.renderPath = function(path) {
   if (!path.attributes.get("id")) path.attributes.add("id", this.getUid());
   path.attributes.add("d", path.asPathstring());
 
@@ -149,7 +149,7 @@ function svg(pattern) {
   )}`;
 };
 
-  this.prototype.renderPathText = function(path) {
+svg.prototype.renderPathText = function(path) {
   let text = path.attributes.get("data-text");
   if (!text) return false;
   let attributes = path.attributes.renderIfPrefixIs("data-text-");
@@ -164,7 +164,7 @@ function svg(pattern) {
   return svg;
 };
 
-  this.prototype.renderText = function(point) {
+svg.prototype.renderText = function(point) {
   let text = point.attributes.get("data-text");
   if (!text) return false;
 
@@ -183,7 +183,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code for a snippet */
-  this.prototype.renderSnippet = function(snippet) {
+svg.prototype.renderSnippet = function(snippet) {
   let svg = this.nl();
   svg += `<use x="${snippet.anchor.x}" y="${snippet.anchor.y}" `;
   svg += `xlink:href="#${snippet.def}" ${snippet.attributes.render()}>`;
@@ -196,7 +196,7 @@ function svg(pattern) {
 };
 
 /** Returns SVG code to open a group */
-  this.prototype.openGroup = function(id) {
+svg.prototype.openGroup = function(id) {
   let svg = this.nl() + this.nl();
   svg += `<!-- Start of group #${id} -->`;
   svg += this.nl();
@@ -208,19 +208,19 @@ function svg(pattern) {
 };
 
 /** Returns SVG code to close a group */
-  this.prototype.closeGroup = function() {
+svg.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() {
+svg.prototype.nl = function() {
   return "\n" + this.tab();
 };
 
 /** Returns indentation */
-  this.prototype.tab = function() {
+svg.prototype.tab = function() {
   let space = "";
   for (let i = 0; i < this.tabs; i++) {
     space += "  ";
@@ -230,23 +230,20 @@ function svg(pattern) {
 };
 
 /** Increases indentation by 1 */
-  this.prototype.indent = function() {
+svg.prototype.indent = function() {
   this.tabs += 1;
 };
 
 /** Decreases indentation by 1 */
-  this.prototype.outdent = function() {
+svg.prototype.outdent = function() {
   this.tabs -= 1;
 };
 
 /** Returns an unused ID */
-  this.prototype.getUid = function() {
+svg.prototype.getUid = function() {
   this.freeId += 1;
 
   return "" + this.freeId;
 };
 
-  return this;
-}
-
 export default svg;