chore: Port FreeSewing.dev to docusaurus
The replaces the NextJS site powering FreeSewing.dev with a Docusaurus setup. It's part of my efforts to simplify FreeSewing's setup so we can focus on our core value proposition.
This commit is contained in:
parent
497633d1d3
commit
ab3204f9f1
692 changed files with 11037 additions and 20674 deletions
48
sites/dev/docs/reference/api/pattern/addpart/readme.mdx
Normal file
48
sites/dev/docs/reference/api/pattern/addpart/readme.mdx
Normal file
|
@ -0,0 +1,48 @@
|
|||
---
|
||||
title: Pattern.addPart()
|
||||
---
|
||||
|
||||
The `Pattern.addPart()` method allows you to add a part to a pattern.
|
||||
It has the same effect as passing a part to the Design constructor.
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.addPart() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.addPart(object part)
|
||||
```
|
||||
|
||||
## Pattern.addPart() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
const extra = {
|
||||
name: 'aaron.extra',
|
||||
draft: ({ points, Point, paths, Path, part }) => {
|
||||
points.msg = new Point(50,15)
|
||||
.attr('data-text', "I am an extra part")
|
||||
paths.box = new Path()
|
||||
.move(new Point(0,0))
|
||||
.line(new Point(0,30))
|
||||
.line(new Point(100,30))
|
||||
.line(new Point(100,0))
|
||||
.close(new Point(100,0))
|
||||
.addClass('note')
|
||||
|
||||
return part
|
||||
}
|
||||
}
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements }).addPart(extra)
|
||||
|
||||
const svg = pattern.draft().render()
|
||||
```
|
33
sites/dev/docs/reference/api/pattern/draft/readme.mdx
Normal file
33
sites/dev/docs/reference/api/pattern/draft/readme.mdx
Normal file
|
@ -0,0 +1,33 @@
|
|||
---
|
||||
title: Pattern.draft()
|
||||
---
|
||||
|
||||
A pattern's `draft()` method will draft the different pattern parts
|
||||
making sure to do so in the right order, handle dependencies, resolve
|
||||
options to their absolute values and a number of other housekeeping things
|
||||
that are required for the pattern to be drafted.
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.draft() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.draft()
|
||||
```
|
||||
|
||||
## Pattern.draft() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements })
|
||||
|
||||
const svg = pattern.draft().render()
|
||||
```
|
|
@ -0,0 +1,33 @@
|
|||
---
|
||||
title: Pattern.draftPartForSet()
|
||||
---
|
||||
|
||||
A pattern's `draftPartForSet()` method will draft a part using a
|
||||
given set of settings.
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.draftPartForSet() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.draftPartForSet(part, set)
|
||||
```
|
||||
|
||||
## Pattern.draftPartForSet() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load a public test settings set from the FreeSewing backend
|
||||
const set = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
)
|
||||
|
||||
const pattern = new Aaron()
|
||||
|
||||
for (const part in pattern.parts) {
|
||||
const svg = pattern.draftPartForSet(part, set).render()
|
||||
}
|
||||
```
|
27
sites/dev/docs/reference/api/pattern/getconfig/readme.mdx
Normal file
27
sites/dev/docs/reference/api/pattern/getconfig/readme.mdx
Normal file
|
@ -0,0 +1,27 @@
|
|||
---
|
||||
title: Pattern.getConfig()
|
||||
---
|
||||
|
||||
You can call `Pattern.getConfig()` to retrieve a pattern's runtime configuration.
|
||||
|
||||
Doing so will resolve all dependencies, load all the plugins, and do all other
|
||||
housekeeping tasks that are typically done behind the scenes when you call
|
||||
`Pattern.draft()`. But it will stop short of drafting the pattern, and instead
|
||||
return a Pattern's internal configuration.
|
||||
|
||||
You can use this to see what options a pattern provides, what
|
||||
measurements it requires, and so on.
|
||||
|
||||
## Pattern.getConfig() signature
|
||||
|
||||
```js
|
||||
object pattern.getConfig()
|
||||
```
|
||||
|
||||
## Pattern.getConfig() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
const config = new Aaron().getConfig()
|
||||
```
|
24
sites/dev/docs/reference/api/pattern/getlogs/readme.mdx
Normal file
24
sites/dev/docs/reference/api/pattern/getlogs/readme.mdx
Normal file
|
@ -0,0 +1,24 @@
|
|||
---
|
||||
title: Pattern.getLogs()
|
||||
---
|
||||
|
||||
The `Pattern.getLogs()` method will return an object holding
|
||||
the logs generated by the pattern.
|
||||
It should only be called after calling `Pattern.draft()`.
|
||||
|
||||
## Pattern.getLogs() signature
|
||||
|
||||
```js
|
||||
Object pattern.getLogs()
|
||||
```
|
||||
|
||||
## Returned object properties
|
||||
|
||||
The `Pattern.getLogs()` method returns an object with
|
||||
the following properties:
|
||||
|
||||
| Property | Description |
|
||||
| --------:| ----------- |
|
||||
| `pattern` | The logs of the pattern itself |
|
||||
| `sets` | The logs per (set of) settings used to draft the pattern |
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
---
|
||||
title: Pattern.getRenderProps()
|
||||
---
|
||||
|
||||
The `Pattern.getRenderProps()` method will return an object that
|
||||
facilitates rendering the pattern by an external renderer such as
|
||||
our [Pattern React component](/reference/packages/react-components).
|
||||
It should only be called after calling `Pattern.draft()`.
|
||||
|
||||
## Pattern.getRenderProps() signature
|
||||
|
||||
```js
|
||||
Object pattern.getRenderProps()
|
||||
```
|
||||
|
||||
## Returned object properties
|
||||
|
||||
The `Pattern.getRenderProps()` method returns an object with
|
||||
the following properties:
|
||||
|
||||
| Property | Description |
|
||||
| --------:| ----------- |
|
||||
| `autoLayout` | An object describing the (automated) pattern layout |
|
||||
| `height` | Height of the drafted pattern in `mm` |
|
||||
| `width` | Width of the drafted pattern in `mm` |
|
||||
| `settings` | The (sets of) settings used to draft the pattern |
|
||||
| `stacks` | A plain object holding the drafted stacks |
|
||||
| `svg` | The [Svg Object](/reference/api/svg/) object with the `preRender` hook applied as [Svg.asRenderProps()](/reference/api/svg/asrenderprops) |
|
||||
|
40
sites/dev/docs/reference/api/pattern/on/readme.mdx
Normal file
40
sites/dev/docs/reference/api/pattern/on/readme.mdx
Normal file
|
@ -0,0 +1,40 @@
|
|||
---
|
||||
title: Pattern.on()
|
||||
---
|
||||
|
||||
The `Pattern.on()` method allows you to attach a function to one of the
|
||||
pattern's [lifecycle hooks](/reference/hooks/). It takes the
|
||||
lifecycle hook's name as the first argument and the function as the second.
|
||||
This method will then be triggered by the lifecycle hook.
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.on() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.on(string hook, function method)
|
||||
```
|
||||
|
||||
:::tip
|
||||
|
||||
Refer to [the Lifecycle hooks documentation](/reference/hooks/) for a list
|
||||
of all available lifecycle hooks, as well as the signature of the function you
|
||||
should pass it.
|
||||
|
||||
:::
|
||||
|
||||
## Pattern.on() example
|
||||
|
||||
```js
|
||||
pattern.on('preRender', function(svg) {
|
||||
svg.style += "svg { background: yellow;}";
|
||||
})
|
||||
```
|
||||
|
||||
Your pattern now has a yellow background.
|
||||
|
||||
:::tip
|
||||
|
||||
The [plugin guide](/guides/plugins/) contains more info on how you can use hooks
|
||||
|
||||
:::
|
85
sites/dev/docs/reference/api/pattern/readme.mdx
Normal file
85
sites/dev/docs/reference/api/pattern/readme.mdx
Normal file
|
@ -0,0 +1,85 @@
|
|||
---
|
||||
title: Pattern
|
||||
---
|
||||
|
||||
The `Pattern` object in FreeSewing's core library holds all data and logic of a pattern.
|
||||
It is the parametric blueprint that when instantiated with a user's settings
|
||||
can draft a bespoke sewing pattern.
|
||||
|
||||
## Creating a Pattern
|
||||
|
||||
A Pattern in FreeSewing is an instantiated Design:
|
||||
|
||||
```js
|
||||
import { Florence } from "@freesewing/florence"
|
||||
|
||||
const pattern = new Florence()
|
||||
```
|
||||
|
||||
You probably want to create a pattern using your own [settings](/reference/settings):
|
||||
|
||||
```js
|
||||
import { Florence } from "@freesewing/florence"
|
||||
|
||||
const pattern = new Florence({
|
||||
paperless: true,
|
||||
measurements: {
|
||||
head: 390,
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
## Multisets in FreeSewing
|
||||
|
||||
You can pass the Pattern constructor an array of multiple settings objects:
|
||||
|
||||
```js
|
||||
import { Florence } from "@freesewing/florence"
|
||||
|
||||
const pattern = new Florence([
|
||||
{
|
||||
measurements: {
|
||||
head: 390,
|
||||
}
|
||||
},
|
||||
{
|
||||
measurements: {
|
||||
head: 420,
|
||||
}
|
||||
},
|
||||
])
|
||||
```
|
||||
|
||||
We refer to these *multiple sets of settings* as **multisets**.
|
||||
It is what powers FreeSewing's [sampling capabilities](/reference/api/pattern/sample) but
|
||||
it also allows you to draft some pattern parts with one set of measurements, and other parts
|
||||
with another set. For example if you have an asymmetric model to fit.
|
||||
|
||||
:::note
|
||||
|
||||
##### Core always keeps a set of settings
|
||||
|
||||
Multisets is an advanced feature of FreeSewing, and for the most part you can forget about it
|
||||
until the day you want to use it.
|
||||
|
||||
However, it's good to keep in mind that under the hood, FreeSewing will always use a set of settings.
|
||||
It just so happens that in most cases, there will be only one settings object in the set.
|
||||
|
||||
:::
|
||||
|
||||
## Pattern attributes
|
||||
|
||||
- `Pattern.activePart`: Holds the id of the active part (while drafting)
|
||||
- `Pattern.activeSet`: Holds the id of the active set (while drafting)
|
||||
- `Pattern.config`: Holds the resolved pattern's configuration
|
||||
- `Pattern.designConfig`: Holds the design's configuration before resolution
|
||||
- `Pattern.parts`: Holds the parts used in the pattern
|
||||
- `Pattern.plugins`: Holds the plugins used in the pattern
|
||||
- `Pattern.settings`: Holds the settings used for the pattern
|
||||
- `Pattern.stacks`: Holds the stacks used in the pattern
|
||||
- `Pattern.store`: Holds the pattern-wide Store
|
||||
- `Pattern.setStores`: Holds an array of stores, one for each set of settings.
|
||||
|
||||
## Pattern methods
|
||||
|
||||
<ReadMore />
|
30
sites/dev/docs/reference/api/pattern/render/readme.mdx
Normal file
30
sites/dev/docs/reference/api/pattern/render/readme.mdx
Normal file
|
@ -0,0 +1,30 @@
|
|||
---
|
||||
title: Pattern.render()
|
||||
---
|
||||
|
||||
The `Pattern.render()` method will render the pattern to SVG and return
|
||||
that SVG as a string. It should only be called after calling
|
||||
[Pattern.draft()](/reference/api/pattern/draft/) first.
|
||||
|
||||
## Pattern.render() signature
|
||||
|
||||
```js
|
||||
string pattern.render()
|
||||
```
|
||||
|
||||
## Pattern.render() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements })
|
||||
|
||||
const svg = pattern.draft().render()
|
||||
```
|
53
sites/dev/docs/reference/api/pattern/sample/readme.mdx
Normal file
53
sites/dev/docs/reference/api/pattern/sample/readme.mdx
Normal file
|
@ -0,0 +1,53 @@
|
|||
---
|
||||
title: Pattern.sample()
|
||||
---
|
||||
|
||||
The `Pattern.sample()` method will _sample_ the pattern which means
|
||||
to draft multiple variants of the same pattern, and stack them on
|
||||
top of each other.
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
Under the hood, this method will call one of
|
||||
[Pattern.sampleOption()](/reference/api/pattern/sampleoption),
|
||||
[Pattern.sampleMeasurement()](/reference/api/pattern/samplemeasurement), or
|
||||
[Pattern.sampleModels()](/reference/api/pattern/samplemodels) to sample
|
||||
an option, a measurement, or different models respectively.
|
||||
|
||||
Unlike those three methods where you pass the relevant info to to the method,
|
||||
this `Pattern.sample()` method will instead read the
|
||||
[`settings.sample`](/reference/settings/sample)
|
||||
object to determine what needs to be done.
|
||||
|
||||
See the specific sample methods below for more details:
|
||||
|
||||
- [Pattern.sampleOption()](/reference/api/pattern/sampleoption)
|
||||
- [Pattern.sampleMeasurement()](/reference/api/pattern/samplemeasurement)
|
||||
- [Pattern.sampleModels()](/reference/api/pattern/samplemodels)
|
||||
|
||||
## Pattern.sample() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.sample()
|
||||
```
|
||||
|
||||
## Pattern.sample() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({
|
||||
sample: {
|
||||
models: measurements
|
||||
}
|
||||
})
|
||||
|
||||
const svg = pattern.sample().render()
|
||||
```
|
|
@ -0,0 +1,39 @@
|
|||
---
|
||||
title: Pattern.sampleMeasurement()
|
||||
---
|
||||
|
||||
The `Pattern.sampleMeasurement()` method will _sample_ the pattern which means
|
||||
to draft multiple variants of the same pattern, and stack them on
|
||||
top of each other.
|
||||
|
||||
In this particular case, it will draft 10 variants of the pattern that vary
|
||||
the measurement of your choice between 90% and 110% if the value in the settings.
|
||||
|
||||
:::tip
|
||||
The goal of measurement sampling is to understand the impact of a given measurement on a pattern.
|
||||
:::
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.sampleMeasurement() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.sampleMeasurement(string measurement)
|
||||
```
|
||||
|
||||
## Pattern.sampleMeasurement() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements })
|
||||
|
||||
const svg = pattern.draft().sampleMeasurement('chest')
|
||||
```
|
67
sites/dev/docs/reference/api/pattern/samplemodels/readme.mdx
Normal file
67
sites/dev/docs/reference/api/pattern/samplemodels/readme.mdx
Normal file
|
@ -0,0 +1,67 @@
|
|||
---
|
||||
title: Pattern.sampleModels()
|
||||
---
|
||||
|
||||
The `Pattern.sampleModels()` method will _sample_ the pattern which means
|
||||
to draft multiple variants of the same pattern, and stack them on
|
||||
top of each other.
|
||||
|
||||
In this particular case, it will draft a variants for each of the models you pass it.
|
||||
|
||||
:::tip
|
||||
The goal of model sampling is to verify that a pattern grades correctly up and down as sizes change.
|
||||
:::
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.sampleModels() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.sampleModels(object models, string focus)
|
||||
```
|
||||
|
||||
The `models` object you pass as the first parameter should be structured as such:
|
||||
|
||||
```js
|
||||
{
|
||||
modelName1: {
|
||||
measurement1: valueInMm,
|
||||
measurement2: valueInMm,
|
||||
// ...
|
||||
},
|
||||
modelName2: {
|
||||
measurement1: valueInMm,
|
||||
measurement2: valueInMm,
|
||||
// ...
|
||||
},
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
The (optional) string you can pass as the second parameter should hold the
|
||||
key of one of the models in the first parameter. In our example above, it
|
||||
could hold `modelName2` for example.
|
||||
|
||||
By passing this second parameter, you can put the _focus_ on one of the models,
|
||||
which will influence the render style, and make it
|
||||
easier to see a comparison between a given set of measurements, and the rest.
|
||||
|
||||
Alternatively, you can use the `Pattern.sample()` method and set `settings.sample.focus` to the key
|
||||
identifying your model in the models object.
|
||||
|
||||
## Pattern.sampleModels() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
const Aaron = new Aaron()
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const svg = aaron.sampleModels(measurements, "34").render()
|
||||
```
|
46
sites/dev/docs/reference/api/pattern/sampleoption/readme.mdx
Normal file
46
sites/dev/docs/reference/api/pattern/sampleoption/readme.mdx
Normal file
|
@ -0,0 +1,46 @@
|
|||
---
|
||||
title: Pattern.sampleOption()
|
||||
---
|
||||
|
||||
The `Pattern.sampleOption()` method will _sample_ the pattern which means
|
||||
to draft multiple variants of the same pattern, and stack them on
|
||||
top of each other.
|
||||
|
||||
In this particular case, the variants it drafts depend
|
||||
on [the type of option](/reference/api/part/config/options/):
|
||||
|
||||
- For a Percentage or Degree option, 10 steps will be sampled, between min and max
|
||||
- For a Counter or Millimeter option, a maximum of 10 steps will be sampled, between min and max
|
||||
- For a Constant numeric option, 10 steps will be sampled between 90% and 110% of the value
|
||||
- For a List option, each option in the list will be sampled
|
||||
- For a Boolean option, both `false` and `true` will be sampled
|
||||
|
||||
:::tip
|
||||
The goal of option sampling is to verify the impact of an option on the pattern, and verify that
|
||||
its min and max boundaries are correct and its default value is sensible.
|
||||
:::
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.sampleOption() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.sampleOption(string option)
|
||||
```
|
||||
|
||||
## Pattern.sampleOption() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements })
|
||||
|
||||
const svg = pattern.draft().sampleOption('backlineBend')
|
||||
```
|
38
sites/dev/docs/reference/api/pattern/use/readme.mdx
Normal file
38
sites/dev/docs/reference/api/pattern/use/readme.mdx
Normal file
|
@ -0,0 +1,38 @@
|
|||
---
|
||||
title: Pattern.use()
|
||||
---
|
||||
|
||||
The `Pattern.use()` method will load a FreeSewing plugin.
|
||||
Plugins are a way to extend a pattern's functionality.
|
||||
For more details, refer to [the plugin guide](/guides/plugins/).
|
||||
|
||||
:::noteThis method is chainable as it returns the Pattern object:::
|
||||
|
||||
## Pattern.use() signature
|
||||
|
||||
```js
|
||||
Pattern pattern.use(object plugin)
|
||||
// or
|
||||
Pattern pattern.use(object plugin, object plugin_data)
|
||||
```
|
||||
|
||||
See [the plugin guide](/guides/plugins/) for details on how to structure
|
||||
you plugin object.
|
||||
|
||||
## Pattern.use() example
|
||||
|
||||
```js
|
||||
import { Aaron } from "@freesewing/aaron"
|
||||
import { pluginTheme } from "@freesewing/plugin-theme"
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements }).use(pluginTheme)
|
||||
|
||||
const svg = pattern.draft().render()
|
||||
```
|
Loading…
Add table
Add a link
Reference in a new issue