UNPKG

5.04 kBJavaScriptView Raw
1
2const { style, fsw } = require('@sutton-signwriting/core');
3const { signSvgBody } = require('./fsw-sign-svg');
4const { symbolSvgBody } = require('./fsw-symbol-svg');
5const fs = require('fs');
6
7/**
8 * Function that creates an SVG image for a column of FSW
9 * @function fsw.columnSvg
10 * @param {ColumnData} fswColumn - an array of objects with information about FSW signs and punctuation
11 * @param {ColumnOptions} options - an object of column options
12 * @returns {string} column svg
13 * @example
14 * const columnData = [
15 * {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"AS14c20S27106M518x529S14c20481x471S27106503x489","zoom":1},
16 * {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468","zoom":1},
17 * {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"S38800464x496","zoom":1}
18 * ];
19 * const columnOptions = {"height": 250, "width": 150};
20 * @example
21 * // using promise.then
22 * fsw.columnSvg(columnData, columnOptions).then( svg => {
23 * console.log(svg)
24 * })
25 * @example
26 * // using async/await
27 * const svg = await fsw.columnSvg(columnData, columnOptions)
28 */
29const columnSvg = async (fswColumn, options) => {
30 const blank = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="1" height="1"></svg>';
31 //if (typeof fswColumn !== 'array') return blank;
32 const values = fsw.columnDefaultsMerge(options);
33 let x1 = 0;
34 let y1 = 0;
35 let x2 = values.width;
36 let y2 = values.height;
37
38 let background = '';
39 if (values.background) {
40 background = ` <rect x="${x1}" y="${y1}" width="${x2 - x1}" height="${y2 - y1}" style="fill:${values.background};" />\n`
41 }
42
43 let sizing = ` width="${values.width}" height="${values.height}"`;
44
45 let svg = `<svg version="1.1" xmlns="http://www.w3.org/2000/svg"${sizing} viewBox="${x1} ${y1} ${(x2 - x1)} ${(y2 - y1)}">
46${background}`
47
48 for (let i=0; i<fswColumn.length; i++){
49 item = fswColumn[i];
50 const dash = item.text.indexOf('-')
51 if (dash>0) {
52 const itemStyle = item.text.substring(dash);
53 const newStyle = {
54 ...values.style,
55 ...parseStyle(itemStyle)
56 };
57 item.text = item.text.replace(itemStyle,style.compose(newStyle));
58 } else {
59 item.text += style.compose(values.style);
60 }
61 item.zoom = item.zoom * values.style.zoom;
62
63 svg += '<g transform="translate(' + (item.x) + ',' + (item.y) + ') scale(' + item.zoom + ') translate(' + (-item.minX) + ',' + (-item.minY) + ') ">\n';
64 if (item.segment=="sign"){
65 svg += await signSvgBody(item.text)
66 } else {
67 svg += await symbolSvgBody(item.text)
68 }
69 svg += '\n</g>\n';
70 }
71
72 svg += '</svg>';
73
74 return svg;
75}
76
77const parseArg = (val) => {
78 try {
79 return JSON.parse(val)
80 } catch {
81 return undefined
82 }
83}
84
85const helpArgs = () => {
86 console.log("FSW Column SVG\n")
87 console.log("Usage: node fsw/fsw-column-svg.js ColumnData [OutputFile] [Arguments]\n");
88 console.log("ColumnData");
89 console.log(" https://www.sutton-signwriting.io/core/#columndata\n");
90 console.log("StyleObject");
91 console.log(" https://www.sutton-signwriting.io/core/#styleobject\n");
92 console.log("Arguments for ColumnOptions used to create ColumnData");
93 console.log("--height the height of the column");
94 console.log("--width the width of the column");
95 console.log("--offset the lane offset for left and right lanes");
96 console.log("--pad amount of padding before and after signs as well as at top, left, and right of column");
97 console.log("--margin amount of space at bottom of column that is not available");
98 console.log("--dynamic enables variable width column");
99 console.log("--background background color for column");
100 console.log("--style an object of style options for signs");
101 console.log("--puncuation an object of punctuation options");
102 process.exit(1);
103}
104
105if (require.main === module) {
106 const args = require('minimist')(process.argv.slice(2));
107 const segments = parseArg(args._[0]);
108 const file = args._[1];
109 if (!segments || args.help) helpArgs();
110
111 args.style = parseArg(args["style"]);
112 args.punctuation = parseArg(args["punctuation"]);
113 args.detail = parseArg(args["detail"]);
114
115 args.options = parseArg(args["options"]);
116 args.options = (typeof args.options == 'object')?args.options:{};
117 Object.keys(args).map((key)=>{
118 switch (key) {
119 case '_':
120 case 'options':
121 break;
122 default:
123 args.options[key] = args[key]
124 }
125 })
126 columnSvg(segments,args.options).then( svg => {
127 if (file) {
128 fs.writeFileSync(file, svg);
129 } else {
130 console.log(svg);
131 }
132 })
133} else {
134 module.exports = { columnSvg }
135}