chore(markdown): Linting of dev docs
This commit is contained in:
parent
1d8beedd44
commit
265ad404da
317 changed files with 1281 additions and 1503 deletions
|
@ -14,6 +14,7 @@ This Code of Conduct is an almost verbatim copy of the [Contributor Covenant][ho
|
||||||
available at [http://contributor-covenant.org/version/2/0][version]
|
available at [http://contributor-covenant.org/version/2/0][version]
|
||||||
|
|
||||||
[homepage]: http://contributor-covenant.org
|
[homepage]: http://contributor-covenant.org
|
||||||
|
|
||||||
[version]: http://contributor-covenant.org/version/2/0/
|
[version]: http://contributor-covenant.org/version/2/0/
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
|
@ -4,12 +4,14 @@ order: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
##### Community Impact
|
##### Community Impact
|
||||||
Use of inappropriate language or other behavior
|
|
||||||
|
Use of inappropriate language or other behavior
|
||||||
deemed unprofessional or unwelcome in the community.
|
deemed unprofessional or unwelcome in the community.
|
||||||
|
|
||||||
##### Consequence
|
##### Consequence
|
||||||
A private, written warning from community leaders,
|
|
||||||
providing clarity around the nature of the violation and an
|
A private, written warning from community leaders,
|
||||||
explanation of why the behavior was inappropriate.
|
providing clarity around the nature of the violation and an
|
||||||
|
explanation of why the behavior was inappropriate.
|
||||||
|
|
||||||
A public apology may be requested.
|
A public apology may be requested.
|
||||||
|
|
|
@ -3,8 +3,8 @@ title: Enforcement Guidelines
|
||||||
order: 60
|
order: 60
|
||||||
---
|
---
|
||||||
|
|
||||||
Community leaders will follow these Community Impact Guidelines
|
Community leaders will follow these Community Impact Guidelines
|
||||||
in determining the consequences for any action they deem
|
in determining the consequences for any action they deem
|
||||||
in violation of FreeSewing's Code of Conduct:
|
in violation of FreeSewing's Code of Conduct:
|
||||||
|
|
||||||
<ReadMore list />
|
<ReadMore list />
|
||||||
|
|
|
@ -4,10 +4,12 @@ order: 40
|
||||||
---
|
---
|
||||||
|
|
||||||
##### Community Impact
|
##### Community Impact
|
||||||
Demonstrating a pattern of violation of
|
|
||||||
community standards, including sustained inappropriate behavior,
|
Demonstrating a pattern of violation of
|
||||||
harassment of an individual, or aggression toward or
|
community standards, including sustained inappropriate behavior,
|
||||||
|
harassment of an individual, or aggression toward or
|
||||||
disparagement of classes of individuals.
|
disparagement of classes of individuals.
|
||||||
|
|
||||||
##### Consequence
|
##### Consequence
|
||||||
|
|
||||||
A permanent ban from any sort of public interaction within the community.
|
A permanent ban from any sort of public interaction within the community.
|
||||||
|
|
|
@ -3,18 +3,19 @@ title: Temporary ban
|
||||||
order: 30
|
order: 30
|
||||||
---
|
---
|
||||||
|
|
||||||
##### Community Impact
|
##### Community Impact
|
||||||
A serious violation of community standards,
|
|
||||||
|
A serious violation of community standards,
|
||||||
including sustained inappropriate behavior.
|
including sustained inappropriate behavior.
|
||||||
|
|
||||||
##### Consequence
|
##### Consequence
|
||||||
A temporary ban from any sort of interaction or
|
|
||||||
public communication with the community for a specified period
|
|
||||||
of time.
|
|
||||||
|
|
||||||
No public or private interaction with the people
|
A temporary ban from any sort of interaction or
|
||||||
involved, including unsolicited interaction with those enforcing
|
public communication with the community for a specified period
|
||||||
the Code of Conduct, is allowed during this period.
|
of time.
|
||||||
|
|
||||||
|
No public or private interaction with the people
|
||||||
|
involved, including unsolicited interaction with those enforcing
|
||||||
|
the Code of Conduct, is allowed during this period.
|
||||||
|
|
||||||
Violating these terms may lead to a permanent ban.
|
Violating these terms may lead to a permanent ban.
|
||||||
|
|
||||||
|
|
|
@ -4,14 +4,16 @@ order: 20
|
||||||
---
|
---
|
||||||
|
|
||||||
##### Community Impact
|
##### Community Impact
|
||||||
|
|
||||||
A violation through a single incident or series of actions.
|
A violation through a single incident or series of actions.
|
||||||
|
|
||||||
##### Consequence
|
##### Consequence
|
||||||
A warning with consequences for continued behavior.
|
|
||||||
No interaction with the people involved, including unsolicited
|
A warning with consequences for continued behavior.\
|
||||||
interaction with those enforcing the Code of Conduct, for a
|
No interaction with the people involved, including unsolicited
|
||||||
specified period of time. This includes avoiding interactions
|
interaction with those enforcing the Code of Conduct, for a
|
||||||
|
specified period of time. This includes avoiding interactions
|
||||||
in community spaces as well as external channels like social
|
in community spaces as well as external channels like social
|
||||||
media.
|
media.
|
||||||
|
|
||||||
Violating these terms may lead to a temporary or permanent ban.
|
Violating these terms may lead to a temporary or permanent ban.
|
||||||
|
|
|
@ -3,12 +3,12 @@ title: Enforcement responsibilities
|
||||||
order: 30
|
order: 30
|
||||||
---
|
---
|
||||||
|
|
||||||
Community leaders are responsible for clarifying and enforcing our standards
|
Community leaders are responsible for clarifying and enforcing our standards
|
||||||
of acceptable behavior and will take appropriate and fair corrective action
|
of acceptable behavior and will take appropriate and fair corrective action
|
||||||
in response to any behavior that they deem inappropriate, threatening,
|
in response to any behavior that they deem inappropriate, threatening,
|
||||||
offensive, or harmful.
|
offensive, or harmful.
|
||||||
|
|
||||||
Community leaders have the right and responsibility to remove, edit, or
|
Community leaders have the right and responsibility to remove, edit, or
|
||||||
reject comments, commits, code, wiki edits, issues, and other contributions
|
reject comments, commits, code, wiki edits, issues, and other contributions
|
||||||
that are not aligned to this Code of Conduct, and will communicate reasons
|
that are not aligned to this Code of Conduct, and will communicate reasons
|
||||||
for moderation decisions when appropriate.
|
for moderation decisions when appropriate.
|
||||||
|
|
|
@ -6,11 +6,10 @@ order: 50
|
||||||
Instances of abusive, harassing, or otherwise unacceptable behavior
|
Instances of abusive, harassing, or otherwise unacceptable behavior
|
||||||
may be reported to the community leaders responsible for enforcement:
|
may be reported to the community leaders responsible for enforcement:
|
||||||
|
|
||||||
- Joost De Cock (joost@joost.at)
|
- Joost De Cock (joost@joost.at)
|
||||||
- Sorcha Ní Dhubhghaill (nidhubhs@gmail.com)
|
- Sorcha Ní Dhubhghaill (nidhubhs@gmail.com)
|
||||||
|
|
||||||
All complaints will be reviewed and investigated promptly and fairly.
|
All complaints will be reviewed and investigated promptly and fairly.
|
||||||
|
|
||||||
All community leaders are obligated to respect the privacy and
|
All community leaders are obligated to respect the privacy and
|
||||||
security of the reporter of any incident.
|
security of the reporter of any incident.
|
||||||
|
|
||||||
|
|
|
@ -3,14 +3,13 @@ title: Our pledge
|
||||||
order: 10
|
order: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
We as members, contributors, and leaders of the FreeSewing community pledge
|
We as members, contributors, and leaders of the FreeSewing community pledge
|
||||||
to make participation in our community a harassment-free experience for everyone.
|
to make participation in our community a harassment-free experience for everyone.
|
||||||
|
|
||||||
Everyone, regardless of age, body size, visible or invisible disability,
|
Everyone, regardless of age, body size, visible or invisible disability,
|
||||||
ethnicity, sex characteristics, gender identity and expression, level of experience,
|
ethnicity, sex characteristics, gender identity and expression, level of experience,
|
||||||
education, socio-economic status, nationality, personal appearance, race,
|
education, socio-economic status, nationality, personal appearance, race,
|
||||||
religion, or sexual identity and orientation.
|
religion, or sexual identity and orientation.
|
||||||
|
|
||||||
We pledge to act and interact in ways that contribute to an open, welcoming,
|
We pledge to act and interact in ways that contribute to an open, welcoming,
|
||||||
diverse, inclusive, and healthy community.
|
diverse, inclusive, and healthy community.
|
||||||
|
|
||||||
|
|
|
@ -5,16 +5,16 @@ order: 20
|
||||||
|
|
||||||
Examples of behavior that contributes to a positive environment for our community include:
|
Examples of behavior that contributes to a positive environment for our community include:
|
||||||
|
|
||||||
- Demonstrating empathy and kindness toward other people
|
- Demonstrating empathy and kindness toward other people
|
||||||
- Being respectful of differing opinions, viewpoints, and experiences
|
- Being respectful of differing opinions, viewpoints, and experiences
|
||||||
- Giving and gracefully accepting constructive feedback
|
- Giving and gracefully accepting constructive feedback
|
||||||
- Accepting responsibility and apologizing to those affected by our mistakes, and learning from the experience
|
- Accepting responsibility and apologizing to those affected by our mistakes, and learning from the experience
|
||||||
- Focusing on what is best not just for us as individuals, but for the overall community
|
- Focusing on what is best not just for us as individuals, but for the overall community
|
||||||
|
|
||||||
Examples of unacceptable behavior include:
|
Examples of unacceptable behavior include:
|
||||||
|
|
||||||
- The use of sexualized language or imagery, and sexual attention or advances of any kind
|
- The use of sexualized language or imagery, and sexual attention or advances of any kind
|
||||||
- Trolling, insulting or derogatory comments, and personal or political attacks
|
- Trolling, insulting or derogatory comments, and personal or political attacks
|
||||||
- Public or private harassment
|
- Public or private harassment
|
||||||
- Publishing others’ private information, such as a physical or email address, without their explicit permission
|
- Publishing others’ private information, such as a physical or email address, without their explicit permission
|
||||||
- Other conduct which could reasonably be considered inappropriate in a professional setting
|
- Other conduct which could reasonably be considered inappropriate in a professional setting
|
||||||
|
|
|
@ -3,10 +3,9 @@ title: Scope
|
||||||
order: 40
|
order: 40
|
||||||
---
|
---
|
||||||
|
|
||||||
This Code of Conduct applies within all FreeSewing community spaces, and also applies
|
This Code of Conduct applies within all FreeSewing community spaces, and also applies
|
||||||
when an individual is officially representing the FreeSewing community in public spaces.
|
when an individual is officially representing the FreeSewing community in public spaces.
|
||||||
|
|
||||||
Examples of representing our community include using an official e-mail address,
|
Examples of representing our community include using an official e-mail address,
|
||||||
posting via an official social media account, or acting as an appointed representative
|
posting via an official social media account, or acting as an appointed representative
|
||||||
at an online or offline event.
|
at an online or offline event.
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,10 @@ documentation can help you find your feet, and figure out what goes where.
|
||||||
|
|
||||||
Our documentation is divided into four different types:
|
Our documentation is divided into four different types:
|
||||||
|
|
||||||
- [**Tutorials**](/tutorials) are lessons that lead you through a series of steps to complete a project.
|
- [**Tutorials**](/tutorials) are lessons that lead you through a series of steps to complete a project.
|
||||||
- [**Guides**](/guides) tell a story to further your understanding of a specific topic.
|
- [**Guides**](/guides) tell a story to further your understanding of a specific topic.
|
||||||
- [**Howtos**](/howtos) give you concrete steps to solve a common problem or challenge.
|
- [**Howtos**](/howtos) give you concrete steps to solve a common problem or challenge.
|
||||||
- [**Reference**](/reference) holds technical descriptions of the underlying technology and how to make use of it.
|
- [**Reference**](/reference) holds technical descriptions of the underlying technology and how to make use of it.
|
||||||
|
|
||||||
Each time you write documentation, you have to ask yourself: Is it a tutorial? Is it a Guide?
|
Each time you write documentation, you have to ask yourself: Is it a tutorial? Is it a Guide?
|
||||||
Is it a Howto? Or is it Reference documentation.
|
Is it a Howto? Or is it Reference documentation.
|
||||||
|
@ -21,24 +21,21 @@ Is it a Howto? Or is it Reference documentation.
|
||||||
If you find it hard to answer that question, the illustration below might help you figure out
|
If you find it hard to answer that question, the illustration below might help you figure out
|
||||||
where your documentation should go based on what it's trying to accomplish:
|
where your documentation should go based on what it's trying to accomplish:
|
||||||
|
|
||||||

|
structure](docs.png "A visual representation of how our documentation is structured")
|
||||||
|
|
||||||
|
- Write a **Tutorial** is your aim is to help people learn the platform
|
||||||
- Write a **Tutorial** is your aim is to help people learn the platform
|
- Write a **Guide** if your aim is to further people's understanding of a topic by going a bit deeper
|
||||||
- Write a **Guide** if your aim is to further people's understanding of a topic by going a bit deeper
|
- Write a **Howto** if your ain is to help people accomplish a task
|
||||||
- Write a **Howto** if your ain is to help people accomplish a task
|
- Write **Reference** documentation to detail how things work under the hood
|
||||||
- Write **Reference** documentation to detail how things work under the hood
|
- Refer people to **Discord or Github** for things that are not (yet) covered in our documentation
|
||||||
- Refer people to **Discord or Github** for things that are not (yet) covered in our documentation
|
|
||||||
|
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
##### Based on a talk by Daniele Procida
|
##### Based on a talk by Daniele Procida
|
||||||
|
|
||||||
This structure is loosely based
|
This structure is loosely based
|
||||||
on [this talk by Daniele Procida](https://www.youtube.com/watch?v=t4vKPhjcMZg) at
|
on [this talk by Daniele Procida](https://www.youtube.com/watch?v=t4vKPhjcMZg) at
|
||||||
PyCon AU 2017.
|
PyCon AU 2017.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -3,8 +3,7 @@ title: Guides
|
||||||
order: zbb
|
order: zbb
|
||||||
---
|
---
|
||||||
|
|
||||||
You can find a list of all FreeSewing guides below:
|
You can find a list of all FreeSewing guides below:
|
||||||
|
|
||||||
|
|
||||||
<ReadMore recurse />
|
<ReadMore recurse />
|
||||||
|
|
||||||
|
@ -20,4 +19,3 @@ guides take more time to explain in-depth what is being done and why.
|
||||||
For more details, refer to [How we structure our documentation](/guides/docs).
|
For more details, refer to [How we structure our documentation](/guides/docs).
|
||||||
|
|
||||||
</Related>
|
</Related>
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@ title: Code and code blocks
|
||||||
order: 80
|
order: 80
|
||||||
---
|
---
|
||||||
|
|
||||||
Especially for our developer documentation, there's a lot of times we include source code
|
Especially for our developer documentation, there's a lot of times we include source code
|
||||||
in the documentation.
|
in the documentation.
|
||||||
You can make these look pretty by using a code block.
|
You can make these look pretty by using a code block.
|
||||||
|
|
||||||
|
@ -15,7 +15,7 @@ let me = 'you'
|
||||||
```
|
```
|
||||||
````
|
````
|
||||||
|
|
||||||
Gives you:
|
Gives you:
|
||||||
|
|
||||||
```text
|
```text
|
||||||
let me = 'you'
|
let me = 'you'
|
||||||
|
@ -38,14 +38,11 @@ let me = 'you'
|
||||||
|
|
||||||
The following language codes are supported:
|
The following language codes are supported:
|
||||||
|
|
||||||
- `js` for Javascript code
|
- `js` for Javascript code
|
||||||
- `markdown` for Markdown
|
- `markdown` for Markdown
|
||||||
- `html` for HTML
|
- `html` for HTML
|
||||||
- `svg` for SVG
|
- `svg` for SVG
|
||||||
- `bash` for Bash or shell scripts
|
- `bash` for Bash or shell scripts
|
||||||
- `mdx` for MDX
|
- `mdx` for MDX
|
||||||
- `jsx` for JSX
|
- `jsx` for JSX
|
||||||
- `json` for JSON
|
- `json` for JSON
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@ title: Custom components
|
||||||
order: 90
|
order: 90
|
||||||
---
|
---
|
||||||
|
|
||||||
The way we render markdown on our websites is through the use of [MDX](https://mdxjs.com/).
|
The way we render markdown on our websites is through the use of [MDX](https://mdxjs.com/).\
|
||||||
This allows us to extend Markdown with our own so-called *custom components*.
|
This allows us to extend Markdown with our own so-called *custom components*.
|
||||||
|
|
||||||
Such custom components allow us to put things in Markdown content that would
|
Such custom components allow us to put things in Markdown content that would
|
||||||
|
@ -42,7 +42,6 @@ The **Comment** component requires a `by` attribute that lists the author of the
|
||||||
<Comment by="joost">**Do** try this at home</Comment>
|
<Comment by="joost">**Do** try this at home</Comment>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
## Fixme
|
## Fixme
|
||||||
|
|
||||||
<Fixme>
|
<Fixme>
|
||||||
|
@ -62,7 +61,6 @@ or can't fix it now.
|
||||||
</Fixme>
|
</Fixme>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
## Note
|
## Note
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
@ -91,6 +89,7 @@ It's typically used on overview pages, such as out [markdown guide](/guides/mark
|
||||||
It won't show anything on this page, since this page has not child-pages.
|
It won't show anything on this page, since this page has not child-pages.
|
||||||
|
|
||||||
## Related
|
## Related
|
||||||
|
|
||||||
<Related>
|
<Related>
|
||||||
This snippet is provided by [the buttons plugin](/reference/plugins/buttons)
|
This snippet is provided by [the buttons plugin](/reference/plugins/buttons)
|
||||||
</Related>
|
</Related>
|
||||||
|
@ -104,6 +103,7 @@ Use **Related** to add something that is relevant to the current topic.
|
||||||
```
|
```
|
||||||
|
|
||||||
## Tip
|
## Tip
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
Comparing yourself to others is the fastest way to become unhappy
|
Comparing yourself to others is the fastest way to become unhappy
|
||||||
</Tip>
|
</Tip>
|
||||||
|
@ -117,6 +117,7 @@ Use **Tip** for, you know, tips.
|
||||||
```
|
```
|
||||||
|
|
||||||
## Warning
|
## Warning
|
||||||
|
|
||||||
<Warning>
|
<Warning>
|
||||||
##### Please make a backup
|
##### Please make a backup
|
||||||
Following these instructions will remove all your data
|
Following these instructions will remove all your data
|
||||||
|
@ -142,7 +143,7 @@ Embed a video:
|
||||||
```markdown
|
```markdown
|
||||||
<YouTube id='Rz6ShSftDlI' />
|
<YouTube id='Rz6ShSftDlI' />
|
||||||
```
|
```
|
||||||
|
|
||||||
Embed a playlist:
|
Embed a playlist:
|
||||||
|
|
||||||
<YouTube id='PL1gv5yv3DoZOFSXz7yydeV1H8m6pfwstn' playlist />
|
<YouTube id='PL1gv5yv3DoZOFSXz7yydeV1H8m6pfwstn' playlist />
|
||||||
|
@ -150,6 +151,3 @@ Embed a playlist:
|
||||||
```md
|
```md
|
||||||
<YouTube id='PL1gv5yv3DoZOFSXz7yydeV1H8m6pfwstn' playlist />
|
<YouTube id='PL1gv5yv3DoZOFSXz7yydeV1H8m6pfwstn' playlist />
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -14,7 +14,7 @@ goals:
|
||||||
- Learn about the different custom components
|
- Learn about the different custom components
|
||||||
---
|
---
|
||||||
|
|
||||||
Markdown is a lightweight markup language with plain text formatting syntax.
|
Markdown is a lightweight markup language with plain text formatting syntax.
|
||||||
It is designed to be easily readable by humans, and computers alike.
|
It is designed to be easily readable by humans, and computers alike.
|
||||||
|
|
||||||
Markdown is often used to format documentation, online comments,
|
Markdown is often used to format documentation, online comments,
|
||||||
|
@ -24,6 +24,5 @@ In this guide, we'll look at the following topics:
|
||||||
|
|
||||||
<ReadMore list />
|
<ReadMore list />
|
||||||
|
|
||||||
This will be enough to get you started. If you'd like to learn more,
|
This will be enough to get you started. If you'd like to learn more,
|
||||||
visit [markdownguide.org](https://www.markdownguide.org/).
|
visit [markdownguide.org](https://www.markdownguide.org/).
|
||||||
|
|
||||||
|
|
|
@ -7,33 +7,33 @@ Some things to keep in mind when working in Markdown are:
|
||||||
|
|
||||||
## Use remark-jargon for glossary terms
|
## Use remark-jargon for glossary terms
|
||||||
|
|
||||||
There is no need to add a *glossary* section to documentation.
|
There is no need to add a *glossary* section to documentation.
|
||||||
We use a plugin called [remark-jargon][rj] to explain terms.
|
We use a plugin called [remark-jargon][rj] to explain terms.
|
||||||
Information can be found at the link.
|
Information can be found at the link.
|
||||||
|
|
||||||
[rj]: https://github.com/freesewing/freesewing/blob/develop/packages/remark-jargon/README.md
|
[rj]: https://github.com/freesewing/freesewing/blob/develop/packages/remark-jargon/README.md
|
||||||
|
|
||||||
## Let lists be lists
|
## Let lists be lists
|
||||||
|
|
||||||
Please make sure to use Markdown proper, doing things such as hardcoding
|
Please make sure to use Markdown proper, doing things such as hardcoding
|
||||||
numbers for lists and using `·` for bulleted lists won't be rendered
|
numbers for lists and using `·` for bulleted lists won't be rendered
|
||||||
properly and will be styled differently.
|
properly and will be styled differently.
|
||||||
Using Markdown in the same way for everything ensures the site and
|
Using Markdown in the same way for everything ensures the site and
|
||||||
documentation look clean and professional. You can use a Markdown editor
|
documentation look clean and professional. You can use a Markdown editor
|
||||||
like [StackEdit](https://stackedit.io/) to preview your text.
|
like [StackEdit](https://stackedit.io/) to preview your text.
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
Github itself also allows working in Markdown and will give you a handy preview!
|
Github itself also allows working in Markdown and will give you a handy preview!
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
If you get lost or have a question about how to do something, feel free to come
|
If you get lost or have a question about how to do something, feel free to come
|
||||||
ask on the Discord. We've all had to learn Markdown at some point and would be
|
ask on the Discord. We've all had to learn Markdown at some point and would be
|
||||||
delighted to pass knowledge on.
|
delighted to pass knowledge on.
|
||||||
|
|
||||||
## Create meaningful links
|
## Create meaningful links
|
||||||
|
|
||||||
When adding links please do not link them using a structure like:
|
When adding links please do not link them using a structure like:
|
||||||
Link [here][yt]. Instead put the link under the relevant term.
|
Link [here][yt]. Instead put the link under the relevant term.
|
||||||
See first list item for an example.
|
See first list item for an example.
|
||||||
|
|
||||||
[yt]: https://www.youtube.com/watch?v=dQw4w9WgXcQ
|
[yt]: https://www.youtube.com/watch?v=dQw4w9WgXcQ
|
||||||
|
@ -42,22 +42,23 @@ See first list item for an example.
|
||||||
|
|
||||||
### Lining within the same website
|
### Lining within the same website
|
||||||
|
|
||||||
When you are linking within freesewing.dev or freesewing.org you can use a relative link from
|
When you are linking within freesewing.dev or freesewing.org you can use a relative link from
|
||||||
the site root.
|
the site root.\
|
||||||
Use:
|
Use:
|
||||||
|
|
||||||
```text
|
```text
|
||||||
/guides/markdown/frequent-mistakes
|
/guides/markdown/frequent-mistakes
|
||||||
```
|
```
|
||||||
instead of
|
|
||||||
|
instead of
|
||||||
|
|
||||||
```text
|
```text
|
||||||
https://freesewing.dev/guides/markdown/frequent-mistakes
|
https://freesewing.dev/guides/markdown/frequent-mistakes
|
||||||
```
|
```
|
||||||
|
|
||||||
### Linking images
|
### Linking images
|
||||||
|
|
||||||
Images can be put in the same folder you are working on with a link
|
Images can be put in the same folder you are working on with a link
|
||||||
to the filename. For example:
|
to the filename. For example:
|
||||||
|
|
||||||
```markdown
|
```markdown
|
||||||
|
@ -66,16 +67,16 @@ This is [a picture of a banana](banana.jpg)
|
||||||
|
|
||||||
## Avoid ambiguity when lising a number of steps
|
## Avoid ambiguity when lising a number of steps
|
||||||
|
|
||||||
If you're writing documentation that involves steps, please do not mix levels
|
If you're writing documentation that involves steps, please do not mix levels
|
||||||
of steps. Steps written out in documentation are there to facilitate brainless
|
of steps. Steps written out in documentation are there to facilitate brainless
|
||||||
execution. Don't be afraid to repeat yourself.
|
execution. Don't be afraid to repeat yourself.
|
||||||
|
|
||||||
If you use substeps we want those substeps to take away ambiguity rather
|
If you use substeps we want those substeps to take away ambiguity rather
|
||||||
than introduce it into your instructions. In the next example the substep
|
than introduce it into your instructions. In the next example the substep
|
||||||
introduces something that ought to be done before the previous steps.
|
introduces something that ought to be done before the previous steps.
|
||||||
This creates confusion about when that step ought to be executed.
|
This creates confusion about when that step ought to be executed.
|
||||||
|
|
||||||
An example of what not to do:
|
An example of what not to do:
|
||||||
|
|
||||||
```md
|
```md
|
||||||
1. cut collar
|
1. cut collar
|
||||||
|
@ -87,18 +88,18 @@ An example of what not to do:
|
||||||
|
|
||||||
## Be mindful of whitespace
|
## Be mindful of whitespace
|
||||||
|
|
||||||
Markdown sytax around white space is a little unintuitive. If you want a
|
Markdown sytax around white space is a little unintuitive. If you want a
|
||||||
paragraph break but no white space you need to add two spaces at the end of
|
paragraph break but no white space you need to add two spaces at the end of
|
||||||
your line. I've found it helpful to experiment and keep checking the preview
|
your line. I've found it helpful to experiment and keep checking the preview
|
||||||
to see how things look. Not all the empty lines and whitespace in your
|
to see how things look. Not all the empty lines and whitespace in your
|
||||||
document will render in the preview.
|
document will render in the preview.
|
||||||
|
|
||||||
## Using custom components
|
## Using custom components
|
||||||
|
|
||||||
When you're using custom components you want to leave an empty line before
|
When you're using custom components you want to leave an empty line before
|
||||||
and after your component.
|
and after your component.
|
||||||
|
|
||||||
```markdown
|
```markdown
|
||||||
Lorem ipsum dolor sit amet,
|
Lorem ipsum dolor sit amet,
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
@ -108,9 +109,8 @@ consectetur adipisci elit,
|
||||||
sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
|
sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
|
||||||
```
|
```
|
||||||
|
|
||||||
If you're using any markdown syntax within a custom component you want to also
|
If you're using any markdown syntax within a custom component you want to also
|
||||||
leave an empty line at the start and end of your component.
|
leave an empty line at the start and end of your component.
|
||||||
|
|
||||||
|
|
||||||
```markdown
|
```markdown
|
||||||
Lorem ipsum dolor sit amet,
|
Lorem ipsum dolor sit amet,
|
||||||
|
@ -125,11 +125,7 @@ sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
|
||||||
```
|
```
|
||||||
|
|
||||||
## Don't be shy to ask a friend
|
## Don't be shy to ask a friend
|
||||||
Learning a new language can be intimidating, whether its Javascript, Norse or
|
|
||||||
Markdown but everyone in the Freesewing community is glad you're here and
|
|
||||||
helping us make the site even more awesome.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Learning a new language can be intimidating, whether its Javascript, Norse or
|
||||||
|
Markdown but everyone in the Freesewing community is glad you're here and
|
||||||
|
helping us make the site even more awesome.
|
||||||
|
|
|
@ -20,9 +20,8 @@ followed by a space and the image title between quotes.
|
||||||
|
|
||||||
##### Images go in the same folder as your markdown file
|
##### Images go in the same folder as your markdown file
|
||||||
|
|
||||||
The convention is to always place your images in the same folder as the
|
The convention is to always place your images in the same folder as the
|
||||||
text where you are including the image. That way, you just need to specify
|
text where you are including the image. That way, you just need to specify
|
||||||
the image name, and not the path to its location.
|
the image name, and not the path to its location.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
|
@ -7,10 +7,11 @@ order: 30
|
||||||
You can make text *italic* or **bold**
|
You can make text *italic* or **bold**
|
||||||
by wrapping it in 1 or 2 asterisk respectively.
|
by wrapping it in 1 or 2 asterisk respectively.
|
||||||
```
|
```
|
||||||
|
|
||||||
You can make text *italic* or **bold** by wrapping it in 1 or 2 asterisk respectively:
|
You can make text *italic* or **bold** by wrapping it in 1 or 2 asterisk respectively:
|
||||||
|
|
||||||
```md
|
```md
|
||||||
Alternatively, you can also use underscores to mark _italic_ or __bold__.
|
Alternatively, you can also use underscores to mark _italic_ or __bold__.
|
||||||
```
|
```
|
||||||
Alternatively, you can also use underscores to mark _italic_ or __bold__.
|
|
||||||
|
|
||||||
|
Alternatively, you can also use underscores to mark *italic* or **bold**.
|
||||||
|
|
|
@ -11,6 +11,5 @@ Like
|
||||||
this.
|
this.
|
||||||
```
|
```
|
||||||
|
|
||||||
Like
|
Like\
|
||||||
this.
|
this.
|
||||||
|
|
||||||
|
|
|
@ -8,6 +8,7 @@ Links combine square brackets for the link text with round brackets for the dest
|
||||||
```md
|
```md
|
||||||
[Like this](https://freesewing.org)
|
[Like this](https://freesewing.org)
|
||||||
```
|
```
|
||||||
|
|
||||||
[Like this](https://freesewing.org)
|
[Like this](https://freesewing.org)
|
||||||
|
|
||||||
An alternative notation allows you to include the links as such:
|
An alternative notation allows you to include the links as such:
|
||||||
|
@ -22,6 +23,7 @@ See [the reference documentation][1] on [freesewing.dev][2]
|
||||||
See [the reference documentation][1] on [freesewing.dev][2]
|
See [the reference documentation][1] on [freesewing.dev][2]
|
||||||
|
|
||||||
[1]: https://freesewing.dev/reference
|
[1]: https://freesewing.dev/reference
|
||||||
|
|
||||||
[2]: https://freesewing.dev/reference
|
[2]: https://freesewing.dev/reference
|
||||||
|
|
||||||
You don't have to use numbers, but can also use named references.
|
You don't have to use numbers, but can also use named references.
|
||||||
|
@ -35,4 +37,3 @@ We moved the markdown content to [our monorepo][monorepo]
|
||||||
We moved the markdown content to [our monorepo][monorepo]
|
We moved the markdown content to [our monorepo][monorepo]
|
||||||
|
|
||||||
[monorepo]: https://github.com/freesewing/freesewing
|
[monorepo]: https://github.com/freesewing/freesewing
|
||||||
|
|
||||||
|
|
|
@ -12,12 +12,12 @@ To make a list, just do as you would in plain text:
|
||||||
- item
|
- item
|
||||||
```
|
```
|
||||||
|
|
||||||
- a bullet
|
- a bullet
|
||||||
- list
|
- list
|
||||||
- a sublist
|
- a sublist
|
||||||
- item
|
- item
|
||||||
|
|
||||||
If you want an numbered list, just write numbers.
|
If you want an numbered list, just write numbers.
|
||||||
They don't even have to be the correct numbers:
|
They don't even have to be the correct numbers:
|
||||||
|
|
||||||
```md
|
```md
|
||||||
|
@ -27,7 +27,6 @@ They don't even have to be the correct numbers:
|
||||||
2. Item 3
|
2. Item 3
|
||||||
```
|
```
|
||||||
|
|
||||||
1. Item 1
|
1. Item 1
|
||||||
2. Item 2
|
2. Item 2
|
||||||
2. Item 3
|
3. Item 3
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,6 @@ order: 70
|
||||||
|
|
||||||
If you need them, you can create tables too, using a structure as shown below:
|
If you need them, you can create tables too, using a structure as shown below:
|
||||||
|
|
||||||
|
|
||||||
```md
|
```md
|
||||||
| Name | Description |
|
| Name | Description |
|
||||||
| ---- | ----------- |
|
| ---- | ----------- |
|
||||||
|
@ -35,4 +34,3 @@ You can change the alignment of the columns by using a colon (`:`) on the line b
|
||||||
| Compound | A substance composed of two or more elements. Chemically combined in definite proportions by weight |
|
| Compound | A substance composed of two or more elements. Chemically combined in definite proportions by weight |
|
||||||
| Mixture | Two or more substances that are not chemically united, such as air |
|
| Mixture | Two or more substances that are not chemically united, such as air |
|
||||||
| Solution | A uniform mixture of varying proportions of a solvent and a solute |
|
| Solution | A uniform mixture of varying proportions of a solvent and a solute |
|
||||||
|
|
||||||
|
|
|
@ -10,7 +10,7 @@ You can just start writing.
|
||||||
|
|
||||||
An empty line starts a new paragraph.
|
An empty line starts a new paragraph.
|
||||||
```
|
```
|
||||||
|
|
||||||
You can just start writing.
|
You can just start writing.
|
||||||
|
|
||||||
An empty line starts a new paragraph.
|
An empty line starts a new paragraph.
|
||||||
|
|
||||||
|
|
|
@ -12,11 +12,11 @@ The pattern configuration holds important information about the pattern
|
||||||
A pattern's [configuration](/reference/config/) is created by the pattern designer
|
A pattern's [configuration](/reference/config/) is created by the pattern designer
|
||||||
and details a number of important things about the pattern, like:
|
and details a number of important things about the pattern, like:
|
||||||
|
|
||||||
- The **measurements** that are required to draft the pattern
|
- The **measurements** that are required to draft the pattern
|
||||||
- The different **parts** in the pattern and how they depend on each other
|
- The different **parts** in the pattern and how they depend on each other
|
||||||
- The different **options** that are available to tweak the pattern
|
- The different **options** that are available to tweak the pattern
|
||||||
|
|
||||||
The configuration is part of the pattern's code. It is created by the designer and
|
The configuration is part of the pattern's code. It is created by the designer and
|
||||||
it is the same for everybody using the pattern.
|
it is the same for everybody using the pattern.
|
||||||
In other words, you cannot change the configuration. Instead, the configuration
|
In other words, you cannot change the configuration. Instead, the configuration
|
||||||
specifies what kind of settings the pattern accepts.
|
specifies what kind of settings the pattern accepts.
|
||||||
|
|
|
@ -3,12 +3,12 @@ title: How patterns work
|
||||||
---
|
---
|
||||||
|
|
||||||
This short guide will illustrate and explain how patterns work in FreeSewing.
|
This short guide will illustrate and explain how patterns work in FreeSewing.
|
||||||
Not to be confused with how sewing pattern work — although there's [great books
|
Not to be confused with how sewing pattern work — although there's [great books
|
||||||
about that](https://www.assembil.com/how-patterns-work-book/) if you're
|
about that](https://www.assembil.com/how-patterns-work-book/) if you're
|
||||||
interested — it's about what goes on under the hood each time a sewing
|
interested — it's about what goes on under the hood each time a sewing
|
||||||
pattern is generated by FreeSewing.
|
pattern is generated by FreeSewing.
|
||||||
|
|
||||||
This illustration is a good starting point to gain a better
|
This illustration is a good starting point to gain a better
|
||||||
understanding of the structure of a FreeSewing pattern:
|
understanding of the structure of a FreeSewing pattern:
|
||||||
|
|
||||||
<Example part="docs_overview">
|
<Example part="docs_overview">
|
||||||
|
@ -17,9 +17,9 @@ A schematic overview of FreeSewing
|
||||||
|
|
||||||
If we look at our image, it can be divided into three areas:
|
If we look at our image, it can be divided into three areas:
|
||||||
|
|
||||||
- The left area with the **settings** box
|
- The left area with the **settings** box
|
||||||
- The middle area with the **Pattern** box and everything in it
|
- The middle area with the **Pattern** box and everything in it
|
||||||
- The right area with the **draft** box and the *SVG* and *React* logos
|
- The right area with the **draft** box and the *SVG* and *React* logos
|
||||||
|
|
||||||
Let's take a closer look at everything that is contained within our central **Pattern** box:
|
Let's take a closer look at everything that is contained within our central **Pattern** box:
|
||||||
|
|
||||||
|
@ -34,5 +34,3 @@ application.
|
||||||
That part is outside the scope of this guide.
|
That part is outside the scope of this guide.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -8,12 +8,11 @@ Parts divide your pattern into re-usable components
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
Parts are a container for the points, paths, and snippets of (a part of) your pattern.
|
Parts are a container for the points, paths, and snippets of (a part of) your pattern.
|
||||||
They are also re-usable by other patterns, which makes them a powerful tool to build
|
They are also re-usable by other patterns, which makes them a powerful tool to build
|
||||||
a pattern library.
|
a pattern library.
|
||||||
|
|
||||||
If you design a T-shirt pattern with a `front`, `back`, and `sleeve`, each of those would be a part.
|
If you design a T-shirt pattern with a `front`, `back`, and `sleeve`, each of those would be a part.
|
||||||
If you then wanted to make a long-sleeved version of your T-shirt pattern, you only need to design
|
If you then wanted to make a long-sleeved version of your T-shirt pattern, you only need to design
|
||||||
a new sleeve part. You can re-use the `front` and `back` parts of your short-sleeved T-shirt pattern, as they did not change.
|
a new sleeve part. You can re-use the `front` and `back` parts of your short-sleeved T-shirt pattern, as they did not change.
|
||||||
|
|
||||||
When developing a FreeSewing pattern, you will spend most of your time designing the individual parts.
|
When developing a FreeSewing pattern, you will spend most of your time designing the individual parts.
|
||||||
|
|
||||||
|
|
|
@ -12,15 +12,15 @@ Paths are the lines and curves that make up your pattern.
|
||||||
They are made up of a set of drawing operations that together make up the path.
|
They are made up of a set of drawing operations that together make up the path.
|
||||||
FreeSewing supports the following types of drawing operations:
|
FreeSewing supports the following types of drawing operations:
|
||||||
|
|
||||||
- The **move** operation moves our virtual pen but does not draw anything.
|
- The **move** operation moves our virtual pen but does not draw anything.
|
||||||
- The **line** operation draws a straight line
|
- The **line** operation draws a straight line
|
||||||
- The **curve** operation draws a [Bézier curve](/guides/overview/about/beziercurves/)
|
- The **curve** operation draws a [Bézier curve](/guides/overview/about/beziercurves/)
|
||||||
- The **close** operation closes the path
|
- The **close** operation closes the path
|
||||||
|
|
||||||
To crucial thing to keep in mind is that, with the exception of the **move** operation,
|
To crucial thing to keep in mind is that, with the exception of the **move** operation,
|
||||||
all drawing operations start from wherever you are currently on your virtual sheet of paper.
|
all drawing operations start from wherever you are currently on your virtual sheet of paper.
|
||||||
|
|
||||||
For example, you might expect the **line** operation to take a start- and endpoint.
|
For example, you might expect the **line** operation to take a start- and endpoint.
|
||||||
But in fact, it only takes an endpoint, and will draw a straight line from where our virtual pen
|
But in fact, it only takes an endpoint, and will draw a straight line from where our virtual pen
|
||||||
currently is to said endpoint.
|
currently is to said endpoint.
|
||||||
|
|
||||||
|
@ -35,8 +35,7 @@ Understanding that each drawing operation builds upon the next one is an importa
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
Our example image (which, if you hadn't realized was created with FreeSewing) has a lot of
|
Our example image (which, if you hadn't realized was created with FreeSewing) has a lot of
|
||||||
paths in it. Each box, the arrows, the lines in the React logo, and so on.
|
paths in it. Each box, the arrows, the lines in the React logo, and so on.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
|
@ -14,7 +14,6 @@ and the store.
|
||||||
In reality, your pattern will be a *constructor* that takes the user's settings as
|
In reality, your pattern will be a *constructor* that takes the user's settings as
|
||||||
input and will return a new instance of your pattern.
|
input and will return a new instance of your pattern.
|
||||||
|
|
||||||
That pattern instance will have a `draft()` method which will do the actual work of
|
That pattern instance will have a `draft()` method which will do the actual work of
|
||||||
drafting the pattern. Once drafted, you can either call the `render()` method on
|
drafting the pattern. Once drafted, you can either call the `render()` method on
|
||||||
the pattern instance, or pass it to [our React component](/packages/components) to render it in the browser.
|
the pattern instance, or pass it to [our React component](/packages/components) to render it in the browser.
|
||||||
|
|
||||||
|
|
|
@ -14,25 +14,24 @@ Before we can draw any line, we need to know where it starts from, and where it
|
||||||
That's why we have **points**. They are the most basic building block of a
|
That's why we have **points**. They are the most basic building block of a
|
||||||
FreeSewing pattern, and their role is to store coordinates.
|
FreeSewing pattern, and their role is to store coordinates.
|
||||||
|
|
||||||
Each point must have:
|
Each point must have:
|
||||||
|
|
||||||
- A **X-coordinate**
|
- A **X-coordinate**
|
||||||
- A **Y-coordinate**
|
- A **Y-coordinate**
|
||||||
|
|
||||||
Together, these coordinates determine the location of the point in the 2-dimensional plane we're drawing on.
|
Together, these coordinates determine the location of the point in the 2-dimensional plane we're drawing on.
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
Points are unlikely to confuse you. The only gotcha is [the
|
Points are unlikely to confuse you. The only gotcha is [the
|
||||||
coordinate system](/guides/prerequisites/coordinate-system/) which has a Y-axis that is inverted to what you
|
coordinate system](/guides/prerequisites/coordinate-system/) which has a Y-axis that is inverted to what you
|
||||||
may intuitively expect.
|
may intuitively expect.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
Our example image (which, if you hadn't realized was created with FreeSewing) has a lot of
|
Our example image (which, if you hadn't realized was created with FreeSewing) has a lot of
|
||||||
points in it. The corners of the boxes, the location where the text goes, and so on.
|
points in it. The corners of the boxes, the location where the text goes, and so on.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
|
@ -8,12 +8,12 @@ Snippets are little embelishments that go on your pattern
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
Snippets are little embellishments you can use and re-use on your pattern.
|
Snippets are little embellishments you can use and re-use on your pattern.
|
||||||
They are typically used for things like logos or buttons.
|
They are typically used for things like logos or buttons.
|
||||||
|
|
||||||
Each snippet must have:
|
Each snippet must have:
|
||||||
|
|
||||||
- An anchor point that determine where the snippet will be located
|
- An anchor point that determine where the snippet will be located
|
||||||
- The name of the snippet to insert
|
- The name of the snippet to insert
|
||||||
|
|
||||||
Since our example image does not have any snippets in it, here's another example
|
Since our example image does not have any snippets in it, here's another example
|
||||||
of a `button`, `buttonhole`, and `logo` snippet added to a FreeSewing pattern:
|
of a `button`, `buttonhole`, and `logo` snippet added to a FreeSewing pattern:
|
||||||
|
@ -21,4 +21,3 @@ of a `button`, `buttonhole`, and `logo` snippet added to a FreeSewing pattern:
|
||||||
<Example part="snippet">
|
<Example part="snippet">
|
||||||
An example of the use of snippets
|
An example of the use of snippets
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
|
|
|
@ -11,4 +11,3 @@ The store provides key-value storage that is shared across your pattern.
|
||||||
|
|
||||||
If you have some information in one part that you want to make available
|
If you have some information in one part that you want to make available
|
||||||
outside that part (in another part) you can save it to the store.
|
outside that part (in another part) you can save it to the store.
|
||||||
|
|
||||||
|
|
|
@ -20,6 +20,7 @@ const condition = settings => {
|
||||||
else return false // Do not load the plugin
|
else return false // Do not load the plugin
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
You pass your plugin and condition method as a third parameter to the Design constructor
|
You pass your plugin and condition method as a third parameter to the Design constructor
|
||||||
with the `plugin` and `condition` keys respectively.
|
with the `plugin` and `condition` keys respectively.
|
||||||
|
|
||||||
|
@ -50,16 +51,15 @@ const Pattern = new freesewing.Design(
|
||||||
|
|
||||||
Our condition method will return `true` only if the following conditions are met:
|
Our condition method will return `true` only if the following conditions are met:
|
||||||
|
|
||||||
- A `settings` object is passed into the method
|
- A `settings` object is passed into the method
|
||||||
- `settings.options` is _truthy_
|
- `settings.options` is *truthy*
|
||||||
- `settings.options.draftForHighBust` is _truthy_
|
- `settings.options.draftForHighBust` is *truthy*
|
||||||
- `settings.options.measurements.highBust` is _truthy_
|
- `settings.options.measurements.highBust` is *truthy*
|
||||||
|
|
||||||
This is a real-world example from our Teagan pattern. A t-shirt pattern that can be
|
This is a real-world example from our Teagan pattern. A t-shirt pattern that can be
|
||||||
drafted to the high bust (rather than the full chest circumference) if the user
|
drafted to the high bust (rather than the full chest circumference) if the user
|
||||||
choses so.
|
choses so.
|
||||||
|
|
||||||
But that feat is handled auto-magically by `plugin-bust` which is a build-time plugin.
|
But that feat is handled auto-magically by `plugin-bust` which is a build-time plugin.
|
||||||
So whether to load this plugin or not hinges on the user settings, which is why we
|
So whether to load this plugin or not hinges on the user settings, which is why we
|
||||||
load this plugin conditionally.
|
load this plugin conditionally.
|
||||||
|
|
||||||
|
|
|
@ -5,17 +5,16 @@ order: 60
|
||||||
|
|
||||||
A **hook** is a lifecycle event. The available hooks are:
|
A **hook** is a lifecycle event. The available hooks are:
|
||||||
|
|
||||||
- [preRender](/reference/hooks/prerender/): Called at the start of [`Pattern.render()`](/reference/api/pattern#render)
|
- [preRender](/reference/hooks/prerender/): Called at the start of [`Pattern.render()`](/reference/api/pattern#render)
|
||||||
- [postRender](/reference/hooks/postrender/): Called at the end of [`Pattern.render()`](/reference/api/pattern#render)
|
- [postRender](/reference/hooks/postrender/): Called at the end of [`Pattern.render()`](/reference/api/pattern#render)
|
||||||
- [insertText](/reference/hooks/inserttext/): Called when inserting text
|
- [insertText](/reference/hooks/inserttext/): Called when inserting text
|
||||||
- [preDraft](/reference/hooks/predraft/): Called at the start of [`Pattern.draft()`](/reference/api/pattern#draft)
|
- [preDraft](/reference/hooks/predraft/): Called at the start of [`Pattern.draft()`](/reference/api/pattern#draft)
|
||||||
- [postDraft](/reference/hooks/postdraft/): Called at the end of [`Pattern.draft()`](/reference/api/pattern#draft)
|
- [postDraft](/reference/hooks/postdraft/): Called at the end of [`Pattern.draft()`](/reference/api/pattern#draft)
|
||||||
- [preSample](/reference/hooks/presample/): Called at the start of [`Pattern.sample()`](/reference/api/pattern#sample)
|
- [preSample](/reference/hooks/presample/): Called at the start of [`Pattern.sample()`](/reference/api/pattern#sample)
|
||||||
- [postSample](/reference/hooks/postsample/): Called at the end of [`Pattern.sample()`](/reference/api/pattern#sample)
|
- [postSample](/reference/hooks/postsample/): Called at the end of [`Pattern.sample()`](/reference/api/pattern#sample)
|
||||||
|
|
||||||
You can register a method for a hook. When the hook is triggered, your method will be
|
You can register a method for a hook. When the hook is triggered, your method will be
|
||||||
called. It will receive two parameters:
|
called. It will receive two parameters:
|
||||||
|
|
||||||
- An object relevant to the hook. See the [hooks API reference](/reference/hooks/) for details.
|
- An object relevant to the hook. See the [hooks API reference](/reference/hooks/) for details.
|
||||||
- Data passed when the hook was registered (optional)
|
- Data passed when the hook was registered (optional)
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@ title: Loading build-time plugins
|
||||||
order: 20
|
order: 20
|
||||||
---
|
---
|
||||||
|
|
||||||
Build-time plugins are loaded at build time, by passing them to
|
Build-time plugins are loaded at build time, by passing them to
|
||||||
the [`freesewing.Design`](/reference/api/#design) constructor:
|
the [`freesewing.Design`](/reference/api/#design) constructor:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
@ -24,4 +24,3 @@ import config from "../config"
|
||||||
|
|
||||||
const Pattern = new freesewing.Design(config, [plugins, gorePlugin] )
|
const Pattern = new freesewing.Design(config, [plugins, gorePlugin] )
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -22,5 +22,3 @@ const myAaron = new Aaron()
|
||||||
Plugins that use only hooks are typically run-time plugins
|
Plugins that use only hooks are typically run-time plugins
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,8 +5,8 @@ order: 90
|
||||||
|
|
||||||
Plugin structure for macros is similar, with a few changes:
|
Plugin structure for macros is similar, with a few changes:
|
||||||
|
|
||||||
- Rather than the hook name, you provide the macro name (that you choose yourself)
|
- Rather than the hook name, you provide the macro name (that you choose yourself)
|
||||||
- The context (`this`) of a macro method is **always** a [Part](/reference/api/part) object.
|
- The context (`this`) of a macro method is **always** a [Part](/reference/api/part) object.
|
||||||
|
|
||||||
Apart from these, the structure is very similar:
|
Apart from these, the structure is very similar:
|
||||||
|
|
||||||
|
@ -35,7 +35,7 @@ export default {
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
Did you figure out what this plugin does?
|
Did you figure out what this plugin does?
|
||||||
It provides a `box` macro that draws a box on our pattern in a given location with a give size.
|
It provides a `box` macro that draws a box on our pattern in a given location with a give size.
|
||||||
|
|
||||||
We can use it like this:
|
We can use it like this:
|
||||||
|
@ -48,7 +48,7 @@ macro('box', {
|
||||||
});
|
});
|
||||||
```
|
```
|
||||||
|
|
||||||
Obviously, you can expect to learn how to call a macro in its documentation,
|
Obviously, you can expect to learn how to call a macro in its documentation,
|
||||||
rather than have to comb through its code.
|
rather than have to comb through its code.
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
@ -61,4 +61,3 @@ to a macro needs to be contained in a single argument.
|
||||||
Typically, you use a single plain object to configure the macro.
|
Typically, you use a single plain object to configure the macro.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -3,10 +3,10 @@ title: Plugin structure
|
||||||
order: 50
|
order: 50
|
||||||
---
|
---
|
||||||
|
|
||||||
Plugins can do two things:
|
Plugins can do two things:
|
||||||
|
|
||||||
- They can use hooks
|
- They can use hooks
|
||||||
- They can provide macros
|
- They can provide macros
|
||||||
|
|
||||||
Your plugin should export an object with the following structure:
|
Your plugin should export an object with the following structure:
|
||||||
|
|
||||||
|
@ -19,7 +19,6 @@ Your plugin should export an object with the following structure:
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
The `name` and `version` attributes are self-explanatory.
|
The `name` and `version` attributes are self-explanatory.
|
||||||
The [hooks](/guides/plugins/hooks/) and [macros](/guides/plugins/macros/) sections
|
The [hooks](/guides/plugins/hooks/) and [macros](/guides/plugins/macros/) sections
|
||||||
explain the `hooks` and `macros` properties.
|
explain the `hooks` and `macros` properties.
|
||||||
|
|
||||||
|
|
|
@ -5,8 +5,8 @@ order: 10
|
||||||
|
|
||||||
Plugins come in two flavours:
|
Plugins come in two flavours:
|
||||||
|
|
||||||
- [Build-time plugins](#build-time-plugins)
|
- [Build-time plugins](#build-time-plugins)
|
||||||
- [Run-time plugins](#run-time-plugins)
|
- [Run-time plugins](#run-time-plugins)
|
||||||
|
|
||||||
When writing a plugin, ask yourself whether it's a run-time or a build-time plugin.
|
When writing a plugin, ask yourself whether it's a run-time or a build-time plugin.
|
||||||
And if the answer is both, please split them into two plugins.
|
And if the answer is both, please split them into two plugins.
|
||||||
|
@ -25,14 +25,12 @@ Our [plugin bundle](/reference/plugins/bundle/) bundles build-time plugins that
|
||||||
|
|
||||||
<Note>Plugins that provide a macro are typically build-time plugins</Note>
|
<Note>Plugins that provide a macro are typically build-time plugins</Note>
|
||||||
|
|
||||||
|
|
||||||
## Run-time plugins
|
## Run-time plugins
|
||||||
|
|
||||||
A plugin is a run-time plugin if it can be added after instantiating your pattern.
|
A plugin is a run-time plugin if it can be added after instantiating your pattern.
|
||||||
Think of it as a plugin to be used in the front-end.
|
Think of it as a plugin to be used in the front-end.
|
||||||
|
|
||||||
Run-time plugins are not a dependecy of the pattern. They just _add something_ to it.
|
Run-time plugins are not a dependecy of the pattern. They just *add something* to it.
|
||||||
|
|
||||||
Our [theme plugin](/reference/plugins/theme/) is a good example of a run-time plugin.
|
Our [theme plugin](/reference/plugins/theme/) is a good example of a run-time plugin.
|
||||||
If it's missing, your pattern will still work, it just won't look pretty.
|
If it's missing, your pattern will still work, it just won't look pretty.
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@ title: Using hooks without a plugin
|
||||||
order: 85
|
order: 85
|
||||||
---
|
---
|
||||||
|
|
||||||
You can attach a method to a hook at run-time without the need for a plugin
|
You can attach a method to a hook at run-time without the need for a plugin
|
||||||
using the [Pattern.on()](/reference/api/pattern/on) method.
|
using the [Pattern.on()](/reference/api/pattern/on) method.
|
||||||
|
|
||||||
The method takes the hook name as its first argument, and the hook method as its second.
|
The method takes the hook name as its first argument, and the hook method as its second.
|
||||||
|
@ -17,4 +17,3 @@ pattern.on('preRender', function(svg) {
|
||||||
```
|
```
|
||||||
|
|
||||||
Congratulations, you've just made your pattern yellow.
|
Congratulations, you've just made your pattern yellow.
|
||||||
|
|
||||||
|
|
|
@ -9,8 +9,8 @@ that as the second object.
|
||||||
|
|
||||||
Remember that:
|
Remember that:
|
||||||
|
|
||||||
- The `insertText` hook will receive a locale and string and you should return a string.
|
- The `insertText` hook will receive a locale and string and you should return a string.
|
||||||
- All other hooks receive an object. You don't need to return anything, but rather modify the object you receive.
|
- All other hooks receive an object. You don't need to return anything, but rather modify the object you receive.
|
||||||
|
|
||||||
Let's look at an example:
|
Let's look at an example:
|
||||||
|
|
||||||
|
@ -39,8 +39,8 @@ export default {
|
||||||
|
|
||||||
This is a complete plugin, ready to be published on NPM. It uses two hooks:
|
This is a complete plugin, ready to be published on NPM. It uses two hooks:
|
||||||
|
|
||||||
- `preRender` : We add some style and defs to our SVG
|
- `preRender` : We add some style and defs to our SVG
|
||||||
- `insertText` : We transfer all text to UPPERCASE
|
- `insertText` : We transfer all text to UPPERCASE
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
|
@ -52,8 +52,7 @@ the SVG tag with the name and version of our plugin.
|
||||||
We check for this attribute when the `preRender` hook runs, thereby avoiding that
|
We check for this attribute when the `preRender` hook runs, thereby avoiding that
|
||||||
our styles and defs will be added twice.
|
our styles and defs will be added twice.
|
||||||
|
|
||||||
It is good practice to wrap you hook methods in a call like this, because you have
|
It is good practice to wrap you hook methods in a call like this, because you have
|
||||||
no guarantee the user won't render your pattern more than once.
|
no guarantee the user won't render your pattern more than once.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -3,40 +3,38 @@ title: Understanding Bézier curves
|
||||||
order: 50
|
order: 50
|
||||||
---
|
---
|
||||||
|
|
||||||
While lines on computers are easy to store with a start and end point,
|
While lines on computers are easy to store with a start and end point,
|
||||||
curves require more information.
|
curves require more information.
|
||||||
In FreeSewing — as in SVG and countless of other computer applications —
|
In FreeSewing — as in SVG and countless of other computer applications —
|
||||||
curves are stored as [Bézier curves](https://en.wikipedia.org/wiki/B%C3%A9zier_curve),
|
curves are stored as [Bézier curves](https://en.wikipedia.org/wiki/B%C3%A9zier_curve),
|
||||||
named after French engineer [Pierre Bézier](https://en.wikipedia.org/wiki/Pierre_B%C3%A9zier) who
|
named after French engineer [Pierre Bézier](https://en.wikipedia.org/wiki/Pierre_B%C3%A9zier) who
|
||||||
popularized their use back in the 1960s.
|
popularized their use back in the 1960s.
|
||||||
|
|
||||||
In FreeSewing, we use so-called cubic Bézier curves which have:
|
In FreeSewing, we use so-called cubic Bézier curves which have:
|
||||||
|
|
||||||
- A start point
|
- A start point
|
||||||
- A first control point that’s linked to the start point
|
- A first control point that’s linked to the start point
|
||||||
- A second control point that’s linked to the end point
|
- A second control point that’s linked to the end point
|
||||||
- An end point
|
- An end point
|
||||||
|
|
||||||
<Example settings_complete="0" part="path_curve">
|
<Example settings_complete="0" part="path_curve">
|
||||||
An example of a Bézier curve drawn by the Path.curve() method
|
An example of a Bézier curve drawn by the Path.curve() method
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
Bézier curves and their *handles* or *control points* are surprisingly intuitive.
|
Bézier curves and their *handles* or *control points* are surprisingly intuitive.
|
||||||
The following illustration does a great job at explaining how they are constructed:
|
The following illustration does a great job at explaining how they are constructed:
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
You don't need understand the mathematics behind Bézier Curves.
|
You don't need understand the mathematics behind Bézier Curves.
|
||||||
As long as you intuitively *get* how the control points influence the curve, you're good to go.
|
As long as you intuitively *get* how the control points influence the curve, you're good to go.
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
###### More on Bézier curves
|
###### More on Bézier curves
|
||||||
|
|
||||||
Wikipedia has a good [introduction to Bézier curves](https://en.wikipedia.org/wiki/B%C3%A9zier_curve).
|
Wikipedia has a good [introduction to Bézier curves](https://en.wikipedia.org/wiki/B%C3%A9zier_curve).\
|
||||||
For a deep-dive into the subject, check out [A Primer on Bézier Curves](https://pomax.github.io/bezierinfo/) by
|
For a deep-dive into the subject, check out [A Primer on Bézier Curves](https://pomax.github.io/bezierinfo/) by
|
||||||
[Pomax](https://github.com/Pomax).
|
[Pomax](https://github.com/Pomax).
|
||||||
|
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -24,4 +24,3 @@ This is a common point of confusion so keep in mind that the Y-axis may
|
||||||
not behave as you would have intuitively expected.
|
not behave as you would have intuitively expected.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -16,7 +16,7 @@ goals:
|
||||||
---
|
---
|
||||||
|
|
||||||
Drawing lines and curves on paper is a skill most people have been practicing since kindergarten.
|
Drawing lines and curves on paper is a skill most people have been practicing since kindergarten.
|
||||||
In FreeSewing, we draw lines and curves with code, which is a bit more abstract
|
In FreeSewing, we draw lines and curves with code, which is a bit more abstract
|
||||||
but doesn't have to be complicated once you understand a few basic building blocks.
|
but doesn't have to be complicated once you understand a few basic building blocks.
|
||||||
|
|
||||||
Understanding the concepts that are involved in designing sewing patterns in code will pay dividents later.
|
Understanding the concepts that are involved in designing sewing patterns in code will pay dividents later.
|
||||||
|
@ -30,12 +30,11 @@ That is why we recommend you familiarize yourself with the following topics:
|
||||||
|
|
||||||
FreeSewing sits at the intersection of the world of makers and developers.
|
FreeSewing sits at the intersection of the world of makers and developers.
|
||||||
If your background is in development, you will need no explaining what SVG is, but might not
|
If your background is in development, you will need no explaining what SVG is, but might not
|
||||||
know much about designing sewing patterns.
|
know much about designing sewing patterns.
|
||||||
If on the other hand your background is in sewing or pattern design, you might wonder what
|
If on the other hand your background is in sewing or pattern design, you might wonder what
|
||||||
the heck Node JS is and why you should care.
|
the heck Node JS is and why you should care.
|
||||||
|
|
||||||
Few people straddle both worlds, so as you start using FreeSewing, chances are
|
Few people straddle both worlds, so as you start using FreeSewing, chances are
|
||||||
you'll learn a few new things along the way.
|
you'll learn a few new things along the way.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -6,10 +6,9 @@ order: 20
|
||||||
Patterns are rendered as **SVG** — short
|
Patterns are rendered as **SVG** — short
|
||||||
for [Scalable Vector Graphics](https://en.wikipedia.org/wiki/Scalable_Vector_Graphics) —
|
for [Scalable Vector Graphics](https://en.wikipedia.org/wiki/Scalable_Vector_Graphics) —
|
||||||
an XML-based vector image format and an open standard.
|
an XML-based vector image format and an open standard.
|
||||||
While you don’t need to be an SVG expert, a basic understanding of the format
|
While you don’t need to be an SVG expert, a basic understanding of the format
|
||||||
will greatly help you to understand FreeSewing.
|
will greatly help you to understand FreeSewing.
|
||||||
|
|
||||||
For example, the coordinate system and the way paths
|
For example, the coordinate system and the way paths
|
||||||
are structured are all related to the SVG drawing system, which is closely related
|
are structured are all related to the SVG drawing system, which is closely related
|
||||||
to other 2D drawing technologies such as PostScript or PDF.
|
to other 2D drawing technologies such as PostScript or PDF.
|
||||||
|
|
||||||
|
|
|
@ -3,14 +3,12 @@ title: Units in FreeSewing
|
||||||
order: 40
|
order: 40
|
||||||
---
|
---
|
||||||
|
|
||||||
FreeSewing uses millimeter for all its internal units.
|
FreeSewing uses millimeter for all its internal units.
|
||||||
We do support both imperial and metrics units, which are displayed
|
We do support both imperial and metrics units, which are displayed
|
||||||
as cm or inch, but under the hood everything is handled in millimeter.
|
as cm or inch, but under the hood everything is handled in millimeter.
|
||||||
|
|
||||||
So as a pattern designer, you will work with mm.
|
So as a pattern designer, you will work with mm.
|
||||||
When you write `1`, that’s one mm. When you write `7.8`, that’s 7.8mm.
|
When you write `1`, that’s one mm. When you write `7.8`, that’s 7.8mm.
|
||||||
|
|
||||||
While you can use cm or inch on the FreeSewing website, that is merely a layer of
|
While you can use cm or inch on the FreeSewing website, that is merely a layer of
|
||||||
abstration on top of the internal units, which are always mm.
|
abstration on top of the internal units, which are always mm.
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@ title: Translation guide
|
||||||
Freesewing.org is proudly multilingual, and we currently support five languges.
|
Freesewing.org is proudly multilingual, and we currently support five languges.
|
||||||
For this, we rely on the work of our translators who volunteer their
|
For this, we rely on the work of our translators who volunteer their
|
||||||
time to translate FreeSewing into various languages from English, which
|
time to translate FreeSewing into various languages from English, which
|
||||||
is our source language.
|
is our source language.
|
||||||
|
|
||||||
This translation guide will tell you everything you need to
|
This translation guide will tell you everything you need to
|
||||||
know to join the effort as a translator for FreeSewing.
|
know to join the effort as a translator for FreeSewing.
|
||||||
|
@ -14,7 +14,7 @@ know to join the effort as a translator for FreeSewing.
|
||||||
|
|
||||||
##### TL;DR: Becoming a FreeSewing translator
|
##### TL;DR: Becoming a FreeSewing translator
|
||||||
|
|
||||||
Our translation project on Crowdin is accessible
|
Our translation project on Crowdin is accessible
|
||||||
via [translate.freesewing.org](https://translate.freesewing.org).
|
via [translate.freesewing.org](https://translate.freesewing.org).
|
||||||
|
|
||||||
To get started, you will need to be invited as a translator. No need to worry,
|
To get started, you will need to be invited as a translator. No need to worry,
|
||||||
|
@ -27,16 +27,15 @@ Bonus: You'll get an `@freesewing.org` email alias
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
||||||
## Languages
|
## Languages
|
||||||
|
|
||||||
We currently support the following five languages:
|
We currently support the following five languages:
|
||||||
|
|
||||||
- **en** : English
|
- **en** : English
|
||||||
- **de** : German
|
- **de** : German
|
||||||
- **es** : Spanish
|
- **es** : Spanish
|
||||||
- **fr** : French
|
- **fr** : French
|
||||||
- **nl** : Dutch
|
- **nl** : Dutch
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
|
@ -50,8 +49,8 @@ please [come and talk to us on Discord](https://discord.freesewing.org).
|
||||||
|
|
||||||
We use two different tools to manage our translations, depending on the context:
|
We use two different tools to manage our translations, depending on the context:
|
||||||
|
|
||||||
- Markdown content and code strings in our monorepo are translated within **Crowdin**
|
- Markdown content and code strings in our monorepo are translated within **Crowdin**
|
||||||
- Blog and showcase posts are translated within **Strapi**
|
- Blog and showcase posts are translated within **Strapi**
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
|
@ -59,7 +58,7 @@ We use two different tools to manage our translations, depending on the context:
|
||||||
|
|
||||||
If you'd like to help out, please join our translation team on Crowdin.
|
If you'd like to help out, please join our translation team on Crowdin.
|
||||||
|
|
||||||
While it can be nice to have blog and showcase posts translated, these are less important than the
|
While it can be nice to have blog and showcase posts translated, these are less important than the
|
||||||
translation work in Crowdin which is about the documentation and strings that allow people to
|
translation work in Crowdin which is about the documentation and strings that allow people to
|
||||||
use FreeSewing.org in a different language.
|
use FreeSewing.org in a different language.
|
||||||
|
|
||||||
|
@ -84,7 +83,7 @@ Strapi ([strapi.io](https://strapi.io/)) is a so-called *headless content manage
|
||||||
Headless just means that we load the content from it via an API, rather than have it be part of our
|
Headless just means that we load the content from it via an API, rather than have it be part of our
|
||||||
website like a classic CMS (eg. Wordpress).
|
website like a classic CMS (eg. Wordpress).
|
||||||
|
|
||||||
In Strapi, we keep our blog posts and showcases for FreeSewing.org.
|
In Strapi, we keep our blog posts and showcases for FreeSewing.org.
|
||||||
We also keep our newsletter editions there and developer blog posts for FreeSewing.dev there, but since
|
We also keep our newsletter editions there and developer blog posts for FreeSewing.dev there, but since
|
||||||
those are not translated, we will ignore them in this guide.
|
those are not translated, we will ignore them in this guide.
|
||||||
|
|
||||||
|
@ -129,8 +128,6 @@ These will be filled in later with the correct value. For example:
|
||||||
|
|
||||||
looks like this in Spanish
|
looks like this in Spanish
|
||||||
|
|
||||||
|
|
||||||
```yaml
|
```yaml
|
||||||
{field} guardado
|
{field} guardado
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -6,10 +6,9 @@ about: Shows you how to access user measurements from inside your pattern
|
||||||
|
|
||||||
Measurements are stored in `pattern.settings.measurements`.
|
Measurements are stored in `pattern.settings.measurements`.
|
||||||
|
|
||||||
You can pull them out of there with
|
You can pull them out of there with
|
||||||
the [shorthand](/howtos/code/shorthand/) call:
|
the [shorthand](/howtos/code/shorthand/) call:
|
||||||
|
|
||||||
|
|
||||||
```js
|
```js
|
||||||
const { measurements, options } = part.shorthand()
|
const { measurements, options } = part.shorthand()
|
||||||
|
|
||||||
|
|
|
@ -6,13 +6,11 @@ about: Shows you how to access user options from inside your pattern
|
||||||
|
|
||||||
Options are stored in `pattern.settings.options`.
|
Options are stored in `pattern.settings.options`.
|
||||||
|
|
||||||
You can pull them out of there with
|
You can pull them out of there with
|
||||||
the [shorthand](/howtos/code/shorthand/) call:
|
the [shorthand](/howtos/code/shorthand/) call:
|
||||||
|
|
||||||
|
|
||||||
```js
|
```js
|
||||||
const { measurements, options } = part.shorthand()
|
const { measurements, options } = part.shorthand()
|
||||||
|
|
||||||
let sleeveBonus = measurements.shoulderToWrist * (1 + options.sleeveLengthBonus);
|
let sleeveBonus = measurements.shoulderToWrist * (1 + options.sleeveLengthBonus);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -8,11 +8,11 @@ about: While documentation is good, sometimes you want to add some instructions
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/38d101b0415a4cbf3f9f86e006bd8cb7c43c703b/packages/jaeger/src/front.js#L411)
|
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/38d101b0415a4cbf3f9f86e006bd8cb7c43c703b/packages/jaeger/src/front.js#L411)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
Adding instructions to your pattern is _just_ a matter of adding text.
|
Adding instructions to your pattern is *just* a matter of adding text.
|
||||||
The tricky part is to make sure your text can be translated.
|
The tricky part is to make sure your text can be translated.
|
||||||
|
|
||||||
Below is a rather involved example from Aaron:
|
Below is a rather involved example from Aaron:
|
||||||
|
|
|
@ -4,7 +4,7 @@ for: developers
|
||||||
about: Shows you how to add new parts to your pattern
|
about: Shows you how to add new parts to your pattern
|
||||||
---
|
---
|
||||||
|
|
||||||
Since the patterns parts are listed
|
Since the patterns parts are listed
|
||||||
in [the configuration file](/reference/config/), freesewing knows about
|
in [the configuration file](/reference/config/), freesewing knows about
|
||||||
all the parts that belong to your pattern.
|
all the parts that belong to your pattern.
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@ icon: pattern
|
||||||
about: Shows you how to add paths to your pattern
|
about: Shows you how to add paths to your pattern
|
||||||
---
|
---
|
||||||
|
|
||||||
After using the [shorthand](/howtos/code/shorthand/) call,
|
After using the [shorthand](/howtos/code/shorthand/) call,
|
||||||
`Path` contains the path constructor, while `paths` is a reference to `part.paths`,
|
`Path` contains the path constructor, while `paths` is a reference to `part.paths`,
|
||||||
which is where you should store your paths.
|
which is where you should store your paths.
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@ for: developers
|
||||||
about: Shows you how to add points to your pattern
|
about: Shows you how to add points to your pattern
|
||||||
---
|
---
|
||||||
|
|
||||||
After using the [shorthand](/howtos/code/shorthand/) call,
|
After using the [shorthand](/howtos/code/shorthand/) call,
|
||||||
`Point` contains the point constructor, while `points` is a reference to `part.points`,
|
`Point` contains the point constructor, while `points` is a reference to `part.points`,
|
||||||
which is where you should store your points.
|
which is where you should store your points.
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@ for: developers
|
||||||
about: Shows you how to add snippets to your pattern
|
about: Shows you how to add snippets to your pattern
|
||||||
---
|
---
|
||||||
|
|
||||||
After using the [shorthand](/howtos/code/shorthand/) call,
|
After using the [shorthand](/howtos/code/shorthand/) call,
|
||||||
`Snippet` contains the path constructor, while `snippets` is a reference to `part.snippets`,
|
`Snippet` contains the path constructor, while `snippets` is a reference to `part.snippets`,
|
||||||
which is where you should store your paths.
|
which is where you should store your paths.
|
||||||
|
|
||||||
|
@ -16,8 +16,8 @@ snippets.logo = new Snippet('logo', points.logoAnchor);
|
||||||
|
|
||||||
You can scale and rotate a snippet by setting the `data-scale` and `data-rotate` attributes respectively.
|
You can scale and rotate a snippet by setting the `data-scale` and `data-rotate` attributes respectively.
|
||||||
|
|
||||||
- **data-scale** : Either a single scale factor, or a set of 2 scale factors for the X and Y axis respectively. See [the SVG scale transform](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform#Scale) for details.
|
- **data-scale** : Either a single scale factor, or a set of 2 scale factors for the X and Y axis respectively. See [the SVG scale transform](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform#Scale) for details.
|
||||||
- **data-rotate**: A rotation in degrees. The center of the rotation will be the snippet's anchor point
|
- **data-rotate**: A rotation in degrees. The center of the rotation will be the snippet's anchor point
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
|
@ -30,4 +30,3 @@ Below is an example of the available snippets, and the use of the `data-scale` a
|
||||||
<Example pattern="rendertest" options_only="snippets">
|
<Example pattern="rendertest" options_only="snippets">
|
||||||
Overview of available snippets
|
Overview of available snippets
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
|
|
|
@ -4,8 +4,8 @@ title: Adding text
|
||||||
|
|
||||||
SVG is pretty great, but its text handling leaves much to be desired.
|
SVG is pretty great, but its text handling leaves much to be desired.
|
||||||
|
|
||||||
To abstract away the intricacies of adding text to an SVG document,
|
To abstract away the intricacies of adding text to an SVG document,
|
||||||
FreeSewing lets you add text to patterns by adding it to the attributes
|
FreeSewing lets you add text to patterns by adding it to the attributes
|
||||||
of points and paths.
|
of points and paths.
|
||||||
|
|
||||||
All you have to do is set the `data-text` attribute to the text you want to add to the pattern:
|
All you have to do is set the `data-text` attribute to the text you want to add to the pattern:
|
||||||
|
@ -48,4 +48,3 @@ paths.example = new Path()
|
||||||
<Example part="path_attr">
|
<Example part="path_attr">
|
||||||
Text on a path
|
Text on a path
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
|
|
|
@ -14,7 +14,7 @@ paths.example.attributes.add('class', 'lining dashed');
|
||||||
```
|
```
|
||||||
|
|
||||||
Because it's so common to set attributes, Points, Paths and Snippets all have
|
Because it's so common to set attributes, Points, Paths and Snippets all have
|
||||||
the `attr()` helper method.
|
the `attr()` helper method.
|
||||||
|
|
||||||
Not only is less more, the method is also *chainable*, which allows you to do this:
|
Not only is less more, the method is also *chainable*, which allows you to do this:
|
||||||
|
|
||||||
|
@ -33,7 +33,7 @@ The [adding-text](/concepts/adding-text) documentation explains this in detail.
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
When rendering, FreeSewing will output all your attributes. This gives you the
|
When rendering, FreeSewing will output all your attributes. This gives you the
|
||||||
possiblity to use any valid attribute to control the appearance.
|
possiblity to use any valid attribute to control the appearance.
|
||||||
|
|
||||||
This is also why we use the *data-* prefix for those attributes that have
|
This is also why we use the *data-* prefix for those attributes that have
|
||||||
|
|
|
@ -5,7 +5,7 @@ about: Shows you how to create a new design
|
||||||
---
|
---
|
||||||
|
|
||||||
To create a new pattern, call `new freesewing.Design()`.
|
To create a new pattern, call `new freesewing.Design()`.
|
||||||
It takes your pattern configuration,
|
It takes your pattern configuration,
|
||||||
and any plugins you want to load as parameters.
|
and any plugins you want to load as parameters.
|
||||||
|
|
||||||
For example, if we were creating a new pattern called `Sorcha`:
|
For example, if we were creating a new pattern called `Sorcha`:
|
||||||
|
@ -19,7 +19,7 @@ import config from "../config"
|
||||||
const Sorcha = new freesewing.Design(config, plugins)
|
const Sorcha = new freesewing.Design(config, plugins)
|
||||||
```
|
```
|
||||||
|
|
||||||
This method does not return a `Design` object. Instead it returns
|
This method does not return a `Design` object. Instead it returns
|
||||||
a constructor method for your pattern.
|
a constructor method for your pattern.
|
||||||
|
|
||||||
When importing your pattern, it is itself a constructor:
|
When importing your pattern, it is itself a constructor:
|
||||||
|
@ -35,7 +35,7 @@ let pattern = new Sorcha()
|
||||||
|
|
||||||
##### Design() is a super-constructor
|
##### Design() is a super-constructor
|
||||||
|
|
||||||
Constructors are functions you can call with `new` to create an object.
|
Constructors are functions you can call with `new` to create an object.
|
||||||
As `freesewing.Design()` returns a constructor, you can think of it
|
As `freesewing.Design()` returns a constructor, you can think of it
|
||||||
as a super-constructor.
|
as a super-constructor.
|
||||||
|
|
||||||
|
|
|
@ -18,7 +18,7 @@ dependencies: {
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
This could be from a T-shirt pattern where the `front` and `back` patterns are very similar,
|
This could be from a T-shirt pattern where the `front` and `back` patterns are very similar,
|
||||||
so they both are inheriting a `base` part.
|
so they both are inheriting a `base` part.
|
||||||
In addition, the `sleeve` part needs to be drafted after the `front` and `back` part because
|
In addition, the `sleeve` part needs to be drafted after the `front` and `back` part because
|
||||||
in `front` and `back` we store the length of the armhole seam in the [store](/reference/api/store) and
|
in `front` and `back` we store the length of the armhole seam in the [store](/reference/api/store) and
|
||||||
|
@ -26,9 +26,9 @@ we need that info to fit the sleevecap to the armhole.
|
||||||
|
|
||||||
Now if a user requests to draft only the `sleeve` part, FreeSewing will still draft:
|
Now if a user requests to draft only the `sleeve` part, FreeSewing will still draft:
|
||||||
|
|
||||||
- First the `base` part
|
- First the `base` part
|
||||||
- Then the `front` and `back` parts
|
- Then the `front` and `back` parts
|
||||||
- Finally the `sleeve` part
|
- Finally the `sleeve` part
|
||||||
|
|
||||||
but it will only render the `sleeve` part, as that's the only thing the user requested.
|
but it will only render the `sleeve` part, as that's the only thing the user requested.
|
||||||
|
|
||||||
|
|
|
@ -4,10 +4,10 @@ for: developers
|
||||||
about: Shows how you can add circles to your pattern
|
about: Shows how you can add circles to your pattern
|
||||||
---
|
---
|
||||||
|
|
||||||
Real circles are rarely used in pattern design, and they are not part of the SVG path specification,
|
Real circles are rarely used in pattern design, and they are not part of the SVG path specification,
|
||||||
but rather a different SVG element.
|
but rather a different SVG element.
|
||||||
|
|
||||||
Still, if you want a circle, you can draw one by setting a Point's `data-circle` attribute
|
Still, if you want a circle, you can draw one by setting a Point's `data-circle` attribute
|
||||||
to the radius of the circle you want to draw.
|
to the radius of the circle you want to draw.
|
||||||
|
|
||||||
In addition, all attributes that have a `data-circle-` prefix will apply to the circle, rather than the point.
|
In addition, all attributes that have a `data-circle-` prefix will apply to the circle, rather than the point.
|
||||||
|
@ -15,4 +15,3 @@ In addition, all attributes that have a `data-circle-` prefix will apply to the
|
||||||
<Example pattern="rendertest" options_only="circles">
|
<Example pattern="rendertest" options_only="circles">
|
||||||
Circles
|
Circles
|
||||||
</Example>
|
</Example>
|
||||||
|
|
||||||
|
|
|
@ -8,49 +8,52 @@ about: Shows how to create a variation of a pre-existing design
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/aaron/config/index.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/config/index.js#L34)
|
- [packages/aaron/config/index.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/config/index.js#L34)
|
||||||
- [packages/aaron/src/index.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/src/index.js#L2)
|
- [packages/aaron/src/index.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/src/index.js#L2)
|
||||||
- [packages/carlita/src/index.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/carlita/src/index.js#L25)
|
- [packages/carlita/src/index.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/carlita/src/index.js#L25)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
## Setup
|
## Setup
|
||||||
|
|
||||||
To be able to extend existing patterns, you will have to access them on your local machine. There are two ways to do this:
|
To be able to extend existing patterns, you will have to access them on your local machine. There are two ways to do this:
|
||||||
- add needed dependencies when using `npx create-freesewing-pattern`
|
|
||||||
- create your new pattern in a clone of the [freesewing monorepo](https://github.com/freesewing/freesewing)
|
- add needed dependencies when using `npx create-freesewing-pattern`
|
||||||
|
- create your new pattern in a clone of the [freesewing monorepo](https://github.com/freesewing/freesewing)
|
||||||
|
|
||||||
### When using `npx create-freesewing-pattern`
|
### When using `npx create-freesewing-pattern`
|
||||||
|
|
||||||
If you want to use existing patterns when creating your new pattern with `npx create-freesewing-pattern`, you have to install the needed dependencies.
|
If you want to use existing patterns when creating your new pattern with `npx create-freesewing-pattern`, you have to install the needed dependencies.\
|
||||||
Let's say you want to extend Brian.
|
Let's say you want to extend Brian.\
|
||||||
In your freshly created pattern folder, you now have to run
|
In your freshly created pattern folder, you now have to run
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
npm install --save @freesewing/brian
|
npm install --save @freesewing/brian
|
||||||
```
|
```
|
||||||
This will install Brian as a dependency, which you can then access in your pattern (see [examples](/howtos/code/extend-pattern/#examples) below on how to do that).
|
|
||||||
|
This will install Brian as a dependency, which you can then access in your pattern (see [examples](/howtos/code/extend-pattern/#examples) below on how to do that).\
|
||||||
This has to be repeated for every new pattern you create.
|
This has to be repeated for every new pattern you create.
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
Some packages need more than one dependency. Carlton, for example, is based on Bent, which in turn is based on Brian. You will have to install all dependencies in the way shown above. If something is still missing, error messages will tell you what you still need to install.
|
Some packages need more than one dependency. Carlton, for example, is based on Bent, which in turn is based on Brian. You will have to install all dependencies in the way shown above. If something is still missing, error messages will tell you what you still need to install.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
### Using the freesewing monorepo
|
### Using the freesewing monorepo
|
||||||
|
|
||||||
You can use the power of robots to install the needed dependencies if you work in a clone of the [freesewing monorepo](https://github.com/freesewing/freesewing).
|
You can use the power of robots to install the needed dependencies if you work in a clone of the [freesewing monorepo](https://github.com/freesewing/freesewing).
|
||||||
- First, clone the monorepo (or your fork of it) to your local machine.
|
|
||||||
- Go to the root and run `yarn kickstart`. This will take a while, so grab a coffee and come back later.
|
- First, clone the monorepo (or your fork of it) to your local machine.
|
||||||
- Once that is done, edit the file `config/descriptions.yaml` to include the name and description of your new pattern (take care to start the description with `A FreeSewing pattern`).
|
- Go to the root and run `yarn kickstart`. This will take a while, so grab a coffee and come back later.
|
||||||
- Create a folder for your new pattern in `packages`.
|
- Once that is done, edit the file `config/descriptions.yaml` to include the name and description of your new pattern (take care to start the description with `A FreeSewing pattern`).
|
||||||
- Run `yarn reconfigure`. This will read the changes in `config/descriptions.yaml` and create the needed files in your new folder.
|
- Create a folder for your new pattern in `packages`.
|
||||||
- If you haven't already, now is also a good time to create a feature branch so that you don't work directly in the `develop`-branch of the git-repository: `git checkout -b mycoolnewpattern` (adjust name accordingly).
|
- Run `yarn reconfigure`. This will read the changes in `config/descriptions.yaml` and create the needed files in your new folder.
|
||||||
- You can now start the actual pattern design work (i.e. editing and adding `src` and `config` files for your pattern.
|
- If you haven't already, now is also a good time to create a feature branch so that you don't work directly in the `develop`-branch of the git-repository: `git checkout -b mycoolnewpattern` (adjust name accordingly).
|
||||||
- For dependencies, configure them in `config/dependencies.yaml`.
|
- You can now start the actual pattern design work (i.e. editing and adding `src` and `config` files for your pattern.
|
||||||
- Run `yarn reconfigure` again, and the magic will make sure that your `package.json` is updated accordingly.
|
- For dependencies, configure them in `config/dependencies.yaml`.
|
||||||
- You can set yourself as an author in `config/exceptions.yaml`, and - you guessed it - run `yarn reconfigure` again.
|
- Run `yarn reconfigure` again, and the magic will make sure that your `package.json` is updated accordingly.
|
||||||
|
- You can set yourself as an author in `config/exceptions.yaml`, and - you guessed it - run `yarn reconfigure` again.
|
||||||
|
|
||||||
Now you can work on extending existing patterns into something new and exciting. And the best part about using this method is that making a pull request will be much easier once you're done developing your new pattern.
|
Now you can work on extending existing patterns into something new and exciting. And the best part about using this method is that making a pull request will be much easier once you're done developing your new pattern.
|
||||||
|
|
||||||
|
|
|
@ -8,7 +8,7 @@ about: When you inherit a part, it comes with a bunch of paths. Here'show to hid
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/front.js#L22)
|
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/front.js#L22)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -7,7 +7,7 @@ about: Shows how you can use one design as the basis for another
|
||||||
If your pattern is based on, or extending, another pattern (some of) your
|
If your pattern is based on, or extending, another pattern (some of) your
|
||||||
pattern parts will need to be drafted by the parent pattern.
|
pattern parts will need to be drafted by the parent pattern.
|
||||||
|
|
||||||
In such a case, rather than return our own draft method for the part, you
|
In such a case, rather than return our own draft method for the part, you
|
||||||
should instantiate the parent pattern, and return its part draft method:
|
should instantiate the parent pattern, and return its part draft method:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
|
|
@ -15,16 +15,16 @@ inject: {
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
The `front` and `back` parts will be *injected* with the `base` part. As a result, both
|
The `front` and `back` parts will be *injected* with the `base` part. As a result, both
|
||||||
the `front` and `back` parts will be instantiated with a cloned copy of all the points, paths,
|
the `front` and `back` parts will be instantiated with a cloned copy of all the points, paths,
|
||||||
and snippets of the `base` part.
|
and snippets of the `base` part.
|
||||||
|
|
||||||
This is a common design pattern where one part builds on another. In our example, we can imagine
|
This is a common design pattern where one part builds on another. In our example, we can imagine
|
||||||
a T-shirt pattern where the front and back are rather similar, apart from the neckline.
|
a T-shirt pattern where the front and back are rather similar, apart from the neckline.
|
||||||
So rather than repeating ourselves, we draft a `base` part and inject that in the `front` and
|
So rather than repeating ourselves, we draft a `base` part and inject that in the `front` and
|
||||||
`back` parts.
|
`back` parts.
|
||||||
|
|
||||||
Using `inject` will cause FreeSewing to always draft the injected part prior to
|
Using `inject` will cause FreeSewing to always draft the injected part prior to
|
||||||
drafting the part it gets injected to. It will, in other words, influece the draft order.
|
drafting the part it gets injected to. It will, in other words, influece the draft order.
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
|
@ -8,11 +8,10 @@ about: When you inherit a part, it comes with a bunch of paths. Here'show to rem
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/carlton/src/back.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/carlton/src/back.js#L62)
|
- [packages/carlton/src/back.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/carlton/src/back.js#L62)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
||||||
```js
|
```js
|
||||||
for (let i in paths) delete paths[i]
|
for (let i in paths) delete paths[i]
|
||||||
```
|
```
|
||||||
|
|
|
@ -8,17 +8,16 @@ about: Shows how to share dimensions between similar pattern parts
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/aaron/src/shared.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/shared.js)
|
- [packages/aaron/src/shared.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/shared.js)
|
||||||
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/src/front.js#L160)
|
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/72f34101792bda4d8e553c3479daa63cb461f3c5/packages/aaron/src/front.js#L160)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
||||||
When you have different pattern parts that look similar -- like the front
|
When you have different pattern parts that look similar -- like the front
|
||||||
and back of a garment -- you may find that there's a lot of dimensions
|
and back of a garment -- you may find that there's a lot of dimensions
|
||||||
shared between them.
|
shared between them.
|
||||||
|
|
||||||
The example below is from Aaron where dimensions are shared between
|
The example below is from Aaron where dimensions are shared between
|
||||||
the back and front part.
|
the back and front part.
|
||||||
|
|
||||||
Aaron has a file called `shared.js` that looks like this:
|
Aaron has a file called `shared.js` that looks like this:
|
||||||
|
@ -49,8 +48,7 @@ import { dimensions } from './shared'
|
||||||
|
|
||||||
<Note>
|
<Note>
|
||||||
|
|
||||||
Since our shared dimension method is a so-called _named export_ we need to
|
Since our shared dimension method is a so-called *named export* we need to
|
||||||
import it with the syntax you see above.
|
import it with the syntax you see above.
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ The [Part.shorthand()](/reference/api/part/#shorthand) method will become your b
|
||||||
By using [object destructuring](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring) you'll get access to a bunch
|
By using [object destructuring](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring) you'll get access to a bunch
|
||||||
of handy variables to make your code more concise and readable.
|
of handy variables to make your code more concise and readable.
|
||||||
|
|
||||||
[Part.shorthand()](/reference/api/part/#shorthand) provides a lot of things, and you typically
|
[Part.shorthand()](/reference/api/part/#shorthand) provides a lot of things, and you typically
|
||||||
don't need all of them, but here's everything it has to offer:
|
don't need all of them, but here's everything it has to offer:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
|
|
@ -8,7 +8,7 @@ Sometimes, you'll want to access data from one part into another part.
|
||||||
For example, you may store the length of the armhole in your front and back parts,
|
For example, you may store the length of the armhole in your front and back parts,
|
||||||
and then read that value when drafting the sleeve so you can verify the sleeve fits the armhole.
|
and then read that value when drafting the sleeve so you can verify the sleeve fits the armhole.
|
||||||
|
|
||||||
For this, you should use the [Store](/reference/api/store/), which is available via
|
For this, you should use the [Store](/reference/api/store/), which is available via
|
||||||
the [shorthand](/howtos/code/shorthand/) call:
|
the [shorthand](/howtos/code/shorthand/) call:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
|
|
@ -8,11 +8,11 @@ about: Shows how to store a seam length so you can true the seam of another part
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/front.js#L103)
|
- [packages/aaron/src/front.js](https://github.com/freesewing/freesewing/blob/develop/packages/aaron/src/front.js#L103)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
Often when designing patterns, we need to _true a seam_ which means to make sure
|
Often when designing patterns, we need to *true a seam* which means to make sure
|
||||||
that two parts that need to be joined together are the same distance.
|
that two parts that need to be joined together are the same distance.
|
||||||
|
|
||||||
The example below is from Aaron and stores the length of the armhole seam:
|
The example below is from Aaron and stores the length of the armhole seam:
|
||||||
|
@ -27,4 +27,3 @@ The example below is from Aaron and stores the length of the armhole seam:
|
||||||
.length()
|
.length()
|
||||||
)
|
)
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -52,5 +52,3 @@ points.example.attr(
|
||||||
|
|
||||||
Whether you're rendering to SVG or React, by using ` ` your spaces
|
Whether you're rendering to SVG or React, by using ` ` your spaces
|
||||||
will be properly rendered in both environments.
|
will be properly rendered in both environments.
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -8,12 +8,12 @@ about: Shows how to adapt the length of the sleevecap to fit your armhole
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/bent/src/sleeve.js](https://github.com/freesewing/freesewing/blob/develop/packages/bent/src/sleeve.js)
|
- [packages/bent/src/sleeve.js](https://github.com/freesewing/freesewing/blob/develop/packages/bent/src/sleeve.js)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
Fitting the sleevecap to the armhole means that we need to make sure the length
|
Fitting the sleevecap to the armhole means that we need to make sure the length
|
||||||
of the seams match.
|
of the seams match.\
|
||||||
A similar challenge is to fit the collar to the neck opening and so on.
|
A similar challenge is to fit the collar to the neck opening and so on.
|
||||||
|
|
||||||
For all of these situations where you have to create curved seams with matching
|
For all of these situations where you have to create curved seams with matching
|
||||||
|
@ -25,15 +25,15 @@ This pattern is rather common, and we will unpack an example from Bent below.
|
||||||
|
|
||||||
Before we dive in, here's a few things to keep in mind:
|
Before we dive in, here's a few things to keep in mind:
|
||||||
|
|
||||||
- In Javascript, you can create a function within your function and call it
|
- In Javascript, you can create a function within your function and call it
|
||||||
- Bent extends Brian which sets both the `frontArmholeLength` and `backArmholeLength` values in the store with the length of those seams
|
- Bent extends Brian which sets both the `frontArmholeLength` and `backArmholeLength` values in the store with the length of those seams
|
||||||
- We need to match the length of the sleevecap + sleeve cap ease to the length of the front and back armhole
|
- We need to match the length of the sleevecap + sleeve cap ease to the length of the front and back armhole
|
||||||
|
|
||||||
Here's how you can handle this in code:
|
Here's how you can handle this in code:
|
||||||
|
|
||||||
- We create a method that does teh actual drafting of our sleevecap
|
- We create a method that does teh actual drafting of our sleevecap
|
||||||
- We use a `tweak` value to influence the process, we start with a value of `1`
|
- We use a `tweak` value to influence the process, we start with a value of `1`
|
||||||
- We check the length after every attempt, and adjust the `tweak` value
|
- We check the length after every attempt, and adjust the `tweak` value
|
||||||
|
|
||||||
```js
|
```js
|
||||||
export default function (part) {
|
export default function (part) {
|
||||||
|
@ -81,7 +81,7 @@ export default function (part) {
|
||||||
|
|
||||||
A few things that are important:
|
A few things that are important:
|
||||||
|
|
||||||
- We check to see how close we are by using `Math.abs(delta)` which gives us the absolute value of our delta
|
- We check to see how close we are by using `Math.abs(delta)` which gives us the absolute value of our delta
|
||||||
- We guard against an endless loop by keeping track of the runs and giving up after 25
|
- We guard against an endless loop by keeping track of the runs and giving up after 25
|
||||||
- We multiply by `0.99` and `1.02` to respectively decrease and increase our `tweak` factor.
|
- We multiply by `0.99` and `1.02` to respectively decrease and increase our `tweak` factor.
|
||||||
This assymetric approach avoids that we end up ping-ponging around our target value and never land somewhere in the middle
|
This assymetric approach avoids that we end up ping-ponging around our target value and never land somewhere in the middle
|
||||||
|
|
|
@ -8,7 +8,7 @@ about: Adding seam allowance or hem allowance is easy to do
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/bruce/src/inset.js](https://github.com/freesewing/freesewing/blob/develop/packages/bruce/src/inset.js#L34)
|
- [packages/bruce/src/inset.js](https://github.com/freesewing/freesewing/blob/develop/packages/bruce/src/inset.js#L34)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
@ -20,8 +20,8 @@ seam allowance.
|
||||||
|
|
||||||
In the example below we have two such paths:
|
In the example below we have two such paths:
|
||||||
|
|
||||||
- `paths.saBase` is the path that will require regular seam allowance
|
- `paths.saBase` is the path that will require regular seam allowance
|
||||||
- `paths.hemBase` is the path that will require more seam allowance, or hem allowance
|
- `paths.hemBase` is the path that will require more seam allowance, or hem allowance
|
||||||
|
|
||||||
When creating them, we disable rendering, effectively hiding them.
|
When creating them, we disable rendering, effectively hiding them.
|
||||||
Then we string together our real path and our seam allowance based on them:
|
Then we string together our real path and our seam allowance based on them:
|
||||||
|
|
|
@ -8,18 +8,18 @@ about: Slash and spread is easy enough on paper, here's how to do it in code
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/jaeger/src/front.js#L64)
|
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/jaeger/src/front.js#L64)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
When we _slash and spread_ a pattern, we cut out a triangle, and then rotate it
|
When we *slash and spread* a pattern, we cut out a triangle, and then rotate it
|
||||||
around the tip of the triangle.
|
around the tip of the triangle.
|
||||||
|
|
||||||
And that's exactly what we do in code. We just need to know:
|
And that's exactly what we do in code. We just need to know:
|
||||||
|
|
||||||
- What point we want to rotate around
|
- What point we want to rotate around
|
||||||
- Which points we want to rotate
|
- Which points we want to rotate
|
||||||
- By how much we want to rotate
|
- By how much we want to rotate
|
||||||
|
|
||||||
```js
|
```js
|
||||||
let rotate = [
|
let rotate = [
|
||||||
|
|
|
@ -8,7 +8,7 @@ about: Adding multiple snippets doesn't need to be a chore with this handy macro
|
||||||
|
|
||||||
##### See this example in our source code
|
##### See this example in our source code
|
||||||
|
|
||||||
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/jaeger/src/front.js#L381)
|
- [packages/jaeger/src/front.js](https://github.com/freesewing/freesewing/blob/8474477911daed3c383700ab29c9565883f16d66/packages/jaeger/src/front.js#L381)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
|
|
@ -7,4 +7,3 @@ the hardest part. These guides will walk you through setting up your
|
||||||
development environment on your operating system of choice.
|
development environment on your operating system of choice.
|
||||||
|
|
||||||
<ReadMore />
|
<ReadMore />
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@ for: developers
|
||||||
about: Shows you how to setup your development environment to work on freesewing.dev, our website for developers
|
about: Shows you how to setup your development environment to work on freesewing.dev, our website for developers
|
||||||
---
|
---
|
||||||
|
|
||||||
freesewing.dev is built from a package in our monorepo. You will need the following setup and installed before you begin: Node, [lerna](https://lerna.js.org/) and [yarn](https://yarnpkg.com/).
|
freesewing.dev is built from a package in our monorepo. You will need the following setup and installed before you begin: Node, [lerna](https://lerna.js.org/) and [yarn](https://yarnpkg.com/).
|
||||||
|
|
||||||
To get started, checkout the repository:
|
To get started, checkout the repository:
|
||||||
|
|
||||||
|
|
|
@ -21,20 +21,20 @@ Enter the newly installed repository:
|
||||||
cd freesewing.org
|
cd freesewing.org
|
||||||
```
|
```
|
||||||
|
|
||||||
Copy the `.env.example` file to `.env`. If you just want to get the site running you don't need to edit the values inside the `.env` file. But if you want to use any of the integrations (e.g. Google Authentication, Algolia search) you will need to enter your own values to this file.
|
Copy the `.env.example` file to `.env`. If you just want to get the site running you don't need to edit the values inside the `.env` file. But if you want to use any of the integrations (e.g. Google Authentication, Algolia search) you will need to enter your own values to this file.
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
cp .env.example .env
|
cp .env.example .env
|
||||||
```
|
```
|
||||||
|
|
||||||
Because freesewing.org is in the process of moving to the monorepo, it's using shared components from the monorepo as a submodule. You will need to initialize the monorepo submodule. Do so with the following git commands:
|
Because freesewing.org is in the process of moving to the monorepo, it's using shared components from the monorepo as a submodule. You will need to initialize the monorepo submodule. Do so with the following git commands:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
git submodule init
|
git submodule init
|
||||||
git submodule update
|
git submodule update
|
||||||
```
|
```
|
||||||
|
|
||||||
Before running the above command the `monorepo` folder will be empty. After running the above commands you should see files in the `monorepo` folder.
|
Before running the above command the `monorepo` folder will be empty. After running the above commands you should see files in the `monorepo` folder.
|
||||||
|
|
||||||
Now install the dependencies:
|
Now install the dependencies:
|
||||||
|
|
||||||
|
|
|
@ -8,4 +8,3 @@ Blog posts have been migrated to [Strapi](https://strapi.io/), a headless CMS sy
|
||||||
Our strapi instance can be accessed at [posts.freesewing.org](https://posts.freesewing.org/).
|
Our strapi instance can be accessed at [posts.freesewing.org](https://posts.freesewing.org/).
|
||||||
|
|
||||||
If you don't have a Strapi account (yet), [reach out to us on Discord](https://discord.freesewing.org).
|
If you don't have a Strapi account (yet), [reach out to us on Discord](https://discord.freesewing.org).
|
||||||
|
|
||||||
|
|
|
@ -13,4 +13,3 @@ categories:
|
||||||
- anothercat
|
- anothercat
|
||||||
- somethingelse
|
- somethingelse
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@ title: Mult-line text
|
||||||
order: 40
|
order: 40
|
||||||
---
|
---
|
||||||
|
|
||||||
To add multi-line text in frontmatter, use a `|` character,
|
To add multi-line text in frontmatter, use a `|` character,
|
||||||
and prefix the lines by spaces:
|
and prefix the lines by spaces:
|
||||||
|
|
||||||
```md
|
```md
|
||||||
|
@ -11,6 +11,3 @@ about: |
|
||||||
This is a multi-line text
|
This is a multi-line text
|
||||||
that will be assigned to the about key
|
that will be assigned to the about key
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -3,8 +3,7 @@ title: Howtos
|
||||||
order: zcc
|
order: zcc
|
||||||
---
|
---
|
||||||
|
|
||||||
You can find a list of all FreeSewing hotwtos below:
|
You can find a list of all FreeSewing hotwtos below:
|
||||||
|
|
||||||
|
|
||||||
<ReadMore recurse />
|
<ReadMore recurse />
|
||||||
|
|
||||||
|
@ -20,4 +19,3 @@ guides take more time to explain in-depth what is being done and why.
|
||||||
For more details, refer to [How we structure our documentation](/guides/docs).
|
For more details, refer to [How we structure our documentation](/guides/docs).
|
||||||
|
|
||||||
</Related>
|
</Related>
|
||||||
|
|
||||||
|
|
|
@ -2,8 +2,8 @@
|
||||||
title: FreeSewing in the browser
|
title: FreeSewing in the browser
|
||||||
---
|
---
|
||||||
|
|
||||||
Thanks to the advances in browser standardisation around Javascrip
|
Thanks to the advances in browser standardisation around Javascrip
|
||||||
ESM modules, not to mention [the new Skypack CDN](https://www.skypack.dev/),
|
ESM modules, not to mention [the new Skypack CDN](https://www.skypack.dev/),
|
||||||
you can generate patterns in the browser with a few lines of Javascript.
|
you can generate patterns in the browser with a few lines of Javascript.
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
@ -21,19 +21,18 @@ our website for makers.
|
||||||
|
|
||||||
To generate a pattern, you will need to:
|
To generate a pattern, you will need to:
|
||||||
|
|
||||||
- Instantiate the pattern (`new ...`)
|
- Instantiate the pattern (`new ...`)
|
||||||
- Pass it the settings and measurements you want to use (`{ ... }`)
|
- Pass it the settings and measurements you want to use (`{ ... }`)
|
||||||
- Load the theme plugin (using `use()`)
|
- Load the theme plugin (using `use()`)
|
||||||
- Draft the pattern (using `draft()`)
|
- Draft the pattern (using `draft()`)
|
||||||
- Render it to SVG (using `render()`)
|
- Render it to SVG (using `render()`)
|
||||||
|
|
||||||
Which can be done as a one-liner since `use()`, `draft()` and
|
Which can be done as a one-liner since `use()`, `draft()` and
|
||||||
`render()` are all chainable, as shown below.
|
`render()` are all chainable, as shown below.
|
||||||
|
|
||||||
## Code example
|
## Code example
|
||||||
|
|
||||||
Below is a complete example.
|
Below is a complete example.
|
||||||
|
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<html>
|
<html>
|
||||||
|
@ -87,9 +86,7 @@ Below is a complete example.
|
||||||
|
|
||||||
## Dependencies
|
## Dependencies
|
||||||
|
|
||||||
If you compare this example with [our NodeJS
|
If you compare this example with [our NodeJS
|
||||||
example](/reference/howtos/nodejs) you'll notice that you do not
|
example](/reference/howtos/nodejs) you'll notice that you do not
|
||||||
need to worry about loading any dependencies. Not even `@freesewing/core`
|
need to worry about loading any dependencies. Not even `@freesewing/core`
|
||||||
is loaded, because Skypack will pull in all dependencies for you.
|
is loaded, because Skypack will pull in all dependencies for you.
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -3,4 +3,3 @@ title: FreeSewing in different environments
|
||||||
---
|
---
|
||||||
|
|
||||||
You can use FreeSewing a different environments:
|
You can use FreeSewing a different environments:
|
||||||
|
|
||||||
|
|
|
@ -22,11 +22,11 @@ our website for makers.
|
||||||
|
|
||||||
To generate a pattern, you will need to:
|
To generate a pattern, you will need to:
|
||||||
|
|
||||||
- Instantiate the pattern (`new ...`)
|
- Instantiate the pattern (`new ...`)
|
||||||
- Pass it the settings and measurements you want to use (`{ ... }`)
|
- Pass it the settings and measurements you want to use (`{ ... }`)
|
||||||
- Load the theme plugin (using `use()`)
|
- Load the theme plugin (using `use()`)
|
||||||
- Draft the pattern (using `draft()`)
|
- Draft the pattern (using `draft()`)
|
||||||
- Render it to SVG (using `render()`)
|
- Render it to SVG (using `render()`)
|
||||||
|
|
||||||
Which can be done as a one-liner since `use()`, `draft()` and
|
Which can be done as a one-liner since `use()`, `draft()` and
|
||||||
`render()` are all chainable, as shown below.
|
`render()` are all chainable, as shown below.
|
||||||
|
@ -64,11 +64,11 @@ console.log(svg)
|
||||||
|
|
||||||
##### Remarks on the example code
|
##### Remarks on the example code
|
||||||
|
|
||||||
- We are using `@freesewing/aaron` as the design, but you could use any design
|
- We are using `@freesewing/aaron` as the design, but you could use any design
|
||||||
- You probably want to [use your own measurements](/reference/api/settings/measurements)
|
- You probably want to [use your own measurements](/reference/api/settings/measurements)
|
||||||
or you could use `@freesewing/models` to load measurements from [our sizing grid](https://freesewing.org/sizes/)
|
or you could use `@freesewing/models` to load measurements from [our sizing grid](https://freesewing.org/sizes/)
|
||||||
- We are using `@freesewing/plugin-theme` to theme our SVG, but you
|
- We are using `@freesewing/plugin-theme` to theme our SVG, but you
|
||||||
could [pass in your own CSS](/guides/plugins/using-hooks-without-plugin)
|
could [pass in your own CSS](/guides/plugins/using-hooks-without-plugin)
|
||||||
|
|
||||||
</Note>
|
</Note>
|
||||||
|
|
||||||
|
@ -77,11 +77,11 @@ could [pass in your own CSS](/guides/plugins/using-hooks-without-plugin)
|
||||||
The code above will only work if you've got the required dependencies installed on your system.
|
The code above will only work if you've got the required dependencies installed on your system.
|
||||||
Obviously you need NodeJS, but you will also need the following packages:
|
Obviously you need NodeJS, but you will also need the following packages:
|
||||||
|
|
||||||
- `@freesewing/core`: Our core library
|
- `@freesewing/core`: Our core library
|
||||||
- `@freesewing/plugin-bundle`: Set of common plugins
|
- `@freesewing/plugin-bundle`: Set of common plugins
|
||||||
- `@freesewing/aaron` or any design you want to use
|
- `@freesewing/aaron` or any design you want to use
|
||||||
- Any design on which the design you choose is built. In this case, Aaron depends on `@freesewing/brian`
|
- Any design on which the design you choose is built. In this case, Aaron depends on `@freesewing/brian`
|
||||||
- `@freesewing/utils`
|
- `@freesewing/utils`
|
||||||
|
|
||||||
For the example above, your `package.json` **dependencies** section will look like this:
|
For the example above, your `package.json` **dependencies** section will look like this:
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
title: Common git challenges
|
title: Common git challenges
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
Git is a distributed version control system originally created by
|
Git is a distributed version control system originally created by
|
||||||
Linus Torvalds (of linux fame).
|
Linus Torvalds (of linux fame).
|
||||||
Much like Linux itself, git is immensly powerful yet can be intimidating
|
Much like Linux itself, git is immensly powerful yet can be intimidating
|
||||||
|
@ -17,7 +16,7 @@ Below are some common challenges when working with FreeSewing code in git:
|
||||||
##### Git what now?
|
##### Git what now?
|
||||||
|
|
||||||
If you've never heard of git, if you're not even sure what a version
|
If you've never heard of git, if you're not even sure what a version
|
||||||
control system is, I recommend
|
control system is, I recommend
|
||||||
this [Learn Git in 15 Minutes](https://www.youtube.com/watch?v=USjZcfj8yxE&) introduction video.
|
this [Learn Git in 15 Minutes](https://www.youtube.com/watch?v=USjZcfj8yxE&) introduction video.
|
||||||
|
|
||||||
If you've used git before, but always felt confused about how it works,
|
If you've used git before, but always felt confused about how it works,
|
||||||
|
@ -25,4 +24,3 @@ check out this [Git For Ages 4 And Up](https://youtu.be/1ffBJ4sVUb4?t=121) video
|
||||||
A bit longer, but it well worth a watch.
|
A bit longer, but it well worth a watch.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
|
@ -94,11 +94,10 @@ Date: Sun Jan 16 13:48:15 2022 +0100
|
||||||
```
|
```
|
||||||
|
|
||||||
Instead, all the previous changes are now staged, and we can do a new commit,
|
Instead, all the previous changes are now staged, and we can do a new commit,
|
||||||
and rewrite our for quick-save commits into one commit that only commits the
|
and rewrite our for quick-save commits into one commit that only commits the
|
||||||
end result of our repeated attempts.
|
end result of our repeated attempts.
|
||||||
|
|
||||||
This approach keeps the commit history clean, not to mention that it makes
|
This approach keeps the commit history clean, not to mention that it makes
|
||||||
you look like a total boss who gets everything right at the first attempt.
|
you look like a total boss who gets everything right at the first attempt.
|
||||||
|
|
||||||
|
|
||||||
[1]: https://github.com/freesewing/freesewing/commit/5204ff5c16327962108e1629716e045275d3bf84
|
[1]: https://github.com/freesewing/freesewing/commit/5204ff5c16327962108e1629716e045275d3bf84
|
||||||
|
|
|
@ -9,18 +9,15 @@ about: |
|
||||||
ask questions or share your feedback
|
ask questions or share your feedback
|
||||||
---
|
---
|
||||||
|
|
||||||
Our [chatrooms on Discord](https://discord.freesewing.org/) are the best place to
|
Our [chatrooms on Discord](https://discord.freesewing.org/) are the best place to
|
||||||
ask questions or share your feedback.
|
ask questions or share your feedback.
|
||||||
|
|
||||||
Many of the FreeSewing contributors hang out there, and since we're spread over
|
Many of the FreeSewing contributors hang out there, and since we're spread over
|
||||||
different parts of the world, you're likely to find somebody there who can answer
|
different parts of the world, you're likely to find somebody there who can answer
|
||||||
your question(s) at any given moment.
|
your question(s) at any given moment.
|
||||||
|
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
If you want to report a problem, please [create an issue](https://github.com/freesewing/freesewing/issues/new).
|
If you want to report a problem, please [create an issue](https://github.com/freesewing/freesewing/issues/new).
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -2,15 +2,15 @@
|
||||||
title: Body ambassador
|
title: Body ambassador
|
||||||
---
|
---
|
||||||
|
|
||||||
Maybe you’re unusually short or tall.
|
Maybe you’re unusually short or tall.
|
||||||
Maybe you have a bit of a pot belly or very large breasts.
|
Maybe you have a bit of a pot belly or very large breasts.
|
||||||
Maybe you have a disability that requires fit adjustments.
|
Maybe you have a disability that requires fit adjustments.
|
||||||
|
|
||||||
Whatever it is, if you represent a minority fitting issue you could
|
Whatever it is, if you represent a minority fitting issue you could
|
||||||
represent this minority to make sure their needs are heard and understood.
|
represent this minority to make sure their needs are heard and understood.
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
Join the `#pattern-design` channel on the Discord server and help us understand how we can design patterns that fit people with your body type.
|
Join the `#pattern-design` channel on the Discord server and help us understand how we can design patterns that fit people with your body type.
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
|
@ -2,10 +2,9 @@
|
||||||
title: Community building
|
title: Community building
|
||||||
---
|
---
|
||||||
|
|
||||||
The FreeSewing community resides [on Discord](https://discord.freesewing.org/).
|
The FreeSewing community resides [on Discord](https://discord.freesewing.org/).
|
||||||
Just being there to answer questions and chat with other people is a valuable part of community building.
|
Just being there to answer questions and chat with other people is a valuable part of community building.
|
||||||
|
|
||||||
We also can be found [in plenty of other places](https://freesewing.org/community/where/) where we'd love to have you join us.
|
We also can be found [in plenty of other places](https://freesewing.org/community/where/) where we'd love to have you join us.
|
||||||
|
|
||||||
Apart from being present in chat rooms and social media, you could also take on some responsibility on one or more platforms.
|
Apart from being present in chat rooms and social media, you could also take on some responsibility on one or more platforms.
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
title: Develop sewing patterns
|
title: Develop sewing patterns
|
||||||
---
|
---
|
||||||
|
|
||||||
You could program new designs for FreeSewing.
|
You could program new designs for FreeSewing.
|
||||||
If you're not afraid of Javascript and are happy to team up with a designer,
|
If you're not afraid of Javascript and are happy to team up with a designer,
|
||||||
you could work on a new pattern together.
|
you could work on a new pattern together.
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
title: Ways to contribute
|
title: Ways to contribute
|
||||||
---
|
---
|
||||||
|
|
||||||
Thank you for being part of our community, and for wanting to contribute! ❤️
|
Thank you for being part of our community, and for wanting to contribute! ❤️\
|
||||||
FreeSewing is an open source project ran by volunteers from different corners of the world.
|
FreeSewing is an open source project ran by volunteers from different corners of the world.
|
||||||
We would love to have you on board, and this page lists everything you need to know to get started.
|
We would love to have you on board, and this page lists everything you need to know to get started.
|
||||||
|
|
||||||
|
@ -13,8 +13,8 @@ value a safe and welcoming environment for all members of the FreeSewing communi
|
||||||
|
|
||||||
To that extend, we impose the following requirements to ensure everyone feels safe and welcome:
|
To that extend, we impose the following requirements to ensure everyone feels safe and welcome:
|
||||||
|
|
||||||
- Any member of our community must respect [our community standards](https://freesewing.org/docs/various/community-standards/)
|
- Any member of our community must respect [our community standards](https://freesewing.org/docs/various/community-standards/)
|
||||||
- As a contributor, you must uphold [our Code of Conduct](/guides/code-of-conduct/)
|
- As a contributor, you must uphold [our Code of Conduct](/guides/code-of-conduct/)
|
||||||
|
|
||||||
Go ahead and read those, we'll wait.
|
Go ahead and read those, we'll wait.
|
||||||
|
|
||||||
|
@ -22,16 +22,16 @@ Go ahead and read those, we'll wait.
|
||||||
|
|
||||||
With that out of the way, here's a few more things that are *good to know*:
|
With that out of the way, here's a few more things that are *good to know*:
|
||||||
|
|
||||||
- Nobody gets paid to work on/for FreeSewing. We are a 100% volunteer organisation.
|
- Nobody gets paid to work on/for FreeSewing. We are a 100% volunteer organisation.
|
||||||
- We have patrons who support us financially, but all the money that comes in goes to charity —
|
- We have patrons who support us financially, but all the money that comes in goes to charity —
|
||||||
See our [revenue pledge](https://freesewing.org/docs/various/pledge/) for details
|
See our [revenue pledge](https://freesewing.org/docs/various/pledge/) for details
|
||||||
- FreeSewing follows the [all-contributors](https://allcontributors.org/) specification.
|
- FreeSewing follows the [all-contributors](https://allcontributors.org/) specification.
|
||||||
Contributions of any kind are welcome.
|
Contributions of any kind are welcome.
|
||||||
|
|
||||||
## Where to begin
|
## Where to begin
|
||||||
|
|
||||||
Below is a list of ideas or roles you could take up.
|
Below is a list of ideas or roles you could take up.
|
||||||
If you're not sure what to do, or if you have questions, [please reach out to
|
If you're not sure what to do, or if you have questions, [please reach out to
|
||||||
us](https://discord.freesewing.org/).
|
us](https://discord.freesewing.org/).
|
||||||
|
|
||||||
<ReadMore />
|
<ReadMore />
|
||||||
|
@ -43,12 +43,9 @@ us](https://discord.freesewing.org/).
|
||||||
For many in our community, contributring to FreeSewing marked their
|
For many in our community, contributring to FreeSewing marked their
|
||||||
first steps into the world of open source software development.
|
first steps into the world of open source software development.
|
||||||
|
|
||||||
I (joost) am happy to provide guidance or mentorship to anyone who
|
I (joost) am happy to provide guidance or mentorship to anyone who
|
||||||
wants to learn, especially when doing so enables upwards social mobility.
|
wants to learn, especially when doing so enables upwards social mobility.
|
||||||
|
|
||||||
[Reach out](https://discord.freesewing.org/) and we let's do this.
|
[Reach out](https://discord.freesewing.org/) and we let's do this.
|
||||||
|
|
||||||
</Comment>
|
</Comment>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -4,4 +4,3 @@ title: Make illustrations
|
||||||
|
|
||||||
Our documentation can always use some more/better illustrations to help people figure out how
|
Our documentation can always use some more/better illustrations to help people figure out how
|
||||||
to make our patterns into garments.
|
to make our patterns into garments.
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
title: Language ambassador
|
title: Language ambassador
|
||||||
---
|
---
|
||||||
|
|
||||||
You could represent FreeSewing in a non-English community.
|
You could represent FreeSewing in a non-English community.
|
||||||
There, you can help answer questions or triage problem reports.
|
There, you can help answer questions or triage problem reports.
|
||||||
Or you can point out where translations are missing.
|
Or you can point out where translations are missing.
|
||||||
|
|
||||||
|
|
|
@ -2,8 +2,8 @@
|
||||||
title: Pattern ambassador
|
title: Pattern ambassador
|
||||||
---
|
---
|
||||||
|
|
||||||
You could take charge of a specific FreeSewing design/pattern.
|
You could take charge of a specific FreeSewing design/pattern.
|
||||||
|
|
||||||
You’ll be the person to ask questions about how to make that pattern.
|
You’ll be the person to ask questions about how to make that pattern.
|
||||||
You’ll make sure the documentation is not forgotten.
|
You’ll make sure the documentation is not forgotten.
|
||||||
And you can help with questions or triage problem reports to developers or designers.
|
And you can help with questions or triage problem reports to developers or designers.
|
||||||
|
|
|
@ -5,7 +5,7 @@ title: Pattern testing
|
||||||
You could make (a muslin for) our patterns prior to release to make sure everything is ok.
|
You could make (a muslin for) our patterns prior to release to make sure everything is ok.
|
||||||
|
|
||||||
<Tip>
|
<Tip>
|
||||||
|
|
||||||
Join the `#pattern-design` channel on the Discord server and let us know you would like to help. Here you will find people designing new patterns and reviewing existing patterns. Feedback is very welcome!
|
Join the `#pattern-design` channel on the Discord server and let us know you would like to help. Here you will find people designing new patterns and reviewing existing patterns. Feedback is very welcome!
|
||||||
|
|
||||||
</Tip>
|
</Tip>
|
||||||
|
|
|
@ -9,7 +9,6 @@ organize milestones, and so on.
|
||||||
|
|
||||||
This is helpful in more than one way:
|
This is helpful in more than one way:
|
||||||
|
|
||||||
- It reduces the cognitive load of the people implementing changes because they don't have to worry about forgetting things
|
- It reduces the cognitive load of the people implementing changes because they don't have to worry about forgetting things
|
||||||
- It increases transparency by making it clear what sort of things are being worked on
|
- It increases transparency by making it clear what sort of things are being worked on
|
||||||
- It gives us that good feeling of closing the issue when the task is done
|
- It gives us that good feeling of closing the issue when the task is done
|
||||||
|
|
||||||
|
|
|
@ -2,17 +2,16 @@
|
||||||
title: Report bugs
|
title: Report bugs
|
||||||
---
|
---
|
||||||
|
|
||||||
Bugs are tracked as [GitHub issues](https://guides.github.com/features/issues/).
|
Bugs are tracked as [GitHub issues](https://guides.github.com/features/issues/).
|
||||||
Create an issue [in our monorepo](https://github.com/freesewing/freesewing/issues/new?assignees=&labels=%F0%9F%90%9B+bug&template=bug-report.md&title=Bug+report) if you've found one.
|
Create an issue [in our monorepo](https://github.com/freesewing/freesewing/issues/new?assignees=\&labels=%F0%9F%90%9B+bug\&template=bug-report.md\&title=Bug+report) if you've found one.
|
||||||
|
|
||||||
Explain the problem and include additional details to help maintainers reproduce the problem:
|
Explain the problem and include additional details to help maintainers reproduce the problem:
|
||||||
|
|
||||||
* **Use a clear and descriptive title** for the issue to identify the problem.
|
- **Use a clear and descriptive title** for the issue to identify the problem.
|
||||||
* **Describe the exact steps which reproduce the problem** in as many details as possible.
|
- **Describe the exact steps which reproduce the problem** in as many details as possible.
|
||||||
* **Include relevant information** such as your username on the site, or the person you drafted a pattern for.
|
- **Include relevant information** such as your username on the site, or the person you drafted a pattern for.
|
||||||
|
|
||||||
Provide more context by answering these questions:
|
Provide more context by answering these questions:
|
||||||
|
|
||||||
* **Did the problem start happening recently** (e.g. it worked fine before but since the latest update it doesn't)
|
- **Did the problem start happening recently** (e.g. it worked fine before but since the latest update it doesn't)
|
||||||
* **Can you reliably reproduce the issue?** If not, provide details about how often the problem happens and under which conditions it normally happens.
|
- **Can you reliably reproduce the issue?** If not, provide details about how often the problem happens and under which conditions it normally happens.
|
||||||
|
|
||||||
|
|
|
@ -4,6 +4,5 @@ title: Showcase our patterns
|
||||||
|
|
||||||
Anytime somebody has made one of our patterns, we like to showcase it on [freesewing.org](https://freesewing.org/showcase/).
|
Anytime somebody has made one of our patterns, we like to showcase it on [freesewing.org](https://freesewing.org/showcase/).
|
||||||
|
|
||||||
Unpublished showcases are tracked as [GitHub issues](https://guides.github.com/features/issues/).
|
Unpublished showcases are tracked as [GitHub issues](https://guides.github.com/features/issues/).
|
||||||
Create an issue [in our monorepo](https://github.com/freesewing/freesewing/issues/new?assignees=&labels=%F0%9F%91%8D+good+first+issue%2C+%F0%9F%93%B8+showcase%2C+%F0%9F%A4%97+community&template=showcase-template.md&title=Create+showcase+from+this+content) when you've made one of our patterns, or have come across pictures from another maker who did.
|
Create an issue [in our monorepo](https://github.com/freesewing/freesewing/issues/new?assignees=\&labels=%F0%9F%91%8D+good+first+issue%2C+%F0%9F%93%B8+showcase%2C+%F0%9F%A4%97+community\&template=showcase-template.md\&title=Create+showcase+from+this+content) when you've made one of our patterns, or have come across pictures from another maker who did.
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,5 @@
|
||||||
title: Translation
|
title: Translation
|
||||||
---
|
---
|
||||||
|
|
||||||
You could translate FreeSewing into one of its additional languages
|
You could translate FreeSewing into one of its additional languages
|
||||||
(French, German, Dutch, Spanish). Or if you’re ambitious, add a new one.
|
(French, German, Dutch, Spanish). Or if you’re ambitious, add a new one.
|
||||||
|
|
||||||
|
|
|
@ -4,12 +4,11 @@ title: Triage issues
|
||||||
|
|
||||||
Triaging issues is a great way to get involved in FreeSewing. You can do tasks such as:
|
Triaging issues is a great way to get involved in FreeSewing. You can do tasks such as:
|
||||||
|
|
||||||
- Making sure issues are properly labeled
|
- Making sure issues are properly labeled
|
||||||
- Ensuring they have a good title that explains the issue in brief
|
- Ensuring they have a good title that explains the issue in brief
|
||||||
- Assigning issues to people to make sure they are tended to
|
- Assigning issues to people to make sure they are tended to
|
||||||
- Keeping an eye on stale issues, and either updating or closing them
|
- Keeping an eye on stale issues, and either updating or closing them
|
||||||
- Assigning issues to milestones so we can plan our releases
|
- Assigning issues to milestones so we can plan our releases
|
||||||
|
|
||||||
All FreeSewing contributors have triage permissions that allows them to do this.
|
All FreeSewing contributors have triage permissions that allows them to do this.
|
||||||
If you don't have the rights, or bump into any issues, [reach out to us on Discord](https://discord.freesewing.org).
|
If you don't have the rights, or bump into any issues, [reach out to us on Discord](https://discord.freesewing.org).
|
||||||
|
|
||||||
|
|
|
@ -8,7 +8,7 @@ Attributes attributes.add(string key, string value)
|
||||||
|
|
||||||
Adds `value` to the attribute identified by `key`.
|
Adds `value` to the attribute identified by `key`.
|
||||||
|
|
||||||
Adding multiple values to the same key will result in them being joined together
|
Adding multiple values to the same key will result in them being joined together
|
||||||
(with a space) when rendering.
|
(with a space) when rendering.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
@ -28,4 +28,3 @@ paths.demo = new Path()
|
||||||
paths.demo = new Path()
|
paths.demo = new Path()
|
||||||
.attr('class', 'classA classB');
|
.attr('class', 'classA classB');
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue