From 1bccf5c827d160991a046723a60b46d42407adf8 Mon Sep 17 00:00:00 2001 From: Joost De Cock Date: Mon, 24 Dec 2018 15:53:34 +0100 Subject: [PATCH] sparkles: Added collar --- packages/simon/config/config.js | 6 +- packages/simon/index.html | 2 +- packages/simon/src/collar.js | 155 ++++++++++++++++++++++++++++++ packages/simon/src/collarstand.js | 4 +- packages/simon/src/index.js | 2 + 5 files changed, 163 insertions(+), 6 deletions(-) create mode 100644 packages/simon/src/collar.js diff --git a/packages/simon/config/config.js b/packages/simon/config/config.js index 6138f8582e7..28d6452390d 100644 --- a/packages/simon/config/config.js +++ b/packages/simon/config/config.js @@ -41,7 +41,7 @@ export default { yoke: "backBase", sleeve: "sleeveBase" }, - parts: ["collarStand"], + parts: ["collarStand", "collar"], hide: ["base", "frontBase", "front", "backBase", "sleeveBase"], options: { // Constants @@ -103,7 +103,8 @@ export default { // Angles collarAngle: { deg: 85, min: 60, max: 130 }, collarStandBend: { deg: 3, min: 0, max: 5 }, - collarStandCurve: { deg: 5, min: 0, max: 5 }, + collarStandCurve: { deg: 2, min: 0, max: 5 }, + collarFlare: { deg: 4, min: 0, max: 10 }, // Millimeter buttonPlacketWidth: { mm: 20, min: 10, max: 30 }, @@ -121,7 +122,6 @@ export default { chestEase: { pct: 8, min: -4, max: 20 }, collarBend: { pct: 5, min: 0, max: 10 }, collarEase: { pct: 3.5, min: 0, max: 10 }, - collarFlare: { pct: 3, min: 0, max: 6 }, collarGap: { pct: 3, min: 0, max: 6 }, collarRoll: { pct: 3, min: 0, max: 6 }, cuffDrape: { pct: 10, min: 0, max: 20 }, diff --git a/packages/simon/index.html b/packages/simon/index.html index 4bc59cef79f..855031cdca1 100644 --- a/packages/simon/index.html +++ b/packages/simon/index.html @@ -113,7 +113,7 @@ let settings1 = { ...settings }; pattern1.settings.options.buttonholePlacketType = "seperate"; //pattern1.settings.options.splitYoke = "yes"; pattern1.settings.sa = 10; - pattern1.settings.only = "collarStand"; + pattern1.settings.only = "collar"; pattern1.draft(); console.log(pattern1); document.getElementById("svg1").innerHTML = pattern1.render(); diff --git a/packages/simon/src/collar.js b/packages/simon/src/collar.js new file mode 100644 index 00000000000..3cefd4db155 --- /dev/null +++ b/packages/simon/src/collar.js @@ -0,0 +1,155 @@ +export default part => { + // prettier-ignore + let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand(); + + const draft = function(tweak = 1) { + let length = + measurements.neckCircumference * + (1 + options.collarEase - options.collarGap) * + tweak; + let width = options.collarStandWidth * (1 + options.collarRoll); + + // Draft right side + points.topMid = new Point(0, 0); + points.bottomMid = new Point(0, width); + points.bottomMidCp1 = points.bottomMid.shift(0, length * 0.35); + points.rightBottomEdge = new Point( + length / 2, + width + length * options.collarBend + ); + points.rightTopHinge = points.topMid.shift(0, length * 0.25); + points.rightTopEdgeDirection = points.rightTopHinge.shift( + options.collarFlare, + 10 + ); + points.rightBottomEdgeDirection = points.rightBottomEdge.shift( + options.collarAngle, + 10 + ); + points.rightTopEdge = utils.beamsIntersect( + points.rightTopHinge, + points.rightTopEdgeDirection, + points.rightBottomEdge, + points.rightBottomEdgeDirection + ); + points.rightTopHingeCp1 = points.rightTopHinge.shift(0, length * 0.1); + + // Draft left side + points.leftTopHinge = points.rightTopHinge.flipX(); + points.bottomMidCp2 = points.bottomMidCp1.flipX(); + points.leftTopHingeCp2 = points.rightTopHingeCp1.flipX(); + points.leftTopEdge = points.rightTopEdge.flipX(); + points.leftBottomEdge = points.rightBottomEdge.flipX(); + + let len = new Path() + .move(points.leftBottomEdge) + ._curve(points.bottomMidCp2, points.bottomMid) + .length(); + + return ( + len * 2 - + measurements.neckCircumference * + (1 + options.collarEase - options.collarGap) + ); + }; + + let delta, tweak, run; + tweak = 1; + run = 1; + do { + delta = draft(tweak); + tweak = tweak * (1 - delta / 1000); + run++; + console.log("tweak is", tweak, "run", run, "delta", delta); + } while (Math.abs(delta) > 1 && run < 20); + + paths.seam = new Path() + .move(points.bottomMid) + .curve_(points.bottomMidCp1, points.rightBottomEdge) + .line(points.rightTopEdge) + ._curve(points.rightTopHingeCp1, points.rightTopHinge) + .line(points.topMid) + .line(points.leftTopHinge) + .curve_(points.leftTopHingeCp2, points.leftTopEdge) + .line(points.leftBottomEdge) + ._curve(points.bottomMidCp2, points.bottomMid) + .close() + .attr("class", "fabric"); + + // Complete pattern? + if (complete) { + // Draw undercollar line + let uc = points.topMid.dist(points.bottomMid) * 0.05; + points.ucTopMid = points.topMid.shift(-90, uc); + points.ucRightTopHinge = points.rightTopHinge.shift(-90, uc); + points.ucRightTopHingeCp1 = points.rightTopHingeCp1.shift(-90, uc); + points.ucLeftTopHinge = points.ucRightTopHinge.flipX(); + points.ucLeftTopHingeCp2 = points.ucRightTopHingeCp1.flipX(); + paths.underCollar = new Path() + .move(points.rightTopEdge) + ._curve(points.ucRightTopHingeCp1, points.ucRightTopHinge) + .line(points.ucLeftTopHinge) + .curve_(points.ucLeftTopHingeCp2, points.leftTopEdge) + .attr("class", "dotted") + .attr("data-text", "cutUndercollarSlightlySmaller") + .attr("data-text-class", "center"); + + // Helplines + paths.help = new Path() + .move(points.topMid) + .line(points.bottomMid) + .attr("class", "dotted"); + + // Grainline + macro("grainline", { + from: points.bottomMidCp2.shift(90, 10), + to: points.bottomMidCp1.shift(90, 10) + }); + + // Title + points.title = new Point(20, points.bottomMid.y / 2); + macro("title", { + at: points.title, + nr: "7 & 8", + title: "collarAndUndercollar", + scale: 0.6, + append: true + }); + + // Indicate collar stand side + paths.collarStandLeft = new Path() + .move(points.leftBottomEdge) + ._curve(points.bottomMidCp2, points.bottomMid) + .attr("data-text", "sideOfTheCollarStand") + .attr("data-text-class", "center"); + paths.collarStandRight = new Path() + .move(points.bottomMid) + .curve_(points.bottomMidCp1, points.rightBottomEdge) + .attr("data-text", "sideOfTheCollarStand") + .attr("data-text-class", "center"); + // Notches + macro("sprinkle", { + snippet: "notch", + on: [ + "bottomMid", + "rightBottomEdge", + "leftBottomEdge", + "rightTopEdge", + "leftTopEdge" + ] + }); + + if (sa) { + paths.sa = paths.seam.offset(sa).attr("class", "fabric sa"); + paths.saUndercollar = paths.underCollar + .offset(sa) + .attr("class", "dotted"); + } + } + + // Paperless? + if (paperless) { + } + + return part; +}; diff --git a/packages/simon/src/collarstand.js b/packages/simon/src/collarstand.js index 81a1ff12691..427aab9ee20 100644 --- a/packages/simon/src/collarstand.js +++ b/packages/simon/src/collarstand.js @@ -160,8 +160,8 @@ export default part => { // Grainline macro("grainline", { - from: points.bottomMid, - to: points.topMid + from: points.leftCf, + to: points.rightCf }); // Title diff --git a/packages/simon/src/index.js b/packages/simon/src/index.js index 93acf340356..06275c34a5b 100644 --- a/packages/simon/src/index.js +++ b/packages/simon/src/index.js @@ -14,6 +14,7 @@ import draftButtonholePlacket from "./buttonholeplacket"; import draftYoke from "./yoke"; import draftSleeve from "./sleeve"; import draftCollarStand from "./collarstand"; +import draftCollar from "./collar"; // Constructor const Simon = function(settings) { @@ -53,5 +54,6 @@ Simon.prototype.draftButtonholePlacket = draftButtonholePlacket; Simon.prototype.draftYoke = draftYoke; Simon.prototype.draftSleeve = draftSleeve; Simon.prototype.draftCollarStand = draftCollarStand; +Simon.prototype.draftCollar = draftCollar; export default Simon;