From edc726ebb199c8a4877581c9addc5b2aae975b11 Mon Sep 17 00:00:00 2001 From: Joost De Cock Date: Sat, 25 May 2019 11:11:46 +0200 Subject: [PATCH] :construction: Work on API examples --- packages/examples/config/index.js | 7 ++- packages/examples/package.json | 1 + packages/examples/src/index.js | 21 +++++--- packages/examples/src/path__curve.js | 17 ++++++ packages/examples/src/path_clone.js | 5 +- packages/examples/src/path_close.js | 19 +++++++ packages/examples/src/path_curve.js | 18 +++++++ packages/examples/src/path_curve_.js | 17 ++++++ packages/examples/src/path_edge.js | 19 ++++--- packages/examples/src/path_end.js | 2 +- packages/examples/src/path_intersects.js | 2 +- packages/examples/src/path_intersectsx.js | 2 +- packages/examples/src/path_intersectsy.js | 2 +- packages/examples/src/path_join.js | 3 +- packages/examples/src/path_line.js | 16 ++++++ packages/examples/src/path_move.js | 13 +++++ packages/examples/src/path_reverse.js | 8 ++- packages/examples/src/path_shiftalong.js | 16 +++--- .../examples/src/path_shiftfractionalong.js | 16 +++--- packages/examples/src/path_start.js | 2 +- packages/examples/src/path_translate.js | 6 +-- packages/examples/src/point_angle.js | 54 ++++--------------- packages/examples/src/point_clone.js | 2 +- packages/examples/src/point_copy.js | 2 +- packages/examples/src/point_dist.js | 3 -- packages/examples/src/point_dx.js | 3 -- packages/examples/src/point_dy.js | 3 -- packages/examples/src/point_rotate.js | 2 - packages/examples/src/point_shift.js | 9 ++-- .../src/point_shiftfractiontowards.js | 14 +---- packages/examples/src/point_shiftoutwards.js | 20 ++----- packages/examples/src/point_shifttowards.js | 18 ++----- packages/examples/src/point_sitson.js | 2 +- packages/examples/src/point_sitsroughlyon.js | 2 +- packages/examples/src/point_translate.js | 13 +++-- packages/examples/src/snippet_clone.js | 11 ++-- .../src/utils_beamintersectscircle.js | 24 +++++---- .../examples/src/utils_beamintersectsx.js | 11 ++-- .../examples/src/utils_beamintersectsy.js | 5 +- packages/examples/src/utils_beamsintersect.js | 4 +- .../examples/src/utils_circlesintersect.js | 4 +- .../examples/src/utils_curvesintersect.js | 2 +- .../src/utils_lineintersectscircle.js | 22 ++++---- .../examples/src/utils_lineintersectscurve.js | 2 +- packages/examples/src/utils_linesintersect.js | 2 +- packages/examples/src/utils_pointonbeam.js | 6 +-- packages/examples/src/utils_pointoncurve.js | 4 +- packages/examples/src/utils_pointonline.js | 6 +-- 48 files changed, 259 insertions(+), 203 deletions(-) create mode 100644 packages/examples/src/path__curve.js create mode 100644 packages/examples/src/path_close.js create mode 100644 packages/examples/src/path_curve.js create mode 100644 packages/examples/src/path_curve_.js create mode 100644 packages/examples/src/path_line.js create mode 100644 packages/examples/src/path_move.js diff --git a/packages/examples/config/index.js b/packages/examples/config/index.js index 49a16173c94..667137eea72 100644 --- a/packages/examples/config/index.js +++ b/packages/examples/config/index.js @@ -14,8 +14,13 @@ export default { }, parts: [ "point_attr", + "path_move", + "path_line", + "path_curve", "path__curve", "path_curve_", + "path_close", + "path_ops", "path_attr", "path_clone", "path_divide", @@ -27,7 +32,6 @@ export default { "path_join", "path_length", "path_offset", - "path_ops", "path_reverse", "path_shiftalong", "path_shiftfractionalong", @@ -55,6 +59,7 @@ export default { "point_shifttowards", "point_shiftoutwards", "point_sitson", + "point_sitsroughlyon", "point_rotate", "point_translate", "settings_sa", diff --git a/packages/examples/package.json b/packages/examples/package.json index 1f54fa4c01e..192fbdb00bd 100644 --- a/packages/examples/package.json +++ b/packages/examples/package.json @@ -22,6 +22,7 @@ "nodebuild": "BABEL_ENV=production rollup -c -o dist/index.js -f cjs", "modulebuild": "BABEL_ENV=production rollup -c -o dist/index.mjs -f es", "build": "npm run clean && npm run nodebuild && npm run modulebuild", + "start": "rollup -c -w", "test": "echo \"examples: No tests configured. Perhaps you'd like to do this?\" && exit 0", "pubtest": "npm publish --registry http://localhost:6662", "pubforce": "npm publish", diff --git a/packages/examples/src/index.js b/packages/examples/src/index.js index a994294a21c..62fa3d44012 100644 --- a/packages/examples/src/index.js +++ b/packages/examples/src/index.js @@ -2,6 +2,12 @@ import freesewing from "@freesewing/core"; import plugins from "@freesewing/plugin-bundle"; import config from "../config/"; // Path API +import draftPath_move from "./path_move"; +import draftPath_line from "./path_line"; +import draftPath_curve from "./path_curve"; +import draftPath__curve from "./path__curve"; +import draftPath_curve_ from "./path_curve_"; +import draftPath_close from "./path_close"; import draftPath_ops from "./path_ops"; import draftPath_attr from "./path_attr"; import draftPath_clone from "./path_clone"; @@ -43,6 +49,7 @@ import draftPoint_shiftfractiontowards from "./point_shiftfractiontowards"; import draftPoint_shifttowards from "./point_shifttowards"; import draftPoint_shiftoutwards from "./point_shiftoutwards"; import draftPoint_sitson from "./point_sitson"; +import draftPoint_sitsroughlyon from "./point_sitsroughlyon"; import draftPoint_rotate from "./point_rotate"; import draftPoint_translate from "./point_translate"; // Utils API @@ -75,12 +82,13 @@ const Pattern = new freesewing.Design(config, plugins); // Attach draft methods to prototype let methods = { - draftPath_move: draftPath_ops, - draftPath_line: draftPath_ops, - draftPath_curve: draftPath_ops, - draftPath__curve: draftPath_ops, - draftPath_curve_: draftPath_ops, - draftPath_close: draftPath_ops, + draftPath_move, + draftPath_line, + draftPath_curve, + draftPath__curve, + draftPath_curve_, + draftPath_close, + draftPath_ops, draftPath_attr, draftPath_clone, draftPath_divide, @@ -120,6 +128,7 @@ let methods = { draftPoint_shifttowards, draftPoint_shiftoutwards, draftPoint_sitson, + draftPoint_sitsroughlyon, draftPoint_rotate, draftPoint_translate, draftSettings_sa, diff --git a/packages/examples/src/path__curve.js b/packages/examples/src/path__curve.js new file mode 100644 index 00000000000..d88edd5e603 --- /dev/null +++ b/packages/examples/src/path__curve.js @@ -0,0 +1,17 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.from = new Point(5, 20); + points.cp2 = new Point(60, 30); + points.to = new Point(90, 20); + + paths.line = new Path() + .move(points.from) + ._curve(points.cp2, points.to) + .attr("data-text", "Path._curve()") + .attr("data-text-class", "text-sm center fill-note"); + + return box(part, 100, 25); +}; diff --git a/packages/examples/src/path_clone.js b/packages/examples/src/path_clone.js index e8c487c4b79..c6407b2cfdc 100644 --- a/packages/examples/src/path_clone.js +++ b/packages/examples/src/path_clone.js @@ -12,7 +12,10 @@ export default part => { .line(points.B) .curve(points.BCp2, points.CCp1, points.C); - paths.clone = paths.example.clone().attr("class", "note lashed stroke-xl"); + paths.clone = paths.example + .clone() + .attr("class", "note lashed stroke-l") + .attr("style", "stroke-opacity: 0.5"); return part; }; diff --git a/packages/examples/src/path_close.js b/packages/examples/src/path_close.js new file mode 100644 index 00000000000..a555d68b4f7 --- /dev/null +++ b/packages/examples/src/path_close.js @@ -0,0 +1,19 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.from = new Point(10, 20); + points.cp2 = new Point(60, 30); + points.to = new Point(90, 20); + + paths.line = new Path() + .move(points.from) + ._curve(points.cp2, points.to) + .close() + .reverse() // To keep text from being upside-down + .attr("data-text", "Path._close()") + .attr("data-text-class", "text-sm right fill-note"); + + return box(part, 100, 25); +}; diff --git a/packages/examples/src/path_curve.js b/packages/examples/src/path_curve.js new file mode 100644 index 00000000000..a068a69ab76 --- /dev/null +++ b/packages/examples/src/path_curve.js @@ -0,0 +1,18 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.from = new Point(10, 20); + points.cp1 = new Point(40, 0); + points.cp2 = new Point(60, 30); + points.to = new Point(90, 20); + + paths.line = new Path() + .move(points.from) + .curve(points.cp1, points.cp2, points.to) + .attr("data-text", "Path.curve()") + .attr("data-text-class", "text-sm center fill-note"); + + return box(part, 100, 25); +}; diff --git a/packages/examples/src/path_curve_.js b/packages/examples/src/path_curve_.js new file mode 100644 index 00000000000..68f9d61d685 --- /dev/null +++ b/packages/examples/src/path_curve_.js @@ -0,0 +1,17 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.from = new Point(10, 20); + points.cp1 = new Point(40, 0); + points.to = new Point(90, 20); + + paths.line = new Path() + .move(points.from) + .curve_(points.cp1, points.to) + .attr("data-text", "Path.curve_()") + .attr("data-text-class", "text-sm center fill-note"); + + return box(part, 100, 25); +}; diff --git a/packages/examples/src/path_edge.js b/packages/examples/src/path_edge.js index 889de1fc6c4..7ce3741bac8 100644 --- a/packages/examples/src/path_edge.js +++ b/packages/examples/src/path_edge.js @@ -16,14 +16,17 @@ export default part => { .curve(points.E, points.D, points.A) .close(); - snippets.a = new Snippet("x", paths.demo.edge("topLeft")); - snippets.b = new Snippet("x", paths.demo.edge("topRight")); - snippets.c = new Snippet("x", paths.demo.edge("bottomLeft")); - snippets.d = new Snippet("x", paths.demo.edge("bottomRight")); - snippets.e = new Snippet("x", paths.demo.edge("top")); - snippets.f = new Snippet("x", paths.demo.edge("left")); - snippets.g = new Snippet("x", paths.demo.edge("bottom")); - snippets.h = new Snippet("x", paths.demo.edge("right")); + for (let i of [ + "topLeft", + "topRight", + "bottomLeft", + "bottomRight", + "top", + "left", + "bottom", + "right" + ]) + snippets[i] = new Snippet("notch", paths.demo.edge(i)); return part; }; diff --git a/packages/examples/src/path_end.js b/packages/examples/src/path_end.js index 1201e8ba95f..22c779f7d7e 100644 --- a/packages/examples/src/path_end.js +++ b/packages/examples/src/path_end.js @@ -12,7 +12,7 @@ export default part => { .line(points.B) .curve(points.BCp2, points.CCp1, points.C); - snippets.x = new Snippet("x", paths.demo.end()); + snippets.end = new Snippet("notch", paths.demo.end()); return part; }; diff --git a/packages/examples/src/path_intersects.js b/packages/examples/src/path_intersects.js index c16e36451e4..a9ec204d1ea 100644 --- a/packages/examples/src/path_intersects.js +++ b/packages/examples/src/path_intersects.js @@ -29,7 +29,7 @@ export default part => { .curve(points._DCp1, points._DCp1, points._D); for (let p of paths.demo1.intersects(paths.demo2)) { - snippets[part.getId()] = new Snippet("x", p); + snippets[part.getId()] = new Snippet("notch", p); } return part; diff --git a/packages/examples/src/path_intersectsx.js b/packages/examples/src/path_intersectsx.js index d0401ea14f6..b25244a177b 100644 --- a/packages/examples/src/path_intersectsx.js +++ b/packages/examples/src/path_intersectsx.js @@ -24,7 +24,7 @@ export default part => { .curve(points.DCp1, points.DCp1, points.D); for (let p of paths.demo.intersectsX(60)) { - snippets[part.getId()] = new Snippet("x", p); + snippets[part.getId()] = new Snippet("notch", p); } return part; diff --git a/packages/examples/src/path_intersectsy.js b/packages/examples/src/path_intersectsy.js index 8888cbb52da..f5179e10157 100644 --- a/packages/examples/src/path_intersectsy.js +++ b/packages/examples/src/path_intersectsy.js @@ -23,7 +23,7 @@ export default part => { .curve(points.BCp2, points.CCp1, points.C) .curve(points.DCp1, points.DCp1, points.D); for (let p of paths.demo.intersectsY(58)) { - snippets[part.getId()] = new Snippet("x", p); + snippets[part.getId()] = new Snippet("notch", p); } return part; diff --git a/packages/examples/src/path_join.js b/packages/examples/src/path_join.js index 053229249a0..148b980ff99 100644 --- a/packages/examples/src/path_join.js +++ b/packages/examples/src/path_join.js @@ -19,7 +19,8 @@ export default part => { paths.joint = paths.path1 .join(paths.path2) - .attr("class", "note lashed stroke-xl"); + .attr("class", "note lashed stroke-l") + .attr("style", "stroke-opacity: 0.5"); return part; }; diff --git a/packages/examples/src/path_line.js b/packages/examples/src/path_line.js new file mode 100644 index 00000000000..4423e8aaced --- /dev/null +++ b/packages/examples/src/path_line.js @@ -0,0 +1,16 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.from = new Point(10, 10); + points.to = new Point(90, 10); + + paths.line = new Path() + .move(points.from) + .line(points.to) + .attr("data-text", "Path.line()") + .attr("data-text-class", "text-sm center fill-note"); + + return box(part, 100, 15); +}; diff --git a/packages/examples/src/path_move.js b/packages/examples/src/path_move.js new file mode 100644 index 00000000000..35a752998e0 --- /dev/null +++ b/packages/examples/src/path_move.js @@ -0,0 +1,13 @@ +import { box } from "./shared"; + +export default part => { + let { Point, points, Path, paths } = part.shorthand(); + + points.to = new Point(50, 10) + .attr("data-text", "Path.move()") + .attr("data-text-class", "fill-note center"); + + paths.noline = new Path().move(points.to); + + return box(part, 100, 15); +}; diff --git a/packages/examples/src/path_reverse.js b/packages/examples/src/path_reverse.js index b261374d6f2..152420930f7 100644 --- a/packages/examples/src/path_reverse.js +++ b/packages/examples/src/path_reverse.js @@ -9,9 +9,13 @@ export default part => { paths.example = new Path() .move(points.B) .curve(points.BCp2, points.CCp1, points.C) - .attr("data-text", "msg"); + .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors") + .attr("data-text-class", "text-xs fill-note"); - paths.reverse = paths.example.reverse().attr("data-text", "gsm"); + paths.reverse = paths.example + .reverse() + .attr("data-text", "freesewingIsMadeByJoostDeCockAndContributors") + .attr("data-text-class", "text-xs fill-lining"); return part; }; diff --git a/packages/examples/src/path_shiftalong.js b/packages/examples/src/path_shiftalong.js index 993a91073c4..bd8e7d1d26c 100644 --- a/packages/examples/src/path_shiftalong.js +++ b/packages/examples/src/path_shiftalong.js @@ -12,19 +12,19 @@ export default part => { .line(points.B) .curve(points.BCp2, points.CCp1, points.C); - points.X1 = paths.example + points.x1 = paths.example .shiftAlong(20) - .attr("data-text", "msg_2cm") - .attr("data-text-class", "center") + .attr("data-text", "2cm") + .attr("data-text-class", "center fill-note") .attr("data-text-lineheight", 6); - points.X2 = paths.example + points.x2 = paths.example .shiftAlong(90) - .attr("data-text", "msg_9cm") - .attr("data-text-class", "center") + .attr("data-text", "9cm") + .attr("data-text-class", "center fill-note") .attr("data-text-lineheight", 6); - snippets.Xl = new Snippet("x", points.X1); - snippets.X2 = new Snippet("x", points.X2); + snippets.x1 = new Snippet("notch", points.x1); + snippets.x2 = new Snippet("notch", points.x2); return part; }; diff --git a/packages/examples/src/path_shiftfractionalong.js b/packages/examples/src/path_shiftfractionalong.js index 09b219f984f..4c8b43f2c65 100644 --- a/packages/examples/src/path_shiftfractionalong.js +++ b/packages/examples/src/path_shiftfractionalong.js @@ -12,19 +12,19 @@ export default part => { .line(points.B) .curve(points.BCp2, points.CCp1, points.C); - points.X1 = paths.example + points.x1 = paths.example .shiftFractionAlong(0.2) - .attr("data-text", "msg_20") - .attr("data-text-class", "center") + .attr("data-text", "20%") + .attr("data-text-class", "center fill-note") .attr("data-text-lineheight", 6); - points.X2 = paths.example + points.x2 = paths.example .shiftFractionAlong(0.9) - .attr("data-text", "msg_90") - .attr("data-text-class", "center") + .attr("data-text", "90%") + .attr("data-text-class", "center fill-note") .attr("data-text-lineheight", 6); - snippets.Xl = new Snippet("x", points.X1); - snippets.X2 = new Snippet("x", points.X2); + snippets.xl = new Snippet("notch", points.x1); + snippets.x2 = new Snippet("notch", points.x2); return part; }; diff --git a/packages/examples/src/path_start.js b/packages/examples/src/path_start.js index 0a98149212d..37d1fb19c7b 100644 --- a/packages/examples/src/path_start.js +++ b/packages/examples/src/path_start.js @@ -12,6 +12,6 @@ export default part => { .line(points.B) .curve(points.BCp2, points.CCp1, points.C); - snippets.x = new Snippet("x", paths.example.start()); + snippets.start = new Snippet("notch", paths.example.start()); return part; }; diff --git a/packages/examples/src/path_translate.js b/packages/examples/src/path_translate.js index 671d4d938a0..133aac0b27e 100644 --- a/packages/examples/src/path_translate.js +++ b/packages/examples/src/path_translate.js @@ -10,11 +10,9 @@ export default part => { paths.A = new Path() .move(points.A) .line(points.B) - .curve(points.BCp2, points.CCp1, points.C) - .attr("data-text", "msg_path") - .attr("data-text-class", "center"); + .curve(points.BCp2, points.CCp1, points.C); - paths.B = paths.A.translate(60, 30).attr("data-text", "msg_transform", true); + paths.B = paths.A.translate(60, 30); points.step1 = points.B.shift(0, 60); points.step2 = points.step1.shift(-90, 30); diff --git a/packages/examples/src/point_angle.js b/packages/examples/src/point_angle.js index 40852ecbe39..5cf17760d8b 100644 --- a/packages/examples/src/point_angle.js +++ b/packages/examples/src/point_angle.js @@ -1,51 +1,17 @@ export default part => { - let { Point, points, Path, paths, Snippet, snippets } = part.shorthand(); + let { Point, points, Path, paths } = part.shorthand(); - points.sun = new Point(40, 40); - points.moon1 = new Point(70, 40) - .attr("data-text", "0") - .attr("data-text-class", "text-xl"); - points.moon2 = new Point(40, 10) - .attr("data-text", 90) - .attr("data-text-class", "text-xl"); - points.moon3 = new Point(10, 40) - .attr("data-text", 180) - .attr("data-text-class", "text-xl"); - points.moon4 = new Point(40, 70) - .attr("data-text", 270) - .attr("data-text-class", "text-xl"); - points.moon5 = points.moon1.rotate(-45, points.sun); - points.moon5 - .attr("data-text", points.sun.angle(points.moon5)) - .attr("data-text-class", "text-xl"); + points.sun = new Point(10, 5); + points.moon = points.sun.shift(-15, 70); + points.text = points.sun + .shiftFractionTowards(points.moon, 0.8) + .attr("data-text", points.sun.angle(points.moon) + "°") + .attr("data-text-class", "text-sm fill-note center"); - paths.moon1 = new Path() + paths.line = new Path() .move(points.sun) - .line(points.moon1) - .attr("class", "dashed note"); - paths.moon2 = new Path() - .move(points.sun) - .line(points.moon2) - .attr("class", "dashed note"); - paths.moon3 = new Path() - .move(points.sun) - .line(points.moon3) - .attr("class", "dashed note"); - paths.moon4 = new Path() - .move(points.sun) - .line(points.moon4) - .attr("class", "dashed note"); - paths.moon5 = new Path() - .move(points.sun) - .line(points.moon5) - .attr("class", "dashed note"); - - snippets.notch = new Snippet("notch", points.sun); - snippets.notch1 = new Snippet("x", points.moon1); - snippets.notch2 = new Snippet("x", points.moon2); - snippets.notch3 = new Snippet("x", points.moon3); - snippets.notch4 = new Snippet("x", points.moon4); - snippets.notch5 = new Snippet("x", points.moon5); + .line(points.moon) + .attr("class", "dashed"); return part; }; diff --git a/packages/examples/src/point_clone.js b/packages/examples/src/point_clone.js index 60132beeec1..855430c5148 100644 --- a/packages/examples/src/point_clone.js +++ b/packages/examples/src/point_clone.js @@ -9,7 +9,7 @@ export default part => { .attr("data-text-fill-opacity", "0.5"); points.B = points.A.clone().attr("data-text", "Point B"); - snippets.x = new Snippet("x", points.A); + snippets.x = new Snippet("notch", points.A); return box(part); }; diff --git a/packages/examples/src/point_copy.js b/packages/examples/src/point_copy.js index a2b21e04407..467b8a7ca3e 100644 --- a/packages/examples/src/point_copy.js +++ b/packages/examples/src/point_copy.js @@ -8,7 +8,7 @@ export default part => { .attr("data-text-class", "text-xl"); points.B = points.A.copy().attr("data-text", "Point B"); - snippets.x = new Snippet("x", points.A); + snippets.x = new Snippet("notch", points.A); return box(part); }; diff --git a/packages/examples/src/point_dist.js b/packages/examples/src/point_dist.js index cd56299c1e9..350a46a516b 100644 --- a/packages/examples/src/point_dist.js +++ b/packages/examples/src/point_dist.js @@ -9,8 +9,5 @@ export default part => { to: points.to }); - snippets.notch1 = new Snippet("x", points.from); - snippets.notch2 = new Snippet("x", points.to); - return part; }; diff --git a/packages/examples/src/point_dx.js b/packages/examples/src/point_dx.js index 79de92a5c68..cea283ed357 100644 --- a/packages/examples/src/point_dx.js +++ b/packages/examples/src/point_dx.js @@ -10,8 +10,5 @@ export default part => { y: 25 }); - snippets.notch1 = new Snippet("x", points.from); - snippets.notch2 = new Snippet("x", points.to); - return part; }; diff --git a/packages/examples/src/point_dy.js b/packages/examples/src/point_dy.js index 2ae1292aa38..4a86062bd22 100644 --- a/packages/examples/src/point_dy.js +++ b/packages/examples/src/point_dy.js @@ -10,8 +10,5 @@ export default part => { x: 50 }); - snippets.notch1 = new Snippet("x", points.from); - snippets.notch2 = new Snippet("x", points.to); - return part; }; diff --git a/packages/examples/src/point_rotate.js b/packages/examples/src/point_rotate.js index 0277ec4ab3d..b66e1473279 100644 --- a/packages/examples/src/point_rotate.js +++ b/packages/examples/src/point_rotate.js @@ -2,14 +2,12 @@ export default part => { let { Point, points, Path, paths, Snippet, snippets } = part.shorthand(); points.sun = new Point(40, 40); - snippets.sun = new Snippet("notch", points.sun); points.moon = new Point(70, 40); let step = 360 / 36; for (let i = 1; i < 37; i++) { let angle = step * i; points[`moon${i}`] = points.moon.rotate(angle, points.sun); paths[`moon${i}`] = new Path().move(points.sun).line(points[`moon${i}`]); - snippets[`moon${i}`] = new Snippet("x", points[`moon${i}`]); } return part; diff --git a/packages/examples/src/point_shift.js b/packages/examples/src/point_shift.js index b70a53eabf5..6f91255b63d 100644 --- a/packages/examples/src/point_shift.js +++ b/packages/examples/src/point_shift.js @@ -1,5 +1,7 @@ +import { box } from "./shared"; + export default part => { - let { Point, points, Snippet, snippets, macro } = part.shorthand(); + let { Point, points, macro } = part.shorthand(); points.A = new Point(90, 40) .attr("data-text", "Point A") @@ -8,14 +10,11 @@ export default part => { .attr("data-text", "Point B is point A shifted 7cm\nat a 155 degree angle") .attr("data-text-lineheight", 6); - snippets.A = new Snippet("x", points.A); - snippets.B = new Snippet("x", points.B); - macro("ld", { from: points.B, to: points.A, d: -10 }); - return part; + return box(part, 100, 45); }; diff --git a/packages/examples/src/point_shiftfractiontowards.js b/packages/examples/src/point_shiftfractiontowards.js index 489a1647486..faca8329351 100644 --- a/packages/examples/src/point_shiftfractiontowards.js +++ b/packages/examples/src/point_shiftfractiontowards.js @@ -1,13 +1,5 @@ export default part => { - let { - Point, - points, - Path, - paths, - Snippet, - snippets, - macro - } = part.shorthand(); + let { Point, points, Path, paths, macro } = part.shorthand(); points.A = new Point(90, 70).attr("data-text", "Point A"); points.B = new Point(10, 10).attr("data-text", "Point B"); @@ -19,10 +11,6 @@ export default part => { .attr("data-text-class", "center") .attr("data-text-lineheight", 6); - snippets.A = new Snippet("x", points.A); - snippets.B = new Snippet("x", points.B); - snippets.C = new Snippet("x", points.C); - paths.direction = new Path() .move(points.A) .line(points.B) diff --git a/packages/examples/src/point_shiftoutwards.js b/packages/examples/src/point_shiftoutwards.js index a53bb8d21d9..648c5f22789 100644 --- a/packages/examples/src/point_shiftoutwards.js +++ b/packages/examples/src/point_shiftoutwards.js @@ -1,24 +1,14 @@ +import { box } from "./shared"; + export default part => { - let { - Point, - points, - Path, - paths, - Snippet, - snippets, - macro - } = part.shorthand(); + let { Point, points, Path, paths, macro } = part.shorthand(); points.A = new Point(90, 70).attr("data-text", "Point A"); - points.B = new Point(10, 10).attr("data-text", "Point B"); + points.B = new Point(30, 30).attr("data-text", "Point B"); points.C = points.A.shiftOutwards(points.B, 30) .attr("data-text", "Point C is point A shifted 3cm\nbeyond point B") .attr("data-text-lineheight", 6); - snippets.A = new Snippet("x", points.A); - snippets.B = new Snippet("x", points.B); - snippets.C = new Snippet("x", points.C); - paths.direction = new Path() .move(points.A) .line(points.C) @@ -30,5 +20,5 @@ export default part => { d: -10 }); - return part; + return box(part, 110, 75); }; diff --git a/packages/examples/src/point_shifttowards.js b/packages/examples/src/point_shifttowards.js index 2b0f780ce50..e4ebed1ed63 100644 --- a/packages/examples/src/point_shifttowards.js +++ b/packages/examples/src/point_shifttowards.js @@ -1,13 +1,7 @@ +import { box } from "./shared"; + export default part => { - let { - Point, - points, - Path, - paths, - Snippet, - snippets, - macro - } = part.shorthand(); + let { Point, points, Path, paths, macro } = part.shorthand(); points.A = new Point(90, 70).attr("data-text", "Point A"); points.B = new Point(10, 10).attr("data-text", "Point B"); @@ -19,10 +13,6 @@ export default part => { .attr("data-text-class", "center") .attr("data-text-lineheight", 6); - snippets.A = new Snippet("x", points.A); - snippets.B = new Snippet("x", points.B); - snippets.C = new Snippet("x", points.C); - paths.direction = new Path() .move(points.A) .line(points.B) @@ -34,5 +24,5 @@ export default part => { d: -10 }); - return part; + return box(part, 110, 80); }; diff --git a/packages/examples/src/point_sitson.js b/packages/examples/src/point_sitson.js index e283b4cba35..2b1f919c4ad 100644 --- a/packages/examples/src/point_sitson.js +++ b/packages/examples/src/point_sitson.js @@ -8,7 +8,7 @@ export default part => { points[`a${i}`] = new Point(i * 10, 40); points[`b${i}`] = new Point(i * 10, i * 8); if (points[`a${i}`].sitsOn(points[`b${i}`])) s = "notch"; - else s = "x"; + else s = "bnotch"; snippets[`b${i}`] = new Snippet(s, points[`b${i}`]); snippets[`a${i}`] = new Snippet(s, points[`a${i}`]); } diff --git a/packages/examples/src/point_sitsroughlyon.js b/packages/examples/src/point_sitsroughlyon.js index 47734c9a9b7..a94e8239a43 100644 --- a/packages/examples/src/point_sitsroughlyon.js +++ b/packages/examples/src/point_sitsroughlyon.js @@ -10,7 +10,7 @@ export default part => { points[`a${i}`] = new Point(i * 10, 40); points[`b${i}`] = new Point(i * 10, i * 8); if (points[`a${i}`].sitsRoughlyOn(points[`b${i}`])) s = "notch"; - else s = "x"; + else s = "bnotch"; snippets[`b${i}`] = new Snippet(s, points[`b${i}`]); snippets[`a${i}`] = new Snippet(s, points[`a${i}`]); } diff --git a/packages/examples/src/point_translate.js b/packages/examples/src/point_translate.js index 97ad94f9348..7a774a7a905 100644 --- a/packages/examples/src/point_translate.js +++ b/packages/examples/src/point_translate.js @@ -1,7 +1,9 @@ -export default part => { - let { Point, points, Snippet, snippets, macro } = part.shorthand(); +import { box } from "./shared"; - points.A = new Point(10, 10).attr("data-text", "Point A"); +export default part => { + let { Point, points, macro } = part.shorthand(); + + points.A = new Point(20, 20).attr("data-text", "Point A"); points.B = points.A.translate(120, 60) .attr( "data-text", @@ -11,9 +13,6 @@ export default part => { .attr("data-text-dy", -6) .attr("data-text-lineheight", 6); - snippets.A = new Snippet("x", points.A); - snippets.B = new Snippet("x", points.B); - macro("ld", { from: points.A, to: points.B, @@ -21,5 +20,5 @@ export default part => { noStartMarker: true }); - return part; + return box(part, 150, 85); }; diff --git a/packages/examples/src/snippet_clone.js b/packages/examples/src/snippet_clone.js index c32718478a7..6c20f838216 100644 --- a/packages/examples/src/snippet_clone.js +++ b/packages/examples/src/snippet_clone.js @@ -3,12 +3,13 @@ import { box } from "./shared"; export default part => { let { Point, points, Snippet, snippets } = part.shorthand(); - points.anchor = new Point(50, 15); - snippets.demo = new Snippet("logo", points.anchor) - .attr("data-scale", 0.8) - .attr("data-rotate", 180); + points.anchor = new Point(35, 35); + snippets.demo = new Snippet("logo", points.anchor).attr( + "style", + "color: #f006" + ); - snippets.clone = snippets.demo.clone().attr("data-rotate", 90, true); + snippets.clone = snippets.demo.clone().attr("data-scale", 0.5); return box(part); }; diff --git a/packages/examples/src/utils_beamintersectscircle.js b/packages/examples/src/utils_beamintersectscircle.js index 33143051676..1e6a5f58fdb 100644 --- a/packages/examples/src/utils_beamintersectscircle.js +++ b/packages/examples/src/utils_beamintersectscircle.js @@ -1,3 +1,5 @@ +import { box } from "./shared"; + export default part => { let { Point, @@ -9,15 +11,15 @@ export default part => { utils } = part.shorthand(); - points.A = new Point(45, 45) + points.A = new Point(95, 45) .attr("data-circle", 35) .attr("data-circle-class", "fabric"); - points.B = new Point(5, 50); - points.C = new Point(25, 30); - points.D = new Point(5, 65); - points.E = new Point(65, 5); - points.F = new Point(15, 75); - points.G = new Point(75, 15); + points.B = new Point(55, 50); + points.C = new Point(75, 30); + points.D = new Point(55, 65); + points.E = new Point(115, 5); + points.F = new Point(65, 75); + points.G = new Point(125, 15); paths.line1 = new Path().move(points.B).line(points.C); paths.line2 = new Path().move(points.D).line(points.E); @@ -44,11 +46,11 @@ export default part => { ); snippets.first1 = new Snippet("bnotch", intersections1[0]); - snippets.second1 = new Snippet("x", intersections1[1]); + snippets.second1 = new Snippet("notch", intersections1[1]); snippets.first2 = new Snippet("bnotch", intersections2[0]); - snippets.second2 = new Snippet("x", intersections2[1]); + snippets.second2 = new Snippet("notch", intersections2[1]); snippets.first3 = new Snippet("bnotch", intersections3[0]); - snippets.second3 = new Snippet("x", intersections3[1]); + snippets.second3 = new Snippet("notch", intersections3[1]); - return part; + return box(part, 200, 80); }; diff --git a/packages/examples/src/utils_beamintersectsx.js b/packages/examples/src/utils_beamintersectsx.js index 8477d97799c..f1dc60300a9 100644 --- a/packages/examples/src/utils_beamintersectsx.js +++ b/packages/examples/src/utils_beamintersectsx.js @@ -10,15 +10,18 @@ export default part => { } = part.shorthand(); points.A = new Point(10, 10); - points.B = new Point(50, 40); + points.B = new Point(90, 30); paths.AB = new Path().move(points.A).line(points.B); - snippets.X = new Snippet("x", utils.beamIntersectsX(points.A, points.B, 40)); + snippets.x = new Snippet( + "notch", + utils.beamIntersectsX(points.A, points.B, 40) + ); paths.help = new Path() - .move(new Point(40, 0)) - .line(new Point(40, 50)) + .move(new Point(40, 5)) + .line(new Point(40, 35)) .attr("class", "note dashed"); return part; diff --git a/packages/examples/src/utils_beamintersectsy.js b/packages/examples/src/utils_beamintersectsy.js index 1cf00072755..5f54a76b3e5 100644 --- a/packages/examples/src/utils_beamintersectsy.js +++ b/packages/examples/src/utils_beamintersectsy.js @@ -14,7 +14,10 @@ export default part => { paths.AB = new Path().move(points.A).line(points.B); - snippets.X = new Snippet("x", utils.beamIntersectsY(points.A, points.B, 30)); + snippets.x = new Snippet( + "notch", + utils.beamIntersectsY(points.A, points.B, 30) + ); paths.help = new Path() .move(new Point(0, 30)) diff --git a/packages/examples/src/utils_beamsintersect.js b/packages/examples/src/utils_beamsintersect.js index b484c0354a0..82c6f5fd868 100644 --- a/packages/examples/src/utils_beamsintersect.js +++ b/packages/examples/src/utils_beamsintersect.js @@ -17,8 +17,8 @@ export default part => { paths.AB = new Path().move(points.A).line(points.B); paths.CD = new Path().move(points.C).line(points.D); - snippets.X = new Snippet( - "x", + snippets.x = new Snippet( + "notch", utils.beamsIntersect(points.A, points.B, points.C, points.D) ); diff --git a/packages/examples/src/utils_circlesintersect.js b/packages/examples/src/utils_circlesintersect.js index 7166a860897..5a0cb960428 100644 --- a/packages/examples/src/utils_circlesintersect.js +++ b/packages/examples/src/utils_circlesintersect.js @@ -29,9 +29,9 @@ export default part => { ); snippets.first1 = new Snippet("bnotch", intersections1[0]); - snippets.second1 = new Snippet("x", intersections1[1]); + snippets.second1 = new Snippet("notch", intersections1[1]); snippets.first2 = new Snippet("bnotch", intersections2[0]); - snippets.second2 = new Snippet("x", intersections2[1]); + snippets.second2 = new Snippet("notch", intersections2[1]); return part; }; diff --git a/packages/examples/src/utils_curvesintersect.js b/packages/examples/src/utils_curvesintersect.js index ff7e1cef139..49006bc4083 100644 --- a/packages/examples/src/utils_curvesintersect.js +++ b/packages/examples/src/utils_curvesintersect.js @@ -35,7 +35,7 @@ export default part => { points.Dcp, points.D )) { - snippets[part.getId()] = new Snippet("x", p); + snippets[part.getId()] = new Snippet("notch", p); } return part; diff --git a/packages/examples/src/utils_lineintersectscircle.js b/packages/examples/src/utils_lineintersectscircle.js index e21a79a0476..ee0f946e369 100644 --- a/packages/examples/src/utils_lineintersectscircle.js +++ b/packages/examples/src/utils_lineintersectscircle.js @@ -1,3 +1,5 @@ +import { box } from "./shared"; + export default part => { let { Point, @@ -9,16 +11,16 @@ export default part => { utils } = part.shorthand(); - points.A = new Point(45, 45) + points.A = new Point(95, 45) .attr("data-circle", 35) .attr("data-circle-class", "fabric"); - points.B = new Point(5, 50); - points.C = new Point(25, 30); + points.B = new Point(55, 50); + points.C = new Point(75, 30); - points.D = new Point(5, 65); - points.E = new Point(65, 5); - points.F = new Point(15, 75); - points.G = new Point(75, 15); + points.D = new Point(55, 65); + points.E = new Point(115, 5); + points.F = new Point(65, 75); + points.G = new Point(125, 15); paths.line1 = new Path().move(points.B).line(points.C); paths.line2 = new Path().move(points.D).line(points.E); @@ -45,9 +47,9 @@ export default part => { ); snippets.first1 = new Snippet("bnotch", intersections1[0]); snippets.first2 = new Snippet("bnotch", intersections2[0]); - snippets.second2 = new Snippet("x", intersections2[1]); + snippets.second2 = new Snippet("notch", intersections2[1]); snippets.first3 = new Snippet("bnotch", intersections3[0]); - snippets.second3 = new Snippet("x", intersections3[1]); + snippets.second3 = new Snippet("notch", intersections3[1]); - return part; + return box(part, 200, 80); }; diff --git a/packages/examples/src/utils_lineintersectscurve.js b/packages/examples/src/utils_lineintersectscurve.js index 2b3e1d754c1..9bcfc80c6f3 100644 --- a/packages/examples/src/utils_lineintersectscurve.js +++ b/packages/examples/src/utils_lineintersectscurve.js @@ -28,7 +28,7 @@ export default part => { points.Bcp, points.B )) { - snippets[part.getId()] = new Snippet("x", p); + snippets[part.getId()] = new Snippet("notch", p); } return part; diff --git a/packages/examples/src/utils_linesintersect.js b/packages/examples/src/utils_linesintersect.js index 219b89c7518..7211213cf4d 100644 --- a/packages/examples/src/utils_linesintersect.js +++ b/packages/examples/src/utils_linesintersect.js @@ -18,7 +18,7 @@ export default part => { paths.CD = new Path().move(points.C).line(points.D); snippets.X = new Snippet( - "x", + "notch", utils.linesIntersect(points.A, points.B, points.C, points.D) ); diff --git a/packages/examples/src/utils_pointonbeam.js b/packages/examples/src/utils_pointonbeam.js index b1aa9135360..c2d86ff872b 100644 --- a/packages/examples/src/utils_pointonbeam.js +++ b/packages/examples/src/utils_pointonbeam.js @@ -19,17 +19,17 @@ export default part => { let scatter = []; for (let i = 1; i < 36; i++) { for (let j = 1; j < 27; j++) { - scatter.push(new Point(i * 5, j * 5)); + scatter.push(new Point(i * 10, j * 10)); } } let snippet; for (let point of scatter) { if (utils.pointOnBeam(points.from1, points.to1, point)) snippet = "notch"; - else snippet = "x"; + else snippet = "bnotch"; snippets[part.getId()] = new Snippet(snippet, point); if (utils.pointOnBeam(points.from2, points.to2, point, 0.01)) { snippet = "notch"; - } else snippet = "x"; + } else snippet = "bnotch"; snippets[part.getId()] = new Snippet(snippet, point); } paths.line1 = new Path() diff --git a/packages/examples/src/utils_pointoncurve.js b/packages/examples/src/utils_pointoncurve.js index 7fdf6e2a2bd..a8afaf31fbf 100644 --- a/packages/examples/src/utils_pointoncurve.js +++ b/packages/examples/src/utils_pointoncurve.js @@ -17,7 +17,7 @@ export default part => { let scatter = []; for (let i = 1; i < 19; i++) { for (let j = 1; j < 14; j++) { - scatter.push(new Point(i * 5, j * 5)); + scatter.push(new Point(i * 10, j * 10)); } } let snippet; @@ -32,7 +32,7 @@ export default part => { ) ) { snippet = "notch"; - } else snippet = "x"; + } else snippet = "bnotch"; snippets[part.getId()] = new Snippet(snippet, point); } paths.curve = new Path() diff --git a/packages/examples/src/utils_pointonline.js b/packages/examples/src/utils_pointonline.js index 0df7fda740e..f24e7fc1178 100644 --- a/packages/examples/src/utils_pointonline.js +++ b/packages/examples/src/utils_pointonline.js @@ -19,17 +19,17 @@ export default part => { let scatter = []; for (let i = 1; i < 36; i++) { for (let j = 1; j < 27; j++) { - scatter.push(new Point(i * 5, j * 5)); + scatter.push(new Point(i * 10, j * 10)); } } let snippet; for (let point of scatter) { if (utils.pointOnLine(points.from1, points.to1, point)) snippet = "notch"; - else snippet = "x"; + else snippet = "bnotch"; snippets[part.getId()] = new Snippet(snippet, point); if (utils.pointOnLine(points.from2, points.to2, point, 0.01)) { snippet = "notch"; - } else snippet = "x"; + } else snippet = "bnotch"; snippets[part.getId()] = new Snippet(snippet, point); } paths.line1 = new Path()