From 62e64f973f9afcfbde6e782b165f1a1bd332025f Mon Sep 17 00:00:00 2001 From: Joost De Cock Date: Tue, 29 Dec 2020 18:33:20 +0100 Subject: [PATCH] feat(components): More examples in the Examples component --- config/changelog.yaml | 2 + packages/examples/config/index.js | 177 ++++++++++--------- packages/examples/src/index.js | 14 ++ packages/examples/src/plugin_buttons.js | 6 +- packages/examples/src/plugin_cutonfold.js | 10 +- packages/examples/src/plugin_grainline.js | 6 +- packages/examples/src/snippets_bnotch.js | 10 ++ packages/examples/src/snippets_button.js | 10 ++ packages/examples/src/snippets_buttonhole.js | 10 ++ packages/examples/src/snippets_logo.js | 10 ++ packages/examples/src/snippets_notch.js | 10 ++ packages/examples/src/snippets_snapsocket.js | 10 ++ packages/examples/src/snippets_snapstud.js | 10 ++ 13 files changed, 189 insertions(+), 96 deletions(-) create mode 100644 packages/examples/src/snippets_bnotch.js create mode 100644 packages/examples/src/snippets_button.js create mode 100644 packages/examples/src/snippets_buttonhole.js create mode 100644 packages/examples/src/snippets_logo.js create mode 100644 packages/examples/src/snippets_notch.js create mode 100644 packages/examples/src/snippets_snapsocket.js create mode 100644 packages/examples/src/snippets_snapstud.js diff --git a/config/changelog.yaml b/config/changelog.yaml index c16b19c86d2..494fe9add47 100644 --- a/config/changelog.yaml +++ b/config/changelog.yaml @@ -1,6 +1,8 @@ Unreleased: date: Added: + components: + - Added some more examples to the Examples component css-theme: - Proper formatting for markdown syntax highlighting Changed: diff --git a/packages/examples/config/index.js b/packages/examples/config/index.js index d7c67835ed3..ba3a25a39ba 100644 --- a/packages/examples/config/index.js +++ b/packages/examples/config/index.js @@ -1,100 +1,105 @@ -import { version } from "../package.json"; +import { version } from '../package.json' export default { - name: "examples", + name: 'examples', version, - design: "Joost De Cock", - code: "Joost De Cock", - department: "womenswear", - type: "pattern", + design: 'Joost De Cock', + code: 'Joost De Cock', + department: 'womenswear', + type: 'pattern', difficulty: 1, - tags: [ - "example", - ], + tags: ['example'], optionGroups: { - fit: ["fixme"] + fit: ['fixme'] }, measurements: [], dependencies: { - point_attr: "path_attr" + point_attr: 'path_attr' }, parts: [ - "point_attr", - "path_move", - "path_line", - "path_curve", - "path__curve", - "path_curve_", - "path_close", - "path_ops", - "path_attr", - "path_clone", - "path_divide", - "path_edge", - "path_end", - "path_intersects", - "path_intersectsx", - "path_intersectsy", - "path_join", - "path_length", - "path_offset", - "path_reverse", - "path_shiftalong", - "path_shiftfractionalong", - "path_split", - "path_start", - "path_translate", - "path_trim", - "plugin_buttons", - "plugin_cutonfold", - "plugin_dimension", - "plugin_grainline", - "plugin_logo", - "plugin_round", - "plugin_scalebox", - "plugin_sprinkle", - "plugin_title", - "point_angle", - "point_attr", - "point_clone", - "point_copy", - "point_dist", - "point_dx", - "point_dy", - "point_flipx", - "point_flipy", - "point_shift", - "point_shiftfractiontowards", - "point_shifttowards", - "point_shiftoutwards", - "point_sitson", - "point_sitsroughlyon", - "point_rotate", - "point_translate", - "settings_sa", - "snippet", - "snippet_attr", - "snippet_clone", - "utils_linesintersect", - "utils_beamsintersect", - "utils_beamintersectsx", - "utils_beamintersectsy", - "utils_lineintersectscurve", - "utils_curvesintersect", - "utils_pointonbeam", - "utils_pointonline", - "utils_pointoncurve", - "utils_circlesintersect", - "utils_beamintersectscircle", - "utils_lineintersectscircle", - "utils_curveintersectsy", - "utils_curveintersectsx", - "utils_splitcurve", - "docs_overview", - "docs_coords" + 'point_attr', + 'path_move', + 'path_line', + 'path_curve', + 'path__curve', + 'path_curve_', + 'path_close', + 'path_ops', + 'path_attr', + 'path_clone', + 'path_divide', + 'path_edge', + 'path_end', + 'path_intersects', + 'path_intersectsx', + 'path_intersectsy', + 'path_join', + 'path_length', + 'path_offset', + 'path_reverse', + 'path_shiftalong', + 'path_shiftfractionalong', + 'path_split', + 'path_start', + 'path_translate', + 'path_trim', + 'plugin_buttons', + 'plugin_cutonfold', + 'plugin_dimension', + 'plugin_grainline', + 'plugin_logo', + 'plugin_round', + 'plugin_scalebox', + 'plugin_sprinkle', + 'plugin_title', + 'point_angle', + 'point_attr', + 'point_clone', + 'point_copy', + 'point_dist', + 'point_dx', + 'point_dy', + 'point_flipx', + 'point_flipy', + 'point_shift', + 'point_shiftfractiontowards', + 'point_shifttowards', + 'point_shiftoutwards', + 'point_sitson', + 'point_sitsroughlyon', + 'point_rotate', + 'point_translate', + 'settings_sa', + 'snippet', + 'snippet_attr', + 'snippet_clone', + 'snippets_bnotch', + 'snippets_notch', + 'snippets_button', + 'snippets_buttonhole', + 'snippets_snapsocket', + 'snippets_snapstud', + 'snippets_logo', + 'utils_linesintersect', + 'utils_beamsintersect', + 'utils_beamintersectsx', + 'utils_beamintersectsy', + 'utils_lineintersectscurve', + 'utils_curvesintersect', + 'utils_pointonbeam', + 'utils_pointonline', + 'utils_pointoncurve', + 'utils_circlesintersect', + 'utils_beamintersectscircle', + 'utils_lineintersectscircle', + 'utils_curveintersectsy', + 'utils_curveintersectsx', + 'utils_splitcurve', + 'docs_overview', + 'docs_coords' ], options: { - focus: "", + focus: '', // Optiongroups are needed for now, because workbench fixme: { pct: 50, @@ -102,4 +107,4 @@ export default { max: 100 } } -}; +} diff --git a/packages/examples/src/index.js b/packages/examples/src/index.js index ae376e27f7c..946d0704cbc 100644 --- a/packages/examples/src/index.js +++ b/packages/examples/src/index.js @@ -76,6 +76,13 @@ import draftSettings_sa from './settings_sa' import draftSnippet from './snippet' import draftSnippet_attr from './snippet_attr' import draftSnippet_clone from './snippet_clone' +import draftSnippets_bnotch from './snippets_bnotch' +import draftSnippets_notch from './snippets_notch' +import draftSnippets_button from './snippets_button' +import draftSnippets_buttonhole from './snippets_buttonhole' +import draftSnippets_snapsocket from './snippets_snapsocket' +import draftSnippets_snapstud from './snippets_snapstud' +import draftSnippets_logo from './snippets_logo' // Docs illustrations import draftDocs_overview from './docs_overview' import draftDocs_coords from './docs_coords' @@ -140,6 +147,13 @@ let methods = { draftSnippet, draftSnippet_attr, draftSnippet_clone, + draftSnippets_bnotch, + draftSnippets_notch, + draftSnippets_button, + draftSnippets_buttonhole, + draftSnippets_snapsocket, + draftSnippets_snapstud, + draftSnippets_logo, draftUtils_linesintersect, draftUtils_beamsintersect, draftUtils_beamintersectsx, diff --git a/packages/examples/src/plugin_buttons.js b/packages/examples/src/plugin_buttons.js index 58908e7a267..89994f031da 100644 --- a/packages/examples/src/plugin_buttons.js +++ b/packages/examples/src/plugin_buttons.js @@ -1,12 +1,12 @@ import { box } from './shared' -export default part => { +export default (part) => { let { Point, snippets, Snippet } = part.shorthand() snippets.button = new Snippet('button', new Point(20, 10)) snippets.buttonhole = new Snippet('buttonhole', new Point(40, 10)) - snippets.snapMale = new Snippet('snap-male', new Point(60, 10)) - snippets.snapFemale = new Snippet('snap-female', new Point(80, 10)) + snippets.snapMale = new Snippet('snap-stud', new Point(60, 10)) + snippets.snapFemale = new Snippet('snap-socket', new Point(80, 10)) return box(part, 100, 20) } diff --git a/packages/examples/src/plugin_cutonfold.js b/packages/examples/src/plugin_cutonfold.js index cab6a78109b..15ef30df083 100644 --- a/packages/examples/src/plugin_cutonfold.js +++ b/packages/examples/src/plugin_cutonfold.js @@ -1,10 +1,10 @@ -export default part => { +export default (part) => { let { Point, points, Path, paths, macro } = part.shorthand() points.topLeft = new Point(0, 0) points.topRight = new Point(150, 0) - points.bottomRight = new Point(150, 50) - points.bottomLeft = new Point(0, 50) + points.bottomRight = new Point(150, 30) + points.bottomLeft = new Point(0, 30) paths.box = new Path() .move(points.topLeft) @@ -14,8 +14,8 @@ export default part => { .close() macro('cutonfold', { - from: points.topRight, - to: points.topLeft, + from: points.bottomLeft, + to: points.bottomRight, grainline: true }) diff --git a/packages/examples/src/plugin_grainline.js b/packages/examples/src/plugin_grainline.js index 197dccefc43..28c2dcaa90e 100644 --- a/packages/examples/src/plugin_grainline.js +++ b/packages/examples/src/plugin_grainline.js @@ -1,4 +1,6 @@ -export default part => { +import { box } from './shared' + +export default (part) => { let { Point, points, macro } = part.shorthand() points.grainlineFrom = new Point(10, 10) @@ -9,5 +11,5 @@ export default part => { to: points.grainlineTo }) - return part + return box(part, 110, 15) } diff --git a/packages/examples/src/snippets_bnotch.js b/packages/examples/src/snippets_bnotch.js new file mode 100644 index 00000000000..b5478c467e6 --- /dev/null +++ b/packages/examples/src/snippets_bnotch.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('bnotch', points.anchor) + + return box(part, 100, 10) +} diff --git a/packages/examples/src/snippets_button.js b/packages/examples/src/snippets_button.js new file mode 100644 index 00000000000..8c15ebedf78 --- /dev/null +++ b/packages/examples/src/snippets_button.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('button', points.anchor) + + return box(part, 100, 10) +} diff --git a/packages/examples/src/snippets_buttonhole.js b/packages/examples/src/snippets_buttonhole.js new file mode 100644 index 00000000000..4e9c9f3d571 --- /dev/null +++ b/packages/examples/src/snippets_buttonhole.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('buttonhole', points.anchor) + + return box(part, 100, 10) +} diff --git a/packages/examples/src/snippets_logo.js b/packages/examples/src/snippets_logo.js new file mode 100644 index 00000000000..56953e2b49d --- /dev/null +++ b/packages/examples/src/snippets_logo.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 35) + snippets.demo = new Snippet('logo', points.anchor) + + return box(part, 100, 50) +} diff --git a/packages/examples/src/snippets_notch.js b/packages/examples/src/snippets_notch.js new file mode 100644 index 00000000000..1e97eb548db --- /dev/null +++ b/packages/examples/src/snippets_notch.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('notch', points.anchor) + + return box(part, 100, 10) +} diff --git a/packages/examples/src/snippets_snapsocket.js b/packages/examples/src/snippets_snapsocket.js new file mode 100644 index 00000000000..03e1c10f9b1 --- /dev/null +++ b/packages/examples/src/snippets_snapsocket.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('snap-socket', points.anchor) + + return box(part, 100, 10) +} diff --git a/packages/examples/src/snippets_snapstud.js b/packages/examples/src/snippets_snapstud.js new file mode 100644 index 00000000000..b4918077261 --- /dev/null +++ b/packages/examples/src/snippets_snapstud.js @@ -0,0 +1,10 @@ +import { box } from './shared' + +export default (part) => { + let { Point, points, Snippet, snippets } = part.shorthand() + + points.anchor = new Point(50, 5) + snippets.demo = new Snippet('snap-stud', points.anchor) + + return box(part, 100, 10) +}