31:T1186,model = { const flipX = (shape) => ({ frame: (controls) => ln.scale(new ln.Vector(-1, 1, 1)), folds: [shape()] }) const repeat = (n, shape, next) => range(n).reduce( (acc, i) => shape(() => acc), next || (() => {}) ) const crenulation = (next) => ({ frame: (u) => ln.rotate(new ln.Vector(0, 1, 0),-u.x3 * toRad) .translate(new ln.Vector(0,1,0)), shape: squaredrectangle(1,1), folds: [{ frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x3 * toRad) .translate(new ln.Vector(0,1,0)), shape: squaredrectangle(1,1), folds: [next()] }] }) const flatSide = () => ({ // inner frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x0 * toRad) .translate(new ln.Vector(2,0,0)), shape: squaredrectangle(2,4), folds: [ { frame: () => ln.translate(new ln.Vector(2,-1,0)), folds: [repeat(2, crenulation)] }, { // Tall outer wall frame: (u) => ln.translate(new ln.Vector(1,0,0)) .rotate(new ln.Vector(0, 1, 0), u.x1 * toRad) .translate(new ln.Vector(3,0,0)), shape: squaredrectangle(5,4), folds: [{ frame: () => ln.rotate(new ln.Vector(0,1,0), 180 * toRad).translate(new ln.Vector(0,-1,0)), folds: [repeat(2, crenulation)] },{ // Foot flap frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x2 * toRad) .translate(new ln.Vector(5,0,0)), shape: squaredrectangle(1,4) }] } ] }) const indentSide = () => ({ // inner frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x4 * toRad) .translate(new ln.Vector(2,0,0)), shape: squaredrectangle(2,4), folds: [{ frame: () => ln.translate(new ln.Vector(2,-1,0)), folds: [repeat(2, crenulation)] }, { // Upper outer wall frame: (u) => ln.translate(new ln.Vector(1,0,0)) .rotate(new ln.Vector(0, 1, 0), u.x5 * toRad) .translate(new ln.Vector(3,0,0)), shape: squaredrectangle(2,4), folds: [{ frame: () => ln.rotate(new ln.Vector(0,1,0), 180 * toRad).translate(new ln.Vector(0,-1,0)), folds: [repeat(2, crenulation)] }, { // Underhang flap frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x6 * toRad) .translate(new ln.Vector(2,0,0)), shape: squaredrectangle(1,4), folds: [{ // Indented lower wall frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x7 * toRad) .translate(new ln.Vector(1,0,0)), shape: squaredrectangle(3,4), folds: [{ // Foot frame: (u) => ln.rotate(new ln.Vector(0, 1, 0), u.x8 * toRad) .translate(new ln.Vector(3,0,0)), shape: squaredrectangle(2,4) }] } ] }] } ] }) const cellFlat = (next) => { let nextValue = undefined; console.log(next) if (next) nextValue = next(); return ({ // Walkway folds: [{ frame: () => ln.translate(new ln.Vector(-2,0,0)), shape: squaredrectangle(4,4) },flatSide(), flipX(flatSide), { frame:() => ln.translate(new ln.Vector(0,4,0)), ...nextValue && {folds: [nextValue]} }] }) } const cellIndent = (next) => { let nextValue = undefined; console.log(next) if (next) nextValue = next(); return ({ // Walkway folds: [{ frame: () => ln.translate(new ln.Vector(-2,0,0)), shape: squaredrectangle(4,4) },indentSide(), flipX(indentSide), { frame:() => ln.translate(new ln.Vector(0,4,0)), ...nextValue && {folds: [nextValue]} }] }) } return ({ frame: (controls) => ln.rotate(new ln.Vector(1, 0, 0), (90) * toRad) .rotate(new ln.Vector(0, 1, 0), (controls.c0) * toRad) .rotate(new ln.Vector(1, 0, 0), (controls.c1 - 29) * toRad) .translate(new ln.Vector(0,0,0)), folds: [repeat( Math.ceil(Math.max(1, Math.abs(controls.n / 10)) ), (next) => cellFlat(() => cellIndent(next)))] }) }32:[{"id":"8e5775721adc56171acfefd49942711e5f3e595690fa73466bbe968b1acab44cdb798dbd113155c74c65bc2877ab0603b72f628145a0b40b79c027a4821ac787","href":"https://static.observableusercontent.com/files/8e5775721adc56171acfefd49942711e5f3e595690fa73466bbe968b1acab44cdb798dbd113155c74c65bc2877ab0603b72f628145a0b40b79c027a4821ac787","name":"IMG_20201216_213753.jpg","type":"image/jpeg","lastModified":1608245431575.203,"size":142099}] 2f:{"title":"Parametric Kirigami: The Castle Wall","cells":[{"id":114,"value":"md`# Parametric Kirigami: The Castle Wall\n\nAs hinted at [last time](https://observablehq.com/@tomlarkworthy/kirigami-turret), we can fold in paper space but also in program space. We use the\n\n~~~js\n flipX(shape)\n repeat(n, shape, next)\n~~~\n\ncombinators to capture symmetry present in our design.\n\n![castle](${await FileAttachment(\"IMG_20201216_213753.jpg\").url()})\n\n`\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":296,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":881,"value":"controls","pinned":false,"hidden":false,"mode":"ojs"},{"id":808,"value":"viewof controls = {\n const labels = [\"c0\", \"c1\", \"x0\", \"x1\", \"x2\", \"x3\", \"x4\", \"x5\", \"x6\", \"x7\", \"x8\", \"n\"]\n return form(html`

\n \n \n ${labels.map(label => html``)}\n \n \n \n \n ${labels.map(label => html``)}\n \n

${label}

`)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":519,"value":"view = {\n return new Promise((resolve) => {\n let eye = new ln.Vector(6,2,40);\n \n let center = new ln.Vector(eye.x, eye.y, 0);\n let up = new ln.Vector(0, 1, 0);\n const height = 500\n let paths = scene.render(eye, center, up, width, height, 35, 0.5, 1000, 0.3)\n \n resolve(html`\n ${ln.toSVG(paths, width, height)}\n `)\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":813,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":123,"value":"scene = {\n // first thing is to create a scene\n const scene = new ln.Scene()\n \n function loadModel(scene, frame, model) {\n const f = model.frame ? frame.mul(model.frame(controls))\n : frame;\n if(model.shape) scene.add(new ln.TransformedShape(model.shape, f));\n (model.folds || []).forEach(fold => {\n loadModel(scene, f, fold);\n })\n }\n \n loadModel(scene, ln.identity(), model);\n\n return scene;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":217,"value":"squaredrectangle = (w, h) => {\n const thickness= 0.01;\n const min = new ln.Vector(0, 0, 0)\n const max = new ln.Vector(w, h, thickness)\n const cube = new ln.Cube(min, max)\n\n cube.insec\n \n // we can specify which paths to render and create new ones:\n cube.paths = function() {\n const paths = []\n const { x: x1, y: y1} = this.min\n const { x: x2, y: y2} = this.max\n for(let i = 0; i <= w; i++) {\n const x = x1 + (x2 - x1) * (i / w);\n paths.push([new ln.Vector(x, 0, thickness), new ln.Vector(x, h, thickness)])\n paths.push([new ln.Vector(x, 0, 0), new ln.Vector(x, h, 0)])\n }\n \n for(let j = 0; j <= h; j++) {\n const y = y1 + (y2 - y1) * (j / h);\n paths.push([new ln.Vector(0, y, thickness), new ln.Vector(w, y, thickness)])\n paths.push([new ln.Vector(0, y, 0), new ln.Vector(w, y, 0)])\n }\n return paths\n }\n return cube;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":647,"value":"range = (n) => [...Array(n).keys()];","pinned":false,"hidden":false,"mode":"ojs"},{"id":378,"value":"toRad = Math.PI / 180","pinned":false,"hidden":false,"mode":"ojs"},{"id":240,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":809,"value":"import {form} from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":147,"value":"ln = import('https://unpkg.com/@lnjs/core@0.5.0/es/index.js?module')","pinned":false,"hidden":false,"mode":"ojs"},{"id":1160,"value":"import { footer } from \"@tomlarkworthy/footer\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":1178,"value":"footer","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}