some js formatting tweaks to tutorial

markdown/dev/tutorials/pattern-design/adding-measurements/en.md

@@ -16,27 +16,26 @@ So let's add it as a required measurement.
 
 ## Adding required measurements
 
-In our `bib.mjs` file, on the `bib` object, there is a key called
+In our `design/src/bib.mjs` file, on the `bib` object, there is a key called
 `measurements` (line 121) that will hold a list (an array) of all required measurements
 for this part.
 
-We are going to use *the official name* of the measurement. For head
+We are going to use [*the official name* of the measurement](/reference/measurements). For head
 circumference, that name is `head`.
 
 ```design/src/bib.mjs
 function draftBib({ part }) {
-
   return part
 }
 
 export const bib = {
   name: 'tutorial.bib',
-  draft: draftBib,[],
+  draft: draftBib,
   from: false,
   hide: {
-  self: false,
+    self: false,
-  from: false,
+    from: false,
-  after: false
+    after: false
   },
   options: {},
   // start-highlight

markdown/dev/tutorials/pattern-design/adding-options/en.md

@@ -31,12 +31,12 @@ function draftBib({ part }) {
 export const bib = {
  
   name: 'tutorial.bib',
-  draft: draftBib,[],
+  draft: draftBib,
   from: false,
   hide: {
-  self: false,
+    self: false,
-  from: false,
+    from: false,
-  after: false
+    after: false
   },
   // highlight-start
   options: {

markdown/dev/tutorials/pattern-design/avoiding-overlap/en.md

@@ -3,8 +3,8 @@ title: Avoiding overlap
 order: 220
 ---
 
-While we've only drawn the end of one strap, it's pretty obvious they overlap.
+While we've only drawn the end of one strap, it's pretty obvious they overlap,
-Which is a big no-no in sewing patterns, so we're going to have to address
+which makes it impossible to cut out, so we're going to have to address
 that.
 
 Specifically, we're going to rotate our strap out of the way until it no longer overlaps.
@@ -14,7 +14,7 @@ to rotate.
 Once we have our list of points to rotate, we can rotate them. How far? Until the strap no longer overlaps.
 
 <Example tutorial caption="It is looking pretty wonky now, but we'll deal with that next">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -31,18 +31,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/completing-our-pattern/en.md

@@ -22,7 +22,7 @@ is *truthy*.
 
 To access the setting, we can destructure it:
 
-```mjs
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -58,20 +58,22 @@ To use them, much like points and paths, we need to destructure both
 the `Snippet` constructor as well as the `snippets` object to hold
 our snippets:
 
-```mjs
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
+  //hightlight-start
+  Snippet,
+  //highlight-end
   paths,
   points,
+  // highlight-start
+  snippets,
+  // highlight-end
   measurements,
   options,
   macro,
   complete,
-  // highlight-start
-  Snippet,
-  snippets,
-  // highlight-end
   part,
 }) {
 
@@ -97,20 +99,18 @@ You can find all possible snippets in [our documentation](/reference/api/snippet
 Let's put this and few other things together to complete our design:
 
 <Example tutorial caption="Almost done. But there's one more thing the user can ask for: a **paperless** pattern">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
+  Snippet,
   paths,
   points,
+  snippets,
   measurements,
   options,
   macro,
-  // highlight-start
   complete,
-  snippets,
-  Snippet,
-  // highlight-end
   part,
 }) {
 
@@ -119,18 +119,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/completing-the-neck-opening/en.md

@@ -14,7 +14,7 @@ as it is, and simply chose to not show it.
 To accomplish this, we'll call the `hide()` method on our path:
 
 <Example tutorial caption="A hidden path is not shown">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -30,20 +30,20 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       // highlight-start
       .hide()
       // highlight-end
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)
@@ -68,7 +68,7 @@ Let's add some more points, and then construct the complete path for the neck
 opening.
 
 <Example tutorial caption="Our completed neck opening">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -84,18 +84,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide()
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/creating-the-closure/en.md

@@ -27,7 +27,7 @@ Like our neck opening, we've only drawn half since we can simply copy the
 points to the other side.
 
 <Example tutorial caption="Now the straps overlap. Which doesn't work for a pattern as it would make it impossible to cut it out of a single piece of fabric. So let's deal with the overlap next.">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -46,18 +46,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/draft-method/en.md

@@ -4,12 +4,52 @@ order: 150
 ---
 
 Time to turn our attention to the draft method of our part.
-Inside our `design/src/bib.js` file, this is what it currently looks like:
+Inside our `design/src/bib.mjs` file, this is what it currently looks like:
 
 ```design/src/bib.mjs
-function draftBib({ part 
+function draftBib ({
+  // Uncomment below to destructure what you need
+  /*
+   * Content constructors
+   */
+  //Path,    // A Path constructor to create new paths
+  //Point,   // A Point constructor to create new points
+  //Snippet, // A Snippet constructor to create new snippets
+  /*
+   * Content constainers
+   */
+  //paths,    // Add a Path to your part by adding it to this object
+  //points,   // Add a Points to your part by adding it to this object
+  //snippets, // Add a Snippet to your part by adding it to this object
+  /*
+   * Access to settings
+   */
+  //absoluteOptions, // Access to settings.absoluteOptions
+  //complete,        // Access to settings.complete
+  //measurements,    // Access to settings.measurements
+  //options,         // Access to settings.options
+  //paperless,       // Access to settings.paperless
+  //sa,              // Access to settings.sa
+  //scale,           // Access to settings.scale
+  /*
+   * Access to utilities
+   */
+  //getId,     //See the getId documentation
+  //hide,      //See the hide documentation
+  //log,       //See the logging documentation
+  //macro,     //See the macros documentation
+  //setHidden, //See the setHidden documentation
+  //store,     //See the store documentation
+  //unhide,    //See the unhide documentation
+  //units,     //See the units documentation
+  ///utils,     //See the utils documentation
+  /*
+   * Return value
+   */
+  part, // Your draft method must return this
 }) {
 
+  // Work your magic here
   return part
 }
 ```

markdown/dev/tutorials/pattern-design/drawing-the-straps/en.md

@@ -15,7 +15,7 @@ path. As it happens, that is the default behaviour, so we merely have to remove
 it's `hidden: false` property.
 
 <Example tutorial caption="It is starting to look good. But this sharp corners at the bottom don't exactly say baby, do they?">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -32,18 +32,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/en.md

@@ -21,7 +21,7 @@ At the end of this tutorial, we will have created this pattern:
 
 
 <Example tutorial="1" previewFirst="1" caption="Our end result">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -41,18 +41,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/fitting-the-neck-opening/en.md

@@ -8,7 +8,7 @@ going to make sure it is.  Here's how we'll make sure the neck opening is _just
 right_:
 
 <Example tutorial caption="It might look the same as before, but now it's just right">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -26,18 +26,18 @@ function draftBib({
   let delta
   do {
   // highlight-end
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
 
   // highlight-start
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/our-first-part/en.md

@@ -17,7 +17,7 @@ and approachable code base.
 The previous step has already set everything up for us. Our design's main file
 lives in `design/src/index.mjs`, and our part lives in `design/src/bib.mjs`.
 
-This `bib.mjs` is where we'll do all our work. The file includes a basic guide on how to use it. We removed it for clarity in our example. It currently looks like this:
+This `bib.mjs` is where we'll do all our work. The file includes a comments to guide you on how to use it. We removed those for clarity in our example. It currently looks like this:
 
 ```design/src/bib.mjs
 function draftBib ({
@@ -33,9 +33,9 @@ export const bib = {
   draft: draftBib,[],
   from: false,
   hide: {
-  self: false,
+    self: false,
-  from: false,
+    from: false,
-  after: false
+    after: false
   },
   options: {},
   measurements: [],

markdown/dev/tutorials/pattern-design/paperless/en.md

@@ -43,7 +43,7 @@ Refer to [the list of macros](/reference/macros/) for more details.
 </Note>
 
 <Example tutorial paperless caption="Making our pattern paperless is the icing on the cake. Time to wrap up, go over what we've learned, and give some pointers on where to go from here">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -66,18 +66,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)

markdown/dev/tutorials/pattern-design/rounding-the-corners/en.md

@@ -9,7 +9,7 @@ With our corners rounded, we should also update our path.
 Fortunately, we merely have to update the start of it.
 
 <Example tutorial caption="The shape our bib is now completed">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -26,18 +26,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)
@@ -217,7 +217,6 @@ function draftBib({
     .close()
     .addClass("fabric")
 
-
   return part
 }
 ```

markdown/dev/tutorials/pattern-design/shaping-the-straps/en.md

@@ -17,7 +17,7 @@ As always, [the API docs](/reference/api/point/) have all the details.
 
 
 <Example tutorial caption="All of a sudden, things are starting to look like a bib">
-```js
+```design/src/bib.mjs
 function draftBib({
   Path,
   Point,
@@ -33,18 +33,18 @@ function draftBib({
   let target = (measurements.head * options.neckRatio) /4
   let delta
   do {
-  	points.right = new Point(tweak * measurements.head / 10, 0)
+    points.right = new Point(tweak * measurements.head / 10, 0)
-  	points.bottom = new Point(0, tweak * measurements.head / 12)
+    points.bottom = new Point(0, tweak * measurements.head / 12)
 
-  	points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
+    points.rightCp1 = points.right.shift(90, points.bottom.dy(points.right)/2)
-  	points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
+    points.bottomCp2 = points.bottom.shift(0, points.bottom.dx(points.right)/2)
 
-  	paths.quarterNeck = new Path()
+    paths.quarterNeck = new Path()
-  	  .move(points.right)
+      .move(points.right)
-  	  .curve(points.rightCp1, points.bottomCp2, points.bottom)
+      .curve(points.rightCp1, points.bottomCp2, points.bottom)
       .hide() // Add this line
 
-  	delta = paths.quarterNeck.length() - target
+    delta = paths.quarterNeck.length() - target
     if (delta > 0) tweak = tweak * 0.99
     else tweak = tweak * 1.02
   } while (Math.abs(delta) > 1)