diff --git a/markdown/dev/reference/api/path/_curve/en.md b/markdown/dev/reference/api/path/_curve/en.md
index c009a9d41dc..07790435a61 100644
--- a/markdown/dev/reference/api/path/_curve/en.md
+++ b/markdown/dev/reference/api/path/_curve/en.md
@@ -17,24 +17,24 @@ Path path._curve(Point cp2, Point to)
## Example
-
+
```js
({ Point, points, Path, paths, part }) => {
points.from = new Point(5, 20);
- points.cp2 = new Point(60, 30);
+ points.cp2 = new Point(60, 50);
points.to = new Point(90, 20);
paths.line = new Path()
.move(points.from)
._curve(points.cp2, points.to)
- .attr("data-text", "Path._curve()")
- .attr("data-text-class", "text-sm center fill-note");
+ .setText("Path._curve()", "text-sm center fill-note")
+ .attr("data-text-dy", -1)
return part
}
```
-
+
## Notes
diff --git a/markdown/dev/reference/api/path/addclass/en.md b/markdown/dev/reference/api/path/addclass/en.md
index 750883efb74..d8c0d0bba40 100644
--- a/markdown/dev/reference/api/path/addclass/en.md
+++ b/markdown/dev/reference/api/path/addclass/en.md
@@ -4,31 +4,17 @@ title: Path.addClass()
The `Path.addClass()` method adds a CSS class to the path.
+## Signature
+
```js
Path path.addClass(string className)
```
-This method is chainable as it returns the `Path` object
+This method is chainable as it returns the `Path` object
-
-
-###### This method exists to save you some typing
-
-Note that the two following calls yield the same result:
-
-```js
-path.attr('class', 'fabric')
-path.addClass('fabric')
-```
-
-So the only purpose of this method is to save your some typing.
-
-
-
-
-Example of the Path.addClass() method
-
+## Example
+
```js
({ Point, points, Path, paths, part }) => {
@@ -43,3 +29,15 @@ Example of the Path.addClass() method
return part
}
```
+
+
+## Notes
+
+The main purpose of this method is to save your some typing,
+as the two following calls yield the same result:
+
+```js
+path.attr('class', 'fabric')
+path.addClass('fabric')
+```
+
diff --git a/markdown/dev/reference/api/path/addtext/en.md b/markdown/dev/reference/api/path/addtext/en.md
new file mode 100644
index 00000000000..92d455612f7
--- /dev/null
+++ b/markdown/dev/reference/api/path/addtext/en.md
@@ -0,0 +1,47 @@
+---
+title: Path.addText()
+---
+
+The `Path.addText()` method adds text to the path.
+
+## Signature
+
+```js
+Path path.addText(string text, string className)
+```
+
+The second argument will optionally be used to set the CSS class for the text.
+
+This method is chainable as it returns the `Path` object
+
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+ points.from = new Point(5, 10)
+ points.to = new Point(95, 10)
+
+ paths.line = new Path()
+ .move(points.from)
+ .line(points.to)
+ .addText('FreeSewing rocks')
+
+ return part
+}
+```
+
+
+## Notes
+
+The main purpose of this method is to save your some typing,
+as the two following calls yield the same result:
+
+```js
+path.attr('data-text', 'Hello')
+path.addText('Hello')
+```
+
+The difference with [Path.setText()](/reference/api/path/addtext) is that this
+method will add to the existing text whereas `Path.setText()` will overwrite
+existing text on the path,
diff --git a/markdown/dev/reference/api/path/aspathstring/en.md b/markdown/dev/reference/api/path/aspathstring/en.md
index 17a4d0412c9..047ecb05f4b 100644
--- a/markdown/dev/reference/api/path/aspathstring/en.md
+++ b/markdown/dev/reference/api/path/aspathstring/en.md
@@ -5,13 +5,13 @@ title: Path.asPathString()
This `Path.asPathString()` returs the path as a string that can be used
as the `d` attribute for an SVG `path` element.
+## Signature
+
```js
string path.asPathString()
```
-
+## Notes
This method is mostly aimed at people looking to implement their own rendering
methods, or integrate with SVG processing tools.
-
-
diff --git a/markdown/dev/reference/api/path/attr/en.md b/markdown/dev/reference/api/path/attr/en.md
index 9e3e087e97c..eba65e00d89 100644
--- a/markdown/dev/reference/api/path/attr/en.md
+++ b/markdown/dev/reference/api/path/attr/en.md
@@ -8,6 +8,8 @@ It calls `this.attributes.add()` under the hood, and returns the Path object.
If the third parameter is set to `true` it will call `this.attributes.set()`
instead, thereby overwriting the value of the attribute.
+## Signature
+
```js
Path path.attr(
string name,
@@ -18,31 +20,35 @@ Path path.attr(
This method is chainable as it returns the `Path` object
-
-Example of the Path.attr() method
-
+## Example
+
```js
({ Point, points, Path, paths, part }) => {
- points.from = new Point(10, 50);
- points.cp1 = new Point(40, 10);
- points.cp2 = new Point(90, 30);
- points.to = new Point(50, 90);
+ points.from = new Point(10, 20);
+ points.cp1 = new Point(20, -10);
+ points.cp2 = new Point(50, 50);
+ points.to = new Point(70, 20);
paths.example = new Path()
.move(points.from)
.curve(points.cp1, points.cp2, points.to)
- .addClass("canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
+ .setClass("canvas")
+ .setText("FreeSewing rocks", "text-xs center")
return part
+}
```
+
-
-Methods like `addClass`, `setClass`, `addCircle`, `setCircle`, `adddText`, and `setText`
+## Notes
+
+Methods like
+[`Path.addClass`](/reference/api/path/addclass),
+[`Path.setClass`](/reference/api/path/setclass),
+[`Path.adddText`](/reference/api/path/addtext), and
+[`Path.setText`](/reference/api/path/settext)
all call this method under the hood.
-
diff --git a/markdown/dev/reference/api/path/bbox/en.md b/markdown/dev/reference/api/path/bbox/en.md
index 1b16ac663a7..3c2cf3241ab 100644
--- a/markdown/dev/reference/api/path/bbox/en.md
+++ b/markdown/dev/reference/api/path/bbox/en.md
@@ -5,6 +5,8 @@ title: Path.bbox()
The `Path.bbox()` method returns an object describing the bounding box of a path.
In other words, it gives you a rectangle the Path fits in.
+## Signature
+
```js
object path.bbox()
```
@@ -18,8 +20,6 @@ It returns an object with a signature like this:
}
```
-
+## Notes
This method is mostly aimed at people looking to implement their own layout solution.
-
-
diff --git a/markdown/dev/reference/api/path/clone/en.md b/markdown/dev/reference/api/path/clone/en.md
index 1c750154139..158935ef4d0 100644
--- a/markdown/dev/reference/api/path/clone/en.md
+++ b/markdown/dev/reference/api/path/clone/en.md
@@ -4,30 +4,36 @@ title: Path.clone()
The `Path.clone()` method returns a new `Path` object that is a deep copy of this path.
+## Signature
+
```js
Path path.clone()
```
-
-Example of the Path.clone() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C);
+
+ paths.clone = paths.example
+ .clone()
+ .setClass("note lashed stroke-xl")
+ .attr("style", "stroke-opacity: 0.5");
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-paths.clone = paths.example
- .clone()
- .attr("class", "note lashed stroke-l")
- .attr("style", "stroke-opacity: 0.5");
-```
diff --git a/markdown/dev/reference/api/path/close/en.md b/markdown/dev/reference/api/path/close/en.md
index db3e3b7a738..3cddea95219 100644
--- a/markdown/dev/reference/api/path/close/en.md
+++ b/markdown/dev/reference/api/path/close/en.md
@@ -1,29 +1,36 @@
---
-title: close()
+title: Path.close()
---
+The `Path.close()` method closes a path by drawing a straight line from the current position to the path's start.
+
+## Signature
+
```js
Path path.close()
```
-Closes a path by drawing a straight line from the current position to the path's start.
+This method is chainable as it returns the `Path` object
-
-Example of the Path.close() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.from = new Point(10, 20)
+ points.cp2 = new Point(60, 30)
+ points.to = new Point(90, 20)
+
+ paths.line = new Path()
+ .move(points.from)
+ ._curve(points.cp2, points.to)
+ .close()
+ .reverse() // To keep text from being upside-down
+ .setText('Path._close()', 'text-sm right fill-note')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.from = new Point(10, 20);
-points.cp2 = new Point(60, 30);
-points.to = new Point(90, 20);
-
-paths.line = new Path()
- .move(points.from)
- ._curve(points.cp2, points.to)
- .close()
- .reverse() // To keep text from being upside-down
- .attr("data-text", "Path._close()")
- .attr("data-text-class", "text-sm right fill-note");
-```
diff --git a/markdown/dev/reference/api/path/curve/en.md b/markdown/dev/reference/api/path/curve/en.md
index 22ce7ba5485..825450ebd22 100644
--- a/markdown/dev/reference/api/path/curve/en.md
+++ b/markdown/dev/reference/api/path/curve/en.md
@@ -1,28 +1,36 @@
---
-title: curve()
+title: Path.curve()
---
+The `Path.curve()` method draws a cubic Bezier curve from the current position
+via two control points to a given endpoint.
+
+## Signature
+
```js
Path path.curve(Point cp1, Point cp2, Point to)
```
-Draws a cubic Bezier curve from the current position via two control points to a given endpoint.
+This method is chainable as it returns the `Path` object
-
-Example of the Path.curve() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.from = new Point(10, 20);
+ points.cp1 = new Point(40, 0);
+ points.cp2 = new Point(60, 40);
+ points.to = new Point(90, 20);
+
+ paths.line = new Path()
+ .move(points.from)
+ .curve(points.cp1, points.cp2, points.to)
+ .setText("Path.curve()", "text-sm center fill-note")
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.from = new Point(10, 20);
-points.cp1 = new Point(40, 0);
-points.cp2 = new Point(60, 30);
-points.to = new Point(90, 20);
-
-paths.line = new Path()
- .move(points.from)
- .curve(points.cp1, points.cp2, points.to)
- .attr("data-text", "Path.curve()")
- .attr("data-text-class", "text-sm center fill-note");
-```
diff --git a/markdown/dev/reference/api/path/curve_/en.md b/markdown/dev/reference/api/path/curve_/en.md
index 5499d61726a..c74865423cb 100644
--- a/markdown/dev/reference/api/path/curve_/en.md
+++ b/markdown/dev/reference/api/path/curve_/en.md
@@ -1,35 +1,26 @@
---
-title: "curve_()"
+title: Path.curve_()
---
+The `Path.curve_()` method draws a cubic Bezier curve from the current position
+via two control points to a given endpoint. However, the end control point is
+identical to the end point.
+
+## Signature
+
```js
Path path.curve_(Point cp1, Point to)
```
-Draws a cubic Bezier curve from the current position via two control points to a given endpoint.
-However, the end control point is identical to the end point.
+This method is chainable as it returns the `Path` object
-
+## Example
-###### This method exists to save you some typing
-Note that the two following calls yield the same result:
+
```js
-.curve(point1, point2, point2)
-.curve_(point1, point2)
-```
-
-So the only purpose of this method is to save your some typing;
-
-
-
-
-Example of the Path.curve\_() method
-
-
-```js
- let { Point, points, Path, paths } = part.shorthand();
+({ Point, points, Path, paths, part }) => {
points.from = new Point(10, 20);
points.cp1 = new Point(40, 0);
@@ -38,6 +29,20 @@ Example of the Path.curve\_() method
paths.line = new Path()
.move(points.from)
.curve_(points.cp1, points.to)
- .attr("data-text", "Path.curve_()")
- .attr("data-text-class", "text-sm center fill-note");
+ .setText("Path.curve_()", "text-sm center fill-note")
+ .attr("data-text-dy", -1)
+
+ return part
+}
+```
+
+
+## Notes
+
+The main purpose of this method is to save your some typing,
+as the two following calls yield the same result:
+
+```js
+.curve(point1, point2, point2)
+.curve_(point1, point2)
```
diff --git a/markdown/dev/reference/api/path/divide/en.md b/markdown/dev/reference/api/path/divide/en.md
index 522d7b4bd2c..5bfee5e418f 100644
--- a/markdown/dev/reference/api/path/divide/en.md
+++ b/markdown/dev/reference/api/path/divide/en.md
@@ -1,42 +1,49 @@
---
-title: divide()
+title: Path.divide()
---
+The `Path.divide()` method breaks a path apart in an array of atomic paths. An
+atomic path is a path that can't be divided further and is always made up of
+one move + one drawing operation.
+
+## Signature
+
```js
array path.divide()
```
-Breaks a path apart in an array of atomic paths. An atomic path is a path that can't be divided further and is
-always made up of one move + one drawing operation.
-
-
-Example of the Path.divide() method
-
+## Example
+
```js
-let { Point, points, Path, paths } = part.shorthand();
+({ Point, points, Path, paths, part }) => {
-points.A = new Point(55, 40);
-points.B = new Point(10, 70);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 60);
-points.CCp1 = new Point(50, -30);
-points.D = new Point(50, 80);
-points.DCp1 = new Point(140, 50);
+ points.A = new Point(55, 40);
+ points.B = new Point(10, 70);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 60);
+ points.CCp1 = new Point(50, -30);
+ points.D = new Point(50, 80);
+ points.DCp1 = new Point(140, 50);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .curve(points.DCp1, points.DCp1, points.D)
+ .close();
+
+ let style = "stroke-width: 4; stroke-opacity: 0.5;";
+ let i = 0;
+ for (let p of paths.example.divide()) {
+ i++;
+ paths[i] = p
+ .attr("style", style)
+ .attr('style', `stroke: hsl(${i * 70}, 100%, 50%)`)
+ }
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .curve(points.DCp1, points.DCp1, points.D)
- .close();
-
-let style = "stroke-width: 4; stroke-opacity: 0.5;";
-let i = 0;
-for (let p of paths.example.divide()) {
- i++;
- paths[i] = p
- .attr("style", style)
- .attr("style", `stroke: hsl(${i * 70}, 100%, 50%)`);
+ return part
}
```
+
+
diff --git a/markdown/dev/reference/api/path/edge/en.md b/markdown/dev/reference/api/path/edge/en.md
index b229c539d13..d2b0d6663ee 100644
--- a/markdown/dev/reference/api/path/edge/en.md
+++ b/markdown/dev/reference/api/path/edge/en.md
@@ -1,5 +1,5 @@
---
-title: edge()
+title: Path.edge()
---
```js
@@ -17,36 +17,37 @@ Returns the Point object at the edge of the path you specify. Edge must be one o
- `bottomLeft`
- `bottomRight`
-
-Example of the Path.edge() method
-
-
+
```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
+({ Point, points, Path, paths,snippets, Snippet, part }) => {
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-points.D = new Point(-60, 90);
-points.E = new Point(90, 190);
+ points.A = new Point(45, 60)
+ points.B = new Point(10, 30)
+ points.BCp2 = new Point(40, 20)
+ points.C = new Point(90, 30)
+ points.CCp1 = new Point(50, -30)
+ points.D = new Point(-60, 90)
+ points.E = new Point(90, 190)
+
+ paths.demo = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .curve(points.E, points.D, points.A)
+ .close()
+
+ for (let i of [
+ "topLeft",
+ "topRight",
+ "bottomLeft",
+ "bottomRight",
+ "top",
+ "left",
+ "bottom",
+ "right"
+ ]) snippets[i] = new Snippet("notch", paths.demo.edge(i))
-paths.demo = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .curve(points.E, points.D, points.A)
- .close();
-
-for (let i of [
- "topLeft",
- "topRight",
- "bottomLeft",
- "bottomRight",
- "top",
- "left",
- "bottom",
- "right"
-]) snippets[i] = new Snippet("notch", paths.demo.edge(i));
+ return part
+}
```
+
diff --git a/markdown/dev/reference/api/path/en.md b/markdown/dev/reference/api/path/en.md
index f797e50c045..6c079467db1 100644
--- a/markdown/dev/reference/api/path/en.md
+++ b/markdown/dev/reference/api/path/en.md
@@ -13,8 +13,13 @@ Path new Path();
A Path objects comes with the following properties:
-- `render` : Set this to `false` to not render the path (exclude it from the output)
-- `attributes` : An [Attributes](/reference/api/attributes) instance holding the path's attributes
+- `attributes` : An [Attributes](/reference/api/attributes) instance holding
+ the path's attributes
+- `hidden` : When this is `true` the path will be hidden (excluded it from the
+ output). See [Path.hide()](/reference/api/path/hide),
+ [Path.unhide()](/reference/api/path/unhide), and
+ [Path.setHidden()](/reference/api/path/sethidden) for various methods that
+ allow setting this in a chainable way.
In addition, a Path object exposes the following methods:
diff --git a/markdown/dev/reference/api/path/end/en.md b/markdown/dev/reference/api/path/end/en.md
index 278791d8373..ba128d42b92 100644
--- a/markdown/dev/reference/api/path/end/en.md
+++ b/markdown/dev/reference/api/path/end/en.md
@@ -1,30 +1,38 @@
---
-title: end()
+title: Path.end()
---
+The `Path.end()` method returns the Point object at the end of the path.
+
+## Signature
+
```js
Point path.end()
```
-Returns the Point object at the end of the path.
+This method is chainable as it returns the `Path` object
-
-Example of the Path.end() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, snippets, Snippet, part }) => {
+
+ points.A = new Point(45, 60)
+ points.B = new Point(10, 30)
+ points.BCp2 = new Point(40, 20)
+ points.C = new Point(90, 30)
+ points.CCp1 = new Point(50, -30)
+
+ paths.demo = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+
+ snippets.end = new Snippet("notch", paths.demo.end())
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.demo = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-snippets.end = new Snippet("notch", paths.demo.end());
-```
diff --git a/markdown/dev/reference/api/path/hide/en.md b/markdown/dev/reference/api/path/hide/en.md
index ed231b36511..e0f9b535b1e 100644
--- a/markdown/dev/reference/api/path/hide/en.md
+++ b/markdown/dev/reference/api/path/hide/en.md
@@ -1,37 +1,33 @@
---
-title: hide()
+title: Path.hide()
---
+The `Path.hide()` hides the path so it does not appear in the output.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.hide()
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.top = new Point(50, 0)
+ points.left = new Point (20,50)
+ points.right = new Point (80,50)
+
+ paths.a = new Path().move(points.top).line(points.right).setText('a')
+ paths.b = new Path().move(points.right).line(points.left).setText('b').hide()
+ paths.c = new Path().move(points.left).line(points.top).setText('c')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```
diff --git a/markdown/dev/reference/api/path/insop/en.md b/markdown/dev/reference/api/path/insop/en.md
index f6b18f2378c..b9a430453f8 100644
--- a/markdown/dev/reference/api/path/insop/en.md
+++ b/markdown/dev/reference/api/path/insop/en.md
@@ -1,38 +1,51 @@
---
-title: insop()
+title: Path.insop()
---
+The `Path.insop()` method injects a Path into the [`noop`
+operation](/reference/api/path/noop) with id `id`.
+
+## Signature
+
```js
Path path.insop(string id, Path path)
```
-Injects a Path into the [`noop` operation](/reference/api/path/noop) with id `id`.
+This method is chainable as it returns the `Path` object
-This is often used to insert darts into a path
-
-Example of the Path.noop() method
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.left = new Point(10,10)
+ points.dartLeft = new Point(40, 10)
+ points.dartTip = new Point(50, 50)
+ points.dartRight = new Point(60, 10)
+ points.right = new Point(90, 10)
+
+ paths.withoutDart = new Path()
+ .move(points.left)
+ .line(points.dartLeft)
+ .noop('dart')
+ .line(points.right)
+
+ paths.withDart = paths.withoutDart
+ .clone()
+ .insop(
+ 'dart',
+ new Path()
+ .line(points.dartTip)
+ .line(points.dartRight)
+ )
+ .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
+
+ return part
+}
+```
-```js
-points.left = new Point(10,10)
-points.dartLeft = new Point(40, 10)
-points.dartTip = new Point(50, 50)
-points.dartRight = new Point(60, 10)
-points.right = new Point(90, 10)
+## Notes
-paths.withoutDart = new Path()
- .move(points.left)
- .line(points.dartLeft)
- .noop('dart')
- .line(points.right)
+This is often used to insert darts into a path.
-paths.withDart = paths.without
- .insop(
- 'dart',
- new Path()
- .line(points.dartTip)
- .line(points.dartRight)
- )
- .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
-```
diff --git a/markdown/dev/reference/api/path/intersects/en.md b/markdown/dev/reference/api/path/intersects/en.md
index 8eed5092151..ddb4171dc32 100644
--- a/markdown/dev/reference/api/path/intersects/en.md
+++ b/markdown/dev/reference/api/path/intersects/en.md
@@ -1,59 +1,61 @@
---
-title: intersects()
+title: Path.intersects()
---
- ```
- array|false path.intersects(Path path)
- ```
+The `Path.intersects()` method returns the Point object(s) where the path
+intersects with a path you pass it.
-Returns the Point object(s) where the path intersects with a path you pass it.
+## Signature
-
+```
+array|false path.intersects(Path path)
+```
-###### Use the intersection methods in Utils whenever possible
+
+
+```js
+({ Point, points, Path, paths, snippets, Snippet, getId, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+ points.D = new Point(50, 130);
+ points.DCp1 = new Point(150, 30);
+
+ points._A = new Point(55, 40);
+ points._B = new Point(0, 55);
+ points._BCp2 = new Point(40, -20);
+ points._C = new Point(90, 40);
+ points._CCp1 = new Point(50, -30);
+ points._D = new Point(40, 120);
+ points._DCp1 = new Point(180, 40);
+
+ paths.demo1 = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .curve(points.DCp1, points.DCp1, points.D);
+ paths.demo2 = new Path()
+ .move(points._A)
+ .line(points._B)
+ .curve(points._BCp2, points._CCp1, points._C)
+ .curve(points._DCp1, points._DCp1, points._D);
+
+ for (let p of paths.demo1.intersects(paths.demo2)) {
+ snippets[getId()] = new Snippet('notch', p)
+ }
+
+ return part
+}
+```
+
+
+
+## Notes
This is an expensive (read: slow) method that you should only use when you don't know
in advance in what segment of your path the intersection will occur.
If you do know, use one of the intersection methods in [Utils](/reference/api/utils).
-
-
-
-
-Example of the Path.intersects() method
-
-
- ```js
- let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
-
- points.A = new Point(45, 60);
- points.B = new Point(10, 30);
- points.BCp2 = new Point(40, 20);
- points.C = new Point(90, 30);
- points.CCp1 = new Point(50, -30);
- points.D = new Point(50, 130);
- points.DCp1 = new Point(150, 30);
-
- points._A = new Point(55, 40);
- points._B = new Point(0, 55);
- points._BCp2 = new Point(40, -20);
- points._C = new Point(90, 40);
- points._CCp1 = new Point(50, -30);
- points._D = new Point(40, 120);
- points._DCp1 = new Point(180, 40);
-
- paths.demo1 = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .curve(points.DCp1, points.DCp1, points.D);
- paths.demo2 = new Path()
- .move(points._A)
- .line(points._B)
- .curve(points._BCp2, points._CCp1, points._C)
- .curve(points._DCp1, points._DCp1, points._D);
-
- for (let p of paths.demo1.intersects(paths.demo2)) {
- snippets[part.getId()] = new Snippet("notch", p);
- }
- ```
diff --git a/markdown/dev/reference/api/path/intersectsx/en.md b/markdown/dev/reference/api/path/intersectsx/en.md
index 858b6edab96..9a38ef9c416 100644
--- a/markdown/dev/reference/api/path/intersectsx/en.md
+++ b/markdown/dev/reference/api/path/intersectsx/en.md
@@ -1,43 +1,50 @@
---
-title: intersectsX()
+title: Path.intersectsX()
---
+The `Path.intersectsX()` method returns the Point object(s) where the path
+intersects with a given X-value.
+
+## Signature
+
```js
array|false path.intersectsX(float x)
```
-Returns the Point object(s) where the path intersects with a given X-value.
-
-
-Example of the Path.intersectsX() method
-
+## Example
+
```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
+({ Point, points, Path, paths, snippets, Snippet, getId, part }) => {
-points.A = new Point(95, 50);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-points.D = new Point(50, 130);
-points.DCp1 = new Point(150, 30);
+ points.A = new Point(95, 50);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+ points.D = new Point(50, 130);
+ points.DCp1 = new Point(150, 30);
+
+ points.top = new Point(60, -10);
+ points.bot = new Point(60, 140);
+
+ paths.line = new Path()
+ .move(points.top)
+ .line(points.bot)
+ .attr("class", "lining dashed");
+
+ paths.demo = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .curve(points.DCp1, points.DCp1, points.D);
+
+ for (let p of paths.demo.intersectsX(60)) {
+ snippets[getId()] = new Snippet("notch", p);
+ }
-points.top = new Point(60, -10);
-points.bot = new Point(60, 140);
-
-paths.line = new Path()
- .move(points.top)
- .line(points.bot)
- .attr("class", "lining dashed");
-
-paths.demo = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .curve(points.DCp1, points.DCp1, points.D);
-
-for (let p of paths.demo.intersectsX(60)) {
- snippets[part.getId()] = new Snippet("notch", p);
+ return part
}
```
+
+
diff --git a/markdown/dev/reference/api/path/intersectsy/en.md b/markdown/dev/reference/api/path/intersectsy/en.md
index df06a59385b..b825ec0e77a 100644
--- a/markdown/dev/reference/api/path/intersectsy/en.md
+++ b/markdown/dev/reference/api/path/intersectsy/en.md
@@ -1,43 +1,50 @@
---
-title: intersectsY()
+title: Path.intersectsY()
---
+The `Path.intersectsY()` method returns the Point object(s) where the path
+intersects with a given Y-value.
+
+## Signature
+
```js
array|false path.intersectsY(float y)
```
-Returns the Point object(s) where the path intersects with a given Y-value.
-
-
-Example of the Path.intersectsY() method
-
+## Example
+
```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
+({ Point, points, Path, paths, snippets, Snippet, getId, part }) => {
-points.A = new Point(55, 40);
-points.B = new Point(10, 70);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 60);
-points.CCp1 = new Point(50, -30);
-points.D = new Point(50, 80);
-points.DCp1 = new Point(140, 50);
+ points.A = new Point(55, 40);
+ points.B = new Point(10, 70);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 60);
+ points.CCp1 = new Point(50, -30);
+ points.D = new Point(50, 80);
+ points.DCp1 = new Point(140, 50);
-points.top = new Point(10, 58);
-points.bot = new Point(130, 58);
+ points.top = new Point(10, 58);
+ points.bot = new Point(130, 58);
-paths.line = new Path()
- .move(points.top)
- .line(points.bot)
- .attr("class", "lining dashed");
+ paths.line = new Path()
+ .move(points.top)
+ .line(points.bot)
+ .attr("class", "lining dashed");
-paths.demo = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .curve(points.DCp1, points.DCp1, points.D);
+ paths.demo = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .curve(points.DCp1, points.DCp1, points.D);
-for (let p of paths.demo.intersectsY(58)) {
- snippets[part.getId()] = new Snippet("notch", p);
+ for (let p of paths.demo.intersectsY(58)) {
+ snippets[getId()] = new Snippet("notch", p);
+ }
+
+ return part
}
```
+
+
diff --git a/markdown/dev/reference/api/path/join/en.md b/markdown/dev/reference/api/path/join/en.md
index 32a2e1ab4a0..17bbb31abd5 100644
--- a/markdown/dev/reference/api/path/join/en.md
+++ b/markdown/dev/reference/api/path/join/en.md
@@ -1,44 +1,49 @@
---
-title: join()
+title: Path.join()
---
+The `Path.join()` method joins this path with another path.
+
+
+## Signature
+
```js
Path path.join(path other)
```
-Joins this path with another path.
+## Examples
-
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.A = new Point(45, 60)
+ points.B = new Point(10, 30)
+ points.BCp2 = new Point(40, 20)
+ points.C = new Point(90, 30)
+ points.CCp1 = new Point(50, -30)
+
+ paths.path1 = new Path()
+ .move(points.A)
+ .line(points.B)
+ .setClass("various")
+
+ paths.path2 = new Path()
+ .move(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .setClass("note")
+
+ paths.joint = paths.path1
+ .join(paths.path2)
+ .setClass("lining dotted")
+
+ return part
+}
+```
+
+
+
+## Notes
You cannot join a closed path to another path
-
-
-
-Example of the Path.join() method
-
-
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.path1 = new Path()
- .move(points.A)
- .line(points.B)
- .attr("class", "various");
-
-paths.path2 = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas");
-
-paths.joint = paths.path1
- .join(paths.path2)
- .attr("class", "note lashed stroke-l")
- .attr("style", "stoke-opacity: 0.5");
-```
diff --git a/markdown/dev/reference/api/path/length/en.md b/markdown/dev/reference/api/path/length/en.md
index ca15197e6f7..e58a5e4cdb9 100644
--- a/markdown/dev/reference/api/path/length/en.md
+++ b/markdown/dev/reference/api/path/length/en.md
@@ -1,43 +1,49 @@
---
-title: length()
+title: Path.length()
---
+The `Path.length()` method returns the length of the path.
+
+## Signature
+
```js
float path.length()
```
-Returns the length of the path.
+## Example
-
-Example of the Path.length() method
+
+```js
+({ Point, points, Path, paths, macro, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C);
+
+ macro("pd", {
+ path: paths.example,
+ d: -20
+ });
+
+ macro("pd", {
+ path: new Path().move(points.B).line(points.A),
+ d: 10
+ });
+
+ macro("pd", {
+ path: new Path().move(points.B).curve(points.BCp2, points.CCp1, points.C),
+ d: -10
+ });
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths, macro } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-macro("pd", {
- path: paths.example,
- d: -20
-});
-
-macro("pd", {
- path: new Path().move(points.B).line(points.A),
- d: 10
-});
-
-macro("pd", {
- path: new Path().move(points.B).curve(points.BCp2, points.CCp1, points.C),
- d: -10
-});
-```
diff --git a/markdown/dev/reference/api/path/line/en.md b/markdown/dev/reference/api/path/line/en.md
index 2cf569eb77e..906ec3d2974 100644
--- a/markdown/dev/reference/api/path/line/en.md
+++ b/markdown/dev/reference/api/path/line/en.md
@@ -1,26 +1,34 @@
---
-title: line()
+title: Path.line()
---
+The `Path.line()` method draws a straight line from the current position to a
+given point.
+
+## Signature
+
```js
Path path.line(Point to)
```
-Draws a straight line from the current position to a given point.
+This method is chainable as it returns the `Path` object
-
-Example of the Path.line() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.from = new Point(10, 10)
+ points.to = new Point(90, 10)
+
+ paths.line = new Path()
+ .move(points.from)
+ .line(points.to)
+ .setText("Path.line()", "text-sm center fill-note")
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.from = new Point(10, 10);
-points.to = new Point(90, 10);
-
-paths.line = new Path()
- .move(points.from)
- .line(points.to)
- .attr("data-text", "Path.line()")
- .attr("data-text-class", "text-sm center fill-note");
-```
diff --git a/markdown/dev/reference/api/path/move/en.md b/markdown/dev/reference/api/path/move/en.md
index 7fb24ec2aee..f80354c7f19 100644
--- a/markdown/dev/reference/api/path/move/en.md
+++ b/markdown/dev/reference/api/path/move/en.md
@@ -1,18 +1,36 @@
---
-title: move()
+title: Path.move()
---
+The `Path.move()` method moves to a given point without drawing a line.
+
+## Signature
+
```js
Path path.move(Point to)
```
-Moves to a given point without drawing a line.
+## Example
-
-###### Always start your path with a move
+
+```js
+({ Point, points, Path, paths, part }) => {
-When drawing a path, you must always start with a `move()` call,
+ points.to = new Point(50, 20)
+ .setText("Path.move()", "text-xs fill-note center")
+
+ paths.noline = new Path().move(points.to)
+
+ return part
+}
+```
+
+
+
+## Notes
+
+When drawing a path, **you must always start with a `move()` call**,
followed by your `line()` and/or `curve()` calls
and an optional `close()` call.
@@ -23,21 +41,5 @@ paths.example = new Path()
.move(points.a)
.curve(points.b, points.c, points.d)
.line(points.e)
- .close();
-```
-
-
-
-
-Example of the Path.move() method
-
-
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.to = new Point(50, 20)
- .attr("data-text", "Path.move()")
- .attr("data-text-class", "text-xs fill-note");
-
-paths.noline = new Path().move(points.to);
+ .close()
```
diff --git a/markdown/dev/reference/api/path/noop/en.md b/markdown/dev/reference/api/path/noop/en.md
index 88fad6961ff..38fa85198ed 100644
--- a/markdown/dev/reference/api/path/noop/en.md
+++ b/markdown/dev/reference/api/path/noop/en.md
@@ -1,41 +1,49 @@
---
-title: noop()
+title: Path.noop()
---
+The `Path.noop()` method adds a placeholder path operation.
+A `noop` operation does nothing, but is intended to be replaced later
+with [`Path.insop()`](/reference/api/path/insop).
+
+## Signature
+
```js
Path path.noop(string id)
```
-Adds a placeholder path operation.
+This method is chainable as it returns the `Path` object
-A `noop` operation does nothing, but is intended to be replaced later
-with [`Path.insop()`](/reference/api/path/insop).
+## Example
-This is often used to insert darts into a path
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.noop() method
+ points.left = new Point(10,10)
+ points.dartLeft = new Point(40, 10)
+ points.dartTip = new Point(50, 50)
+ points.dartRight = new Point(60, 10)
+ points.right = new Point(90, 10)
+
+ paths.withoutDart = new Path()
+ .move(points.left)
+ .line(points.dartLeft)
+ .noop('dart')
+ .line(points.right)
+
+ paths.withDart = paths.withoutDart
+ .clone()
+ .insop(
+ 'dart',
+ new Path()
+ .line(points.dartTip)
+ .line(points.dartRight)
+ )
+ .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
+
+ return part
+}
+```
-```js
-points.left = new Point(10,10)
-points.dartLeft = new Point(40, 10)
-points.dartTip = new Point(50, 50)
-points.dartRight = new Point(60, 10)
-points.right = new Point(90, 10)
-
-paths.withoutDart = new Path()
- .move(points.left)
- .line(points.dartLeft)
- .noop('dart')
- .line(points.right)
-
-paths.withDart = paths.without
- .insop(
- 'dart',
- new Path()
- .line(points.dartTip)
- .line(points.dartRight)
- )
- .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
-```
diff --git a/markdown/dev/reference/api/path/offset/en.md b/markdown/dev/reference/api/path/offset/en.md
index c5ce02fae6d..c52d43fcf5f 100644
--- a/markdown/dev/reference/api/path/offset/en.md
+++ b/markdown/dev/reference/api/path/offset/en.md
@@ -1,46 +1,53 @@
---
-title: offset()
+title: Path.offset()
---
+The `Path.offset()` method returns a new Path that is offset by distance from
+the original path.
+
+## Signature
+
```js
Path path.offset(float distance)
```
-Returns a new Path that is offset by distance from the original path.
+## Example
-
-Example of the Path.offset() method
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .line(points.A)
+ .close();
+
+ paths.offset = paths.example
+ .offset(-10)
+ .attr("class", "interfacing");
+
+ paths.lineOffset = new Path()
+ .move(points.A)
+ .line(points.B)
+ .offset(-5)
+ .attr("class", "various");
+
+ paths.curveOffset = new Path()
+ .move(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .offset(-5)
+ .attr("class", "canvas");
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .line(points.A)
- .close();
-
-paths.offset = paths.example
- .offset(-10)
- .attr("class", "interfacing");
-
-paths.lineOffset = new Path()
- .move(points.A)
- .line(points.B)
- .offset(-5)
- .attr("class", "various");
-
-paths.curveOffset = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .offset(-5)
- .attr("class", "canvas");
-```
diff --git a/markdown/dev/reference/api/path/reverse/en.md b/markdown/dev/reference/api/path/reverse/en.md
index 55f8f102fc9..d9952973e0b 100644
--- a/markdown/dev/reference/api/path/reverse/en.md
+++ b/markdown/dev/reference/api/path/reverse/en.md
@@ -1,42 +1,49 @@
---
-title: reverse()
+title: Path.reverse()
---
+The `Path.reverse()` returns a path that is the reversed version of this path.
+As in, start becomes end, and end becomes start.
+
+## Signature
+
```js
-Path path.reverse()
+Path path.reverse(bool cloneAttributes=false)
```
-Returns a path that is the reversed version of this path. As in, start becomes end, and end becomes start.
+If you pass a truthy value to this method, it will return a deep clone of the
+path, including its attributes. By default, it will return a shallow
+copy, whithout the attributes.
-
+## Example
+
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+ .setText("FreeSewing rocks", "text-xs fill-note center")
+
+ paths.reverse = paths.example.reverse(true)
+
+ return part
+}
+```
+
+
+## Notes
The reversed path is a shallow copy.
It will in other words not inherit the attributes of the original path.
-If you want a deep copy, including the attributes, use `Path.clone().reverse()`.
+If you want a deep copy, including the attributes, use `Path.reverse(true)`.
-
-
-Example of the Path.reverse() method
-
-
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs fill-note");
-
-paths.reverse = paths.example
- .reverse()
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs fill-lining");
-```
diff --git a/markdown/dev/reference/api/path/roughlength/en.md b/markdown/dev/reference/api/path/roughlength/en.md
index 5280edae521..de51a13fdce 100644
--- a/markdown/dev/reference/api/path/roughlength/en.md
+++ b/markdown/dev/reference/api/path/roughlength/en.md
@@ -1,37 +1,50 @@
---
-title: roughLength()
+title: Path.roughLength()
---
+The `Path.roughLength()` method returns a (very) rough estimate of the path's length.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Number path.roughLength()
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+## Example
-This allows you to chain different calls together as in the example below.
+
+```js
+({ Point, points, Path, paths, macro, units, part }) => {
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(120, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.B)
+ .curve(points.BCp2, points.CCp1, points.C);
+
+ macro("pd", {
+ path: paths.example,
+ d: -10,
+ text: `Path.roughLength() = ${units(paths.example.roughLength())}`
+ })
+ macro("pd", {
+ path: paths.example,
+ d: 10,
+ text: `Path.length() = ${units(paths.example.length())}`
+ });
+
-
-Example of the Path.attr() method
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
+## Notes
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
+The `Path.roughLength()` is not intended to give an estimate that is accurate, but rather differentiatate between paths that are a few millimeter long, or meters long.
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```
+It calculates the length without *walking the (cubic) Bezier curve* making it very fast and very inaccurate (for curves).
+It is typically used to determine how much precision to apply when walking a curve.
diff --git a/markdown/dev/reference/api/path/setclass/en.md b/markdown/dev/reference/api/path/setclass/en.md
index b4c4f8f5471..28a3407faf2 100644
--- a/markdown/dev/reference/api/path/setclass/en.md
+++ b/markdown/dev/reference/api/path/setclass/en.md
@@ -1,37 +1,43 @@
---
-title: setClass()
+title: Path.setClass()
---
+The `Path.setClass()` method sets the CSS class(es) of the path.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.setClass(string className)
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.from = new Point(5, 10)
+ points.to = new Point(95, 10)
+
+ paths.line = new Path()
+ .move(points.from)
+ .line(points.to)
+ .setClass('note dashed')
+
+ return part
+}
+```
+## Notes
+
+The main purpose of this method is to save your some typing,
+as the two following calls yield the same result:
+
```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
+path.attr('class', 'fabric', true)
+path.addClass('fabric')
```
+
diff --git a/markdown/dev/reference/api/path/sethidden/en.md b/markdown/dev/reference/api/path/sethidden/en.md
index 4ff2a979132..31fb5df586c 100644
--- a/markdown/dev/reference/api/path/sethidden/en.md
+++ b/markdown/dev/reference/api/path/sethidden/en.md
@@ -1,37 +1,34 @@
---
-title: setHidden()
+title: Path.setHidden()
---
+The `Path.setHidden()` method either hides or unhides the path depending on the
+value you pass it.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.setHidden(bool hidden = false)
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.top = new Point(50, 0)
+ points.left = new Point (20,50)
+ points.right = new Point (80,50)
+
+ paths.a = new Path().move(points.top).line(points.right).setText('a')
+ paths.b = new Path().move(points.right).line(points.left).setText('b').setHidden(true)
+ paths.c = new Path().move(points.left).line(points.top).setText('c')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```
diff --git a/markdown/dev/reference/api/path/setrender/en.md b/markdown/dev/reference/api/path/setrender/en.md
deleted file mode 100644
index 8e809bd146d..00000000000
--- a/markdown/dev/reference/api/path/setrender/en.md
+++ /dev/null
@@ -1,12 +0,0 @@
----
-title: setRender()
----
-
-```js
-Path path.setRender(bool render)
-```
-
-This is a chainable method to sets the `path.render` property.
-If you set it to `false` your path will not be rendered.
-
-Add example
diff --git a/markdown/dev/reference/api/path/settext/en.md b/markdown/dev/reference/api/path/settext/en.md
new file mode 100644
index 00000000000..578b3c08908
--- /dev/null
+++ b/markdown/dev/reference/api/path/settext/en.md
@@ -0,0 +1,48 @@
+---
+title: Path.setText()
+---
+
+The `Path.addText()` method set text on the path.
+
+## Signature
+
+```js
+Path path.setText(string text, string className)
+```
+
+The second argument will optionally be used to set the CSS class for the text.
+
+This method is chainable as it returns the `Path` object
+
+## Example
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+ points.from = new Point(5, 10)
+ points.to = new Point(95, 10)
+
+ paths.line = new Path()
+ .move(points.from)
+ .line(points.to)
+ .addText('FreeSewing rocks')
+
+ return part
+}
+```
+
+
+## Notes
+
+The main purpose of this method is to save your some typing,
+as the two following calls yield the same result:
+
+```js
+path.attr('data-text', 'Hello')
+path.setText('Hello')
+```
+
+The difference with [Path.addText()](/reference/api/path/addtext) is that this
+method will overwrite existing text on the path, whereas `Path.addText()` will
+add to the existing text.
+
diff --git a/markdown/dev/reference/api/path/shiftalong/en.md b/markdown/dev/reference/api/path/shiftalong/en.md
index bda434d566f..c31b402bcc8 100644
--- a/markdown/dev/reference/api/path/shiftalong/en.md
+++ b/markdown/dev/reference/api/path/shiftalong/en.md
@@ -1,54 +1,55 @@
---
-title: shiftAlong()
+title: Path.shiftAlong()
---
-```js
-Point path.shiftAlong(float distance[, int stepsPerMm=25])
-```
+The `Path.shiftAlong()` method returns a point that lies at distance travelled
+along the path.
-Returns a point that lies at distance travelled along the path.
-
-
-Example of the Path.shiftAlong() method
-
+## Signature
```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-points.x1 = paths.example
- .shiftAlong(20)
- .attr("data-text", "2cm")
- .attr("data-text-class", "center fill-note")
- .attr("data-text-lineheight", 6);
-points.x2 = paths.example
- .shiftAlong(90)
- .attr("data-text", "9cm")
- .attr("data-text-class", "center fill-note")
- .attr("data-text-lineheight", 6);
-
-snippets.x1 = new Snippet("notch", points.x1);
-snippets.x2 = new Snippet("notch", points.x2);
+Point path.shiftAlong(float distance[, int stepsPerMm=10])
```
-
-
-##### The second parameter is optional
-
The second parameter controls the precision by which the path will be _walked_.
-By default, we'll divide it into 25 steps per mm.
+By default, we'll divide it into 10 steps per mm.
If you don't need that precision, you can pass a lower number.
-But for most cases, you can just ignore it.
+If you need more precision, you can pass a higher number.
+For most cases, the default will be fine.
-
+## Example
+
+
+```js
+({ Point, points, Path, paths, Snippet, snippets, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C);
+
+ points.x1 = paths.example
+ .shiftAlong(20)
+ .attr("data-text", "2cm")
+ .attr("data-text-class", "center fill-note")
+ .attr("data-text-lineheight", 6);
+ points.x2 = paths.example
+ .shiftAlong(90)
+ .attr("data-text", "9cm")
+ .attr("data-text-class", "center fill-note")
+ .attr("data-text-lineheight", 6);
+
+ snippets.x1 = new Snippet("notch", points.x1);
+ snippets.x2 = new Snippet("notch", points.x2);
+
+ return part
+}
+```
+
diff --git a/markdown/dev/reference/api/path/shiftfractionalong/en.md b/markdown/dev/reference/api/path/shiftfractionalong/en.md
index 1672c60cc41..490dc0047fe 100644
--- a/markdown/dev/reference/api/path/shiftfractionalong/en.md
+++ b/markdown/dev/reference/api/path/shiftfractionalong/en.md
@@ -1,54 +1,52 @@
---
-title: shiftFractionAlong()
+title: Path.shiftFractionAlong()
---
+The `Path.shiftFractionAlong()` returns a point that lies at fraction of the
+length of the path travelled along the path.
+
+## Signature
+
```js
Point path.shiftFractionAlong(float fraction[, int stepsPerMm=25])
```
-Returns a point that lies at fraction of the length of the path travelled along the path.
-
-
-Example of the Path.shiftFractionAlong() method
-
-
-```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-points.x1 = paths.example
- .shiftFractionAlong(0.2)
- .attr("data-text", "msg_20")
- .attr("data-text-class", "center")
- .attr("data-text-lineheight", 6);
-points.x2 = paths.example
- .shiftFractionAlong(0.9)
- .attr("data-text", "msg_90")
- .attr("data-text-class", "center")
- .attr("data-text-lineheight", 6);
-
-snippets.xl = new Snippet("notch", points.x1);
-snippets.x2 = new Snippet("notch", points.x2);
-```
-
-
-
-##### The second parameter is optional
-
The second parameter controls the precision by which the path will be _walked_.
-By default, we'll divide it into 25 steps per mm.
+By default, we'll divide it into 10 steps per mm.
If you don't need that precision, you can pass a lower number.
-But for most cases, you can just ignore it.
+If you need more precision, you can pass a higher number.
+For most cases, the default will be fine.
+
+## Example
+
+
+```js
+({ Point, points, Path, paths, Snippet, snippets, part }) => {
+
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+
+ paths.example = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C);
+
+ points.x1 = paths.example
+ .shiftFractionAlong(0.2)
+ .setText("0.2", "center")
+ points.x2 = paths.example
+ .shiftFractionAlong(0.9)
+ .setText("0.9", "center")
+
+ snippets.xl = new Snippet("notch", points.x1);
+ snippets.x2 = new Snippet("notch", points.x2);
+
+ return part
+}
+```
+
-
diff --git a/markdown/dev/reference/api/path/smurve/en.md b/markdown/dev/reference/api/path/smurve/en.md
index 3189c37f7ee..75b967474f1 100644
--- a/markdown/dev/reference/api/path/smurve/en.md
+++ b/markdown/dev/reference/api/path/smurve/en.md
@@ -1,37 +1,41 @@
---
-title: smurve()
+title: Path.smurve()
---
+The `Path.smurve()` method draws a smooth curve from the current point via a control point to an endpoint.
+A smooth curve means it will use the reflection of the end control point of the previous curve.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.smurve(Point cp2, Point end)
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.aFrom = new Point(10, 10);
+ points.aCp1 = new Point(40, 40);
+ points.aCp2 = new Point(70, -20);
+ points.aTo = new Point(100, 10);
+
+ points.bCp2 = new Point(50,50)
+ points.bTo = new Point(10,50)
+
+ paths.smurve = new Path()
+ .move(points.aFrom)
+ .curve(points.aCp1, points.aCp2,points.aTo)
+ .smurve(points.bCp2, points.bTo)
+ .reverse() // Puts text at the end
+ .setText('Path.smurve()')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```
diff --git a/markdown/dev/reference/api/path/smurve_/en.md b/markdown/dev/reference/api/path/smurve_/en.md
index 202b3036809..ed785005404 100644
--- a/markdown/dev/reference/api/path/smurve_/en.md
+++ b/markdown/dev/reference/api/path/smurve_/en.md
@@ -1,37 +1,42 @@
---
-title: smurve_()
+title: Path.smurve_()
---
+The `Path.smurve_()` method draws a smooth curve from the current point an endpoint.
+In addition, the end point's control point lies on top of the end point.
+
+A smooth curve means it will use the reflection of the end control point of the previous curve.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.smurve_(Point cp2, Point end)
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.aFrom = new Point(10, 10);
+ points.aCp1 = new Point(40, 40);
+ points.aCp2 = new Point(70, -20);
+ points.aTo = new Point(100, 10);
+
+ points.bTo = new Point(10,50)
+
+ paths.smurve = new Path()
+ .move(points.aFrom)
+ .curve(points.aCp1, points.aCp2,points.aTo)
+ .smurve_(points.bTo)
+ .reverse() // Puts text at the end
+ .setText('Path.smurve()')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```
diff --git a/markdown/dev/reference/api/path/split/en.md b/markdown/dev/reference/api/path/split/en.md
index c1d5d2117ca..644a5c91c7e 100644
--- a/markdown/dev/reference/api/path/split/en.md
+++ b/markdown/dev/reference/api/path/split/en.md
@@ -1,42 +1,49 @@
---
-title: split
+title: Path.split()
---
+The `Path.split()` method splits a path in two halves, on a point along that
+path that you pass it.
+
+## Signature
+
```js
array path.split(Point splitPoint)
```
-Splits a path in two halves, on a point along that path that you pass it.
-
-
-Example of the Path.split() method
-
+## Example
+
```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
+({ Point, points, Path, paths, snippets, Snippet, part }) => {
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-points.D = new Point(50, 130);
-points.DCp1 = new Point(150, 30);
+ points.A = new Point(45, 60);
+ points.B = new Point(10, 30);
+ points.BCp2 = new Point(40, 20);
+ points.C = new Point(90, 30);
+ points.CCp1 = new Point(50, -30);
+ points.D = new Point(50, 130);
+ points.DCp1 = new Point(150, 30);
+
+ paths.demo = new Path()
+ .move(points.D)
+ .curve(points.DCp1, points.DCp1, points.C)
+ .curve(points.CCp1, points.BCp2, points.B)
+ .line(points.A);
+
+ points.split = paths.demo.shiftFractionAlong(0.75);
+ snippets.split = new Snippet("notch", points.split);
+
+ let style = "stroke-width: 3; stroke-opacity: 0.5;";
+ let halves = paths.demo.split(points.split);
+ for (let i in halves) {
+ paths[i] = halves[i]
+ .attr("style", style)
+ .attr("style", `stroke: hsl(${i * 70}, 100%, 50%)`);
+ }
-paths.demo = new Path()
- .move(points.D)
- .curve(points.DCp1, points.DCp1, points.C)
- .curve(points.CCp1, points.BCp2, points.B)
- .line(points.A);
-
-points.split = paths.demo.shiftFractionAlong(0.75);
-snippets.split = new Snippet("notch", points.split);
-
-let style = "stroke-width: 3; stroke-opacity: 0.5;";
-let halves = paths.demo.split(points.split);
-for (let i in halves) {
- paths[i] = halves[i]
- .attr("style", style)
- .attr("style", `stroke: hsl(${i * 70}, 100%, 50%)`);
+ return part
}
```
+
+
diff --git a/markdown/dev/reference/api/path/start/en.md b/markdown/dev/reference/api/path/start/en.md
index 5c07bbce771..8403460cc0e 100644
--- a/markdown/dev/reference/api/path/start/en.md
+++ b/markdown/dev/reference/api/path/start/en.md
@@ -1,30 +1,38 @@
---
-title: start()
+title: Path.start()
---
+The `Path.start()` method returns the Point object at the start of the path.
+
+## Signature
+
```js
Point path.start()
```
-Returns the Point object at the start of the path.
+This method is chainable as it returns the `Path` object
-
-Example of the Path.start() method
+## Example
+
+
+```js
+({ Point, points, Path, paths, snippets, Snippet, part }) => {
+
+ points.A = new Point(45, 60)
+ points.B = new Point(10, 30)
+ points.BCp2 = new Point(40, 20)
+ points.C = new Point(90, 30)
+ points.CCp1 = new Point(50, -30)
+
+ paths.demo = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+
+ snippets.end = new Snippet("notch", paths.demo.start())
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths, Snippet, snippets } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.example = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-snippets.start = new Snippet("notch", paths.example.start());
-```
diff --git a/markdown/dev/reference/api/path/translate/en.md b/markdown/dev/reference/api/path/translate/en.md
index 6bfbcc1385c..909d038d246 100644
--- a/markdown/dev/reference/api/path/translate/en.md
+++ b/markdown/dev/reference/api/path/translate/en.md
@@ -1,45 +1,51 @@
---
-title: translate()
+title: Path.translate()
---
+The `Path.translate()` method returns a path with
+[a translate transform](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform#Translate)
+applied.
+
+## Example
+
```js
Path path.translate(float deltaX, float deltaY)
```
-Returns a path with
-[a translate transform](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform#Translate)
-applied.
+## Example
-
-Example of the Path.translate() method
+
+```js
+({ Point, points, Path, paths, part, macro }) => {
+
+ points.A = new Point(45, 60)
+ points.B = new Point(10, 30)
+ points.BCp2 = new Point(40, 20)
+ points.C = new Point(90, 30)
+ points.CCp1 = new Point(50, -30)
+
+ paths.A = new Path()
+ .move(points.A)
+ .line(points.B)
+ .curve(points.BCp2, points.CCp1, points.C)
+
+ paths.B = paths.A.translate(60, 30)
+
+ points.step1 = points.B.shift(0, 60)
+ points.step2 = points.step1.shift(-90, 30)
+ macro("ld", {
+ from: points.B,
+ to: points.step1,
+ noStartMarker: true
+ })
+ macro("ld", {
+ from: points.step1,
+ to: points.step2,
+ noStartMarker: true
+ })
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths, macro } = part.shorthand();
-
-points.A = new Point(45, 60);
-points.B = new Point(10, 30);
-points.BCp2 = new Point(40, 20);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, -30);
-
-paths.A = new Path()
- .move(points.A)
- .line(points.B)
- .curve(points.BCp2, points.CCp1, points.C);
-
-paths.B = paths.A.translate(60, 30);
-
-points.step1 = points.B.shift(0, 60);
-points.step2 = points.step1.shift(-90, 30);
-macro("ld", {
- from: points.B,
- to: points.step1,
- noStartMarker: true
-});
-macro("ld", {
- from: points.step1,
- to: points.step2,
- noStartMarker: true
-});
-```
diff --git a/markdown/dev/reference/api/path/trim/en.md b/markdown/dev/reference/api/path/trim/en.md
index 495a67047a7..e4ca44c638a 100644
--- a/markdown/dev/reference/api/path/trim/en.md
+++ b/markdown/dev/reference/api/path/trim/en.md
@@ -1,18 +1,68 @@
---
-title: trim()
+title: Path.trim()
---
+The `Path.trim()` method Returns a new Path that is this path with overlapping
+parts removed.
+
```js
Path path.trim()
```
-Returns a new Path that is this path with overlapping parts removed.
+
+
+
+```js
+({ Point, points, Path, paths, part }) => {
+
+ points.center = new Point(0, 0)
+ points.base = new Point(0, 10)
+ points.tip = new Point(0, 50)
+ points.tipCpRight = new Point(30, 50)
+ points.tipCpLeft = new Point(-30, 50)
+ paths.example = new Path().move(points.base)
+ for (let i = 0; i < 4; i++) {
+ points["base" + i] = points.base.rotate(60 * i, points.center)
+ points["tip" + i] = points.tip.rotate(60 * i, points.center)
+ points["tipCpRight" + i] = points.tipCpRight.rotate(60 * i, points.center)
+ points["tipCpLeft" + i] = points.tipCpLeft.rotate(60 * i, points.center)
+ if (i < 2) {
+ paths.example
+ .line(points["base" + i])
+ .curve(points["base" + i], points["tipCpLeft" + i], points["tip" + i])
+ .curve(
+ points["tipCpRight" + i],
+ points["base" + i],
+ points["base" + i]
+ );
+ } else {
+ paths.example
+ .line(points["base" + i])
+ .line(points["tip" + i])
+ .line(points["tipCpRight" + i])
+ .line(points["base" + i])
+ }
+ }
+
+ paths.offset = paths.example
+ .offset(10)
+ .setClass("lining dotted stroke-sm")
+
+ paths.trimmed = paths.offset
+ .trim()
+ .setClass("various stroke-xl")
+ .attr("style", "stroke-opacity: 0.5;")
+
+ return part
+}
+```
+
+
+
+## Notes
This method is typically used when [Path.offset()](/reference/api/path/offset) caused some overlap.
-
-
-
-###### Use sparsely or performance will suffer
+However, use this sparsely or performance will suffer.
This method is recursive and complex, and the performance penalty for using
it on a long/complex path will be significant.
@@ -22,54 +72,3 @@ To limit the impact of path.trim(), follow this approach:
- construct a minimal path that contains the overlap
- trim it
- now join it to the rest of your path
-
-You can see an example of this
-[in the front part of the Bruce pattern](https://github.com/freesewing/freesewing/blob/3ca5d0edfe54c7ac20aaf3af2f3544aee72f9b99/designs/bruce/src/front.js#L158).
-
-
-
-
-Example of the Path.trim() method
-
-
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.center = new Point(0, 0);
-points.base = new Point(0, 10);
-points.tip = new Point(0, 50);
-points.tipCpRight = new Point(30, 50);
-points.tipCpLeft = new Point(-30, 50);
-paths.example = new Path().move(points.base);
-for (let i = 0; i < 4; i++) {
- points["base" + i] = points.base.rotate(60 * i, points.center);
- points["tip" + i] = points.tip.rotate(60 * i, points.center);
- points["tipCpRight" + i] = points.tipCpRight.rotate(60 * i, points.center);
- points["tipCpLeft" + i] = points.tipCpLeft.rotate(60 * i, points.center);
- if (i < 2) {
- paths.example
- .line(points["base" + i])
- .curve(points["base" + i], points["tipCpLeft" + i], points["tip" + i])
- .curve(
- points["tipCpRight" + i],
- points["base" + i],
- points["base" + i]
- );
- } else {
- paths.example
- .line(points["base" + i])
- .line(points["tip" + i])
- .line(points["tipCpRight" + i])
- .line(points["base" + i]);
- }
-}
-
-paths.offset = paths.example
- .offset(10)
- .attr("class", "lining dotted stroke-sm");
-
-paths.trimmed = paths.offset
- .trim()
- .attr("class", "various stroke-xl")
- .attr("style", "stroke-opacity: 0.5;");
-```
diff --git a/markdown/dev/reference/api/path/unhide/en.md b/markdown/dev/reference/api/path/unhide/en.md
index 11909d5870c..8b7ae18915e 100644
--- a/markdown/dev/reference/api/path/unhide/en.md
+++ b/markdown/dev/reference/api/path/unhide/en.md
@@ -1,37 +1,35 @@
---
-title: unhide()
+title: Path.unhide()
---
+The `Path.unhide()` method unhides the path so it does appears in the output.
+
+By default, paths are not hidden. So you should only call this on path previously hidden via `Path.hide()`.
+
+## Signature
+
```js
-Path path.attr(
- string name,
- mixed value,
- bool overwrite = false
-)
+Path path.unhide()
```
-This `Path.attr()` method calls `this.attributes.add()` under the hood, but returns the Path object.
+This method is chainable as it returns the `Path` object
-This allows you to chain different calls together as in the example below.
+## Example
-If the third parameter is set to `true` it will call `this.attributes.set()` instead, thereby overwriting the value of the attribute.
+
+```js
+({ Point, points, Path, paths, part }) => {
-
-Example of the Path.attr() method
+ points.top = new Point(50, 0)
+ points.left = new Point (20,50)
+ points.right = new Point (80,50)
+
+ paths.a = new Path().move(points.top).line(points.right).setText('a')
+ paths.b = new Path().move(points.right).line(points.left).setText('b').hide().unhide()
+ paths.c = new Path().move(points.left).line(points.top).setText('c')
+
+ return part
+}
+```
-```js
-let { Point, points, Path, paths } = part.shorthand();
-
-points.B = new Point(10, 50);
-points.BCp2 = new Point(40, 10);
-points.C = new Point(90, 30);
-points.CCp1 = new Point(50, 90);
-
-paths.example = new Path()
- .move(points.B)
- .curve(points.BCp2, points.CCp1, points.C)
- .attr("class", "canvas")
- .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors")
- .attr("data-text-class", "text-xs center");
-```