2d:null 2e:["$","title",null,{"children":"Lazer Cuttering Plan Compiler | Tom Larkworthy | Observable"}] 33:T504,viewof configuration = view`

${tabbedPane({ geometry: view`

Common config

${reversibleAttach(compositeConfig, viewof fingerWidth)} ${reversibleAttach(compositeConfig, viewof material_thickness)} ${reversibleAttach(compositeConfig, viewof numberJoints)} ${reversibleAttach(compositeConfig, viewof minThickness)} ${reversibleAttach(compositeConfig, viewof recurseUnite)}

Generators

${tabbedPane({ ["from file"]: view`

${reversibleAttach(compositeConfig, viewof file)} ${reversibleAttach(compositeConfig, viewof rescale)} ${reversibleAttach(compositeConfig, viewof invert_normals)}

`, box: reversibleAttach(compositeConfig, viewof boxParams), flange: reversibleAttach(compositeConfig, viewof flangeParams), angle: reversibleAttach(compositeConfig, viewof angleParams), ["T"]: reversibleAttach(compositeConfig, viewof tParams), ["corner"]: reversibleAttach(compositeConfig, viewof cornerAngleParams) })}

`, visualization: reversibleAttach(compositeConfig, visualizationPane) })}

`34:T4b0,apply_box = { ({ prompt: "Convert the box template params into an array of rectangular surfaces and assign to surfaces view and also calculate the tight fitting bounds and assign to the bounds view", time: 1715503629215 }); const w = boxParams.width / 2; const h = boxParams.height / 2; const d = boxParams.depth / 2; viewof surfaces.value = [ // Front face [ [-w, -h, d], [w, -h, d], [w, h, d], [-w, h, d] ], [ // Back face [-w, h, -d], [w, h, -d], [w, -h, -d], [-w, -h, -d] ], // Top face [ [-w, h, d], [w, h, d], [w, h, -d], [-w, h, -d] ], // Bottom face [ [-w, -h, -d], [w, -h, -d], [w, -h, d], [-w, -h, d] ], // Right face [ [w, -h, -d], [w, h, -d], [w, h, d], [w, -h, d] ], // Left face [ [-w, -h, d], [-w, h, d], [-w, h, -d], [-w, -h, -d] ] ]; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = `box(${ viewof material_thickness.value }, ${w}, ${d}, ${h}))`; viewof filename.dispatchEvent(new Event("input")); }35:T40b,viewof flangeParams = ({ prompt: "Write a UI for a Flange Template. Requires flange diameter, inner width, inner heigh, depth", time: 1715628254526, comment: "Create a UI for setting up a flange with inputs for flange diameter, inner width, inner height, and depth, along with a green apply button." } && view`

Flange Template

${[ "flange_diameter", Inputs.range([0, 200], { label: "Flange Diameter (mm)", value: 40, step: 1 }) ]} ${[ "diameter", Inputs.radio(["OD", "ID"], { value: "ID", step: 0.1 }) ]} ${[ "inner_width", Inputs.range([0, 200], { label: "Inner Width (mm)", value: 18, step: 1 }) ]} ${[ "inner_height", Inputs.range([0, 200], { label: "Inner Height (mm)", value: 18, step: 1 }) ]} ${[ "depth", Inputs.range([0, 200], { label: "Depth (mm)", value: 12, step: 1 }) ]} `)36:Tb8e,apply_flange = { ({ prompt: "Convert the flange template params into an array of rectangular surfaces and assign to surfaces view and also calculate the tight fitting bounds and assign to the bounds view. A flange will need 4 rectangles on the base (XZ plane) to form an O shape, then 4 perpendicular rectangular inner sides", time: 1715629264694, comment: "Convert the flange parameters into an array of rectangular surfaces for the base and inner sides, forming an 'O' shape." }); let { flange_diameter, inner_width, inner_height, depth, diameter } = flangeParams; if (diameter == "OD") { inner_width += 2 * material_thickness; inner_height += 2 * material_thickness; } else if (diameter == "ID") { } else { throw Error(); } const flange_radius = flange_diameter / 2; const outer_rectangles = [ [ [-(inner_width / 2), 0, -(flange_diameter / 2)], [-(inner_width / 2), 0, inner_height / 2], [-(flange_diameter / 2), 0, inner_height / 2], [-(flange_diameter / 2), 0, -(flange_diameter / 2)] ], [ [inner_width / 2, 0, flange_diameter / 2], [inner_width / 2, 0, -inner_height / 2], [flange_diameter / 2, 0, -inner_height / 2], [flange_diameter / 2, 0, flange_diameter / 2] ], [ [flange_diameter / 2, 0, -inner_height / 2], [-inner_width / 2, 0, -inner_height / 2], [-inner_width / 2, 0, -flange_diameter / 2], [flange_diameter / 2, 0, -flange_diameter / 2] ], [ [-flange_diameter / 2, 0, inner_height / 2], [inner_width / 2, 0, inner_height / 2], [inner_width / 2, 0, flange_diameter / 2], [-flange_diameter / 2, 0, flange_diameter / 2] ] ]; const inner_rectangles = [ // Left [ [-(inner_width / 2), 0, -(inner_height / 2)], [-(inner_width / 2), depth, -(inner_height / 2)], [inner_width / 2, depth, -(inner_height / 2)], [inner_width / 2, 0, -(inner_height / 2)] ], // Right [ [inner_width / 2, 0, inner_height / 2], [inner_width / 2, depth, inner_height / 2], [-(inner_width / 2), depth, inner_height / 2], [-(inner_width / 2), 0, inner_height / 2] ], // Front [ [inner_width / 2, 0, -(inner_height / 2)], [inner_width / 2, depth, -(inner_height / 2)], [inner_width / 2, depth, inner_height / 2], [inner_width / 2, 0, inner_height / 2] ], // Back [ [-(inner_width / 2), 0, inner_height / 2], [-(inner_width / 2), depth, inner_height / 2], [-(inner_width / 2), depth, -(inner_height / 2)], [-(inner_width / 2), 0, -(inner_height / 2)] ] ]; viewof surfaces.value = [...outer_rectangles, ...inner_rectangles]; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = `flange(${material_thickness}, ${flange_diameter}, ${depth}, ${diameter}))`; viewof filename.dispatchEvent(new Event("input")); }37:T4c0,apply_angle = { const p = angleParams; const rads = deg2rad(p.angle); const beta = (Math.PI - rads) / 2; const h = -p.length / Math.tan(beta); viewof surfaces.value = [ [ [0, 0, -p.length], [0, 0, -p.length - 5], [Math.min(-5, h - p.length), 0, -p.length / 2], [Math.min(-5, h - p.length), 0, 0], [Math.min(-5, h - p.length), 0, p.length / 2], [0, 0, p.length + 5], [0, 0, p.length], [h, 0, 0] ], [ [h, -p.length, 0], [0, -p.length, p.length], [0, -p.length, p.length + 5], [Math.max(5, h + p.length), -p.length, p.length / 2], [Math.max(5, h + p.length), -p.length, 0], [Math.max(5, h + p.length), -p.length, -p.length / 2], [0, -p.length, -p.length - 5], [0, -p.length, -p.length] ], [ [h, 0, 0], [h, -p.length, 0], [0, -p.length, p.length], [0, 0, p.length] ], [ [0, 0, -p.length], [0, -p.length, -p.length], [h, -p.length, 0], [h, 0, 0] ] ]; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = `angle_test(${material_thickness}, ${p.angle})`; viewof filename.dispatchEvent(new Event("input")); }38:T6d5,parseObjFile = ({ prompt: "Parse an obj file using three.js and return the vertices and the faces as arrays of Vector3", time: 1716391941943, comment: "Define a function to parse an OBJ file using three.js and return the vertices and faces as arrays of Vector3." } && async function parseObjFile(objData) { const objLoader = new THREE.OBJLoader(); const object = objLoader.parse(objData); const vertices = []; const faces = []; object.traverse((child) => { if (child.isMesh) { const geometry = child.geometry; const positionAttribute = geometry.getAttribute("position"); for (let i = 0; i < positionAttribute.count; i++) { const vertex = new THREE.Vector3().fromBufferAttribute( positionAttribute, i ); vertices.push(vertex); } const index = geometry.index; if (index) { for (let i = 0; i < index.count; i += 3) { const a = index.getX(i); const b = index.getX(i + 1); const c = index.getX(i + 2); if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } else { for (let i = 0; i < positionAttribute.count; i += 3) { const a = i; const b = i + 1; const c = i + 2; if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } } }); return { vertices, faces }; })39:T569,apply_obj = { ({ prompt: 'Rewrite this to normalize the coordinates to center on 0,0,0\n\napply_obj = {\n const data = await parseObjFile(await file.text());\n\n const s = data.faces.map((points) => points.map((p) => [p.x, p.y, p.z]));\n\n viewof surfaces.value = s;\n viewof surfaces.dispatchEvent(new Event("input"));\n\n return s;\n}', time: 1716398460812, comment: "Rewrite the function to normalize the coordinates to center on (0, 0, 0) before updating the surfaces view." }); debugger; const { vertices, faces } = await parseObjFile(objText); if (vertices.length == 0) return; // Compute the bounding box to find the center const min = new THREE.Vector3(Infinity, Infinity, Infinity); const max = new THREE.Vector3(-Infinity, -Infinity, -Infinity); vertices.forEach((vertex) => { min.min(vertex); max.max(vertex); }); const center = new THREE.Vector3().addVectors(min, max).multiplyScalar(0.5); // Update the faces with normalized vertices const normalizedFaces = faces.map((face) => face.map((vertex) => vertex.clone().sub(center)) ); const s = normalizedFaces.map((points) => points.map((p) => [p.x, p.y, p.z])); viewof surfaces.value = s; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = file.name; viewof filename.dispatchEvent(new Event("input")); return s; }3a:T773,apply_fbx = { ({ prompt: "Write a loader for fbx assets called apply_fbx", time: 1720280304267, comment: "Define a loader for FBX assets called apply_fbx. The loader parses the FBX file, extracts vertices and faces, and updates the view." }); const fbxData = await file.arrayBuffer(); const loader = new THREE.FBXLoader(); const object = loader.parse(fbxData); const vertices = []; const faces = []; object.traverse((child) => { if (child.isMesh) { const geometry = child.geometry; const positionAttribute = geometry.getAttribute("position"); for (let i = 0; i < positionAttribute.count; i++) { const vertex = new THREE.Vector3().fromBufferAttribute( positionAttribute, i ); vertices.push(vertex); } const index = geometry.index; if (index) { for (let i = 0; i < index.count; i += 3) { const a = index.getX(i); const b = index.getX(i + 1); const c = index.getX(i + 2); if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } else { for (let i = 0; i < positionAttribute.count; i += 3) { const a = i; const b = i + 1; const c = i + 2; if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } } }); const s = faces.map((points) => points.map((p) => [p.x * rescale, p.y * rescale, p.z * rescale]) ); viewof surfaces.value = s; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = file.name; viewof filename.dispatchEvent(new Event("input")); return s; }3b:T8a7,apply_gltf = { ({ prompt: "apply_gltf nearly works but the geometry is not possitioned correctly in world space", time: 1720285209792, comment: "Update the apply_gltf function to ensure geometry is transformed to world coordinates correctly by applying the world matrix transformation to each vertex." }); const gltfData = await file.arrayBuffer(); const loader = new THREE.GLTFLoader(); const { scene } = await new Promise((resolve, reject) => { loader.parse(gltfData, "", resolve, reject); }); const faces = []; scene.updateMatrixWorld(true); // Ensure world matrices are up to date scene.traverse((child) => { const vertices = []; if (child.isMesh) { const geometry = child.geometry; const positionAttribute = geometry.getAttribute("position"); for (let i = 0; i < positionAttribute.count; i++) { const vertex = new THREE.Vector3().fromBufferAttribute( positionAttribute, i ); vertex.applyMatrix4(child.matrixWorld); // Apply world matrix transformation vertices.push(vertex); } const index = geometry.index; if (index) { for (let i = 0; i < index.count; i += 3) { const a = index.getX(i); const b = index.getX(i + 1); const c = index.getX(i + 2); if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } else { for (let i = 0; i < positionAttribute.count; i += 3) { const a = i; const b = i + 1; const c = i + 2; if (invert_normals) { faces.push([vertices[a], vertices[c], vertices[b]]); } else { faces.push([vertices[a], vertices[b], vertices[c]]); } } } } }); const s = faces.map((points) => points.map((p) => [p.x * rescale, p.y * rescale, p.z * rescale]) ); viewof surfaces.value = s; viewof surfaces.dispatchEvent(new Event("input")); viewof filename.value = file.name; viewof filename.dispatchEvent(new Event("input")); return s; }3c:T40e,planes_view_updated = { const table = Inputs.table(surface_planes, { required: false, width: { normal: 100, constant: 70, isPlane: 50 }, maxWidth: 300, rows: 20, columns: ["normal", "constant", "isPlane"], format: { normal: toString, isPlane: (plane, i, array) => html`

${Inputs.button("🗑️", { reduce: () => { viewof exclude_planes.value.push(array[i]); viewof exclude_planes.dispatchEvent(new Event("input")); } })} ${Inputs.button("🧩", { reduce: () => { debugger; viewof focusPlaneIdx.value = viewof focusPlaneIdx.value == i ? -1 : i; viewof focusPlaneIdx.dispatchEvent(new Event("input")); } })}

` }, header: { isPlane: "" } }); Inputs.bind(table, viewof selected_planes); viewof planes_view.value = table; }3d:T473,surfacesOnPlaneAsPath = { ({ prompt: "Given a plane, and a list of 3d polygons expressed as an array of Vector3, if each point is on the plane, project all the points to a closed paper.js Path", time: 1715634727536, comment: "Define a function to project 3D polygons onto a 2D plane and convert them into closed paper.js Paths." }); function projectToPath(plane, polygons) { const [basisX, basisY] = chooseBasis(plane); const projectedPoints = polygons.map((polygon) => { try { return polygon.map((point) => { const pointOnPlane = plane.projectPoint(point, new Vector3()); if (pointOnPlane.distanceTo(point) > 1e-3) throw new Error(); const x = pointOnPlane.dot(basisX); const y = pointOnPlane.dot(basisY); return new paper.Point(x, y); }); } catch (e) {} }); const paths = projectedPoints .filter((d) => d) .map((points) => new paper.Path(points)); paths.forEach((path) => { path.closePath(); if (path.clockwise) path.reverse(); }); return paths; } return projectToPath; }3e:T507,simplifyPath = ({ prompt: "Write a function that walks the segments in a paper.js path, and removes adjacent segments that are colinear with, to simplify the path. Note the resultant segment might also be colean with the next etc Do it in-place. with path.removeSegment(index)", time: 1719765533183, comment: "Define a function to simplify a paper.js path by removing adjacent collinear segments in-place using path.removeSegment(index)." } && function simplifyPath(path) { function isCollinear(p1, p2, p3) { return eq((p2.x - p1.x) * (p3.y - p2.y), (p2.y - p1.y) * (p3.x - p2.x)); } let i = 0; while (i < path.segments.length - 2) { const p1 = path.segments[i].point; const p2 = path.segments[i + 1].point; const p3 = path.segments[i + 2].point; if (isCollinear(p1, p2, p3)) { path.removeSegment(i + 1); } else { i++; } } // Check last two segments if (path.segments.length > 2) { const p1 = path.segments[path.segments.length - 3].point; const p2 = path.segments[path.segments.length - 2].point; const p3 = path.segments[path.segments.length - 1].point; if (isCollinear(p1, p2, p3)) { path.removeSegment(path.segments.length - 2); } } })3f:T53c,projectPathTo3D = ({ prompt: "Given a CompoundPath and a Plane, project the path segments into arrays of Line3. Each array contains a loop for each subpath", time: 1715721277786, comment: "Define a function to project the segments of a CompoundPath into arrays of Line3, each array corresponding to a loop for each subpath." } && function projectPathTo3D(path, plane) { const [basisX, basisY] = chooseBasis(plane); const basisZ = plane.normal; const origin = plane.coplanarPoint(new Vector3()); function projectPoint2DTo3D(point2D) { return new Vector3( point2D.x * basisX.x + point2D.y * basisY.x, point2D.x * basisX.y + point2D.y * basisY.y, point2D.x * basisX.z + point2D.y * basisY.z ).add(origin); } if (path.children) return path.children.map((subPath) => { return subPath.segments.map((segment) => { const start = projectPoint2DTo3D(segment.point); const end = projectPoint2DTo3D(segment.next.point); return new Line3(start, end); }); }); else { return [ path.segments.map((segment) => { const start = projectPoint2DTo3D(segment.point); const end = projectPoint2DTo3D(segment.next.point); return new Line3(start, end); }) ]; } })40:T5e3,findShapeConnections = ({ prompt: "Find a list of connections between shapes encoded as a map of Plane => Line3[]. A connection is a shared edge list, and the two shapes (plane1, plane2, edges1, edges2). Use intersectShapes pairwise.", time: 1715074480396, comment: "Define a function to find connections between shapes, where a connection is defined by shared edges between shapes encoded as a map of Plane => Line3[]." } && function findShapeConnections(shapeMap) { const connections = []; const planes = Array.from(shapeMap.keys()); // Compare each pair of shapes for (let i = 0; i < planes.length; i++) { for (let j = i + 1; j < planes.length; j++) { const plane1 = planes[i]; const plane2 = planes[j]; if (plane1 == plane2) { debugger; } const boundaries1 = shapeMap.get(plane1); const boundaries2 = shapeMap.get(plane2); const edges = intersectShapes(plane1, boundaries1, plane2, boundaries2); if (edges.length > 0) { connections.push({ plane1, plane2, lines1: boundaries1, lines2: boundaries2, sharedEdges: edges, angle: Math.abs( rad2deg( angleBetweenPlanes( plane1, plane2, edges[0].delta(new Vector3()) ) ) ) }); } } } return connections; })41:T44c,visualizeJointGraph = ({ prompt: "visualize the joint graph using graph viz.", time: 1715259707115, comment: "Define a function to visualize a joint graph using Graphviz format, displaying vertices, edges, and edge lengths." } && function visualizeJointGraph(joints) { return dot`digraph G { ${[...edges.keys()] .map( (plane) => `"${toString(plane)}" [color="${ focusJoint && (focusJoint.plane1 === plane || focusJoint.plane2 === plane) ? "red" : focusPlane && focusPlane == plane ? "green" : "black" }"]` ) .join("\n")} ${joints .map((joint) => { return `"${toString(joint.plane1)}" -> "${toString( joint.plane2 )}" [label="${ joint.angle + "° " + joint.sharedEdges.map(toString).join("\n") }" color="${ focusJoint && focusJoint === joint ? "red" : "black" }"]`; }) .join("\n")} }`; return dot.join("\n"); })42:T152f,generatePerimeterPlan = ({ prompt: "Given a list of neighbourhood connections\n\nObject {\n plane1: Plane {isPlane: true, normal: Vector3, constant: 1}\n plane2: Plane {isPlane: true, normal: Vector3, constant: 1}\n lines1: Array(6) [Line3, Line3, Line3, Line3, Line3, Line3]\n lines2: Array(4) [Line3, Line3, Line3, Line3]\n sharedEdges: Array(1) [\n 0: Line3 {\n start: Vector3 {x: 0, y: 1, z: 1}\n end: Vector3 {x: -5, y: 1, z: 1}\n}\n]\n angle: 90\n}\n\nand a the ordered bounds of the surface [x, y][]\n\ngenerate a plan for adjusting the perimeter of the object to insert special joints on the shared edges. \nTo do this you will need to walk the boundary. If there are no shared edges the plane would be a simple list of {plan: move, [x, y]}\nHowever, where the sharedEdges intersect the boundary, we need to split the line up and replace the shared part with\n\n{plan: joint, [x,y], edge: }\n\n\n\n\n", time: 1715421531133, comment: "Define a function to generate a plan for adjusting the perimeter of an object to insert special joints on the shared edges. This involves walking the boundary and replacing parts of it with joints where shared edges intersect." } && function generatePerimeterPlan(plane, joints, boundaries) { console.log("generatePerimeterPlan", generatePerimeterPlan); const sharedEdgeLookup = new Map( joints.flatMap((j) => j.sharedEdges.map((e) => [e, j])) ); const unusedSharedEdges = joints.flatMap((j) => j.sharedEdges); const boundaryPlans = []; // First find box joints by walking round the perimiter // and looking for shared edges in the joints boundaries.forEach((boundary) => { const plans = []; for (let i = 0; i < boundary.length; i++) { const edge = boundary[i]; let connections = joints.filter((joint) => joint.sharedEdges.some((sharedEdge) => { const intersection = intersectLines(edge, sharedEdge, { clamp: true, includeOverlap: true }); if (intersection != null && intersection.start) { return intersection.distanceSq() > 1e-3; } }) ); function findNearest(from, to, edges) { let nearest = null; let nearestDistance = Number.MAX_VALUE; let nearestSharedEdge = undefined; const dir = to.clone().sub(from); edges.forEach((sharedEdge) => { [sharedEdge.start, sharedEdge.end].forEach((p) => { const distance = p.distanceTo(from); const opposite = p == sharedEdge.start ? sharedEdge.end : sharedEdge.start; const sharedDir = opposite.clone().sub(p); if (distance < nearestDistance && sharedDir.dot(dir) > 0) { nearest = p; nearestDistance = distance; nearestSharedEdge = sharedEdge; } }); }); return [nearest, nearestSharedEdge]; } if (connections.length > 0) { let current = edge.start; let openEdges = connections.flatMap((j) => j.sharedEdges); while (!eq(current, edge.end)) { const [nearest, sharedEdge] = findNearest( current, edge.end, openEdges ); if (nearest == null) { plans.push({ plan: "move", edge: new Line3(current, edge.end) }); current = edge.end; } else { unusedSharedEdges.splice( unusedSharedEdges.findIndex((d) => d == sharedEdge), 1 ); if (nearest.distanceTo(current) > 1e-3) { plans.push({ plan: "move", edge: new Line3(current, nearest) }); current = nearest; } const jointEdge = eq(sharedEdge.start, nearest) ? sharedEdge : new Line3(sharedEdge.end, sharedEdge.start); const connection = sharedEdgeLookup.get(sharedEdge); const oppositePlane = connection.plane1 == plane ? connection.plane2 : connection.plane1; const extension = plans.push({ plan: "box", edge: jointEdge, joint: connection, polarity: connection.plane1 == plane, direction: oppositePlane.normal, plane, oppositePlane }); openEdges.splice( openEdges.findIndex((e) => e == sharedEdge), 1 ); current = jointEdge.end; } } } else { plans.push({ plan: "move", edge: edge }); } } boundaryPlans.push(plans); }); // Next look for internal shared edges within the perimiter as mortoise joints const interior_plan = []; unusedSharedEdges.forEach((e) => { const j = sharedEdgeLookup.get(e); const oppositePlane = j.plane1 == plane ? j.plane2 : j.plane1; interior_plan.push({ plan: "mortise", edge: e, joint: j, polarity: j.plane1 == plane, direction: oppositePlane.normal, plane, oppositePlane }); }); return [...boundaryPlans, interior_plan]; })43:T838,projectPlan = (plane, plan) => { const [basisX, basisY] = chooseBasis(plane); return plan.map((step) => { const startPointOnPlane = plane.projectPoint( step.edge.start, new Vector3() ); const endPointOnPlane = plane.projectPoint(step.edge.end, new Vector3()); const dirOnPlane = step.direction && plane.projectPoint(step.direction, new Vector3()); const start = [ startPointOnPlane.dot(basisX), startPointOnPlane.dot(basisY) ]; const end = [endPointOnPlane.dot(basisX), endPointOnPlane.dot(basisY)]; const delta = [start[0] - end[0], start[1] - end[1]]; const magnitude = Math.sqrt(delta[0] * delta[0] + delta[1] * delta[1]); const outward = [delta[1] / magnitude, -delta[0] / magnitude]; let cutParams = {}; if (step.direction) { const oppostiteOffsetStart = step.edge.start .clone() .addScaledVector(step.oppositePlane.normal, material_thickness); const oppostiteOffsetEnd = step.edge.end .clone() .addScaledVector(step.oppositePlane.normal, material_thickness); const cutDirection = [dirOnPlane.dot(basisX), dirOnPlane.dot(basisY)]; const cutType = outward[0] * cutDirection[0] + outward[1] * cutDirection[1] > 0 ? "extend" : "retract"; cutParams = { cutDirection, cutType, oppositeStart: [ oppostiteOffsetStart.dot(basisX), oppostiteOffsetStart.dot(basisY) ], oppositeEnd: [ oppostiteOffsetEnd.dot(basisX), oppostiteOffsetEnd.dot(basisY) ], extension: angleToFingerExtension( cutType == "extend" ? step.joint.angle : -step.joint.angle, { thickness: material_thickness } ), retraction: angleToFingerRetraction( cutType == "extend" ? step.joint.angle : -step.joint.angle, { thickness: material_thickness } ) }; } return { ...step, start, end, outward, ...cutParams }; }); }44:T470,projectToLine = ({ prompt: "Given a point [x,y], and a delta [i, j], and another line start [x, y] end [x, y] find where the point + delta intersects the clamped line, or null if it doesn't, note the point + delta is an infinite line. You can use Paper.js if its simpler\n\nnew paper.Line(x0, y0, x1, y1, true) constructs an vector line", time: 1716646126831, comment: "Define a function to find the intersection of a point + delta (infinite line) with a clamped line segment using Paper.js." } && function projectToLine(point, delta, lineStart, lineEnd) { // Create the line segment and the infinite line const line = new paper.Line( lineStart[0], lineStart[1], lineEnd[0], lineEnd[1], false ); const deltaLine = new paper.Line( point[0], point[1], delta[0], delta[1], true ); // Find the intersection const intersection = line.intersect(deltaLine, true); // Check if the intersection is within the bounds of the line segment if (intersection) { return [intersection.x, intersection.y]; } return null; })45:T504,computeStepInteraction = (step, otherStep, previous = false) => { const results = []; const candidates = []; if (otherStep.oppositeStart) { candidates.push( intersect2d( otherStep.oppositeStart, otherStep.oppositeEnd, step.start, step.end ) ); if (step.oppositeStart) { candidates.push( intersect2d( otherStep.oppositeStart, otherStep.oppositeEnd, step.oppositeStart, step.oppositeEnd ) ); } } if (step.oppositeStart) { candidates.push( intersect2d( otherStep.start, otherStep.end, step.oppositeStart, step.oppositeEnd ) ); } candidates.forEach((candidate) => { if (!candidate) return; const intersection = projectToLine( candidate, step.outward, step.start, step.end ); if (intersection) results.push({ from: candidate, to: intersection }); }); // add retraction from joint const mid = midpoint(step.start, step.end); // results.push({ // from: mid, // to: [ // mid[0] + step.outward[0] * step.retraction, // mid[1] + step.outward[1] * step.retraction // ] // }); return results; }46:T442,computeCorner = (stepA, stepB, endToStart) => { if (stepA.cutType == "retract" || stepB.cutType == "retract") { const retractionA = stepA.cutType == "retract" ? [ stepA.outward[0] * -stepA.retraction, stepA.outward[1] * -stepA.retraction ] : [0, 0]; const retractionB = stepB.cutType == "retract" ? [ stepB.outward[0] * -stepB.retraction, stepB.outward[1] * -stepB.retraction ] : [0, 0]; const lineA = [ [stepA.start[0] + retractionA[0], stepA.start[1] + retractionA[1]], [stepA.end[0] + retractionA[0], stepA.end[1] + retractionA[1]] ]; const lineB = [ [stepB.start[0] + retractionB[0], stepB.start[1] + retractionB[1]], [stepB.end[0] + retractionB[0], stepB.end[1] + retractionB[1]] ]; const intersection = intersect2d( lineA[0], lineA[1], lineB[0], lineB[1], false ); if (intersection != null) { return intersection; } } return endToStart ? stepA.end : stepA.start; }47:T41c,computeStepInteractions = (steps) => { // TODO: there is a bug here as not all neighbours are index adjacent (think shapes with multiple boudnaries) return steps.map((step, i) => { const previousStep = steps[(i - 1 + steps.length) % steps.length]; const nextStep = steps[(i + 1) % steps.length]; const interactions = [ computeStepInteraction(step, previousStep, true), computeStepInteraction(step, nextStep, false) ]; const length = Math.sqrt(distance2DSquared(step.start, step.end)); return { ...step, cornerStart: computeCorner(step, nextStep, true), cornerEnd: computeCorner(step, previousStep, false), delayStart: Math.sqrt( d3.max([step.start, ...interactions[0].map((i) => i.to)], (d) => distance2DSquared(d, step.start) ) ), delayEnd: length - Math.sqrt( d3.max([step.end, ...interactions[1].map((i) => i.to)], (d) => distance2DSquared(d, step.end) ) ), interactions }; }); }48:Tb79,planViz = (plan) => Plot.plot({ aspectRatio: 1, width, grid: true, inset: 10, x: { label: "x" }, y: { label: "y", domain: [ d3.max(plan, (d) => d.start[1] + material_thickness), d3.min(plan, (d) => d.start[1] - material_thickness) ] }, color: { legend: true }, marks: [ Plot.link(plan, { x1: (d) => d.start[0], y1: (d) => d.start[1], x2: (d) => d.end[0], y2: (d) => d.end[1], stroke: (d) => d.plan, markerEnd: "arrow", strokeWidth: 3 }), Plot.link( plan.filter((s) => s.plan == "box"), { x1: (d) => d.oppositeStart[0], y1: (d) => d.oppositeStart[1], x2: (d) => d.oppositeEnd[0], y2: (d) => d.oppositeEnd[1], strokeDasharray: [2], stroke: "green", strokeWidth: 2 } ), Plot.link( plan.flatMap((step) => step.interactions.flat()), { x1: (d) => d.from[0], y1: (d) => d.from[1], x2: (d) => d.to[0], y2: (d) => d.to[1], strokeDasharray: [1], stroke: "red", strokeWidth: 1 } ), Plot.dot( plan.flatMap((step) => step.interactions.flat()), { x: (d) => d.to[0], y: (d) => d.to[1], stroke: "red" } ), Plot.dot( plan.filter((step) => step.cornerStart), { x: (d) => d.cornerStart[0], y: (d) => d.cornerStart[1], stroke: "green" } ), Plot.dot( plan.filter((step) => step.cornerEnd), { x: (d) => d.cornerEnd[0], y: (d) => d.cornerEnd[1], stroke: "red", symbol: (d) => "hexagon" } ), Plot.vector(plan, { x: (d) => (d.start[0] + d.end[0]) / 2, y: (d) => (d.start[1] + d.end[1]) / 2, rotate: (d) => (Math.atan2(d.outward[0], -d.outward[1]) * 180) / Math.PI, length: 20, stroke: "cyan", anchor: "start", strokeWidth: 2 }), Plot.vector( plan.filter((s) => s.plan == "box"), { x: (d) => (d.start[0] + d.end[0]) / 2, y: (d) => (d.start[1] + d.end[1]) / 2, rotate: (d) => (Math.atan2(d.cutDirection[0], -d.cutDirection[1]) * 180) / Math.PI, length: 20, stroke: "red", anchor: "start", strokeWidth: 2 } ), Plot.text( plan.filter((s) => s.plan == "box"), { x: (d) => (d.start[0] + d.end[0]) / 2, y: (d) => (d.start[1] + d.end[1]) / 2, text: (d) => "\n" + (d.polarity ? "+" : "-") + d.joint.angle, fill: "black", strokeWidth: 1, fontSize: 16, frameAnchor: "top-left" } ) ] })49:Te3e,planToSVG = (plan, { scale = 5, thickness = material_thickness } = {}) => { const maxX = d3.max(plan, (step) => Math.max(step.start[0], step.end[0])) + thickness * 2; const maxY = d3.max(plan, (step) => Math.max(step.start[1], step.end[1])) + thickness * 2; const minX = d3.min(plan, (step) => Math.min(step.start[0], step.end[0])) - thickness * 2; const minY = d3.min(plan, (step) => Math.min(step.start[1], step.end[1])) - thickness * 2; const total_width = maxX - minX; const total_height = maxY - minY; let svgEl = undefined; const element = htl.svg`

`; svgEl = element.querySelector("svg"); return element; }4a:T7a2,createBoxJointSide = ({ prompt: "createBoxJointSide should make an informative way to explore mating characteristics of a box joint. It should be a square peice of material with a box join on one side. You should be able to alter the arguments (in an object) for the width, height, depth of the material, then change how much the positive side of the fingers are pushed out from the height, and a different parameter for how much the negative side of the fingers are pulled in. you should also be able to set how many finger pairs there are. It should be a 3d part extruded from a Shape", time: 1714808649416, comment: "Define a function to create a box joint side with configurable dimensions, finger offsets, and number of finger pairs. The part is a 3D extrusion from a Shape." } && function createBoxJointSide({ width = 10, height = 10, depth = 1, positiveFingerOffset = 0.2, negativeFingerOffset = 0.2, fingerPairs = 3, color = 0x00ff00, opacity = 0.5 }) { const shape = new THREE.Shape(); const fingerWidth = width / (2 * fingerPairs); shape.moveTo(width, height); shape.lineTo(0, height); for (let i = 0; i < fingerPairs; i++) { if (i !== 0) shape.lineTo(i * 2 * fingerWidth, -negativeFingerOffset); shape.lineTo(i * 2 * fingerWidth, positiveFingerOffset); shape.lineTo((i * 2 + 1) * fingerWidth, positiveFingerOffset); shape.lineTo((i * 2 + 1) * fingerWidth, -negativeFingerOffset); } shape.lineTo(width, -negativeFingerOffset); shape.lineTo(width, height); const extrudeSettings = { steps: 1, depth: depth, bevelEnabled: false }; const geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings); const material = new THREE.MeshLambertMaterial({ color: color, opacity: opacity, transparent: true }); const mesh = new THREE.Mesh(geometry, material); return mesh; })4b:T4fb,viewof jointToyParams = ({ prompt: "Write a UI for a Flange Template. Requires flange diameter, inner width, inner heigh, depth", time: 1715628254526, comment: "Create a UI for setting up a flange with inputs for flange diameter, inner width, inner height, and depth, along with a green apply button." } && view`

Joint Toy

${[ "angleA", Inputs.range([-360, 360], { value: 45, label: "joint angle a" }) ]} ${["angleB", Inputs.range([-360, 360], { label: "joint angle b" })]} ${[ "toggleNormalA", Inputs.toggle({ label: "toggle A normal", value: false }) ]} ${[ "toggleNormalB", Inputs.toggle({ label: "toggle B normal", value: false }) ]} ${["angle", Inputs.range([-360, 360], { label: "joint angle" })]} ${[ "thickness", Inputs.range([0, 10], { label: "thickness", value: 2 }) ]} ${[ "fingerRetract", Inputs.range([-10, 50], { label: "finger retraction" }) ]} ${["fingerExtend", Inputs.range([-5, 50], { label: "finger extension" })]} ${[ "autoFit", Inputs.toggle({ label: "auto fit finger params", value: true }) ]} `)4c:T10b3,box_clockwise = ( start, end, { offset, finger_depth, finger_width, cut_correction, end_anchor = false, reverse = false, delayStart = NaN, delayEnd = NaN, reverseDelay = false, debug = false } = {} ) => { const distance = (a, b) => Math.sqrt(distance2DSquared(a, b)); finger_width = finger_width || 2; finger_depth = finger_depth || viewof material_thickness.value; cut_correction = cut_correction || 0.1; offset = offset || 0; const dir = [end[0] - start[0], end[1] - start[1]]; const length = Math.sqrt(dir[0] * dir[0] + dir[1] * dir[1]); dir[0] /= length; dir[1] /= length; const commands = []; const in_cut = [-finger_depth * dir[1], finger_depth * dir[0]]; const cos45 = 1 / Math.sqrt(2); const sin45 = 1 / Math.sqrt(2); const cos135 = -1 / Math.sqrt(2); const sin135 = 1 / Math.sqrt(2); const corner_cut_a = [ (cos135 * dir[0] - sin135 * dir[1]) * cut_correction, (sin135 * dir[0] + cos135 * dir[1]) * cut_correction ]; const corner_cut_b = [ (cos45 * dir[0] - sin45 * dir[1]) * cut_correction, (sin45 * dir[0] + cos45 * dir[1]) * cut_correction ]; if (debug) debugger; let on_outer; reverseDelay ^= reverse; const dist = distance(start, end); delayEnd = Math.min(delayEnd, dist); if (end_anchor) { offset = (dist % finger_width) + offset; on_outer = dist % (finger_width * 2) < finger_width; reverseDelay ^= on_outer; } else { on_outer = mod(offset, finger_width * 2) <= finger_width; } if (reverse) on_outer = !on_outer; // adjust delays to stop the delays from inverting // Some weird ruonding errors so we step a funny amount if (!Number.isNaN(delayStart)) while (((delayStart - offset) / finger_width + reverseDelay) % 2 <= 1) { delayStart += finger_width / 3; } if (!Number.isNaN(delayEnd)) while ( delayEnd > 0 && ((delayEnd - offset) / finger_width + reverseDelay) % 2 <= 1 ) { delayEnd -= finger_width / 3; } // First cut on boundary if ( on_outer ^ end_anchor ^ (((delayStart - offset) / finger_width) % 2 > 1) ) { commands.push(` L ${start[0]} ${start[1]} `); } else { commands.push(` L ${start[0] + in_cut[0]} ${start[1] + in_cut[1]} `); } for ( let i = end_anchor ? 0 : 1; (i + offset / finger_width) * finger_width < length - 0.0001; i++ ) { const i1 = i + offset / finger_width; if (i1 > delayEnd / finger_width) continue; if (!on_outer) { // outwards cut commands.push(` L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${ start[0] + i1 * finger_width * dir[0] + in_cut[0] + corner_cut_b[0] } ${ start[1] + i1 * finger_width * dir[1] + in_cut[1] + corner_cut_b[1] } L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${start[0] + i1 * finger_width * dir[0]} ${start[1] + i1 * finger_width * dir[1]} `); } else { // inwards cut commands.push(` L ${start[0] + i1 * finger_width * dir[0]} ${start[1] + i1 * finger_width * dir[1]} L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${ start[0] + i1 * finger_width * dir[0] + in_cut[0] + corner_cut_a[0] } ${ start[1] + i1 * finger_width * dir[1] + in_cut[1] + corner_cut_a[1] } L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} `); } on_outer = !on_outer; if (i1 <= delayStart / finger_width) commands.pop(); } // last cut on boundary if (on_outer) { commands.push(` L ${end[0]} ${end[1]} `); } else { commands.push(` L ${end[0] + in_cut[0]} ${end[1] + in_cut[1]} `); } return commands.join(); }4d:T4a5,viewof box_clockwise_config = Inputs.form({ x0: Inputs.range([0, 100], { label: "x0", value: 10 }), y0: Inputs.range([0, 100], { label: "y0", value: 10 }), x1: Inputs.range([0, 100], { label: "x0", value: 80 }), y1: Inputs.range([0, 100], { label: "y1", value: 10 }), offset: Inputs.range([-10, 10], { label: "offset", value: 0 }), finger_depth: Inputs.range([0, 10], { label: "finger_depth", value: 2.1 }), finger_width: Inputs.range([0, 10], { label: "finger_width", value: 2 }), cut_correction: Inputs.range([0, 10], { label: "cut_correction", value: 0.1 }), end_anchor: Inputs.toggle({ label: "end_anchor", value: false }), reverse: Inputs.toggle({ label: "reverse", value: false }), delayStart: Inputs.range([0, 100], { label: "delay start", value: 0 }), delayEnd: Inputs.range([0, 100], { label: "delay end", value: 90 }), reverseDelay: Inputs.toggle({ label: "reverse delay", value: false }), label: Inputs.text({ label: "label", value: "7" }), debug: Inputs.toggle({ label: "debug", value: false }) })4e:T46c,viewof mortise_clockwise_v1_config = Inputs.form({ x0: Inputs.range([0, 100], { label: "x0", value: 10 }), y0: Inputs.range([0, 100], { label: "y0", value: 10 }), x1: Inputs.range([0, 100], { label: "x0", value: 80 }), y1: Inputs.range([0, 100], { label: "y1", value: 10 }), offset: Inputs.range([-10, 10], { label: "offset", value: 0 }), finger_depth: Inputs.range([0, 10], { label: "finger_depth", value: 2.1 }), finger_width: Inputs.range([0, 10], { label: "finger_width", value: 2 }), cut_correction: Inputs.range([0, 10], { label: "cut_correction", value: 0.1 }), end_anchor: Inputs.toggle({ label: "end_anchor", value: false }), reverse: Inputs.toggle({ label: "reverse", value: false }), delayStart: Inputs.range([0, 100], { label: "delay start", value: 0 }), delayEnd: Inputs.range([0, 100], { label: "delay end", value: 90 }), reverseDelay: Inputs.toggle({ label: "reverse delay", value: false }), debug: Inputs.toggle({ label: "debug", value: false }) })4f:T1341,mortise_clockwise_v1 = ( start, end, { offset, finger_depth = 3, finger_width = 3, cut_correction, end_anchor = false, reverse = false, delayStart = NaN, delayEnd = NaN, reverseDelay = false, debug = false } = {} ) => { const distance = (a, b) => Math.sqrt(distance2DSquared(a, b)); finger_width = finger_width || 2; finger_depth = finger_depth || material_thickness; cut_correction = cut_correction || 0.1; offset = offset || 0; const dir = [end[0] - start[0], end[1] - start[1]]; const length = Math.sqrt(dir[0] * dir[0] + dir[1] * dir[1]); dir[0] /= length; dir[1] /= length; const commands = []; const in_cut = [-finger_depth * dir[1], finger_depth * dir[0]]; const cos45 = 1 / Math.sqrt(2); const sin45 = 1 / Math.sqrt(2); const cos135 = -1 / Math.sqrt(2); const sin135 = 1 / Math.sqrt(2); const corner_cut_a = [ (cos135 * dir[0] - sin135 * dir[1]) * cut_correction, (sin135 * dir[0] + cos135 * dir[1]) * cut_correction ]; const corner_cut_b = [ (cos45 * dir[0] - sin45 * dir[1]) * cut_correction, (sin45 * dir[0] + cos45 * dir[1]) * cut_correction ]; if (debug) debugger; let on_outer; reverseDelay ^= reverse; const dist = distance(start, end); delayEnd = Math.min(delayEnd, dist - (end_anchor ? 0 : finger_width)); if (end_anchor) { offset = (dist % finger_width) + offset; on_outer = dist % (finger_width * 2) < finger_width; reverseDelay ^= on_outer; } else { on_outer = mod(offset, finger_width * 2) <= finger_width; } if (reverse) on_outer = !on_outer; // adjust delays to stop the delays from inverting // Some weird ruonding errors so we step a funny amount if (!Number.isNaN(delayStart)) while (((delayStart - offset) / finger_width + reverseDelay) % 2 <= 1) { delayStart += finger_width / 3; } if (!Number.isNaN(delayEnd)) while ( delayEnd > 0 && ((delayEnd - offset) / finger_width + reverseDelay) % 2 <= 1 ) { delayEnd -= finger_width / 3; } // First cut on boundary /* if ( on_outer ^ end_anchor ^ (((delayStart - offset) / finger_width) % 2 > 1) ) { commands.push(` L ${start[0]} ${start[1]} `); } else { commands.push(` L ${start[0] + in_cut[0]} ${start[1] + in_cut[1]} `); }*/ for ( let i = end_anchor ? 0 : 1; (i + offset / finger_width) * finger_width < length - 0.0001; i++ ) { const i1 = i + offset / finger_width; if (i1 > delayEnd / finger_width) continue; if (!on_outer) { } else { // inwards cut commands.push(` M ${start[0] + i1 * finger_width * dir[0]} ${start[1] + i1 * finger_width * dir[1]} L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${ start[0] + i1 * finger_width * dir[0] + in_cut[0] + corner_cut_a[0] } ${ start[1] + i1 * finger_width * dir[1] + in_cut[1] + corner_cut_a[1] } L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${start[0] + i1 * finger_width * dir[0] + in_cut[0]} ${start[1] + i1 * finger_width * dir[1] + in_cut[1]} L ${ start[0] + i1 * finger_width * dir[0] + in_cut[0] + corner_cut_b[0] } ${ start[1] + i1 * finger_width * dir[1] + in_cut[1] + corner_cut_b[1] } L ${start[0] + (i1 + 1) * finger_width * dir[0] + in_cut[0]} ${start[1] + (i1 + 1) * finger_width * dir[1] + in_cut[1]} L ${start[0] + (i1 + 1) * finger_width * dir[0]} ${start[1] + (i1 + 1) * finger_width * dir[1]} L ${start[0] + (i1 + 1) * finger_width * dir[0] - corner_cut_a[0]} ${start[1] + (i1 + 1) * finger_width * dir[1] - corner_cut_a[1]} L ${start[0] + (i1 + 1) * finger_width * dir[0]} ${start[1] + (i1 + 1) * finger_width * dir[1]} L ${start[0] + i1 * finger_width * dir[0]} ${start[1] + i1 * finger_width * dir[1]} L ${start[0] + i1 * finger_width * dir[0] - corner_cut_b[0]} ${start[1] + i1 * finger_width * dir[1] - corner_cut_b[1]} L ${start[0] + i1 * finger_width * dir[0]} ${start[1] + i1 * finger_width * dir[1]} `); } on_outer = !on_outer; if (i1 <= delayStart / finger_width) commands.pop(); } // last cut on boundary if (on_outer) { commands.push(` M ${end[0]} ${end[1]} `); } else { commands.push(` M ${end[0] + in_cut[0]} ${end[1] + in_cut[1]} `); } return commands.join(); }50:T62d,exampleShapes = ({ plane1: new Plane( new Vector3(0, -0.5547001962252291, 0.8320502943378436), -4.992301766027061 ), lines1: [ new THREE.Line3( new THREE.Vector3(-7.499999999999998, 9.000000000000002, 12), new THREE.Vector3( -7.499999999999998, 8.881784197001252e-16, 5.999999999999998 ) ), new THREE.Line3( new THREE.Vector3( -7.499999999999998, 8.881784197001252e-16, 5.999999999999998 ), new THREE.Vector3( 7.499999999999998, 8.881784197001252e-16, 5.999999999999998 ) ), new THREE.Line3( new THREE.Vector3( 7.499999999999998, 8.881784197001252e-16, 5.999999999999998 ), new THREE.Vector3(7.499999999999998, 9.000000000000002, 12) ), new THREE.Line3( new THREE.Vector3(7.499999999999998, 9.000000000000002, 12), new THREE.Vector3(-7.499999999999998, 9.000000000000002, 12) ) ], plane2: new Plane(new Vector3(-1, 0, 0), -7.5), lines2: [ new THREE.Line3( new THREE.Vector3(-7.5, 9, -12), new THREE.Vector3(-7.5, 0, -6) ), new THREE.Line3( new THREE.Vector3(-7.5, 0, -6), new THREE.Vector3(-7.5, 0, 6) ), new THREE.Line3( new THREE.Vector3(-7.5, 0, 6), new THREE.Vector3(-7.5, 9, 12) ), new THREE.Line3( new THREE.Vector3(-7.5, 9, 12), new THREE.Vector3(-7.5, 4.5, 0) ), new THREE.Line3( new THREE.Vector3(-7.5, 4.5, 0), new THREE.Vector3(-7.5, 9, -12) ) ] })51:T55e,eq = ({ prompt: "write a function eq, to check two planes, vector3 or line3 are equals with an epsilon of 1e-4", time: 1714231307450, comment: "Define a function to check equality between two Planes, Vector3s, or Line3s with a specified epsilon tolerance" } && function eq(a, b, epsilon = 1e-4) { if (a instanceof Plane && b instanceof Plane) { return ( a.normal.equals(b.normal, epsilon) && Math.abs(a.constant - b.constant) < epsilon ); } else if (a instanceof Array && b instanceof Array) { return ( a.length == b.length && a.reduce((acc, item, i) => acc && eq(item, b[i]), true) ); } else if (a instanceof Vector3 && b instanceof Vector3) { return eq(a.x, b.x) && eq(a.y, b.y) && eq(a.z, b.z); } else if (a instanceof Line3 && b instanceof Line3) { const aDir = a.delta(new Vector3().normalize()); const bDir = b.delta(new Vector3()).normalize(); return ( (a.start.distanceToSquared(b.start) < epsilon * epsilon && a.end.distanceToSquared(b.end) < epsilon * epsilon) || (a.start.distanceToSquared(b.end) < epsilon * epsilon && a.end.distanceToSquared(b.start) < epsilon * epsilon) ); } else if (typeof a == "number" && typeof b == "number") { return Math.abs(a - b) < epsilon; } return a == b; })52:Tb1e,intersectLines = ({ prompt: "write intersectLines that takes two Line3 and finds the nearest point to both of them", time: 1714205796155, comment: "Define a function to find the nearest point between two Line3 objects" } && function intersectLines( line1, line2, { epsilon = 1e-4, includeOverlap = false, clamp = false } = {} ) { // Extract start and end points from Line3 objects let start1 = line1.start, end1 = line1.end; let start2 = line2.start, end2 = line2.end; // Direction vectors for both lines let dir1 = new Vector3().subVectors(end1, start1).normalize(); let dir2 = new Vector3().subVectors(end2, start2).normalize(); // Calculate the shortest vector between two lines (a vector perpendicular to both direction vectors) let normal = new Vector3().crossVectors(dir1, dir2).normalize(); // Compute the plane normal to dir2 passing through start2 let planeNormal2 = new Vector3().crossVectors(normal, dir2); // Calculate intersection of line1 with the plane defined above let dot = planeNormal2.dot(dir1); if (Math.abs(dot) < 1e-10) { // Lines are parallel and there is no single intersection point return includeOverlap ? overlapParallelLines(line1, line2, { epsilon, clamp }) : null; } let diff = new Vector3().subVectors(start2, start1); let t1 = planeNormal2.dot(diff) / dot; let closestPointLine1 = new Vector3().addVectors( start1, dir1.clone().multiplyScalar(t1) ); // Compute the plane normal to dir1 passing through start1 let planeNormal1 = new Vector3().crossVectors(normal, dir1); // Calculate intersection of line2 with the plane defined above dot = planeNormal1.dot(dir2); if (Math.abs(dot) < 1e-10) { // Lines are parallel and there is no single intersection point return null; } let t2 = planeNormal1.dot(new Vector3().subVectors(start1, start2)) / dot; let closestPointLine2 = new Vector3().addVectors( start2, dir2.clone().multiplyScalar(t2) ); if ( closestPointLine1.distanceToSquared(closestPointLine2) < epsilon * epsilon ) { const closest = new Vector3() .addVectors(closestPointLine1, closestPointLine2) .multiplyScalar(0.5); // Return the midpoint of closest points as the closest approach if (clamp) { const clampedClosest1 = line1.closestPointToPoint( closest, true, new Vector3() ); const clampedClosest2 = line2.closestPointToPoint( closest, true, new Vector3() ); if (clampedClosest1.distanceTo(clampedClosest2) >= epsilon) { return null; } } return closest; } else { return null; } })53:T68b,overlapParallelLines = ({ prompt: "Assuming two lines are parallel, express the overlap as a Line, or null if they are not colinear", time: 1715080658628, comment: "Define a function to calculate the overlap of two parallel lines and return it as a Line3, or null if they are not colinear or do not overlap." } && function overlapParallelLines( line1, line2, { epsilon = 1e-4, clamp = false } = {} ) { // Project line2's points onto line1 to check for overlap let start1 = line1.closestPointToPoint(line2.start, false, new Vector3()); let end1 = line1.closestPointToPoint(line2.end, false, new Vector3()); // Check if the projections are colinear within a small epsilon threshold if (start1.distanceTo(line2.start) > epsilon) return null; if (end1.distanceTo(line2.end) > epsilon) return null; // Ensure start1 is before end1 on line1 if ( line1.delta(new Vector3()).dot(end1.clone().sub(line1.start)) < line1.delta(new Vector3()).dot(start1.clone().sub(line1.start)) ) { [start1, end1] = [end1, start1]; // Swap points if necessary } // Determine the overlap range on line1 const overlapStart = line1.delta(new Vector3()).dot(start1.clone().sub(line1.start)) >= 0 ? start1 : line1.start; const overlapEnd = line1.delta(new Vector3()).dot(end1.clone().sub(line1.start)) <= line1.delta(new Vector3()).dot(line1.end.clone().sub(line1.start)) ? end1 : line1.end; // Check if there's a valid overlap if (overlapStart.distanceTo(overlapEnd) < epsilon) return null; return new Line3(overlapStart, overlapEnd); })54:T49d,intersectPlanes = ({ prompt: "write a function to calculate the intersection of two planes as a Line3, called intersectPlanes", time: 1714157821773, comment: "Define a function to calculate the intersection of two planes as a Line3" } && function intersectPlanes(plane1, plane2) { const line = new Line3(); // Calculate the intersection of two planes const direction = new Vector3().crossVectors(plane1.normal, plane2.normal); const denominator = direction.lengthSq(); if (denominator < 1e-3) { // No intersection, parallel planes return null; } const lineDir1 = new Vector3().crossVectors(plane1.normal, direction); const lineDir2 = new Vector3().crossVectors(plane2.normal, direction); const line1Start = plane1.normal.clone().multiplyScalar(-plane1.constant); const line2Start = plane2.normal.clone().multiplyScalar(-plane2.constant); const point = intersectLines( new Line3(line1Start, line1Start.clone().add(lineDir1)), new Line3(line2Start, line2Start.clone().add(lineDir2)) ); if (!point) { return null; } return new Line3(point, point.clone().add(direction)); })55:T53b,findIntersectingVertices = ({ prompt: "given an array of lines, find all intersecting vertices and return a map of unique vertices mapped to an array of lines that are adjacent", time: 1714233337197, comment: "Function to find intersecting vertices from an array of lines and map them to adjacent lines" } && function findIntersectingVertices(lines) { const verticesMap = new Map(); // Compare each line with every other line to find intersections for (let i = 0; i < lines.length; i++) { for (let j = i + 1; j < lines.length; j++) { const intersection = intersectLines(lines[i], lines[j]); if (intersection) { // If intersection exists, add or update the map const key = `${intersection.x.toFixed(4)},${intersection.y.toFixed( 4 )},${intersection.z.toFixed(4)}`; // Use a string key to handle floating-point precision issues if (!verticesMap.has(key)) { verticesMap.set(key, []); } verticesMap.get(key).push(lines[i]); verticesMap.get(key).push(lines[j]); } } } const result = new Map(); // Deduplicate lines associated with each vertex verticesMap.forEach((value, key) => { result.set(parseVector3(key), dedupe(eq, value)); }); return result; })56:T48a,surfaceDistanceToPoint = ({ prompt: "write a rectangularSurfaceToPoint distance function that accounts for the edges. A surface is defined as 4 coordinates \n0: Array(4) [\n 0: Array(3) [-10, 1, 1]\n 1: Array(3) [0, 1, 1]\n 2: Array(3) [0, -2, 1]\n 3: Array(3) [-10, -2, 1]\n]\nWe should reuse Triangle", time: 1714286534554, comment: "Define a function to calculate the distance from a point to a rectangular surface, using two triangles to account for the entire surface" } && function surfaceDistanceToPoint(surface, point) { const [v0, v1, v2, v3] = surface.map((coords) => new Vector3(...coords)); const pointVector = new Vector3(...point); // Calculate distances to two triangular parts of the rectangle const triangle1 = new Triangle(v0, v1, v2); const triangle2 = new Triangle(v0, v2, v3); const distance1 = triangle1 .closestPointToPoint(pointVector, new Vector3()) .distanceTo(pointVector); const distance2 = triangle2 .closestPointToPoint(pointVector, new Vector3()) .distanceTo(pointVector); // Return the minimum distance return Math.min(distance1, distance2); })57:T7d4,findIntersectionTransitions = ({ prompt: "Given two shapes (plane1, lines1, plane2, line2), find candidate intersection transitions between them that is on their bounds. tip, the transitions will be on the line intersection of their two planes. ", time: 1715074143953 } && function findIntersectionTransitions(plane1, lines1, plane2, lines2) { // Find the line of intersection between the two planes const unitIntersectionLine = intersectPlanes(plane1, plane2); if (!unitIntersectionLine) { return []; // No intersection line if planes are parallel } const intersectionLine = extendLine(unitIntersectionLine, 1e5); // Find segments of the intersection line that are within the bounds of the two shapes const transitions1 = []; const transitions2 = []; lines1.forEach((line) => { // Check if the intersection line intersects with any of the shape's lines const intersection = intersectLines(intersectionLine, line, { includeOverlap: true, clamp: true }); if (intersection) { if (intersection.isVector3) { transitions1.push(intersection); } else { transitions1.push(intersection.start); transitions1.push(intersection.end); } } }); lines2.forEach((line) => { // Check if the intersection line intersects with any of the shape's lines const intersection = intersectLines(intersectionLine, line, { includeOverlap: true, clamp: true }); if (intersection) { if (intersection.isVector3) { transitions2.push(intersection); } else { transitions2.push(intersection.start); transitions2.push(intersection.end); } } }); return dedupe(eq, [...transitions1, ...transitions2]).sort( (a, b) => new Vector3().subVectors(a, intersectionLine.start).length() - new Vector3().subVectors(b, intersectionLine.start).length() ); })58:T6f9,intersectShapes = ({ prompt: "findIntersectionTransitions gives and ordered list of points that (may) lie on the boundary of a shared line between two Shape3D. Use isInsideShape3D to check the midpoint between consecutive pair, so we can return a minimal list of Line3 that lie on the shared edge of the two shapes. Call this intersectShapes", time: 1715180457167, comment: "Define a function to find minimal list of Line3 that lie on the shared edge between two Shape3D by using intersection transitions and checking midpoints for containment within both shapes." } && function intersectShapes(plane1, boundaries1, plane2, boundaries2) { const transitions = findIntersectionTransitions( plane1, boundaries1.flat(), plane2, boundaries2.flat() ); if (transitions.length === 0) return []; const sharedLines = []; let classification = "--", edgeStart = undefined; for (let i = 0; i < transitions.length - 1; i++) { const midpoint = new Vector3() .addVectors(transitions[i], transitions[i + 1]) .multiplyScalar(0.5); // Check if the midpoint is inside both shapes const nextClassification = classifyPointOnShape(midpoint, plane1, boundaries1) + "-" + classifyPointOnShape(midpoint, plane2, boundaries2); if (nextClassification == classification) { } else { if (edgeStart) sharedLines.push(new Line3(edgeStart, transitions[i])); if (!nextClassification.includes("OUTSIDE")) edgeStart = transitions[i]; } classification = nextClassification; } if (!classification.includes("OUTSIDE")) sharedLines.push( new Line3(edgeStart, transitions[transitions.length - 1]) ); return sharedLines; })59:T638,testIntersectLinesRandom = ({ prompt: "Write a randomized test for intersectLine. Generate a random intersection point, two random directions.. Then generate two pairs of start and end points for each direction. Then create lines and intersect them, checking their intesection point was the one in the beginning", time: 1714203329492, comment: "Write a randomized test for the intersectLines function" } && geometrySuite.test("intersectLines random test", () => { // Generate a random intersection point const intersectionPoint = new Vector3() .random() .subScalar(0.5) .multiplyScalar(100); // Generate two random directions const direction1 = new Vector3().randomDirection(); const direction2 = new Vector3().randomDirection(); // Generate start and end points for two lines const start1 = intersectionPoint .clone() .addScaledVector(direction1, -Math.random() * 50); const end1 = intersectionPoint .clone() .addScaledVector(direction1, Math.random() * 50); const start2 = intersectionPoint .clone() .addScaledVector(direction2, -Math.random() * 50); const end2 = intersectionPoint .clone() .addScaledVector(direction2, Math.random() * 50); // Create lines const line1 = new Line3(start1, end1); const line2 = new Line3(start2, end2); // Intersect the lines const result = intersectLines(line1, line2); // Check if the intersection point matches the one we started with expect(intersectionPoint.distanceTo(result)).toBeLessThan(1e-3); }))5a:T579,testIntersectPlanesRandom = ({ prompt: "Write a randomized test for intersectPlane. Generate 2 random planes and find the line intersection. Generate a random point, and find its nearest point on the line. Then measure the distance of that point-on-the-intersection-line to the two planes, it should be (near) 0.", time: 1714199166116, comment: "Write a randomized test for the intersectPlanes function" } && geometrySuite.test("intersectPlanes random test", () => { // Generate two random planes const plane1 = new Plane( new Vector3().randomDirection(), Math.random() * 2 - 1 ); const plane2 = new Plane(XZ.normal, 1); // Find the line of intersection const intersectionLine = intersectPlanes(plane1, plane2); // Generate a random point const randomPoint = new Vector3().randomDirection().multiplyScalar(20); // Find the nearest point on the intersection line const nearestPoint = intersectionLine.closestPointToPoint( randomPoint, false, new Vector3() ); // Calculate the distances to the planes const distanceToPlane1 = plane1.distanceToPoint(nearestPoint); const distanceToPlane2 = plane2.distanceToPoint(nearestPoint); // The distances should be very close to zero expect(Math.abs(distanceToPlane1)).toBeLessThan(1e-3); expect(Math.abs(distanceToPlane2)).toBeLessThan(1e-3); }))5b:T800,chooseBasis = ({ prompt: "chooseBasis for plane, based on whether the orthogonal plane is XY, XZ or ZY plane, return the appropriate axis aligned basis vectors.", time: 1714319643795, comment: "Define a function to choose basis vectors for a plane based on its orientation relative to the XY, XZ, or YZ planes" } && function chooseBasis(plane) { const guess = (plane) => { // Calculate the normal vector of the plane const normal = plane.normal.clone().normalize(); // Choose the basis vectors depending on the closest major plane (XY, XZ, or YZ) if (normal.dot(new THREE.Vector3(1, 0, 0)) > 0.9) { // Aligned with X-axis (right face) return [new THREE.Vector3(0, 1, 0), new THREE.Vector3(0, 0, -1)]; } else if (normal.dot(new THREE.Vector3(-1, 0, 0)) > 0.5) { // Aligned with -X-axis (left face) return [new THREE.Vector3(0, 1, 0), new THREE.Vector3(0, 0, 1)]; } else if (normal.dot(new THREE.Vector3(0, 1, 0)) > 0.5) { // Aligned with Y-axis (top face) return [new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, 0, 1)]; } else if (normal.dot(new THREE.Vector3(0, -1, 0)) > 0.5) { // Aligned with -Y-axis (bottom face) return [new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, 0, -1)]; } else if (normal.dot(new THREE.Vector3(0, 0, 1)) > 0.5) { // Aligned with Z-axis (front face) return [new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, -1, 0)]; } else if (normal.dot(new THREE.Vector3(0, 0, -1)) > 0.5) { // Aligned with -Z-axis (back face) return [new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, 1, 0)]; } // Default to XY plane if none of the conditions match return [new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, 1, 0)]; }; const [basisX, basisY] = guess(plane); const x = new THREE.Vector3() .crossVectors(basisY, plane.normal) .normalize(); return [x, new THREE.Vector3().crossVectors(plane.normal, x).normalize()]; })5c:T891,createShape = ({ prompt: "createShape. Given a Plane and an array of 2D points [x, y][], a color and an opacity, build a positioned Mesh using ShapeGeometry ", time: 1714307169388, comment: "Define a function to create a Mesh from a ShapeGeometry defined by a Plane and an array of 2D points, with specified color and opacity" } && function createShape( plane, boundaries, { color = 0x00ff00, opacity = 1, blobURL } = {} ) { const shape = new THREE.Shape(); const max = [boundaries[0][0][0], boundaries[0][0][1]]; const min = [boundaries[0][0][0], boundaries[0][0][1]]; // Start at the first point boundaries.forEach((points) => { shape.moveTo(points[0][0], points[0][1]); // Line to each subsequent point points.slice(1).forEach((point) => { if (point[0] < min[0]) min[0] = point[0]; if (point[1] < min[1]) min[1] = point[1]; if (point[0] > max[0]) max[0] = point[0]; if (point[1] > max[1]) max[1] = point[1]; shape.lineTo(point[0], point[1]); }); shape.lineTo(points[0][0], points[0][1]); // close the shape }); let texture = undefined; if (blobURL) { texture = loader.load(blobURL); texture.repeat.set(1 / (max[0] - min[0]), -1 / (max[1] - min[1])); texture.offset.set( -min[0] / (max[0] - min[0]), min[1] / (max[1] - min[1]) ); texture.center.set(0, 1); } const geometry = new THREE.ShapeGeometry(shape); const material = new THREE.MeshBasicMaterial({ color: color, side: THREE.DoubleSide, transparent: true, //opacity < 1, opacity: opacity, ...(blobURL && { map: texture }) }); const mesh = new THREE.Mesh(geometry, material); // Set the position and orientation of the mesh to match the plane const [basisX, basisY] = chooseBasis(plane); const basisZ = new THREE.Vector3().crossVectors(basisX, basisY).normalize(); const rotationMatrix = new THREE.Matrix4().makeBasis( basisX, basisY, basisZ ); mesh.applyMatrix4(rotationMatrix); mesh.position.copy(plane.coplanarPoint(new Vector3())); return mesh; })5d:Ta56,scene = { const scene = new THREE.Scene(); scene.background = new THREE.Color(0x000000); if (showEdges && edges) { (focusEdges ? [focusEdges] : edges).forEach((boundaries) => { boundaries.forEach((lines) => lines.forEach((line) => { scene.add(createLineSegment(line, 0xff00ff)); scene.add( createPoint(line.start, { color: 0xff00ff }) ); scene.add( createPoint(line.end, { color: 0xff00ff }) ); }) ); }); } if (showSurfaces) { (focusSurfaceIdx !== -1 ? [surfaces[focusSurfaceIdx]] : surfaces).forEach( (surface) => { scene.add(createMesh(surface, 0xcd7f32, 0.3)); } ); } if (showShapes) { if (focusShape === undefined) { shapes2D.forEach((points, plane) => { const mesh = createShape(plane, points, { color: 0xffffff, opacity: 0.4 }); scene.add(mesh); scene.add( new THREE.ArrowHelper(plane.normal, mesh.position, 25, 0xff0000) ); }); } else { const mesh = createShape(focusPlane, shapes2D.get(focusPlane), { color: 0xffffff, opacity: 0.4 }); scene.add(mesh); scene.add( new THREE.ArrowHelper(focusPlane.normal, mesh.position, 25, 0xff0000) ); } } if (focusJoint) { [ [focusJoint.plane1, focusJoint.lines1], [focusJoint.plane2, focusJoint.lines2] ].forEach(([plane, lines]) => { lines.forEach((line) => { scene.add(createLineSegment(line, 0xffff00)); scene.add( createPoint(line.start, { color: 0xffff00 }) ); scene.add( createPoint(line.end, { color: 0xffff00 }) ); }); focusJoint.sharedEdges.forEach((sharedEdge) => { scene.add(createLineSegment(sharedEdge, 0xff00ff)); scene.add( createPoint(sharedEdge.start, { color: 0xff00ff }) ); scene.add( createPoint(sharedEdge.end, { color: 0xff00ff }) ); }); }); } if (showPlan || showParts) { (focusPlane ? [focusPlane] : planBlobs.keys()).forEach((plane) => { const shape = shapes2D.get(plane); if (!shape) return; const mesh = createShape(plane, [getBoundingBoxCorners(shape)], { color: 0xffffff, opacity: 1, blobURL: showPlan ? planBlobs.get(plane) : partBlobs.get(plane) }); scene.add(mesh); }); } return scene; }5e:T519,markdown_skill = ({ prompt: "Write a markdown skill cell", time: 1699719020249, comment: "Complex markdown skill cell" } && md` ## Markdown Skill This demonstrates advanced usage of markdown \`md\` literal

example

${md`## Mermaid Diagram ${mermaid` graph TB; A-->B; A-->C; B-->D; C-->D; `} ## Live JavaScript Execution ${(function () { const span = htl.html``; let count = 0; span.textContent = count; setInterval(() => { count++; span.textContent = count; }, 1000); return span; })()} ## KaTeX The quadratic formula is ${tex`x = {-b \pm \sqrt{b^2-4ac} \over 2a}`} ${tex` \begin{aligned} (a+b)^2 &= (a+b)(a+b) \\ &= a^2 + 2ab + b^2 \end{aligned} `} ## Details/Summary

Expandable content

${md` - Item 1 - Item 2 - Item 3 `}

## HTML Figure

Figure: Endpoint Services. Click to visit the Roboco-op subreddit.

## Blocks \`Backticks\` need to be escaped, it is easier to use ~ instead ~~~js () => throw Error() ~~~ `}

`)5f:[{"id":"0e45096ce808d74e9c747b21b1b7fe6e0770e01cf0df7e8fb8d1a0d9df829a6f68fc791f777645ab1bf66813b5386592cb23aab8317a4c4a1a9bc5bd46b1af75","href":"https://static.observableusercontent.com/files/0e45096ce808d74e9c747b21b1b7fe6e0770e01cf0df7e8fb8d1a0d9df829a6f68fc791f777645ab1bf66813b5386592cb23aab8317a4c4a1a9bc5bd46b1af75","name":"image.png","type":"image/png","lastModified":1724612920074.502,"size":1030651}] 31:{"id":"995853743b593ab0","slug":"lazer-cut-shell-joints","title":"Lazer Cuttering Plan Compiler","thumbnail":"65d68a429862eaf972a5e304cf98f8ba3b29590534640cc2c2c02327301f78ae","access_level":"unlisted","create_time":"$D2024-04-24T05:06:11.751Z","update_time":"$D2025-02-22T05:45:21.853Z","view_time":null,"first_public_time":null,"has_unpublished_edits":null,"fork":{"id":"4d9b7665f00a916c","slug":"three-js","title":"Three.js","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"7db5ed2b0697d645","login":"tomlarkworthy","name":"Tom Larkworthy","avatar_url":"https://avatars-next.observableusercontent.com/47327a8bc1966f2186dcb3ebf4b7ee6e4e7ab9a5c2a07405aff57200ea778f71","tier":"starter_2024"},"version":12061,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"5215f6ec4a999d40","login":"tomlarkworthy","name":"Tom Larkworthy","avatar_url":"https://avatars-next.observableusercontent.com/47327a8bc1966f2186dcb3ebf4b7ee6e4e7ab9a5c2a07405aff57200ea778f71","tier":null}],"members":[{"type":"individual","id":"5215f6ec4a999d40","login":"tomlarkworthy","name":"Tom Larkworthy","avatar_url":"https://avatars-next.observableusercontent.com/47327a8bc1966f2186dcb3ebf4b7ee6e4e7ab9a5c2a07405aff57200ea778f71","tier":null,"role":"editor"},{"type":"team","id":"7db5ed2b0697d645","login":"tomlarkworthy","name":"Tom Larkworthy","avatar_url":"https://avatars-next.observableusercontent.com/47327a8bc1966f2186dcb3ebf4b7ee6e4e7ab9a5c2a07405aff57200ea778f71","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"ac5d5920401a8f5b","slug":"lazer-cutting","title":"lazer cutting","owner":{"id":"7db5ed2b0697d645","login":"tomlarkworthy","name":"Tom Larkworthy"}},"type":"notebook","body":{"title":"Lazer Cuttering Plan Compiler","cells":[{"id":242,"value":"# Lazer Cuttering Plan Compiler\n\nGiven the faces, generate the lazer cutter part plans, such that touching faces are joined with a box or mortoise joint\n\n${await FileAttachment(\"image.png\").image({width: 400})}","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":266,"value":"

\n ${renderer.domElement}\n

\n ${reversibleAttach(assemble_app, viewof partsPanel)}\n

\n ${reversibleAttach(assemble_app, viewof configuration)}\n ${reversibleAttach(assemble_app, viewof planesPanel)}\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"app","database":"$undefined"},{"id":10277,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":6262,"value":"\n## TODO\n\n#### Bugs\n\n- Mortise Joints\n - can overlap beginning of joint\n - corner calculations are broken? Might be join.lines change\n\n#### Improvements\n\n- Make parts a single line SVG parts so the are grouped when imported or nested\n- fixed SVG precision of coords\n- mirror parts?\n- correctly overlay parts\n- divide planes into parts\n- Big selector for templates with flavours (CMS?)\n\n\n#### Roadmap\n\n\n#### Ideas\n\n- Binary encode assembly instructions into tooth pattern\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":11688,"value":"## Notebook Debugger\n\nThis slows the app but is useful to diagnose dataflow problems","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10702,"value":"import { _ndd } from \"@tomlarkworthy/ndd\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10705,"value":"// ndd = _ndd","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10614,"value":"viewof assemble_app = Inputs.toggle({\n label: \"assemble app\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10238,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10232,"value":"viewof compositeConfig = Inputs.toggle({\n label: \"compositeConfig\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4393,"value":"viewof fingerWidth = Inputs.range([0.1, 10], {\n label: \"finger widths\",\n value: 3,\n step: 0.01\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4237,"value":"viewof material_thickness = Inputs.range([0.01, 10], {\n label: \"material thickness\",\n value: 3,\n step: 0.01\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10087,"value":"viewof numberJoints = Inputs.toggle({\n label: \"number joints (slow)\",\n value: false\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11702,"value":"#### Box Template","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4313,"value":"viewof boxParams = {\n ({\n prompt:\n \"Generate a UI for a box. It should let the width, height and depth be set with a green build button\",\n time: 1715503629215,\n comment:\n \"Create a UI for setting up a box with width, height, and depth inputs and a green build button.\"\n });\n const form = view`

Box Template

\n ${[\n \"width\",\n Inputs.range([0, 1000], { label: \"width (mm)\", value: 10, step: 0.1 })\n ]} \n ${[\n \"height\",\n Inputs.range([0, 1000], {\n label: \"height (mm)\",\n value: 22,\n step: 0.1\n })\n ]} \n ${[\n \"depth\",\n Inputs.range([0, 1000], { label: \"depth (mm)\", value: 16, step: 0.1 })\n ]}\n `;\n\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4360,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11704,"value":"#### Flange Template","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4452,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4456,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11708,"value":"#### Angle (debug) Template","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":7190,"value":"viewof angleParams = ({\n prompt:\n \"Write a UI for a Flange Template. Requires flange diameter, inner width, inner heigh, depth\",\n time: 1715628254526,\n comment:\n \"Create a UI for setting up a flange with inputs for flange diameter, inner width, inner height, and depth, along with a green apply button.\"\n} &&\n view`

Angle Tester Template

\n ${[\n \"angle\",\n Inputs.range([-170, 170], {\n label: \"Angle (degrees)\",\n value: 90,\n step: 0.01\n })\n ]}\n ${[\n \"length\",\n Inputs.range([0, 50], {\n label: \"Length (mm)\",\n value: 20\n })\n ]}\n `)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5931,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11710,"value":"#### T (debug) Template","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10199,"value":"viewof tParams = {\n ({\n prompt:\n \"Generate a UI for a T. It should let the width, height and depth be set with a green build button\",\n time: 1715503629215,\n comment:\n \"Create a UI for setting up a box with width, height, and depth inputs and a green build button.\"\n });\n const form = view`

T Template

\n ${[\n \"width\",\n Inputs.range([0, 1000], { label: \"width (mm)\", value: 10, step: 0.1 })\n ]} \n ${[\n \"height\",\n Inputs.range([0, 1000], {\n label: \"height (mm)\",\n value: 22,\n step: 0.1\n })\n ]} \n ${[\n \"depth\",\n Inputs.range([0, 1000], { label: \"depth (mm)\", value: 16, step: 0.1 })\n ]}\n `;\n\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10208,"value":"apply_t = {\n ({\n prompt: \"Convert the tParams into an 2-peice T shaped part\",\n time: 1715503629215\n });\n const w = tParams.width / 2;\n const h = tParams.height / 2;\n const d = tParams.depth / 2;\n viewof surfaces.value = [\n // Horz face\n [\n // vertical face\n [w, h, d],\n [w, h, -d],\n [-w, h, -d],\n [-w, h, d]\n ],\n [\n // vertical face\n [0, h, d],\n [0, h, -d],\n [0, -h, -d],\n [0, -h, d]\n ]\n ];\n viewof surfaces.dispatchEvent(new Event(\"input\"));\n viewof filename.value = `t(${w}, ${d}, ${h}))`;\n viewof filename.dispatchEvent(new Event(\"input\"));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11716,"value":"#### Corner Template","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":11724,"value":"viewof cornerAngleParams = view`

Corner Angle

\n ${[\n \"overhang_width\",\n Inputs.range([0, 1000], {\n label: \"overhang_width (mm)\",\n value: 20,\n step: 0.1\n })\n ]} \n ${[\n \"overhang_height\",\n Inputs.range([0, 1000], {\n label: \"overhang_height (mm)\",\n value: 20,\n step: 0.1\n })\n ]} \n ${[\n \"total_width\",\n Inputs.range([0, 1000], {\n label: \"total_width (mm)\",\n value: 50,\n step: 0.1\n })\n ]} \n ${[\n \"total_height\",\n Inputs.range([0, 1000], {\n label: \"total_height (mm)\",\n value: 30,\n step: 0.1\n })\n ]} \n ${[\n \"depth\",\n Inputs.range([0, 1000], { label: \"depth (mm)\", value: 30, step: 0.1 })\n ]}\n `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11735,"value":"apply_corner_angle = {\n const {\n total_width: w,\n total_height: h,\n depth: d,\n overhang_width: ow,\n overhang_height: oh\n } = cornerAngleParams;\n viewof surfaces.value = [\n // Horz face\n [\n // vertical face\n [w / 2, -h, 0],\n [w / 2, 0, 0],\n [ow / 2, 0, 0],\n [ow / 2, oh, 0],\n [-ow / 2, oh, 0],\n [-ow / 2, 0, 0],\n [-w / 2, 0, 0],\n [-w / 2, -h, 0]\n ],\n [\n // depth face\n [w / 2, 0, 0],\n [w / 2, 0, d],\n [-w / 2, 0, d],\n [-w / 2, 0, 0]\n ]\n ];\n debugger;\n viewof surfaces.dispatchEvent(new Event(\"input\"));\n viewof filename.value = `t(${w}, ${d}, ${h}))`;\n viewof filename.dispatchEvent(new Event(\"input\"));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5794,"value":"### File Importer","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5797,"value":"viewof file = Inputs.file({\n label: \"Asset file (obj, gltf, fbx)\",\n accept: \".obj,.fbx,.gltf\",\n required: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9894,"value":"objText = file.text()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5806,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9839,"value":"viewof minThickness = Inputs.range([0, 100], {\n label: \"minimum thickness\",\n value: viewof material_thickness.value\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10076,"value":"viewof rescale = Inputs.range([0.1, 100], { label: \"rescale\", value: 1 })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9887,"value":"viewof invert_normals = Inputs.toggle({ label: \"invert normals\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6177,"value":"viewof recurseUnite = Inputs.toggle({\n label: \"recursive surface merge (fixes cracks sometimes)\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5672,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10066,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10093,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10567,"value":"viewof exclude_planes = Inputs.input([])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5889,"value":"viewof excluded_planes_view = domView()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10757,"value":"excluded_planes_view_updater = {\n viewof excluded_planes_view.value = Inputs.bind(\n Inputs.select(surface_planes_unfiltered, {\n multiple: true,\n label: \"Exclude Planes\",\n format: toString\n }),\n viewof exclude_planes,\n invalidation\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10493,"value":"exclude_planes","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5836,"value":"## Visualisation Controls","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10326,"value":"viewof compositeVisualizationConfig = Inputs.toggle({\n label: \"composite visualization config\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10320,"value":"visualizationPane = view`

\n \n

view

\n ${reversibleAttach(compositeVisualizationConfig, viewof showSurfaces)}\n ${reversibleAttach(compositeVisualizationConfig, viewof showShapes)}\n ${reversibleAttach(compositeVisualizationConfig, viewof showEdges)}\n ${reversibleAttach(compositeVisualizationConfig, viewof showPlanes)}\n ${reversibleAttach(compositeVisualizationConfig, viewof showPlan)}\n ${reversibleAttach(compositeVisualizationConfig, viewof showParts)}\n

view specific

\n ${tabbedPane({\n part: view`

\n ${reversibleAttach(compositeVisualizationConfig, viewof strokeWidth)}\n

`\n })}\n

bling

\n ${reversibleAttach(compositeVisualizationConfig, viewof spin)}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1807,"value":"viewof spin = Inputs.toggle({ label: \"spin camera\", value: true })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1803,"value":"viewof step = Inputs.range([0, 9], {\n label: \"algorithm step\",\n step: 1,\n value: 8\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1987,"value":"viewof focusPlaneIdx = Inputs.range([-1, 10000], {\n label: \"focus plane\",\n value: -1,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4947,"value":"viewof focusSurfaceIdx = Inputs.range([-1, 10000], {\n label: \"focus surface\",\n value: -1,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3558,"value":"viewof focusJointIdx = Inputs.range([-1, joints.length - 1], {\n label: \"focus joint\",\n value: -1,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5880,"value":"viewof strokeWidth = Inputs.range([1, 10], {\n label: \"part draw stroke width\",\n value: 4\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1827,"value":"stepEffect = {\n const stepMap = [\n [0],\n [1],\n [2],\n [3],\n [2, 3],\n [1, 2, 3],\n [4],\n [2, 3, 5],\n [2, 5],\n [5]\n ];\n const controls = [\n viewof showSurfaces,\n viewof showPlanes,\n viewof showEdges,\n viewof showShapes,\n viewof showPlan,\n viewof showParts\n ];\n controls.forEach((c) => (c.value = false));\n stepMap[step].forEach((i) => (controls[i].value = true));\n controls.forEach((c) => c.dispatchEvent(new Event(\"input\")));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10515,"value":"viewof selected_planes = Inputs.input(surface_planes)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10589,"value":"### Planes Panel","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10595,"value":"viewof compositePlanesPanel = Inputs.toggle({\n label: \"assemble planes planel\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10602,"value":"viewof planesPanel = view`

planes

\n${tabbedPane({\n active: reversibleAttach(compositePlanesPanel, viewof planes_view),\n excluded: reversibleAttach(exclude_planes, viewof excluded_planes_view)\n})}\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10462,"value":"#### Planes component","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10460,"value":"viewof planes_view = domView()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10762,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10896,"value":"### Parts Panel","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10901,"value":"viewof assemblePartsPanel = Inputs.toggle({\n label: \"assemble parts panel\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10773,"value":"viewof partsPanel = domView()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10779,"value":"partsPanelUpdater = {\n viewof partsPanel.value = view`\n

parts

\n ${html`

selected 🧩

\n ${reversibleAttach(assemblePartsPanel, viewof scale)}\n ${reversibleAttach(assemblePartsPanel, viewof focusPart)}\n click to download as svg\n

`}\n \n

download all parts as zip

\n ${reversibleAttach(assemblePartsPanel, viewof filename)}\n ${reversibleAttach(assemblePartsPanel, downloadButton)}\n

\n `;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4245,"value":"viewof scale = Inputs.range([0.01, 10], {\n label: \"part zoom\",\n value: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9799,"value":"viewof filename = Inputs.text({\n label: \"filename\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9757,"value":"downloadButton = {\n ({\n prompt: \"create a button that downloads all parts as a zip\",\n time: 1718465121619,\n comment:\n \"Create a button that, when clicked, downloads all parts as a zip file. The parts are assumed to be in `viewof surfaces`.\"\n });\n const file = filename || \"parts\";\n const z = new zip();\n const partsFolder = z.folder(file);\n const blobPromises = [];\n // Assuming viewof surfaces contains the parts in some format (e.g., JSON)\n partBlobs.forEach((part, plane, index) => {\n blobPromises.push(fetch(part).then((r) => r.blob()));\n });\n const blobs = await Promise.all(blobPromises);\n\n blobs.forEach((blob, index) =>\n partsFolder.file(`part${index + 1}.svg`, blob)\n );\n\n const content = await z.generateAsync({ type: \"blob\" });\n\n return button(content, `${file}.zip`);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1339,"value":"## Algorithm","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1315,"value":"viewof surfaces = Inputs.input([\n // strut 1\n [\n [-10, 1, 1],\n [0, 1, 1],\n [0, -2, 1],\n [-10, -2, 1]\n ],\n [\n [-10, 1, -1],\n [0, 1, -1],\n [0, -2, -1],\n [-10, -2, -1]\n ],\n [\n [-10, 1, -1],\n [0, 1, -1],\n [0, 1, 1],\n [-10, 1, 1]\n ],\n [\n [-10, -2, -1],\n [0, -2, -1],\n [0, -2, 1],\n [-10, -2, 1]\n ],\n // strut 2\n [\n [0, -10, 1],\n [0, 1, 1],\n [2, 1, 1],\n [2, -10, 1]\n ],\n [\n [2, -10, 1],\n [2, 1, 1],\n [2, 1, -4],\n [2, -10, -4]\n ],\n [\n [0, -10, 1],\n [0, 1, 1],\n [0, 1, -4],\n [0, -10, -4]\n ],\n [\n [0, -10, -4],\n [0, 1, -4],\n [2, 1, -4],\n [2, -10, -4]\n ]\n])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1439,"value":"surface_planes_unfiltered = dedupe(eq, surfaces.map(surfaceToPlane))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5887,"value":"surface_planes = surface_planes_unfiltered.filter(\n (p) => !exclude_planes.includes(p)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4501,"value":"### Project surfaces to 2D paths and simplify","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4980,"value":"viewof showSurfaces = Inputs.toggle({\n label: \"show surfaces?\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4509,"value":"vectorSurfaces = surfaces.map((points) =>\n points.map((point) => new Vector3(...point))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4970,"value":"focusSurface = vectorSurfaces[focusSurfaceIdx]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4525,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4494,"value":"viewof focusPlane = bindOneWay(Inputs.input(), viewof focusPlaneIdx, {\n transform: (idx) => [...planePaths.keys()][idx] || null\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10681,"value":"focusPlane","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4504,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4507,"value":"focusPlaneIdxPaths = focusPlane\n ? surfacesOnPlaneAsPath(focusPlane, vectorSurfaces)\n : []","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4544,"value":"unionPaths = ({\n prompt:\n \"Write a function to boolean op union a list of paper.js Path elements\",\n time: 1715719615509,\n comment:\n \"Define a function to perform a union operation on a list of paper.js Path elements.\"\n} &&\n function unionPaths(paths) {\n let unionResult = paths[0];\n for (let i = 1; i < paths.length; i++) {\n unionResult = unionResult.unite(paths[i]);\n }\n if (!recurseUnite) return unionResult;\n else {\n /*\n There is more complexity on recursing depending on the winding order\n Recursive merging breaks the flange but fixes other cases.\n */\n if (unionResult.children && unionResult.children.length < paths.length) {\n return unionPaths(unionResult.removeChildren());\n } else {\n return unionResult;\n }\n }\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4660,"value":"reverseInnerPaths = ({\n prompt:\n \"iterate a list of paper.js path, find if any paths are inside another path (check if all verteces are inside the path) and if so, call .reverse()\",\n time: 1715971167855,\n comment:\n \"Define a function to iterate through a list of paper.js paths, reverse any path that is entirely inside another path.\"\n} &&\n function reverseInnerPaths(path) {\n //if (!path.children) return path;\n return path.reorient(true, false);\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1605,"value":"viewof showPlanes = Inputs.toggle({\n label: \"show planes?\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4575,"value":"unionPlanePaths = mapValues(\n new Map(\n surface_planes.map((plane) => [\n plane,\n unionPaths(surfacesOnPlaneAsPath(plane, vectorSurfaces))\n ])\n ),\n (plane, path) => reverseInnerPaths(path)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9849,"value":"filterPathsByMinDimension = ({\n prompt:\n \"filter a map containing paths, to only include those with a minimum dimension\",\n time: 1719673000342,\n comment:\n \"Define a function to filter a map containing paths, only including those with a minimum dimension.\"\n} &&\n function filterPathsByMinDimension(paths, minDimension) {\n return new Map(\n [...paths].filter(([k, path]) => {\n const { width, height } = getBoundingDimensionOfPath(path);\n return width >= minDimension && height >= minDimension;\n })\n );\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10047,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9857,"value":"planePathsTrimmed = filterPathsByMinDimension(unionPlanePaths, minThickness)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10055,"value":"planePaths = mapValues(planePathsTrimmed, (plane, path) => {\n (path.children || [path]).forEach((path) => simplifyPath(path));\n return path;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10035,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4546,"value":"focusPlanePath = planePaths.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9921,"value":"Plot.plot({\n marks: [\n (focusPlanePath.children || [focusPlanePath]).map((child, i) => {\n const segments = child._segments;\n return Plot.arrow(segments, {\n x1: (d) => d._point._x,\n y1: (d) => d._point._y,\n x2: (d, i) => segments[(i + 1) % segments.length]._point._x,\n y2: (d, i) => segments[(i + 1) % segments.length]._point._y,\n stroke: i\n });\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4797,"value":"### 2D Path to 3D","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4556,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4762,"value":"viewof showEdges = Inputs.toggle({ value: true, label: \"show edges\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4573,"value":"edges = mapValues(planePaths, (plane, path) => projectPathTo3D(path, plane))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4558,"value":"focusEdges = focusPlane ? edges.get(focusPlane) : undefined","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1721,"value":"focusEdgesAll = edges","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1799,"value":"viewof showShapes = Inputs.toggle({\n label: \"show shapes 2D\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1743,"value":"shapes2D = mapValues(planePaths, (plane, path) => {\n if (path.children)\n return path.children.map((subPath) => {\n return subPath.segments.map((segment) => [\n segment.point.x,\n segment.point.y\n ]);\n });\n else {\n return path.segments.map((segment) => [[segment.point.x, segment.point.y]]);\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2283,"value":"focusShape = shapes2D.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2271,"value":"shapePlot = focusShape &&\n Plot.plot({\n marks: [\n focusShape.map((coords, i) =>\n Plot.arrow(coords, {\n x1: (d) => d[0],\n y1: (d) => d[1],\n x2: (d, i) => coords[(i + 1) % coords.length][0],\n y2: (d, i) => coords[(i + 1) % coords.length][1],\n stroke: i\n })\n )\n ]\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2316,"value":"### Find Joints","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3296,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3267,"value":"optimizedShape2D = shapes2D","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3285,"value":"optimizedFocusShape = optimizedShape2D.get(\n [...planePaths.keys()][focusPlaneIdx]\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3282,"value":"optimizedShapePlot = optimizedFocusShape &&\n Plot.plot({\n marks: [\n optimizedFocusShape.map((coords, i) => {\n return Plot.arrow(coords, {\n x1: (d) => d[0],\n y1: (d) => d[1],\n x2: (d, i) => coords[(i + 1) % coords.length][0],\n y2: (d, i) => coords[(i + 1) % coords.length][1],\n stroke: i\n });\n })\n ]\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3366,"value":"$40","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3369,"value":"joints = {\n debugger;\n return findShapeConnections(edges);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3546,"value":"Inputs.bind(\n Inputs.range([-1, joints.length - 1], {\n label: \"focus joint\",\n value: -1,\n step: 1\n }),\n viewof focusJointIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3576,"value":"focusJoint = joints[focusJointIdx]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3658,"value":"$41","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3660,"value":"visualizeJointGraph(joints)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3808,"value":"### Find edges between planes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3864,"value":"neighbourhood = (plane, connections) =>\n connections.filter((c) => c.plane1 == plane || c.plane2 == plane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5011,"value":"neighbourhoods = new Map(\n surface_planes.map((plane) => [plane, neighbourhood(plane, joints)])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3867,"value":"focusNeighbourhood = {\n debugger;\n neighbourhood(focusPlane, joints);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9957,"value":"focusNeighbourhoodPlot = {\n if (!focusNeighbourhood || !focusPlane) return undefined;\n const [basisX, basisY] = chooseBasis(focusPlane);\n return Plot.plot({\n marks: [\n ...focusNeighbourhood.map((neighbourhood, i) =>\n Plot.arrow(neighbourhood.sharedEdges, {\n x1: (line) => line.start.dot(basisX),\n y1: (line) => line.start.dot(basisY),\n x2: (line) => line.end.dot(basisX),\n y2: (line) => line.end.dot(basisY),\n stroke: i\n })\n )\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5021,"value":"boundaries = new Map(\n planePaths\n .keys()\n .map((plane) => [plane, projectPathTo3D(planePaths.get(plane), plane)])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4259,"value":"focusBoundaries = focusPlane && boundaries.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10001,"value":"focusBoundariesPlot = {\n if (!focusBoundaries) return undefined;\n const [basisX, basisY] = chooseBasis(focusPlane);\n return Plot.plot({\n marks: [\n ...focusBoundaries.map((neighbourhood, i) =>\n Plot.arrow(neighbourhood, {\n x1: (line) => line.start.dot(basisX),\n y1: (line) => line.start.dot(basisY),\n x2: (line) => line.end.dot(basisX),\n y2: (line) => line.end.dot(basisY),\n stroke: i\n })\n )\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3882,"value":"$42","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9623,"value":"perimeterPlans = new Map(\n planePaths\n .keys()\n .map((plane) => [\n plane,\n generatePerimeterPlan(\n plane,\n neighbourhoods.get(plane),\n boundaries.get(plane)\n )\n ])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9631,"value":"focusPermiterPlan = perimeterPlans.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11815,"value":"{\n debugger;\n return (\n focusPlane &&\n generatePerimeterPlan(\n focusPlane,\n neighbourhoods.get(focusPlane),\n focusBoundaries\n )\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9996,"value":"focusPerimeterPlanPlot = {\n if (!focusPermiterPlan) return undefined;\n const [basisX, basisY] = chooseBasis(focusPlane);\n return Plot.plot({\n color: {\n legend: true\n },\n marks: [\n ...focusPermiterPlan.map((neighbourhood, i) =>\n Plot.arrow(neighbourhood, {\n x1: (step) => step.edge.start.dot(basisX),\n y1: (step) => step.edge.start.dot(basisY),\n x2: (step) => step.edge.end.dot(basisX),\n y2: (step) => step.edge.end.dot(basisY),\n stroke: (step) => step.plan\n })\n )\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3958,"value":"$43","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9636,"value":"projectedPlans = mapValues(perimeterPlans, (plane, plans) =>\n plans.map((plan) => projectPlan(plane, plan))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9641,"value":"focusProjectedPlan = projectedPlans.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9949,"value":"focusProjectPlanePlot = focusProjectedPlan &&\n Plot.plot({\n marks: [\n focusProjectedPlan.map((section, i) => {\n return Plot.arrow(section, {\n x1: (d) => d.start[0],\n y1: (d) => d.start[1],\n x2: (d) => d.end[0],\n y2: (d) => d.end[1],\n stroke: i\n });\n })\n ]\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6060,"value":"$44","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6045,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9651,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6035,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5029,"value":"plans = mapValues(projectedPlans, (plane, plans) =>\n plans.map((plan) => computeStepInteractions(plan)).flat()\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4010,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9491,"value":"angleToFingerRetraction(155, { thickness: material_thickness })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3886,"value":"viewof focusPlan = Inputs.input(null)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10733,"value":"updateFocusPlan = bindOneWay(viewof focusPlan, viewof focusPlane, {\n transform: (plane) => {\n return plans.get(plane) || null;\n },\n invalidation\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5114,"value":"$48","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3969,"value":"focusPlanViz = focusPlan && planViz(focusPlan)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5129,"value":"viewof showPlan = Inputs.toggle({ label: \"show plan\", value: true })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6130,"value":"### Draw Part","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5119,"value":"planBlobs = mapValues(plans, (plane, plan) =>\n toBlobUrl(planViz(plan).querySelector(\"svg[viewBox]\"))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4040,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5287,"value":"viewof showParts = Inputs.toggle({\n label: \"show parts\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5034,"value":"partsSVG = mapValues(plans, (plane, plan) =>\n planToSVG(plan, { scale: 5, thickness: material_thickness })\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5043,"value":"### Parts to Blobs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5048,"value":"partBlobs = mapValues(partsSVG, (plane, svg) =>\n toBlobUrl(svg.querySelector(\"svg\"))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5055,"value":"focusBlobURL = focusPlane && partBlobs.get(focusPlane)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4045,"value":"viewof focusPart = domView()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10749,"value":"updateFocusPart = {\n bindOneWay(viewof focusPart, viewof focusPlan, {\n transform: (plane) =>\n (plane && planToSVG(focusPlan, { scale: scale })) || null,\n invalidation\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12005,"value":"focusPlan && planToSVG(focusPlan, { scale: scale })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2537,"value":"## Box Joint Cuts","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2718,"value":"sideA = {\n const group = new THREE.Group();\n const normalSign = jointToyParams.toggleNormalA ? -1 : 1;\n group.add(\n createBoxJointSide({\n color: 0x00ffff,\n width: 10,\n height: 15,\n depth: jointToyParams.thickness * normalSign,\n opacity: 0.9,\n negativeFingerOffset: jointToyParams.fingerExtend,\n positiveFingerOffset: jointToyParams.fingerRetract,\n fingerPairs: 10\n })\n );\n group.add(createLineSegment(new Line3(new Vector3(), new Vector3(0, 10, 0))));\n group.add(\n new THREE.ArrowHelper(\n new Vector3(0, 0, normalSign),\n new Vector3(0, 5, 0),\n 10,\n 0xff0000\n )\n );\n return group;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2715,"value":"sideB = {\n const group = new THREE.Group();\n const normalSign = jointToyParams.toggleNormalB ? -1 : 1;\n group.add(\n createBoxJointSide({\n color: 0xff00ff,\n width: 10,\n height: -15,\n depth: jointToyParams.thickness * normalSign,\n opacity: 0.9,\n negativeFingerOffset: jointToyParams.fingerRetract,\n positiveFingerOffset: jointToyParams.fingerExtend,\n fingerPairs: 10\n })\n );\n group.add(\n createLineSegment(new Line3(new Vector3(), new Vector3(0, -10, 0)))\n );\n group.add(\n new THREE.ArrowHelper(\n new Vector3(0, 0, normalSign),\n new Vector3(0, -5, 0),\n 10,\n 0xff0000\n )\n );\n return group;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2592,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2543,"value":"jointScene = {\n ({\n prompt: \"create a scene containing a box joint\",\n time: 1714807594230,\n comment:\n \"Define a function to create a scene containing a box joint using four sides, positioned and rotated to form a box.\"\n });\n const scene = new THREE.Scene();\n\n const ambientLight = new THREE.AmbientLight(0xffffff, 0.4); // soft white light\n scene.add(ambientLight);\n const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);\n directionalLight.position.set(100, 100, -100);\n scene.add(directionalLight);\n\n scene.add(\n createLineSegment(\n new Line3(new Vector3(0, 0, 0), new Vector3(11, 0, 0)),\n 0xffffff\n )\n );\n\n return scene;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2854,"value":"jointWorldSetup = {\n jointScene.add(sideA);\n jointScene.add(sideB);\n invalidation.then(() => {\n jointScene.remove(sideA);\n jointScene.remove(sideB);\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2550,"value":"jointWorld = {\n ({\n prompt: \"create renderer and camera for visualizing the boxJointScene\",\n time: 1714807698604,\n comment:\n \"Define a function to setup a renderer and camera for visualizing the scene, including the box joint.\"\n });\n\n const fov = 45;\n const aspect = width / 2 / height;\n const near = 1;\n const far = 1000;\n const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);\n camera.position.set(-6, 0, -2);\n camera.lookAt(new Vector3(0, 0, 0));\n\n const renderer = new THREE.WebGLRenderer({ antialias: true });\n renderer.setSize(width / 2, height / 2);\n renderer.setPixelRatio(devicePixelRatio);\n const controls = new THREE.OrbitControls(camera, renderer.domElement);\n controls.addEventListener(\"change\", () =>\n renderer.render(jointScene, camera)\n );\n invalidation.then(() => (controls.dispose(), renderer.dispose()));\n\n return { renderer, camera, controls };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2568,"value":"

\n ${jointWorld.renderer.domElement}\n ${viewof fingerMeasures}\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"jointToy","database":"$undefined"},{"id":7249,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2903,"value":"angleToFingerExtension = (angle, { thickness } = {}) => {\n const theta = deg2rad(angle);\n if (angle <= -90) {\n return Math.tan(theta - Math.PI / 2) * thickness;\n } else if (angle <= 0 && angle > -90) {\n return 0;\n } else if (angle >= 0 && angle <= 90) {\n // MT = a + b\n const a = (Math.cos(theta) * thickness) / (1 + Math.cos(theta));\n return Math.tan(theta) * a;\n } else if (angle >= 90) {\n // MT = a + b\n return thickness / Math.cos(theta - Math.PI / 2);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7348,"value":"angleToFingerRetraction(0, { thickness: 1 })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2735,"value":"angle_applier = {\n sideA.quaternion.setFromAxisAngle(\n new Vector3(1, 0, 0),\n deg2rad(jointToyParams.angleA)\n );\n sideB.quaternion.setFromAxisAngle(\n new Vector3(1, 0, 0),\n deg2rad(jointToyParams.angleB)\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2949,"value":"angleToFingerRetraction = (angle, { thickness } = {}) => {\n if (!thickness) throw Error();\n const theta = deg2rad(angle);\n if (angle >= 90) {\n return 0;\n } else if (angle >= 0) {\n const extension = angleToFingerExtension(angle, { thickness });\n return Math.cos(theta) * extension;\n } else if (angle >= -90) {\n return Math.sin(theta + Math.PI) * thickness;\n } else {\n const theta2 = deg2rad(-angle - 90);\n const b = Math.tan(theta2) * thickness;\n const d = thickness / Math.cos(theta2);\n return d + b;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3075,"value":"fingerData = {\n const data = [];\n for (let angle = -170; angle <= 170.5; angle += 1) {\n data.push({\n angle,\n retraction: angleToFingerRetraction(angle, {\n thickness: jointToyParams.thickness\n }),\n extension: angleToFingerExtension(angle, {\n thickness: jointToyParams.thickness\n })\n });\n }\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3079,"value":"viewof fingerMeasures = Plot.plot({\n height: height / 2,\n y: {\n domain: [-5, 5],\n label: \"offset\"\n },\n marks: [\n Plot.ruleX([-90, 0, 90], { stroke: \"lightgrey\" }),\n Plot.ruleX([jointToyParams.angle], { stroke: \"blue\" }),\n Plot.ruleY([0]),\n Plot.lineY(fingerData, {\n x: \"angle\",\n y: \"retraction\",\n stroke: \"red\",\n tip: true\n }),\n Plot.lineY(fingerData, {\n x: \"angle\",\n y: \"extension\",\n stroke: \"green\",\n tip: true\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2878,"value":"autoFitFinger = {\n if (jointToyParams.autoFit) {\n const angle =\n viewof jointToyParams.angleB.value - viewof jointToyParams.angleA.value;\n viewof jointToyParams.fingerRetract.value = angleToFingerRetraction(angle, {\n thickness: jointToyParams.thickness\n });\n viewof jointToyParams.fingerExtend.value = angleToFingerExtension(angle, {\n thickness: jointToyParams.thickness\n });\n\n viewof jointToyParams.angle.value = angle;\n viewof jointToyParams.angle.dispatchEvent(new Event(\"input\"));\n viewof jointToyParams.fingerRetract.dispatchEvent(new Event(\"input\"));\n viewof jointToyParams.fingerExtend.dispatchEvent(new Event(\"input\"));\n return [\n viewof jointToyParams.fingerRetract.value,\n viewof jointToyParams.fingerExtend.value\n ];\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2646,"value":"jointWorldJob = {\n jointWorldSetup;\n autoFitFinger;\n angle_applier;\n while (true) {\n jointWorld.renderer.render(jointScene, jointWorld.camera);\n yield null;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6265,"value":"## Joint Segment","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":6524,"value":"units = \"mm\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11672,"value":"#### label_clockwise","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10135,"value":"import { scaleAxisTransform, fontPath } from \"@tomlarkworthy/single-stroke-font\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10124,"value":"label_clockwise = (start, end, { label, finger_depth } = {}) => {\n const distance = (a, b) => Math.sqrt(distance2DSquared(a, b));\n const mid = midpoint(start, end);\n const angle = degBetween(start, end);\n finger_depth = finger_depth || viewof material_thickness.value;\n return svg``;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11658,"value":"#### box_clockwise","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":6269,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6270,"value":"fingers_clockwise_v1_preview = {\n const total_width = 100;\n const total_height = 100;\n\n const { x0, x1, y0, y1 } = box_clockwise_config;\n return htl.svg`

`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6271,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10980,"value":"#### Mortise Joint","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10982,"value":"mortise_clockwise_v1_preview = {\n const total_width = 100;\n const total_height = 100;\n\n const { x0, x1, y0, y1 } = mortise_clockwise_v1_config;\n return htl.svg`

`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10983,"value":"$4e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10981,"value":"$4f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6272,"value":"download_svg = ({\n prompt: \"write a function that downloads a passed in SVG element argument\",\n time: 1705852941582,\n comment: \"Function to download an SVG element\"\n} &&\n function downloadSVG(svgEl) {\n const serializer = new XMLSerializer();\n const svgStr = serializer.serializeToString(svgEl);\n const filename = svgEl.attributes[\"filename\"]?.value || \"image\";\n const dataUri =\n \"data:image/svg+xml;charset=utf-8,\" + encodeURIComponent(svgStr);\n const link = document.createElement(\"a\");\n link.setAttribute(\"href\", dataUri);\n link.setAttribute(\"download\", `${filename}.svg`);\n document.body.appendChild(link); // Required for Firefox\n link.click();\n document.body.removeChild(link);\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":688,"value":"## Math","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":6268,"value":"function mod(n, m) {\n return ((n % m) + m) % m;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5761,"value":"$50","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2747,"value":"deg2rad = (degrees) => degrees * (Math.PI / 180)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3812,"value":"rad2deg = (rads) => rads * (180 / Math.PI)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6116,"value":"distance2DSquared = (a, b) =>\n (a[0] - b[0]) * (a[0] - b[0]) + (a[1] - b[1]) * (a[1] - b[1])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10181,"value":"degBetween = ({\n prompt:\n \"write a function to calculate the angle between two coordinates [x1,y1], [x2, y2] \",\n time: 1721327715349,\n comment:\n \"Define a function to calculate the angle between two coordinates [x1, y1] and [x2, y2] and return the angle in degrees.\"\n} &&\n function calculateAngleBetweenCoordinates([x1, y1], [x2, y2]) {\n const deltaX = x2 - x1;\n const deltaY = y2 - y1;\n const angle = Math.atan2(deltaY, deltaX);\n return angle * (180 / Math.PI); // Convert the angle from radians to degrees\n })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9484,"value":"midpoint = (a, b) => [(a[0] + b[0]) * 0.5, (a[1] + b[1]) * 0.5]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9853,"value":"getBoundingDimensionOfPath = ({\n prompt: \"calculate the bounding dimensions of a paper.js path\",\n time: 1719672887254,\n comment:\n \"Define a function to calculate the bounding dimensions (width and height) of a paper.js path.\"\n} &&\n function getBoundingDimensions(path) {\n const boundingBox = path.bounds;\n const width = boundingBox.width;\n const height = boundingBox.height;\n return { width, height };\n })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6100,"value":"function intersect2d(start0, end0, start1, end1, clamp = true) {\n const line = new paper.Line(start0[0], start0[1], end0[0], end0[1], false);\n const deltaLine = new paper.Line(\n start1[0],\n start1[1],\n end1[0],\n end1[1],\n false\n );\n\n // Find the intersection\n const intersection = line.intersect(deltaLine, !clamp);\n\n // Check if the intersection is within the bounds of the line segment\n if (intersection) {\n return [intersection.x, intersection.y];\n }\n return null;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3829,"value":"function angleBetweenPlanes(plane1, plane2, axis) {\n // Calculate the dot product of the normals\n let dot = plane1.normal.dot(plane2.normal);\n\n // Compute the magnitudes of each normal vector\n let magnitude1 = plane1.normal.length();\n let magnitude2 = plane2.normal.length();\n\n // Calculate the cosine of the angle between the planes\n let cosTheta = dot / (magnitude1 * magnitude2);\n let angleRadians = Math.acos(Math.min(Math.max(cosTheta, -1), 1));\n\n // Calculate the cross product of the normal vectors to get the axis of rotation\n let cross = new THREE.Vector3();\n cross.crossVectors(plane1.normal, plane2.normal);\n\n // Calculate the dot product of the cross product and the edge vector\n let sign = cross.dot(axis);\n\n // Determine the sign of the angle\n if (sign < 0) {\n angleRadians = -angleRadians;\n }\n\n return angleRadians;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3818,"value":"angleBetweenPlanesExample = rad2deg(\n angleBetweenPlanes(\n new Plane(new Vector3(0, 1, 0), 0),\n new Plane(new Vector3(1, 0, 0), 0),\n new Vector3(0, 0, -1)\n )\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1478,"value":"$51","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1481,"value":"dedupe = ({\n prompt:\n \"write a function dedupe, that takes a predicate and an array and removed duplicates as defined by the predicate\",\n time: 1714231386592,\n comment:\n \"Define a function to remove duplicates from an array based on a provided equality predicate\"\n} &&\n function dedupe(predicate, array) {\n return array.reduce((acc, item) => {\n if (!acc.some((x) => predicate(x, item))) {\n acc.push(item);\n }\n return acc;\n }, []);\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2335,"value":"mapValues = ({\n prompt:\n \"map the values of a Map with function(key, value) returning a new Map\",\n time: 1714231307450,\n comment:\n \"Define a function to check equality between two Planes, Vector3s, or Line3s with a specified epsilon tolerance\"\n} &&\n function mapValues(map, fn) {\n const result = new Map();\n map.forEach((value, key) => result.set(key, fn(key, value)));\n return result;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9879,"value":"shuffleArray = ({\n prompt: \"write a function to randomize the order of an array\",\n time: 1719680043531,\n comment:\n \"Define a function to randomize the order of an array using the Fisher-Yates shuffle algorithm.\"\n} &&\n function shuffleArray(array) {\n for (let i = array.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [array[i], array[j]] = [array[j], array[i]];\n }\n return array;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2508,"value":"normalizeLines = (lines) => {\n const vertexList = [];\n return lines.map((line) => {\n [line.start, line.end].forEach((lineVertex, idx) => {\n let existing = vertexList.find((vertex) => eq(vertex, lineVertex));\n if (!existing) {\n vertexList.push(lineVertex);\n existing = lineVertex;\n }\n if (idx === 0) line.start = existing;\n else line.end = existing;\n });\n return line;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2049,"value":"surfaceToPlane = (surface) =>\n plane\n .clone()\n .setFromCoplanarPoints(\n new Vector3(...surface[0]),\n new Vector3(...surface[1]),\n new Vector3(...surface[2])\n )\n .normalize()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1086,"value":"$52","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3391,"value":"$53","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10018,"value":"overlapParallelLinesSample = {\n return overlapParallelLines(\n new Line3(new Vector3(0, 0, 0), new Vector3(0, 0, 1)),\n new Line3(new Vector3(0, 0, 1), new Vector3(0, 0, 2))\n );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":803,"value":"$54","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2167,"value":"lineOnPlane = ({\n prompt: \"write a function, lineOnPlane\",\n time: 1714426480262,\n comment:\n \"Define a function to determine if a Line3 is coplanar with a given Plane\"\n} &&\n function lineOnPlane(line, plane) {\n // Check if both points of the line are coplanar with the plane\n const startDistance = plane.distanceToPoint(line.start);\n const endDistance = plane.distanceToPoint(line.end);\n\n return Math.abs(startDistance) < 1e-4 && Math.abs(endDistance) < 1e-4;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1501,"value":"$55","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1587,"value":"$56","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2008,"value":"generateEvenlySpacedPoints = ({\n prompt:\n \"write a function that generates 10 evenly spaced points from a Line3 between its start and end\",\n time: 1714323731882,\n comment:\n \"Define a function to generate 10 evenly spaced points on a Line3 between its start and end\"\n} &&\n function generateEvenlySpacedPoints(line, n = 10) {\n const points = [];\n const start = line.start;\n const end = line.end;\n const stepVector = new THREE.Vector3()\n .subVectors(end, start)\n .multiplyScalar(1 / n);\n\n for (let i = 0; i <= n; i++) {\n const point = new THREE.Vector3().addVectors(\n start,\n stepVector.clone().multiplyScalar(i)\n );\n points.push(point);\n }\n return points;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3377,"value":"extendLine = ({\n prompt:\n \"Take a small line, and make it a massive line by moving the start and end points a large amount by its delta\",\n time: 1715078155874,\n comment:\n \"Define a function to extend a Line3 significantly in both directions along its delta vector.\"\n} &&\n function extendLine(line, scale = 1e6) {\n const delta = line.delta(new Vector3()).normalize().multiplyScalar(scale);\n const extendedStart = line.start.clone().add(delta.clone().negate());\n const extendedEnd = line.end.clone().add(delta);\n return new Line3(extendedStart, extendedEnd);\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5149,"value":"getBoundingBoxCorners = ({\n prompt:\n \"Take an array of 2d points [x, y][] and return a new array with 4 points that are in the corners of the axis aligned bounding box\",\n time: 1716111412768,\n comment:\n \"Define a function to return the four corner points of the axis-aligned bounding box for an array of 2D points.\"\n} &&\n function getBoundingBoxCorners(boundaries) {\n const xValues = boundaries.flatMap((points) =>\n points.map((point) => point[0])\n );\n const yValues = boundaries.flatMap((points) =>\n points.map((point) => point[1])\n );\n\n const minX = Math.min(...xValues);\n const maxX = Math.max(...xValues);\n const minY = Math.min(...yValues);\n const maxY = Math.max(...yValues);\n\n return [\n [minX, minY],\n [minX, maxY],\n [maxX, maxY],\n [maxX, minY]\n ];\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3445,"value":"shape3DTo2D = ({\n prompt:\n \"Write a function that converts a Shape3D (plane, boundaries) to a Shape2D ([x, y][])\",\n time: 1715156172321\n} &&\n ((plane, boundaries) => {\n const [basisX, basisY] = chooseBasis(plane);\n return boundaries.map((lines) =>\n lines.map((line) => {\n const pointOnPlane = plane.projectPoint(line.start, new Vector3());\n\n // Project the point onto the plane using the basis vectors\n const x = pointOnPlane.dot(basisX);\n const y = pointOnPlane.dot(basisY);\n\n return [x, y];\n })\n );\n }))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3482,"value":"shape2DToPath = ({\n prompt:\n \"Write a function that converts a shape2D [x,y][] into a paper.js representation (Path)\",\n time: 1715156172321,\n comment:\n \"Define a function to convert an array of 2D points into a paper.js Path representation.\"\n} &&\n function shape2DToPath(shape2DBoundaries, { close = true } = {}) {\n const paths = shape2DBoundaries.map((shape2D) => {\n const path = new paper.Path();\n shape2D.forEach((point, index) => {\n if (index === 0) {\n path.moveTo(new paper.Point(point[0], point[1]));\n } else {\n path.lineTo(new paper.Point(point[0], point[1]));\n }\n });\n if (close) path.closePath();\n return path;\n });\n //if (paths.length == 1) return paths[0];\n return new paper.CompoundPath(paths);\n })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3524,"value":"$57","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11762,"value":"classifyPointOnShape = function classifyPointOnShape(point, plane, boundaries) {\n if (Math.abs(plane.distanceToPoint(point)) > 1e-4) return \"OUTSIDE\"; // Point is not on the plane\n debugger;\n\n const [basisX, basisY] = chooseBasis(plane);\n\n const shape2Dboundaries = shape3DTo2D(plane, boundaries);\n const path = shape2DToPath(shape2Dboundaries);\n const projectedPoint = new paper.Point(\n plane.projectPoint(point, new Vector3()).dot(basisX),\n plane.projectPoint(point, new Vector3()).dot(basisY)\n );\n path.strokeWidth = 1e-3;\n path.strokeColor = \"black\";\n path.fillColor = \"black\";\n path.fillStyle = \"evenodd\";\n if (\n path.hitTest(projectedPoint, {\n tolerance: 1e-3,\n stroke: true,\n fill: false\n })\n ) {\n return \"EDGE\";\n }\n // Check if point is on any of the edges\n if (\n path.hitTest(projectedPoint, {\n tolerance: 1e-3,\n stroke: false,\n fill: true\n })\n )\n return \"INSIDE\";\n return \"OUTSIDE\";\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11886,"value":"focusBoundaries","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3540,"value":"$58","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3673,"value":"## String","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1509,"value":"parseVector3 = ({\n prompt: \"write a function parseVector3\",\n time: 1714233678892,\n comment: \"Define a function to parse a string into a Vector3 object\"\n} &&\n function parseVector3(string) {\n const parts = string.split(\",\").map(Number);\n if (parts.length === 3) {\n return new Vector3(parts[0], parts[1], parts[2]);\n }\n throw new Error(\"Invalid Vector3 string format\");\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3678,"value":"toString = function toString(obj) {\n if (obj === undefined) return \"undefined\";\n else if (obj.isPlane) {\n return `Plane(${toString(obj.normal)},${obj.constant})`;\n } else if (obj.isVector3) {\n return `${obj.x.toFixed(2)},${obj.y.toFixed(2)},${obj.z.toFixed(2)}`;\n } else if (obj.constructor.name == \"Line3\") {\n return `${toString(obj.start)}→${toString(obj.end)}`;\n }\n\n return obj.constructor.name || typeof obj;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5124,"value":"toBlobUrl = (svg) =>\n URL.createObjectURL(\n new Blob([new XMLSerializer().serializeToString(svg)], {\n type: \"image/svg+xml\"\n })\n )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":849,"value":"viewof geometrySuite = ({\n prompt: \"Write a test suite for testing our geometry functions\",\n time: 1714197395380,\n comment:\n \"Write a test suite for testing the geometry functions using the zora testing library\"\n} && createSuite({ name: \"Geometry Tests\" }))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3627,"value":"geometrySuite.test(\"intersectLines example\", () => {\n const l1 = new Line3(new Vector3(0, 0, -1), new Vector3(1, 0, -1));\n const l2 = new Line3(new Vector3(0, 0, 0), new Vector3(0, 0, -1));\n\n expect(intersectLines(l1, l2)).toEqual(new Vector3(0, 0, -1));\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1070,"value":"$59","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":881,"value":"$5a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11928,"value":"geometrySuite.test(\"classify point on inside of donut boundary\", () => {\n const plane = new Plane(new Vector3(0, 0, 1), 0);\n\n const boundary = [\n [\n new Vector3(2, -2, 0),\n new Vector3(2, 2, 0),\n new Vector3(-2, 2, 0),\n new Vector3(-2, -2, 0)\n ],\n [\n new Vector3(1, -1, 0),\n new Vector3(1, 1, 0),\n new Vector3(-1, 1, 0),\n new Vector3(-1, -1, 0)\n ]\n ].map((points) => points.map((p, i) => new Line3(p, points[(i + 1) % 4])));\n\n expect(classifyPointOnShape(new Vector3(2.1, 0, 0), plane, boundary)).toBe(\n \"OUTSIDE\"\n );\n expect(classifyPointOnShape(new Vector3(1.5, 0, 0), plane, boundary)).toBe(\n \"INSIDE\"\n );\n expect(classifyPointOnShape(new Vector3(2, 0, 0), plane, boundary)).toBe(\n \"EDGE\"\n );\n expect(classifyPointOnShape(new Vector3(1, 0, 0), plane, boundary)).toBe(\n \"EDGE\"\n );\n expect(classifyPointOnShape(new Vector3(0, 0, 0), plane, boundary)).toBe(\n \"OUTSIDE\"\n );\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5343,"value":"test3Dto2D = geometrySuite.test(\n \"surfacesOnPlaneAsPath and projectPathTo3D round trip\",\n () => {\n const plane = new Plane(\n new Vector3().randomDirection(),\n Math.random() * 2 - 1\n );\n const a = plane.projectPoint(\n new Vector3().randomDirection().multiplyScalar(20),\n new Vector3()\n );\n const b = plane.projectPoint(\n new Vector3().randomDirection().multiplyScalar(20),\n new Vector3()\n );\n\n const path = unionPaths(surfacesOnPlaneAsPath(plane, [[a, b]]));\n\n const edges = projectPathTo3D([path], plane);\n\n expect(a.distanceTo(edges[0].start) < 1e-3 || a.distanceTo(edges[0].end));\n expect(b.distanceTo(edges[0].start) < 1e-3 || b.distanceTo(edges[0].end));\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":393,"value":"# Planes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":398,"value":"XY = new Plane(new Vector3(0, 0, 1)).normalize()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":403,"value":"XZ = new Plane(new Vector3(0, 1, 0)).normalize()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1006,"value":"YZ = new Plane(new Vector3(1, 0, 0)).normalize()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1920,"value":"$5b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5400,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":696,"value":"## Meshes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":698,"value":"createPlaneMesh = ({\n prompt:\n \"Write a function createPlaneMesh for displaying a plane, with a color and opacity.\",\n time: 1714156508940,\n comment:\n \"Define a function to create a mesh representing a plane with custom width, height, color, and opacity\"\n} &&\n function createPlaneMesh(plane, color = 0x2194ce, opacity = 0.5) {\n const geometry = new THREE.PlaneGeometry(10, 10);\n const material = new THREE.MeshBasicMaterial({\n color: color,\n side: THREE.DoubleSide,\n transparent: true,\n opacity: opacity\n });\n const mesh = new THREE.Mesh(geometry, material);\n\n // Align the mesh with the plane\n const quaternion = new THREE.Quaternion().setFromUnitVectors(\n new Vector3(0, 0, 1),\n plane.normal\n );\n mesh.quaternion.copy(quaternion);\n mesh.position.copy(plane.coplanarPoint(new Vector3()));\n\n return mesh;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1770,"value":"$5c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":746,"value":"createInfiniteLine = ({\n prompt:\n \"create a function for drawing an infinite line defined with a Line3. Give it a custom color\",\n time: 1714063101344,\n comment:\n \"Define a function to draw an infinite line from a Line3 object with a custom color\"\n} &&\n function createInfiniteLine(line, color = 0xff0000) {\n const material = new THREE.LineBasicMaterial({\n color: color\n });\n const geometry = new THREE.BufferGeometry().setFromPoints([\n line.start.clone().addScaledVector(line.delta(new Vector3()), -1e2), // add a very large negative multiple\n line.start.clone().addScaledVector(line.delta(new Vector3()), 1e2) // add a very large positive multiple\n ]);\n const infiniteLine = new THREE.Line(geometry, material);\n return infiniteLine;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1576,"value":"createLineSegment = ({\n prompt:\n \"create a function for drawing a line segment defined with a Line3. Give it a custom color\",\n time: 1714243889593,\n comment:\n \"Define a function to draw a line segment from a Line3 object with a custom color\"\n} &&\n function createLineSegment(line, color = 0x00ff00) {\n const material = new THREE.LineBasicMaterial({\n color: color\n });\n const geometry = new THREE.BufferGeometry().setFromPoints([\n line.start,\n line.end\n ]);\n const lineSegment = new THREE.Line(geometry, material);\n return lineSegment;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1519,"value":"createPoint = ({\n prompt:\n \"write a function createPoint which takes a arg1: Vector3, arg 2 an options object for setting a size, color and an opacity\",\n time: 1714237680911,\n comment:\n \"Define a function to create a point (represented as a sphere) in 3D space with customizable size, color, and opacity\"\n} &&\n function createPoint(\n position,\n { size = 0.1, color = 0xff0000, opacity = 1 } = {}\n ) {\n const geometry = new THREE.SphereGeometry(size, 32, 32);\n const material = new THREE.MeshBasicMaterial({\n color: color,\n transparent: true,\n opacity: opacity\n });\n const pointMesh = new THREE.Mesh(geometry, material);\n pointMesh.position.copy(position);\n return pointMesh;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1216,"value":"createMesh = ({\n prompt:\n \"Write a createMesh which takes 4 points and build a mesh from with a given color and opacity\",\n time: 1714217873218,\n comment:\n \"Define a function to create a mesh from four points with a specified color and opacity\"\n} &&\n function createMesh(points, color = 0x00ff00, opacity = 0.2) {\n const vertices = new Float32Array(\n points[0].x !== undefined\n ? points.flatMap((p) => [p.x, p.y, p.z])\n : points.flat()\n );\n const geometry = new THREE.BufferGeometry(vertices, 3);\n const indeces = Array.from({ length: points.length - 2 }).flatMap(\n (_, i) => [0, i + 1, i + 2]\n );\n debugger;\n geometry.setIndex(indeces);\n geometry.setAttribute(\"position\", new THREE.BufferAttribute(vertices, 3));\n\n const material = new THREE.MeshBasicMaterial({\n color: color,\n side: THREE.DoubleSide,\n transparent: true,\n opacity: opacity\n });\n\n const mesh = new THREE.Mesh(geometry, material);\n return mesh;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2633,"value":"createSimpleLight = ({\n prompt:\n \"write a function for creating a simple light with extendable paramaterization as object args\",\n time: 1714810143025,\n comment:\n \"Define a function to create different types of lights (point, ambient, directional) with parameterized options for type, color, intensity, and position.\"\n} &&\n function createSimpleLight({\n type = \"point\", // 'point', 'ambient', 'directional'\n color = 0xffffff,\n intensity = 1,\n position = new Vector3(0, 0, 0)\n }) {\n let light;\n switch (type) {\n case \"point\":\n light = new THREE.PointLight(color, intensity);\n light.position.set(position);\n break;\n case \"ambient\":\n light = new THREE.AmbientLight(color, intensity);\n break;\n case \"directional\":\n light = new THREE.DirectionalLight(color, intensity);\n light.position.set(position);\n break;\n default:\n throw new Error(\"Unsupported light type\");\n }\n return light;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3649,"value":"## Plots","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3651,"value":"plotShape2D = (coords) =>\n Plot.plot({\n marks: [Plot.dot(coords, { x: (e) => e[0], y: (e) => e[1] })]\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1219,"value":"## Scene","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":4820,"value":"Inputs.bind(\n Inputs.range([-1, surface_planes.length - 1], {\n label: \"focus plane\",\n value: -1,\n step: 1\n }),\n viewof focusPlaneIdx\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5082,"value":"loader = new THREE.TextureLoader()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"$5d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1817,"value":"rotateCameraAroundOrigin = ({\n prompt:\n \"write a function to rotate the camera around the origin by an angle x around a rotation vector y\",\n time: 1714309064093,\n comment:\n \"Define a function to rotate the camera around the origin by a specified angle around a given rotation vector\"\n} &&\n function rotateCameraAroundOrigin(camera, angle, rotationVector) {\n const quaternion = new THREE.Quaternion().setFromAxisAngle(\n rotationVector,\n angle\n );\n camera.position.applyQuaternion(quaternion);\n camera.lookAt(new THREE.Vector3(0, 0, 0)); // Ensure the camera still looks at the origin\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2042,"value":"focusEdges","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"camera = {\n const fov = 45;\n const aspect = width / height;\n const near = 1;\n const far = 9999999;\n const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);\n camera.position.set(0, 30, -1000);\n camera.lookAt(new Vector3(0, 0, 0));\n return camera;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"renderer = {\n const renderer = new THREE.WebGLRenderer({ antialias: true });\n renderer.setSize(width, height);\n renderer.setPixelRatio(devicePixelRatio);\n invalidation.then(() => (renderer.dispose()));\n return renderer;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10423,"value":"controls = {\n const controls = new THREE.OrbitControls(camera, renderer.domElement);\n controls.addEventListener(\"change\", () => renderer.render(scene, camera));\n invalidation.then(() => controls.dispose());\n return controls;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":304,"value":"// Continuously updates\nrender_loop = {\n while (true) {\n if (spin) {\n rotateCameraAroundOrigin(camera, 0.01, new Vector3(0, 1, 0));\n }\n renderer.render(scene, camera);\n yield null;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10361,"value":"## Browser","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10373,"value":"height = screen.height","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1209,"value":"## THREE Basics","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1091,"value":"Vector3 = THREE.Vector3","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1360,"value":"vector3 = new Vector3()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1093,"value":"Line3 = THREE.Line3","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1589,"value":"Triangle = THREE.Triangle","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1365,"value":"line3 = new Line3()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1349,"value":"Plane = THREE.Plane","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1369,"value":"plane = new Plane()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"THREE = {\n const THREE = (window.THREE = await require(\"three@0.159.0/build/three.js\"));\n\n THREE.OrbitControls = (\n await import(\"three@0.159.0/examples/jsm/controls/OrbitControls.js\")\n ).OrbitControls;\n THREE.OBJLoader = (\n await import(\"three@0.159.0/examples/jsm/loaders/OBJLoader.js\")\n ).OBJLoader;\n try {\n THREE.FBXLoader = (\n await import(\"three@0.159.0/examples/jsm/loaders/FBXLoader.js\")\n ).FBXLoader;\n THREE.GLTFLoader = (\n await import(\"three@0.159.0/examples/jsm/loaders/GLTFLoader.js\")\n ).GLTFLoader;\n } catch (err) {\n console.log(\"err\");\n }\n return THREE;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":852,"value":"import { createSuite, expect } from \"@tomlarkworthy/testing\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3457,"value":"## Paper.js Basics","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3470,"value":"