mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-11-13 15:51:00 +00:00
Maurice
ce9c94a77b
- Fifty more shapes: arches, paper cut-outs (leaves, coral, weed, organic circles, a wonky star and sun), stamps, a postmark, a rosette, tags and ticket stubs, sunbursts, ribbons and bands, speech bubbles, drawn arrows, hearts, stars, photo frames and ornaments (scroll, laurel, fleuron, corner). The broad ones are photo frames too, and each tile is drawn at its shape's own proportions, which a new shape is also placed at. - A cut edge on rectangles, circles, arches and the other broad shapes, painted or not, and on a photo's cut: zigzag, scallop, a postage stamp's perforation, wavy, torn and deckle, with a depth in millimetres. Cut in millimetres, so holes stay round on a wide frame. - A line element: two to 32 points dragged on the canvas (a handle pulled from the middle adds one, a double-click removes it), straight or curved, solid, dashed or dotted, a wave or a zigzag, a hand-drawn wobble, a head on either end and an ornament in the middle. A shelf of lines and dividers places them. - The assistant reaches all of it: add and style take the line (its points on the spread in mm) and the edges, describe_book_page says them, and two new findings say when a line is too thin to print and when an edge is set on a shape that takes none. A photo's mask is checked against the shape set rather than listed again, which keeps the page edit's schema smaller. - BOOK_SCHEMA_REV goes to 6.
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import type { BookLineElement } from '@trek/shared';
|
|
|
|
/**
|
|
* The lines and dividers the Elements panel offers, as looks for a new line,
|
|
* and the points each is placed with.
|
|
*/
|
|
|
|
type Look = Partial<Omit<BookLineElement, 'id' | 'kind' | 'frame' | 'points'>>;
|
|
|
|
export interface LinePreset {
|
|
id: string;
|
|
look: Look;
|
|
/** A curve through three points rather than a straight rule. */
|
|
bend?: boolean;
|
|
}
|
|
|
|
export const LINE_PRESETS: readonly LinePreset[] = [
|
|
{ id: 'straight', look: {} },
|
|
{ id: 'arrow', look: { endCap: 'arrow' } },
|
|
{ id: 'double', look: { startCap: 'arrow', endCap: 'arrow' } },
|
|
{ id: 'dashed', look: { dash: 'dashed' } },
|
|
{ id: 'dotted', look: { dash: 'dotted', strokeWidth: 0.8 } },
|
|
{ id: 'curved', look: { curve: 'smooth', endCap: 'arrow' }, bend: true },
|
|
{ id: 'wave', look: { squiggle: 'wave' } },
|
|
{ id: 'zigzag', look: { squiggle: 'zigzag' } },
|
|
{ id: 'hand', look: { wobble: 0.8, endCap: 'open', strokeWidth: 0.7 } },
|
|
{
|
|
id: 'route',
|
|
look: { dash: 'dotted', strokeWidth: 0.9, curve: 'smooth', startCap: 'dot', endCap: 'arrow' },
|
|
bend: true,
|
|
},
|
|
];
|
|
|
|
export const DIVIDER_PRESETS: readonly LinePreset[] = (['diamond', 'sun', 'star', 'heart', 'dot'] as const).map(
|
|
(o) => ({
|
|
id: `divider-${o}`,
|
|
look: { ornament: o, strokeWidth: 0.3 },
|
|
})
|
|
);
|
|
|
|
/** The points a preset is placed with, in a box `w` wide around a middle line. */
|
|
export function presetPoints(p: LinePreset, x: number, y: number, w: number): { x: number; y: number }[] {
|
|
if (!p.bend) {
|
|
return [
|
|
{ x, y },
|
|
{ x: x + w, y },
|
|
];
|
|
}
|
|
const rise = w * 0.18;
|
|
return [
|
|
{ x, y: y + rise },
|
|
{ x: x + w * 0.5, y: y - rise },
|
|
{ x: x + w, y: y + rise },
|
|
];
|
|
}
|