2b:null 2c:["$","title",null,{"children":"The Art of Weaving | Michaël Guitton | Observable"}] 31:Tdc6,Diagram = ({ borderWidth = 1, tileSize = 26, yarnWidth = 16, margin = 20, scaleFactor = 1, backgroundColor = "#f6f6f6", borderColor = "#444", warpColor = "hsl(200, 100%, 70%)", weftColor = "hsl(320, 100%, 70%)", ends = 14, picks = 7 } = {}) => { borderWidth *= scaleFactor; tileSize = Math.max( tileSize * scaleFactor, 16 * scaleFactor + borderWidth * 2 ); yarnWidth = Math.max( 16 * scaleFactor, Math.min(yarnWidth * scaleFactor, tileSize - borderWidth * 2) ); margin *= scaleFactor; function render({ hasLegend = false, pattern = () => {} } = {}) { let extent = 0.8; let offset = { top: margin + tileSize * 2.5, bottom: margin + tileSize / 2, right: margin + Math.ceil(tileSize * (hasLegend ? 5 : extent)), left: margin + tileSize * 3 }; let width = ends * tileSize + offset.left + offset.right; let height = picks * tileSize + offset.top + offset.bottom; let ctx = DOM.context2d(width, height); ctx.fillStyle = backgroundColor; ctx.fillRect(0, 0, width, height); let fabric = Fabric(ctx, ends, picks, { left: offset.left, top: offset.top, tileSize, yarnWidth, borderWidth, borderColor, warpColor, weftColor, pattern }); fabric.drawPattern(true); for (let i = 0; i < ends; i++) { // extend warp threads on the top fabric.drawWarp( offset.left + i * tileSize, margin, warpColor, (offset.top - margin) / tileSize ); // extend warp threads on the bottom fabric.drawWarp( offset.left + i * tileSize, offset.top + picks * tileSize, warpColor, (offset.bottom - margin) / tileSize ); } // extend weft thread on the top left fabric.drawWeft( margin, offset.top, weftColor, (offset.left - margin - (tileSize + yarnWidth + borderWidth * 2) / 2) / tileSize ); // label warp/weft let fontSize = tileSize / 2; ctx.fillStyle = "black"; ctx.font = `${fontSize}px sans-serif`; ctx.textBaseline = "middle"; ctx.fillText("weft", 2 * margin, offset.top + tileSize / 2); ctx.save(); ctx.rotate(-Math.PI / 2); ctx.textAlign = "end"; ctx.fillText( "warp", -2 * margin, offset.left + tileSize / 2 - fontSize * 0.12 ); ctx.restore(); if (hasLegend) { let gap = 5 * scaleFactor; let X = offset.left + Math.ceil((ends + extent) * tileSize) + margin + gap; let Y = 1.5 * tileSize; ctx.strokeStyle = "white"; ctx.lineWidth = gap; ctx.beginPath(); ctx.moveTo(X - gap / 2, 0); ctx.lineTo(X - gap / 2, height); ctx.moveTo(X - gap / 2, height / 2); ctx.lineTo(width, height / 2); ctx.stroke(); for ( let lift = -1, left = X + (width - X - tileSize) / 2, top = tileSize * 2.25; lift++ < 1; top += (height + gap) / 2 ) { fabric.drawInterlacement( left, top, warpColor, weftColor, 1 - lift, 1.25 ); } // label legend X += (width - X) / 2; ctx.fillStyle = "black"; ctx.textAlign = "center"; ctx.textBaseline = "alphabetic"; ctx.fillText("warp-facing", X, Y); ctx.fillText("weft-facing", X, Y + (height + gap) / 2); } return ctx.canvas; } return Object.freeze({ render }); }32:T1449,Fabric = ( /* canvas */ context, /* how many warp yarns? */ ends, /* how many weft yarns? */ picks, { tileSize = 26, borderColor = "#333", borderWidth = 1, yarnWidth = 16, warpColor = "hsl(216, 70%, 80%)", weftColor = "hsl(216, 70%, 70%)", pattern = null, left = 0, top = 0 } = {} ) => { const HALF_PI = Math.PI / 2; borderWidth = Math.max( 0, Math.min(borderWidth, Math.floor(tileSize / 2) - 1) ); yarnWidth = Math.max(2, Math.min(yarnWidth, tileSize - borderWidth * 2)); if ("function" !== typeof pattern || 2 !== pattern.length) { pattern = /* plain weave */ (width, length) => Array.from({ length }, (_, i) => Array.from({ length: width }, (_, j) => !((j & 1) ^ (i & 1))) ); } function drawPattern(drawWeftCurls = false) { let curlOnLeft = false; let drawdown = pattern(ends, picks); for (let pick = 0; pick < picks; pick++) { for (let end = 0; end < ends; end++) { // when drawdown[pick][end] is true, yarn interlacing is warp-facing drawInterlacement( left + end * tileSize, top + pick * tileSize, warpColor, weftColor, drawdown[pick][end] ); } if (drawWeftCurls && pick < picks - 1) { // link picks together drawWeftCurl( curlOnLeft ? left : left + ends * tileSize, top + pick * tileSize, weftColor, curlOnLeft ); curlOnLeft = !curlOnLeft; } } if (drawWeftCurls) { // draw "stubs" to make the top/bottom picks look as wide as the curled wefts let stubSize = borderWidth + (tileSize + yarnWidth) / 2; // top pick drawWeft(left - stubSize, top, weftColor, stubSize / tileSize); // bottom pick drawWeft( (picks & 1) === 0 ? left - stubSize : left + ends * tileSize, top + (picks - 1) * tileSize, weftColor, stubSize / tileSize ); } return drawdown; } function drawInterlacement( x, y, warpColor, weftColor, isWarpFacing = true, length = 1 ) { // when length ≠ 1, extend/shrink all arms of the yarn by the appropriate percentage (length × 100%) let offset = (1 - length) * tileSize; let interlacement = [{ draw: drawWarp, args: [x, y + offset, warpColor] }]; interlacement[isWarpFacing ? "unshift" : "push"]({ draw: drawWeft, args: [x + offset, y, weftColor] }); length = 1 + (length - 1) * 2; for (let yarn of interlacement) { yarn.args.push(length) && yarn.draw.apply(null, yarn.args); } } function drawWarp( x, y, yarnColor, /* percent of to draw */ length = 1 ) { context.fillStyle = yarnColor; context.fillRect( x + (tileSize - yarnWidth) / 2, y, yarnWidth, tileSize * length ); context.fillStyle = borderColor; context.fillRect( x + (tileSize - yarnWidth) / 2 - borderWidth, y, borderWidth, tileSize * length ); context.fillRect( x + (tileSize + yarnWidth) / 2, y, borderWidth, tileSize * length ); } function drawWeft( x, y, yarnColor, /* percent of to draw */ length = 1 ) { context.fillStyle = yarnColor; context.fillRect( x, y + (tileSize - yarnWidth) / 2, tileSize * length, yarnWidth ); context.fillStyle = borderColor; context.fillRect( x, y + (tileSize - yarnWidth) / 2 - borderWidth, tileSize * length, borderWidth ); context.fillRect( x, y + (tileSize + yarnWidth) / 2, tileSize * length, borderWidth ); } function drawWeftCurl( x, y, yarnColor, /* draw to the left of x, with loose ends on the right */ drawToLeft = true /* or draw to the right of x, with loose ends on the left */ ) { context.fillStyle = yarnColor; context.beginPath(); context.arc( x, y + tileSize, (tileSize + yarnWidth) / 2, HALF_PI, 3 * HALF_PI, !drawToLeft ); context.arc( x, y + tileSize, (tileSize - yarnWidth) / 2, 3 * HALF_PI, HALF_PI, drawToLeft ); context.closePath(); context.fill(); context.fillStyle = borderColor; context.beginPath(); // outer border context.arc( x, y + tileSize, (tileSize + yarnWidth) / 2, HALF_PI, 3 * HALF_PI, !drawToLeft ); context.arc( x, y + tileSize, (tileSize + yarnWidth) / 2 + borderWidth, 3 * HALF_PI, HALF_PI, drawToLeft ); // inner border context.arc( x, y + tileSize, (tileSize - yarnWidth) / 2, HALF_PI, 3 * HALF_PI, !drawToLeft ); context.arc( x, y + tileSize, (tileSize - yarnWidth) / 2 - borderWidth, 3 * HALF_PI, HALF_PI, drawToLeft ); context.closePath(); context.fill(); } return Object.freeze({ drawInterlacement, drawPattern, drawWarp, drawWeft }); }33:T1041,Grid = ( data, { /* canvas */ context, /* offset */ left = 0, top = 0 } = {} ) => { if (void 0 === data) { throw "Grid is not defined"; } if ( !Array.isArray(data) || !data.length || !Array.isArray(data[0]) || !data[0].length ) { throw "Grid is empty or is not in the expected format"; } function render({ /* dimensions */ innerThickness = 1, outerThickness = 2, tileSize = 26, /* colors */ off = "white", on = "darkgrey", stroke = "#000", /* crosshatching? */ crosshatching = 0 } = {}) { if (null == context) { left = top = 0; } innerThickness = Math.max(innerThickness, 0); outerThickness = Math.max(outerThickness, 0); tileSize = Math.max(tileSize, 12); const cols = data[0].length; const rows = data.length; let hasStroke = ![null, "none"].includes(stroke); if (!hasStroke) { outerThickness = 0; } crosshatching = +crosshatching ? ((size = tileSize - 1, swatch = [off, hasStroke ? stroke : on]) => { let tile = DOM.context2d(size, size); for (let i = 0, thickness = 2; i < size; i++) { let delta = i * thickness + thickness / 2 + 0.5; tile.lineWidth = thickness; tile.lineCap = "square"; tile.strokeStyle = swatch[i & 1]; tile.beginPath(); if (crosshatching > 0) { /* line through bottom left to top right corners */ tile.moveTo(0, delta); tile.lineTo(size, delta - size); } else { /* line through top left to bottom right corners */ tile.moveTo(delta - size, 0); tile.lineTo(delta, size); } tile.stroke(); } return { pattern: tile.canvas, extent: tile.canvas.width / window.devicePixelRatio }; })() : false; let toggle = [off, on]; let width = 0; let height = 0; let delta = 0; if (crosshatching) { width = height = 1; delta = tileSize - crosshatching.extent; if (outerThickness > 0) { outerThickness--; } } width += outerThickness * 2 + cols * tileSize; height += outerThickness * 2 + rows * tileSize; let ctx = context || DOM.context2d(width, height); if (hasStroke) { ctx.strokeStyle = ctx.fillStyle = stroke; ctx.beginPath(); if (innerThickness > 0) { ctx.lineWidth = innerThickness; } if (outerThickness > 0) { ctx.fillRect(left, top, width, height); } } else { ctx.fillStyle = on; } if (crosshatching) { ctx.fillRect(left, top, width, height); } for ( let row = 0, skip = !!crosshatching || !hasStroke || innerThickness <= 0, L = left + outerThickness, T = top + outerThickness; row < rows; ) { let y = T + row * tileSize; for (let col = 0; col < cols; ) { let x = L + col * tileSize; let hue = toggle[clamp(data[row][col])]; ctx.fillStyle = !crosshatching ? hue : hasStroke ? stroke : on; ctx.fillRect(x, y, tileSize, tileSize); if (crosshatching) { if (hue === on) { ctx.drawImage( crosshatching.pattern, x + delta, y + delta, crosshatching.extent, crosshatching.extent ); } else { ctx.fillStyle = hue; ctx.fillRect( x + delta, y + delta, crosshatching.extent, crosshatching.extent ); } } if (++col === cols || skip) continue; x = L + col * tileSize; ctx.moveTo(x, T); ctx.lineTo(x, T + rows * tileSize); } if (++row === rows || skip) continue; y = T + row * tileSize; ctx.moveTo(L, y); ctx.lineTo(L + cols * tileSize, y); } if (hasStroke) { ctx.closePath(); ctx.stroke(); } return ctx.canvas; } return Object.freeze({ render }); }34:[] 2f:{"id":"1c5fd3574b255c80","slug":"the-art-of-weaving","title":"The Art of Weaving","thumbnail":"f1639b98325363026b3ded385549e9b5f98725f065c4a21e1a1f83c5d794fc85","access_level":"public","create_time":"$D2023-02-17T14:00:01.384Z","update_time":"$D2023-09-13T13:00:02.068Z","view_time":null,"first_public_time":"$D2023-02-17T14:00:01.384Z","fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"4c1622bb5c37477f","login":"galopin","name":"Michaël Guitton","avatar_url":"https://avatars-next.observableusercontent.com/10e2fe999ac95c8686156fd07e96a686520149a4eef18a95f97795b7a7be1e29","tier":"starter_2024"},"version":149,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"950eb34948878085","login":"galopin","name":"Michaël Guitton","avatar_url":"https://avatars-next.observableusercontent.com/b59822ff41962e9448473fadd4a11819ac725b074ad3868aabf532bade0ac00d","tier":null}],"members":[{"type":"individual","id":"950eb34948878085","login":"galopin","name":"Michaël Guitton","avatar_url":"https://avatars-next.observableusercontent.com/b59822ff41962e9448473fadd4a11819ac725b074ad3868aabf532bade0ac00d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"The Art of Weaving","cells":[{"id":0,"value":"# The Art of Weaving","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":28,"value":"{\n let tileSize = 26;\n let ends = Math.floor(640 / tileSize);\n let picks = 12;\n\n let offset = { top: 0, right: 0, bottom: 0, left: 0 };\n let width = ends * tileSize + offset.left + offset.right;\n let height = picks * tileSize + offset.top + offset.bottom;\n\n let ctx = DOM.context2d(width, height);\n\n ctx.fillStyle = \"white\";\n ctx.fillRect(0, 0, width, height);\n\n mutable drawdown = Fabric(ctx, ends, picks, {\n tileSize,\n left: offset.left,\n top: offset.top,\n warpColor: \"hsl(270, 70%, 80%)\",\n weftColor: \"hsl(270, 70%, 70%)\",\n pattern: weavingType.generator\n }).drawPattern();\n\n return ctx.canvas;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"This very notebook would not exist without the preliminary and seminal work of [Lauren Nishizaki](/@lemonnish). Upon stumbling on her [blog post](https://www.laurennishizaki.com/projects/2019/01/weaving-draft-software/), I was literally enthralled and saw an opportunity to refactor the initial code snippets into factory functions (aka hard objects).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":46,"value":"Weaving is one of the most ancient and widespread crafts in the world: It is a method of textile production in which two distinct sets of yarns or threads are interlaced at right angles to form a fabric or cloth. Other notable methods are knitting and crocheting…","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":85,"value":"Incidentally, this made me think of my dear mama.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":48,"value":"> Hospitalized about 2 years ago for a urinary tract infection, Mom contracted COVID-19 and died at the age of 86 in her room in complete isolation. When I was informed by phone of her passing, I cried my eyes out: I was smashed and totally devastated. My grief and dismay at not being able to say goodbye to her was immense.\n>\n> Mom had a passion beyond reason for cats, was an excellent cook, and had developed an incomparable talent for knitting and crocheting. Sadly, she did not pass on her amazing know-how and skills. Her favorite color was purple.\n>\n> Today, it is as if time has stopped. Mom, I love you and miss you so, so much.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":50,"value":"So here am I standing on the shoulders of giants: I hope my contribution will be useful for anyone interested in weaving.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"viewof zoom = Inputs.toggle({ label: \"Zoom in\", value: false })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"viewof hasLegend = Inputs.toggle({ label: \"Show legend\", value: false })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"viewof weavingType = Inputs.radio(patterns, {\n label: \"Weaving type\",\n value: patterns[0],\n format: ($_) => $_.type\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"

\n${graphic}\n

${weavingType.type.charAt(0).toUpperCase() + weavingType.type.slice(1)} weave

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":41,"value":"DOM.download(\n await convertToBlob(graphic),\n [weavingType.type, \"-weaving-diagram\", hasLegend ? \"-with-legend\" : \"\"].join(\n \"\"\n ) + \".png\",\n \"Download diagram as PNG\"\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"A woven piece of fabric is the result of interlacing the yarns that are placed in the direction of the fabric length (warp) by yarns that follow the direction of the fabric width (weft). Each interlacement of warp and weft yarns can be characterized as either warp-facing or weft-facing, depending on which lies on top.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":107,"value":"The most widely used system of notation for describing the interlacement of yarns is the drawdown grid, a diagram where every column represents one warp end, every row represents one weft pick and every square shows one point of interlacement between warp and weft.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":131,"value":"viewof crosshatching = Inputs.toggle({ label: \"Cross-hatch?\", value: false })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"

\n${Grid(drawdown).render({ crosshatching, on: \"darkorchid\", off: \"orchid\", stroke: \"indigo\" })}\n

Drawdown grid

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":111,"value":"Typically, the black/dark-colored squares indicate intersections where warp yarns are on top and the white/light-colored squares where weft yarns are on top.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":113,"value":"Such a drawdown is designed to make it easy for a person to see the interlacement (and any patterns that may exist).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":115,"value":"For a computer program, a drawdown is a rectangular array of boolean values.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":117,"value":"There are two distinct processes involved in analyzing the structure of a woven fabric:\n\n1. determining the interlacement of the warp and weft yarns\n2. producing a draft from the interlacement","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":119,"value":"The number of shafts required is the number of _distinct_ column patterns.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":121,"value":"The number of treadles required is the number of _distinct_ row patterns.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":123,"value":"With a large/intricate drawdown, it can be difficult for a human to determine the various column and row patterns. This is where a computer program can be of tremendous help.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"Grid(weave).render({ crosshatching })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"weave = Weave.from(drawdown)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"Grid(reverse).render({ crosshatching })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"reverse = (($) => $.reverse($.from(drawdown)))(Weave)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":62,"value":"mutable drawdown = []","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"graphic = diagram.render({\n hasLegend,\n pattern: weavingType.generator\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"diagram = Diagram({\n warpColor: \"hsl(270, 70%, 80%)\",\n weftColor: \"hsl(270, 70%, 70%)\",\n scaleFactor: 1 + zoom\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"patterns = [\n { type: \"plain\", generator: /* dummy */ () => {} },\n {\n type: \"twill\",\n generator: (width, length) =>\n Array.from({ length }, (_, i) =>\n Array.from({ length: width }, (_, j) => !((i + j) % 3 == 2 ? 1 : 0))\n )\n },\n {\n type: \"1/3 twill\",\n generator: (width, length) =>\n Array.from({ length }, (_, i) =>\n Array.from({ length: width }, (_, j) => !((i + j) % 4 == 3 ? 1 : 0))\n )\n },\n {\n type: \"2/2 twill\",\n generator: (width, length) =>\n Array.from({ length }, (_, i) =>\n Array.from({ length: width }, (_, j) =>\n j % 4 == i % 4 || j % 4 == (i + 1) % 4 ? 1 - (i & 1) : i & 1\n )\n )\n }\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"$32","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"Weave = {\n yield ((instance) => Object.freeze(Object.assign(() => instance, instance)))(\n Object.freeze({\n from(grid) {\n return Array.from(\n new Set(\n grid.map(\n (x) =>\n x\n .map((x) => +x)\n .join(\"\")\n .match(/^(.+?)\\1*$/)[1]\n )\n ),\n (x) => x.split(\"\").map((x) => +x)\n );\n },\n reverse(grid) {\n return grid.map((x) => x.map((x) => x ^ 1));\n }\n })\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"clamp = (x) =>\n /* return 0 if scalar value is undefined, null, NaN, false, or 0; 1 otherwise */\n Math.ceil(Math.abs(1 / (1 + Math.exp(-(+x || 0))) - 0.5))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"function convertToBlob(canvas) {\n return new Promise((resolve) => canvas.toBlob(resolve));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 30:"$2f:body"