sparkles: Added cuffs

packages/simon/config/config.js

@@ -45,7 +45,8 @@ export default {
     "collarStand",
     "collar",
     "sleevePlacketUnderlap",
-    "sleevePlacketOverlap"
+    "sleevePlacketOverlap",
+    "cuff"
   ],
   hide: ["base", "frontBase", "front", "backBase", "sleeveBase"],
   options: {
@@ -53,7 +54,7 @@ export default {
     collarFactor: 5,
     minimalDartShaping: 5,
     brianFitSleeve: true,
-    cuffOverlap: 0.05,
+    cuffOverlap: 0.15,
     frenchCuffRoundFactor: 0.05,
 
     // Lists
@@ -131,7 +132,7 @@ export default {
     collarRoll: { pct: 3, min: 0, max: 6 },
     cuffDrape: { pct: 10, min: 0, max: 20 },
     cuffEase: { pct: 20, min: 0, max: 200 },
-    cuffLength: { pct: 5, min: 3, max: 10 },
+    cuffLength: { pct: 10, min: 3, max: 15 },
     frontArmholeDeeper: { pct: 0.5, min: 0, max: 1.5 },
     hemCurve: { pct: 75, min: 25, max: 100 },
     hipsEase: { pct: 8, min: -4, max: 20 },

packages/simon/index.html

@@ -109,11 +109,12 @@ let settings1 = { ...settings };
       pattern1.settings.options.lengthBonus = 0.1;
       pattern1.settings.options.hemStyle = "slashed";
       pattern1.settings.options.buttonholePlacketStyle = "classic";
-      pattern1.settings.options.buttonPlacketType = "seperate";
+      pattern1.settings.options.cuffButtonRows = 2;
-      pattern1.settings.options.buttonholePlacketType = "seperate";
+      pattern1.settings.options.barrelCuffNarrowButton = "yes";
+      pattern1.settings.options.cuffStyle = "roundedFrenchCuff";
       //pattern1.settings.options.splitYoke = "yes";
       pattern1.settings.sa = 10;
-      pattern1.settings.only = "sleevePlacketOverlap";
+      pattern1.settings.only = "cuff";
       pattern1.draft();
       console.log(pattern1);
       document.getElementById("svg1").innerHTML = pattern1.render();

packages/simon/src/cuff-barrel-angled.js

@@ -0,0 +1,36 @@
+import { draftBarrelCuff, decorateBarrelCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+
+  draftBarrelCuff(part);
+  let height = store.get("cuffHeight");
+
+  points.leftAngleTop = points.topLeft.shift(0, height / 3);
+  points.leftAngleBottom = points.topLeft.shift(-90, height / 3);
+  points.rightAngleTop = points.topRight.shift(180, height / 3);
+  points.rightAngleBottom = points.topRight.shift(-90, height / 3);
+  paths.seam = new Path()
+    .move(points.leftAngleBottom)
+    .line(points.bottomLeft)
+    .line(points.bottomRight)
+    .line(points.rightAngleBottom)
+    .line(points.rightAngleTop)
+    .line(points.leftAngleTop)
+    .line(points.leftAngleBottom)
+    .close()
+    .attr("class", "fabric");
+
+  // Complete pattern?
+  if (complete) {
+    decorateBarrelCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa);
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff-barrel-rounded.js

@@ -0,0 +1,56 @@
+import { draftBarrelCuff, decorateBarrelCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+
+  draftBarrelCuff(part);
+  let height = store.get("cuffHeight");
+  macro("round", {
+    from: points.topRight,
+    to: points.bottomLeft,
+    via: points.topLeft,
+    radius: height / 3,
+    prefix: "topLeftRound"
+  });
+  macro("round", {
+    from: points.bottomRight,
+    to: points.topLeft,
+    via: points.topRight,
+    radius: height / 3,
+    prefix: "topRightRound"
+  });
+  points.leftAngleBottom = points.topLeft.shift(-90, height / 3);
+  points.rightAngleTop = points.topRight.shift(180, height / 3);
+  points.rightAngleBottom = points.topRight.shift(-90, height / 3);
+  paths.seam = new Path()
+    .move(points.topLeftRoundEnd)
+    .line(points.bottomLeft)
+    .line(points.bottomRight)
+    .line(points.topRightRoundStart)
+    .curve(
+      points.topRightRoundCp1,
+      points.topRightRoundCp2,
+      points.topRightRoundEnd
+    )
+    .line(points.topLeftRoundStart)
+    .curve(
+      points.topLeftRoundCp1,
+      points.topLeftRoundCp2,
+      points.topLeftRoundEnd
+    )
+    .close()
+    .attr("class", "fabric");
+
+  // Complete pattern?
+  if (complete) {
+    decorateBarrelCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa);
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff-barrel-straight.js

@@ -0,0 +1,28 @@
+import { draftBarrelCuff, decorateBarrelCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+
+  draftBarrelCuff(part);
+  paths.seam = new Path()
+    .move(points.topLeft)
+    .line(points.bottomLeft)
+    .line(points.bottomRight)
+    .line(points.topRight)
+    .line(points.topLeft)
+    .close()
+    .attr("class", "fabric");
+
+  // Complete pattern?
+  if (complete) {
+    decorateBarrelCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa);
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff-french-angled.js

@@ -0,0 +1,48 @@
+import { draftFrenchCuff, decorateFrenchCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+
+  draftFrenchCuff(part);
+  let height = store.get("cuffHeight");
+  points.leftAngleTopTop = points.topLeft.shift(0, height / 3);
+  points.leftAngleTopBottom = points.topLeft.shift(-90, height / 3);
+  points.rightAngleTopTop = points.topRight.shift(180, height / 3);
+  points.rightAngleTopBottom = points.topRight.shift(-90, height / 3);
+
+  points.leftAngleBottomTop = points.bottomLeft.shift(90, height / 3);
+  points.leftAngleBottomBottom = points.bottomLeft.shift(0, height / 3);
+  points.rightAngleBottomTop = points.bottomRight.shift(90, height / 3);
+  points.rightAngleBottomBottom = points.bottomRight.shift(180, height / 3);
+
+  paths.seam = new Path()
+    .move(points.leftAngleTopBottom)
+    .line(points.leftAngleBottomTop)
+    .line(points.leftAngleBottomBottom)
+    .line(points.rightAngleBottomBottom)
+    .line(points.rightAngleBottomTop)
+    .line(points.rightAngleTopBottom)
+    .line(points.rightAngleTopTop)
+    .line(points.leftAngleTopTop)
+    .line(points.leftAngleTopBottom)
+    .close()
+    .attr("class", "fabric");
+
+  paths.fold = new Path()
+    .move(points.midLeft)
+    .line(points.midRight)
+    .attr("class", "dotted");
+
+  // Complete pattern?
+  if (complete) {
+    decorateFrenchCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa).attr("class", "fabric sa");
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff-french-rounded.js

@@ -0,0 +1,66 @@
+import { draftFrenchCuff, decorateFrenchCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+  draftFrenchCuff(part);
+  let height = store.get("cuffHeight");
+  macro("round", {
+    from: points.topRight,
+    to: points.bottomLeft,
+    via: points.topLeft,
+    radius: height / 3,
+    prefix: "topLeft"
+  });
+  macro("round", {
+    from: points.topLeft,
+    to: points.bottomRight,
+    via: points.bottomLeft,
+    radius: height / 3,
+    prefix: "bottomLeft"
+  });
+  macro("round", {
+    from: points.bottomLeft,
+    to: points.topRight,
+    via: points.bottomRight,
+    radius: height / 3,
+    prefix: "bottomRight"
+  });
+  macro("round", {
+    from: points.bottomRight,
+    to: points.topLeft,
+    via: points.topRight,
+    radius: height / 3,
+    prefix: "topRight"
+  });
+
+  paths.seam = new Path()
+    .move(points.topLeftEnd)
+    .line(points.bottomLeftStart)
+    .curve(points.bottomLeftCp1, points.bottomLeftCp2, points.bottomLeftEnd)
+    .line(points.bottomRightStart)
+    .curve(points.bottomRightCp1, points.bottomRightCp2, points.bottomRightEnd)
+    .line(points.topRightStart)
+    .curve(points.topRightCp1, points.topRightCp2, points.topRightEnd)
+    .line(points.topLeftStart)
+    .curve(points.topLeftCp1, points.topLeftCp2, points.topLeftEnd)
+    .close()
+    .attr("class", "fabric");
+
+  paths.fold = new Path()
+    .move(points.midLeft)
+    .line(points.midRight)
+    .attr("class", "dotted");
+
+  // Complete pattern?
+  if (complete) {
+    decorateFrenchCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa).attr("class", "fabric sa");
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff-french-straight.js

@@ -0,0 +1,35 @@
+import { draftFrenchCuff, decorateFrenchCuff } from "./shared";
+
+export default part => {
+  // prettier-ignore
+  let {store, measurements, utils, sa, Point, points, Path, paths, Snippet, snippets, complete, paperless, macro, options} = part.shorthand();
+
+  draftFrenchCuff(part);
+  let height = store.get("barrelCuffHeight");
+
+  paths.seam = new Path()
+    .move(points.topLeft)
+    .line(points.bottomLeft)
+    .line(points.bottomRight)
+    .line(points.topRight)
+    .line(points.topLeft)
+    .close()
+    .attr("class", "fabric");
+
+  paths.fold = new Path()
+    .move(points.midLeft)
+    .line(points.midRight)
+    .attr("class", "dotted");
+
+  // Complete pattern?
+  if (complete) {
+    decorateFrenchCuff(part);
+    if (sa) paths.sa = paths.seam.offset(sa);
+  }
+
+  // Paperless?
+  if (paperless) {
+  }
+
+  return part;
+};

packages/simon/src/cuff.js

@@ -0,0 +1,24 @@
+import straightBarrelCuff from "./cuff-barrel-straight";
+import roundedBarrelCuff from "./cuff-barrel-rounded";
+import angledBarrelCuff from "./cuff-barrel-angled";
+import straightFrenchCuff from "./cuff-french-straight";
+import angledFrenchCuff from "./cuff-french-angled";
+import roundedFrenchCuff from "./cuff-french-rounded";
+
+export default part => {
+  let { options } = part.shorthand();
+  switch (options.cuffStyle) {
+    case "roundedBarrelCuff":
+      return roundedBarrelCuff(part);
+    case "straightBarrelCuff":
+      return straightBarrelCuff(part);
+    case "roundedFrenchCuff":
+      return roundedFrenchCuff(part);
+    case "angledFrenchCuff":
+      return angledFrenchCuff(part);
+    case "straightFrenchCuff":
+      return straightFrenchCuff(part);
+    default:
+      return angledBarrelCuff(part);
+  }
+};

packages/simon/src/index.js

@@ -17,6 +17,7 @@ import draftCollarStand from "./collarstand";
 import draftCollar from "./collar";
 import draftSleevePlacketUnderlap from "./sleeveplacket-underlap";
 import draftSleevePlacketOverlap from "./sleeveplacket-overlap";
+import draftCuff from "./cuff";
 
 // Constructor
 const Simon = function(settings) {
@@ -59,5 +60,6 @@ Simon.prototype.draftCollarStand = draftCollarStand;
 Simon.prototype.draftCollar = draftCollar;
 Simon.prototype.draftSleevePlacketUnderlap = draftSleevePlacketUnderlap;
 Simon.prototype.draftSleevePlacketOverlap = draftSleevePlacketOverlap;
+Simon.prototype.draftCuff = draftCuff;
 
 export default Simon;

packages/simon/src/shared.js

@@ -39,3 +39,151 @@ export const addButtons = function(
 
 export const addButtonHoles = (part, origin) =>
   addButtons(part, origin, "buttonhole");
+
+export const draftBarrelCuff = part => {
+  let { store, points, measurements, options, Point } = part.shorthand();
+  let height = measurements.shoulderToWrist * options.cuffLength;
+  let width =
+    measurements.wristCircumference *
+    (1 + options.cuffEase + options.cuffOverlap + options.cuffDrape);
+  store.set("cuffHeight", height);
+  points.topLeft = new Point(0, 0);
+  points.topRight = new Point(width, 0);
+  points.bottomLeft = new Point(0, height);
+  points.bottomRight = new Point(width, height);
+
+  return part;
+};
+
+export const decorateBarrelCuff = part => {
+  let {
+    macro,
+    snippets,
+    Snippet,
+    points,
+    measurements,
+    options,
+    Point
+  } = part.shorthand();
+  // Title
+  points.title = new Point(points.bottomRight.x / 2, points.bottomRight.y / 2);
+  macro("title", {
+    nr: 10,
+    title: "cuff",
+    at: points.title,
+    scale: 0.8
+  });
+
+  // Button and buttonhole
+  let margin = measurements.wristCircumference * options.cuffOverlap;
+  points.buttonLineTop = points.topRight.shift(180, margin / 2);
+  points.buttonLineBottom = points.bottomRight.shift(180, margin / 2);
+  points.buttonholeLineTop = points.topLeft.shift(0, margin / 2);
+  points.buttonholeLineBottom = points.bottomLeft.shift(0, margin / 2);
+
+  for (let i = 1; i <= options.cuffButtonRows; i++) {
+    points["button" + i] = points.buttonLineTop.shiftFractionTowards(
+      points.buttonLineBottom,
+      (1 / (options.cuffButtonRows + 1)) * i
+    );
+    snippets["button" + i] = new Snippet("button", points["button" + i]);
+    points["buttonhole" + i] = new Point(
+      points.buttonholeLineTop.x,
+      points["button" + i].y
+    );
+    snippets["buttonhole" + i] = new Snippet(
+      "buttonhole",
+      points["buttonhole" + i]
+    ).attr("data-rotate", 90);
+    if (options.barrelcuffNarrowButton === "yes") {
+      points["narrowButton" + i] = points["button" + i].shift(180, margin);
+      snippets["narrowButton" + i] = new Snippet(
+        "button",
+        points["narrowButton" + i]
+      );
+    }
+  }
+
+  return part;
+};
+
+export const draftFrenchCuff = part => {
+  let { store, points, measurements, options, Point } = part.shorthand();
+  let margin = measurements.wristCircumference * options.cuffOverlap;
+  let height = measurements.shoulderToWrist * options.cuffLength;
+  let width =
+    measurements.wristCircumference *
+      (1 + options.cuffEase + options.cuffOverlap + options.cuffDrape) +
+    margin / 2;
+  store.set("cuffHeight", height);
+  points.topLeft = new Point(0, 0);
+  points.topRight = new Point(width, 0);
+  points.midLeft = new Point(0, height);
+  points.midRight = new Point(width, height);
+  points.bottomLeft = new Point(0, height * 2);
+  points.bottomRight = new Point(width, height * 2);
+
+  return part;
+};
+
+export const decorateFrenchCuff = part => {
+  let {
+    macro,
+    snippets,
+    Snippet,
+    points,
+    measurements,
+    options,
+    Point
+  } = part.shorthand();
+  // Title
+  points.title = new Point(points.bottomRight.x / 2, points.bottomRight.y / 2);
+  macro("title", {
+    nr: 10,
+    title: "cuff",
+    at: points.title,
+    scale: 0.8
+  });
+
+  // Buttonholes
+  let margin = measurements.wristCircumference * options.cuffOverlap;
+  points.buttonLineTop = points.topRight.shift(180, margin * 0.75);
+  points.buttonLineBottom = points.bottomRight.shift(180, margin * 0.75);
+  points.buttonholeLineTop = points.topLeft.shift(0, margin * 0.75);
+  points.buttonholeLineBottom = points.bottomLeft.shift(0, margin * 0.75);
+
+  points.button1 = points.buttonLineTop.shiftFractionTowards(
+    points.buttonLineBottom,
+    0.2
+  );
+  points.button2 = points.buttonLineTop.shiftFractionTowards(
+    points.buttonLineBottom,
+    0.8
+  );
+  points.button3 = points.buttonholeLineTop.shiftFractionTowards(
+    points.buttonholeLineBottom,
+    0.2
+  );
+  points.button4 = points.buttonholeLineTop.shiftFractionTowards(
+    points.buttonholeLineBottom,
+    0.8
+  );
+  snippets.buttonhole1 = new Snippet("buttonhole", points.button1).attr(
+    "data-rotate",
+    90
+  );
+  snippets.buttonhole2 = new Snippet("buttonhole", points.button2).attr(
+    "data-rotate",
+    90
+  );
+  snippets.buttonhole3 = new Snippet("buttonhole", points.button3).attr(
+    "data-rotate",
+    90
+  );
+  snippets.buttonhole4 = new Snippet("buttonhole", points.button4).attr(
+    "data-rotate",
+    90
+  );
+
+  return part;
+};