30:T624,mainFrame = { const mainFrame = html`

`; mainFrame.style["width"] = `${width}px`; mainFrame.style["height"] = `${height}px`; mainFrame.style["text-align"] = "center"; mainFrame.style.position = "relative"; mainFrame.append(canvas); const frame = html`

`; frame.style["width"] = `${width}px`; frame.style["height"] = `${height}px`; frame.style["text-align"] = "center"; frame.style.display = "inline-block"; //frame.style.border = "1px solid gray"; frame.style.position = "absolute"; frame.style.top = "0px"; frame.style.left = "0px"; frame.style["pointer-events"] = "none"; mainFrame.append(frame); for (let sym of Object.getOwnPropertyNames(buttons)) { let b = buttons[sym]; b.style.position = "absolute"; b.style["z-index"] = "10"; b.style["box-shadow"] = "4px 4px 5px 0px rgba(0,0,0,.2)"; b.style["pointer-events"] = "auto"; b.style["user-select"] = "none"; frame.append(b); } const bwidth = buttonSizeRatio * width; buttons["left"].style.left = buttons["fly"].style.left = buttons["walk"].style.left = "10px"; buttons["up"].style.left = `${(width - bwidth) / 2}px`; buttons["right"].style.left = buttons["full"].style.left = `${ width - bwidth - 10 }px`; buttons["left"].style.bottom = buttons["up"].style.bottom = buttons["right"].style.bottom = "10px"; buttons["fly"].style.top = buttons["full"].style.top = buttons["walk"].style.top = "10px"; frame.append(title); frame.append(loadBar); return mainFrame; }31:T1119,myapps_csv = `https://cadasa.github.io/norway_trails.html,https://cadasa.github.io/vizapps/hiking_trails.JPG,Famous Hiking Trails in Europe I Have Hiked https://cadasa.github.io/earthquake_map.html,https://cadasa.github.io/vizapps/earthquakes.JPG,Real-Time Earthquake Map https://cadasa.github.io/pandora.html,https://cadasa.github.io/vizapps/pandora_leak.JPG,Pandora Leak - Offshore Companies per Country https://cadasa.github.io/cat.html,https://cadasa.github.io/vizapps/Cat.JPG,Global Airline Direct Routes & COVID Restrictions https://cadasa.github.io/woa.html,https://cadasa.github.io/vizapps/woa.JPG,Planets Alignment https://cadasa.github.io/temp.html,https://cadasa.github.io/vizapps/temp.JPG,Global Temperature since the Last Glacial Maximum (24000 yr BP) https://cadasa.github.io/le191121.html,https://cadasa.github.io/vizapps/le.JPG,Total Lunar Eclipse in November 19, 2021 https://cadasa.github.io/vne.html,https://cadasa.github.io/vizapps/vne.JPG,Path to Net-Zero Emissions by 2050 https://cadasa.github.io/nz0.html,https://cadasa.github.io/vizapps/nz0.JPG,Fossil Fuel Assets Worldwide by 2036 in Net Zero Transition https://cadasa.github.io/aurora.html,https://cadasa.github.io/vizapps/auora.JPG,Real-Time Aurora Borealis Forecast https://cadasa.github.io/aid.html,https://cadasa.github.io/vizapps/aid.JPG,Global Chinese Loan and Investment https://cadasa.github.io/flc.html,https://cadasa.github.io/vizapps/flc.JPG,The 1st Non-Stop Flight HAN-SFO of Bamboo Airways https://cadasa.github.io/slr.html,https://cadasa.github.io/vizapps/slr.JPG,Prediction of Sea Level Rise https://cadasa.github.io/lap.html,https://cadasa.github.io/vizapps/lap.JPG,Lunar Analemma and Phases Observed from Monte Cridola - Italy https://cadasa.github.io/nkm.html,https://cadasa.github.io/vizapps/nkm.JPG,North Korea's Line of Fire https://cadasa.github.io/droute.html,https://cadasa.github.io/vizapps/droute.JPG,Shortest Driving Route between Two Cities https://cadasa.github.io/tdf-21.html,https://cadasa.github.io/vizapps/tdf.JPG,Tour de France Map https://cadasa.github.io/gold_mines.html,https://cadasa.github.io/vizapps/10_mines.JPG,Top 10 Mines in the World https://cadasa.github.io/us_trails.html,https://cadasa.github.io/vizapps/us_trails.JPG,All the Hiking Trails in the US https://cadasa.github.io/ai_tennis.html,https://cadasa.github.io/vizapps/ai_tennis.JPG,A.I Tennis https://cadasa.github.io/lisno_map.html,https://cadasa.github.io/vizapps/ncs.JPG,Norwegian Continental Shelf Map with Lithostrat Wells https://cadasa.github.io/360_photo.html,https://cadasa.github.io/vizapps/360_photo.JPG,Visualize a Panorama Photo in 3D https://cadasa.github.io/mtt.html,https://cadasa.github.io/mtt.JPG,LaTEX Equation and Plotter https://cadasa.github.io/icf.html,https://cadasa.github.io/icf.JPG,Interactive Curve Fitting https://cadasa.github.io/scs.html,https://cadasa.github.io/scs.JPG,South China Sea Map https://cadasa.github.io/measure.html,https://cadasa.github.io/measure.JPG,Measure Distance on Map https://cadasa.github.io/blsr.html,https://cadasa.github.io/vizapps/blsr.JPG,Band-Limited Seismic Reflectivity https://cadasa.github.io/stratworld.html,https://cadasa.github.io/vizapps/stratworld.JPG,World Stratigraphic Atlas https://cadasa.github.io/fieldle.html,https://cadasa.github.io/vizapps/fieldle.JPG,Guess Oil/Gas Field in 6 tries https://cadasa.github.io/f&t.html,https://cadasa.github.io/vizapps/f&t.JPG,My Stadium Collection https://cadasa.github.io/flight_tracking.html,https://cadasa.github.io/vizapps/flight_tracking.JPG,Real-Time Flight Tracking https://cadasa.github.io/matrix.html,https://cadasa.github.io/vizapps/matrix.JPG,Matrix Multiplication https://cadasa.github.io/queens.html,https://cadasa.github.io/vizapps/queens.JPG,Solving Queens Problem using Python in Browser https://cadasa.github.io/tm22.html,https://cadasa.github.io/vizapps/tm22.JPG,Moon Phase & Libration https://cadasa.github.io/regression.html,https://cadasa.github.io/vizapps/regression.JPG,Multi-trend Regression Analysis https://cadasa.github.io/spatial_dvc.html,https://cadasa.github.io/vizapps/spatial_dvc.JPG,Geospatial Data View/Conversion https://cadasa.github.io/wem.html,https://cadasa.github.io/vizapps/wem.JPG,Wave-Equation Modelling using FD vs. NN and PINN https://cadasa.github.io/co2.html,https://cadasa.github.io/vizapps/co2.JPG,CO2 Emissions from Countries & Regions `32:T5d1,// // A miscellanea collection with a few paintings and creative coding works // miscellanea = [ { src: "https://upload.wikimedia.org/wikipedia/commons/6/67/Ismael_Nery_-_Nude_woman_crouching_-_sd.jpg", title: "Ismael Nery - Nude Woman Crouching, ca. 1930", link: "https://en.wikipedia.org/wiki/Brazilian_painting#/media/File:Ismael_Nery_-_Nude_woman_crouching_-_sd.jpg" }, { src: "https://upload.wikimedia.org/wikipedia/commons/f/f3/00472-Jader-Siqueira---Tr%C3%ADp.jpg", title: "Jader Siqueira - Triptych, 1977", link: "https://en.wikipedia.org/wiki/Brazilian_painting#/media/File:00472-Jader-Siqueira---Tr%C3%ADp.jpg" }, { src: "https://upload.wikimedia.org/wikipedia/commons/4/42/00031-Trindade-Leal----Gine.jpg", title: "Trindade Leal, Ginete. 1951", link: "https://en.wikipedia.org/wiki/Brazilian_painting#/media/File:00031-Trindade-Leal----Gine.jpg" }, { src: FileAttachment("mandala.png"), title: "Claudio Esperanca - Sketch Mandala", link: "https://observablehq.com/embed/@esperanc/sketch-mandala?cells=canvas" }, { src: "https://showcase.p5js.org/static/media/16.115cb70d.png", title: "36 Days of Type x p5.js", link: "https://36xp5.site/" }, { src: "https://showcase.p5js.org/static/media/32.ffa6848c.png", title: "Christina Dacanay (She/they) from Brooklyn, USA - Fireflies", link: "https://showcase.p5js.org/#/2020-All/project-32/" } ]33:T2126,interaction = { start; let animating = false; let id; let startCell = labyrinth.longestPath[0]; let pathLen = labyrinth.longestPath.length; let endCell = labyrinth.longestPath[pathLen - 1]; // Converts painting dir orientations to camera rotation angles around the y axis and vice versa const dirToYRot = [-Math.PI / 2, Math.PI / 2, Math.PI, 0]; const yRotToDir = { "-1": 0, 1: 1, 2: 2, 0: 3 }; // Current camera Y rotation angle const curCameraYRot = (quat) => { return new THREE.Euler().setFromQuaternion(quat || camera.quaternion, "YXZ") ._y; }; // Which wall direction camera currently points to const curCameraDir = () => { let angle = curCameraYRot(); return yRotToDir[Math.round(angle / (Math.PI / 2))]; }; // The currently viewed painting let currentPainting = null; // Non null if the painting popup is being shown let paintingPopupClose = null; // Opens a popup for the current painting const paintingPopup = function () { if (paintingPopupClose) return; const fwidth = canvas.width * 0.8; const fheight = canvas.height * 0.8; const ftop = canvas.height * 0.1; const fleft = canvas.width * 0.1; paintingPopupClose = popupFrame( mainFrame, currentPainting.link, ftop, fleft, fwidth, fheight, () => { paintingPopupClose = null; } ); }; // Non null if the painting popup is being shown let paintingPopupClose2 = null; const paintingPopup2 = function () { if (paintingPopupClose2) return; const fwidth = canvas.width * 0.8; const fheight = canvas.height * 0.8; const ftop = canvas.height * 0.1; const fleft = canvas.width * 0.1; paintingPopupClose2 = popupFrame( mainFrame, "https://cadasa.github.io/navhelp.html", ftop, fleft, fwidth, fheight, () => { paintingPopupClose2 = null; } ); }; // Something that is done whenever the camera moves to another point let cCell = camera.gridCoords; let cDir = curCameraDir(); const checkPosition = () => { cCell = camera.gridCoords; cDir = curCameraDir(); currentPainting = null; if (!flying) { for (let obj of paintingGroup.children) { let { painting, cell, dir } = obj.paintingProperties; if ( dir == cDir && cell[0] == cCell[0] && cell[1] == cCell[1] && cell[2] == cCell[2] ) { title.removeChild(title.children[0]); title.append(html`

${painting.title} 🔎

`); currentPainting = painting; break; } } } if (currentPainting) { title.style.visibility = "visible"; title.onclick = paintingPopup; } else { title.style.visibility = "hidden"; } return { cCell, cDir }; }; const noAnimation = () => {}; let repeatAnimation = noAnimation; // Rotates the camera const rotate = function (direction) { title.style.visibility = "hidden"; if (animating) return; // Dont do anything if its still finishing animation let oldRot = camera.quaternion.clone(); let newRot = camera.quaternion.clone().multiply(rotations[direction]); let counter = 0; function animation() { counter += 1; THREE.Quaternion.slerp(oldRot, newRot, camera.quaternion, counter / 60); renderer.render(scene, camera); if (counter == 60) { clearInterval(id); animating = false; checkPosition(); repeatAnimation(); } } animating = true; id = setInterval(animation, 1000 / 60); }; // Walks to a given cell const moveTo = function (nextCoords, nextQuat, cellCoords) { title.style.visibility = "hidden"; if (animating) return; // Dont do anything if its still finishing animation let counter = 0; let prev = camera.position.clone(); let next = new THREE.Vector3( ...(cellCoords ? boxPos(...cellCoords) : nextCoords) ); let oldQuat = camera.quaternion.clone(); function animation() { counter += 1; camera.position.lerpVectors(prev, next, counter / 60); if (nextQuat) THREE.Quaternion.slerp( oldQuat, nextQuat, camera.quaternion, counter / 60 ); renderer.render(scene, camera); if (counter == 60) { if (cellCoords) camera.gridCoords = cellCoords; if (breadCrumbs && cellCoords) labyrinth.checkFlags[cellCoords].visible = true; clearInterval(id); animating = false; checkPosition(); repeatAnimation(); } } animating = true; id = setInterval(animation, 1000 / 60); }; // Walks ahead const ahead = function () { if (animating) return; // Ignore if already animating let fwd = new THREE.Vector3(); camera.matrix.extractBasis(new THREE.Vector3(), new THREE.Vector3(), fwd); let currentCoords = camera.gridCoords; let wallCoords = currentCoords.map( (x, i) => x - Math.round(fwd.getComponent(i)) ); let [i, j, k] = wallCoords; if (labyrinth[i][j][k] == ".") { let nextCoords = currentCoords.map( (x, i) => x - 2 * Math.round(fwd.getComponent(i)) ); moveTo(null, null, nextCoords); } }; let [w, h] = [canvas.width, canvas.height]; const raycaster = new THREE.Raycaster(); const rayobjects = cubes.children.concat(paintingGroup.children); let mouse = new THREE.Vector2(); let flying = false; let oldPos, oldQuat, oldCell; buttons.walk.style.display = "none"; const setFlying = () => { let [x, y, z] = boxPos(...labSize); oldPos = camera.position.clone(); oldCell = [...camera.gridCoords]; oldQuat = camera.quaternion.clone(); moveTo([x, y + Math.max(...labSize) * 0.8, z], rotations.down); ["left", "right", "up", "fly"].forEach( (b) => (buttons[b].style.display = "none") ); buttons.walk.style.display = "inline-block"; flying = true; }; const setWalking = (quat, cell) => { moveTo(null, quat || oldQuat, cell || oldCell); ["left", "right", "up", "fly"].forEach( (b) => (buttons[b].style.display = "inline-block") ); buttons.walk.style.display = "none"; flying = false; }; const pickPainting = (e) => { mouse.x = (e.offsetX / canvas.width) * 2 - 1; mouse.y = -(e.offsetY / canvas.height) * 2 + 1; raycaster.setFromCamera(mouse, camera); let pick = raycaster.intersectObjects(rayobjects); if (pick.length > 0) { let obj = pick[0].object; if (obj.paintingProperties) { return obj.paintingProperties; } if (obj.isFloor) { let [i, j, k] = obj.gridCoords; return { cell: [i, 1, k], dir: cDir }; } } return null; }; canvas.oncontextmenu = (e) => { return false; }; canvas.onmousedown = (e) => { if (e.button != 0) return; checkPosition(); const pick = pickPainting(e); if (pick) { const angle = dirToYRot[pick.dir]; const newQuat = new THREE.Quaternion().setFromEuler( new THREE.Euler(0, angle, 0, "YXZ") ); flying = false; setWalking(newQuat, pick.cell); return; } if (flying) return; let [i, j] = [~~((e.offsetX / w) * 3), ~~((e.offsetY / h) * 3)]; repeatAnimation = noAnimation; if (i == 1) { repeatAnimation = ahead; } else { if (i == 0) repeatAnimation = () => { rotate("left"); }; else if (i == 2) repeatAnimation = () => { rotate("right"); }; } repeatAnimation(); }; buttons.left.onmousedown = (e) => { repeatAnimation = () => { rotate("left"); }; repeatAnimation(); }; buttons.up.onmousedown = (e) => { repeatAnimation = ahead; repeatAnimation(); }; buttons.right.onmousedown = (e) => { repeatAnimation = () => { rotate("right"); }; repeatAnimation(); }; buttons.fly.onmousedown = (e) => { if (animating) return; setFlying(); }; buttons.walk.onmousedown = (e) => { if (animating) return; setWalking(); }; buttons.full.onclick = paintingPopup2; canvas.onmouseup = buttons.left.onmouseup = buttons.right.onmouseup = buttons.up.onmouseup = (e) => { repeatAnimation = noAnimation; }; checkPosition(); invalidation.then(() => { if (animating) clearInterval(id); }); }34:T459,"commented out popup demo" // // POPUP FRAME DEMO // // { // const frame = html`

`; // frame.style["width"] = "800px"; // frame.style["height"] = "600px"; // frame.style["text-align"] = "center"; // frame.style["background-color"] = "lightgray"; // frame.style.display = "inline-block"; // frame.style.border = "1px solid gray"; // frame.style.position = "relative"; // const content = md`*Click to open popup*`; // content.style.border = "1px solid pink"; // content.style["border-radius"] = "15px"; // content.style["padding"] = "2px 10px"; // content.style.display = "inline-block"; // content.style.margin = "0 auto"; // content.style["margin-top"] = "20px"; // content.style.position = "relative"; // content.style["box-shadow"] = "4px 4px 5px 0px rgba(0,0,0,.2)"; // frame.append(content); // let popupOpen = false; // content.onclick = () => { // if (!popupOpen) { // popupOpen = true; // popupFrame(frame, paintingInfo[3].link, 100, 100, 600, 400, () => { // popupOpen = false; // }); // } // }; // return frame; // }35:Ta01,// // Function to open an iframe overlayed on parent. // url is the iframe url. // top, left, width, height control the geometry of the overlay. // closeCallback, if defined, is called when the popup closes. // Returns a function to remove the popup. // popupFrame = { const cross = await FileAttachment("cross.png").image(); cross.width = 30; const fullscr = await FileAttachment("fullscreen-icon.jpg").image(); fullscr.width = 30; const loading = await FileAttachment("loading.gif").image(); return function (parent, url, top, left, width, height, closeCallback) { const frame = html``; frame.style["background-color"] = "white"; frame.style.backgroundImage = `url(${loading.src})`; frame.style["background-size"] = "contain"; frame.style["background-position"] = "center"; frame.style["background-repeat"] = "no-repeat"; frame.style.position = "absolute"; frame.style.width = `${width}px`; frame.style.height = `${height}px`; frame.style["z-index"] = 100; frame.style.top = `${top}px`; frame.style.left = `${left}px`; parent.append(frame); const close = html`

${cross}

`; close.style.width = "30px"; close.style.height = "30px"; close.style["background-color"] = "white"; close.style.position = "absolute"; close.style["z-index"] = 100; close.style.top = `${top}px`; close.style.left = `${left + width + 4}px`; parent.append(close); const fullscreen = html`

${fullscr}

`; fullscreen.style.width = "30px"; fullscreen.style.height = "30px"; fullscreen.style["background-color"] = "white"; fullscreen.style.position = "absolute"; fullscreen.style["z-index"] = 100; fullscreen.style.top = `${top + 30}px`; fullscreen.style.left = `${left + width + 4}px`; parent.append(fullscreen); const closePopup = () => { parent.removeChild(frame); parent.removeChild(close); parent.removeChild(fullscreen); if (closeCallback) closeCallback(); }; const maxPopup = () => { frame.requestFullscreen(); if (closeCallback) closeCallback(); }; frame.onload = () => { frame.style.backgroundImage = `none`; }; frame.addEventListener("click", (e) => { e.preventDefault(); }); close.onclick = (e) => { closePopup(); e.stopPropagation(); return false; }; fullscreen.onclick = (e) => { maxPopup(); e.stopPropagation(); return false; }; return closePopup; }; }36:T507,make3dLabyrinth = function(nx, ny, nz) { let lab = []; let [imax, jmax, kmax] = [nx, ny, nz].map(n => 2 * n + 1); // Fill the labyrinth for (let i = 0; i < imax; i++) { lab.push([]); for (let j = 0; j < jmax; j++) { lab[i].push([]); for (let k = 0; k < kmax; k++) { lab[i][j][k] = (i & j & k & 1) == 1 ? 'U' : 'W'; } } } // Directions to walk let dir = [ [1, 0, 0], [-1, 0, 0], [0, 1, 0], [0, -1, 0], [0, 0, 1], [0, 0, -1] ]; // Make a random walk breaking walls starting from cell i,j,k let visit = (i, j, k) => { lab[i][j][k] = '.'; let longest = []; for (let [di, dj, dk] of shuffle(dir)) { let [I, J, K] = [i + di * 2, j + dj * 2, k + dk * 2]; if (I < 0 || J < 0 || K < 0 || I >= imax || J >= jmax || K >= kmax) continue; if (lab[I][J][K] == 'U') { lab[i + di][j + dj][k + dk] = '.'; lab[i][j][k] = '.'; let newpath = visit(I, J, K); if (newpath.length > longest.length) longest = newpath; } } longest.push([i, j, k]); return longest; }; let path = visit( ~~(Math.random() * nx) * 2 + 1, ~~(Math.random() * ny) * 2 + 1, ~~(Math.random() * nz) * 2 + 1 ); lab.longestPath = path; return lab; }37:T542,// // Tear down a few walls // decimate = { function getWalls() { let walls = []; for (let i = 1; i < labyrinth.length - 1; i += 1) { for (let j = 1; j < labyrinth[0].length - 1; j += 1) { for (let k = 1; k < labyrinth[0][0].length - 1; k += 1) { if ((i & 1) + (j & 1) + (k & 1) == 2 && labyrinth[i][j][k] == 'W') walls.push([i, j, k]); } } } return walls; } let walls = getWalls(); // Tear down a few walls according to decimateRatio walls = shuffle(walls); let n = ~~(walls.length * decimateRatio); for (let [i, j, k] of walls.slice(0, n)) labyrinth[i][j][k] = "."; // Tear down "columns" // Tear down walls between cells for (let i = 1; i < labyrinth.length - 1; i += 1) { for (let j = 1; j < labyrinth[0].length - 1; j += 1) { for (let k = 1; k < labyrinth[0][0].length - 1; k += 1) { if ((i & 1) + (j & 1) + (k & 1) == 1 && labyrinth[i][j][k] == 'W') { let count = 0; for (let [di, dj, dk] of [ [-1, 0, 0], [1, 0, 0], [0, -1, 0], [0, 1, 0], [0, 0, -1], [0, 0, 1] ]) if (labyrinth[i + di][j + dj][k + dk] != 'W') count++; if (count == 4) labyrinth[i][j][k] = "."; } } } } return walls; }38:T911,// // Returns a group with all 3d elements of the maze, including // the walls, floor and sprites // cubes = { decimate; // Regenerate after decimation of walls, if any let materials = []; let geometries = [[[], []], [[], []]]; let getCubeGeometry = (i, j, k) => geometries[i % 2][j % 2][k % 2] || (geometries[i % 2][j % 2][k % 2] = new THREE.BoxBufferGeometry( ...boxSize(i, j, k).map(x => x) )); let getCubeMaterial = i => materials[i] || (materials[i] = new THREE.MeshStandardMaterial({ color: new THREE.Color().setHSL(Math.random(), 1, 0.5) })); let beamMaterial = new THREE.MeshStandardMaterial({ color: 0xffffff }); let floorMaterial = new THREE.MeshStandardMaterial({ color: 0x777777 }); let cubes = new THREE.Group(); let spriteMap = new THREE.CanvasTexture( await FileAttachment('whitecheck.png').image() ); let checkMaterial = new THREE.SpriteMaterial({ map: spriteMap }); spriteMap = new THREE.CanvasTexture(await FileAttachment('exit.png').image()); let exitMaterial = new THREE.SpriteMaterial({ map: spriteMap }); let startCell = labyrinth.longestPath[0]; let pathLen = labyrinth.longestPath.length; let endCell = labyrinth.longestPath[pathLen - 1]; labyrinth.checkFlags = {}; let [jmin, jmax] = removeCeiling ? [0, labyrinth[0].length - 1] : [0, labyrinth[0].length]; for (let i = 0; i < labyrinth.length; i++) { for (let j = jmin; j < jmax; j++) { for (let k = 0; k < labyrinth[i][j].length; k++) { let cubetype = labyrinth[i][j][k]; if (cubetype != '.') { let isFloor = j == 0 && (i & 1) + (k & 1) == 2; let material = isFloor ? floorMaterial : beamMaterial; let cube = new THREE.Mesh(getCubeGeometry(i, j, k), material); cube.isFloor = isFloor; cube.gridCoords = [i, j, k]; cube.position.set(...boxPos(i, j, k)); cubes.add(cube); } else if (breadCrumbs && i & j & k & 1) { let flag = new THREE.Sprite(checkMaterial); flag.visible = false; labyrinth.checkFlags[[i, j, k]] = flag; let [x, y, z] = boxPos(i, j, k); flag.position.set(x, y - 0.4, z); flag.scale.set(0.1, 0.1, 0.1); cubes.add(flag); } } } } return cubes; }39:[{"id":"9af138672c731cbef6af8a65f748acdc4517813ea336ac0e78a21c890d4337e2b462070edfe8c009c63ba947fe9257d740f00addc58035070b067373f3644bf3","href":"https://static.observableusercontent.com/files/9af138672c731cbef6af8a65f748acdc4517813ea336ac0e78a21c890d4337e2b462070edfe8c009c63ba947fe9257d740f00addc58035070b067373f3644bf3","name":"p5showcase.csv","type":"text/csv","lastModified":1614437995483.587,"size":9303},{"id":"c5b437c8fb61945c19bf73d92fb3d9b89e087fd07f8360ebf44542481d594533df5696c28a199755363238bb72dda5db81907ee0f37dcacf0a4358bebe3e6321","href":"https://static.observableusercontent.com/files/c5b437c8fb61945c19bf73d92fb3d9b89e087fd07f8360ebf44542481d594533df5696c28a199755363238bb72dda5db81907ee0f37dcacf0a4358bebe3e6321","name":"national_gallery.csv","type":"text/csv","lastModified":1614437995483.587,"size":25243},{"id":"6012ded5e0d5ff34d312bb1920098a367f51ace61f400a186c58d73ddff192b506c453c0097c016db2b0ef924f9220b5829270a2d860ceb7eb69f515b37af360","href":"https://static.observableusercontent.com/files/6012ded5e0d5ff34d312bb1920098a367f51ace61f400a186c58d73ddff192b506c453c0097c016db2b0ef924f9220b5829270a2d860ceb7eb69f515b37af360","name":"british_museum.csv","type":"text/csv","lastModified":1614437995483.587,"size":56156},{"id":"5b2d099b4523af9aeb149d3f1b7e2bea26597f0c04f6f52357d0ef86febc1e37f3c9e422624755c26f06055e8383e59eed15cca8ebb77cb91173d362a119b653","href":"https://static.observableusercontent.com/files/5b2d099b4523af9aeb149d3f1b7e2bea26597f0c04f6f52357d0ef86febc1e37f3c9e422624755c26f06055e8383e59eed15cca8ebb77cb91173d362a119b653","name":"louvre.csv","type":"text/csv","lastModified":1614437995483.587,"size":17453},{"id":"7a0714247131cc0fdb2854ca7f6f5d9c72ccbb1c1254caca6ae51ce72eb9627a02773dcf986e9a370c4a6b7f70d2ba086a988bac6f688352edbf83cd75e30baa","href":"https://static.observableusercontent.com/files/7a0714247131cc0fdb2854ca7f6f5d9c72ccbb1c1254caca6ae51ce72eb9627a02773dcf986e9a370c4a6b7f70d2ba086a988bac6f688352edbf83cd75e30baa","name":"kinetic_art.csv","type":"text/csv","lastModified":1614437995483.587,"size":2077},{"id":"36726c6312e219864de317451a646b5006ac7a074600b008fe6cc3c2144eda7c2a9f0c1a7b0d627969bf0bb70c168985fcaa30255dcb961bf2770856700bdfb2","href":"https://static.observableusercontent.com/files/36726c6312e219864de317451a646b5006ac7a074600b008fe6cc3c2144eda7c2a9f0c1a7b0d627969bf0bb70c168985fcaa30255dcb961bf2770856700bdfb2","name":"modern_art@1.csv","type":"text/csv","lastModified":1614437995483.587,"size":6511},{"id":"2c20e5a12127d278152c1b5235756461d35ac442bb59bf02f4db8a4b84aaec6f800a743293c0320355d2e6ad6905e129d720fc59f83015005b713202ffffffb7","href":"https://static.observableusercontent.com/files/2c20e5a12127d278152c1b5235756461d35ac442bb59bf02f4db8a4b84aaec6f800a743293c0320355d2e6ad6905e129d720fc59f83015005b713202ffffffb7","name":"brazilian_art@1.csv","type":"text/csv","lastModified":1614437995483.587,"size":10125},{"id":"f80a728ad412c8e9d7606a8756041a717b365251e8c98bbdc52dfbaec3d2ec5a3f462dc75bd1ca774ba11d33b05a3a97ec0072a3364bbbad4a082e84fb5ad700","href":"https://static.observableusercontent.com/files/f80a728ad412c8e9d7606a8756041a717b365251e8c98bbdc52dfbaec3d2ec5a3f462dc75bd1ca774ba11d33b05a3a97ec0072a3364bbbad4a082e84fb5ad700","name":"mandala.png","type":"image/png","lastModified":1614437995483.587,"size":157064},{"id":"8f0c76b4c5b18a30f19518ac4e8863c6caadc0469859ecbc9311954429969229f9ec4e970b4819d4f79f175e4ea9889f4dd4890868402463141ff1ee539d7608","href":"https://static.observableusercontent.com/files/8f0c76b4c5b18a30f19518ac4e8863c6caadc0469859ecbc9311954429969229f9ec4e970b4819d4f79f175e4ea9889f4dd4890868402463141ff1ee539d7608","name":"exit.png","type":"image/png","lastModified":1614437995483.587,"size":12521},{"id":"cb47fe65703ae0fdd8658efe34b882c0f51a5316302f59ae2106e480a86788a27bd69672f2022af0b6c06c681ac9ba6843b4cd4abf7769f2e0c9874e7d0cf6cd","href":"https://static.observableusercontent.com/files/cb47fe65703ae0fdd8658efe34b882c0f51a5316302f59ae2106e480a86788a27bd69672f2022af0b6c06c681ac9ba6843b4cd4abf7769f2e0c9874e7d0cf6cd","name":"whitecheck.png","type":"image/png","lastModified":1614437995483.587,"size":13401},{"id":"96840efd22040db3234d3439d06aabfb4fe6f5e36c65ae7f0ccf3a2fabb6c8738fa9777935ad0b0d4d5ac0009456710e4f65be343e7731787607fe15f200c663","href":"https://static.observableusercontent.com/files/96840efd22040db3234d3439d06aabfb4fe6f5e36c65ae7f0ccf3a2fabb6c8738fa9777935ad0b0d4d5ac0009456710e4f65be343e7731787607fe15f200c663","name":"nz.png","type":"image/png","lastModified":1614437995483.587,"size":449211},{"id":"bc8de4b1ced0c0fe2e10c6ce24fef976a7536bcc33b14af010f8b5ecc53f016a92d6f81728e5337d12f91f9a207409a0db2f05466e50e8f22d9a08a7cfaf9d50","href":"https://static.observableusercontent.com/files/bc8de4b1ced0c0fe2e10c6ce24fef976a7536bcc33b14af010f8b5ecc53f016a92d6f81728e5337d12f91f9a207409a0db2f05466e50e8f22d9a08a7cfaf9d50","name":"pz.png","type":"image/png","lastModified":1614437995483.587,"size":460402},{"id":"409556af1de740c6f5ef8e45ab950809821522719e1bb090779cc1dd9d922b1c1b1f807acf07e3aacfdb7a3c3fe35921fe21fe32d12e810a8699d206cc4e4f1f","href":"https://static.observableusercontent.com/files/409556af1de740c6f5ef8e45ab950809821522719e1bb090779cc1dd9d922b1c1b1f807acf07e3aacfdb7a3c3fe35921fe21fe32d12e810a8699d206cc4e4f1f","name":"ny.png","type":"image/png","lastModified":1614437995483.587,"size":417779},{"id":"40676807f861b520136c6671c1890706b1eae673a51a2afcafa20a9757adc75f9820f605c851a4b3773a361e6612feb5f00969ff883032b025e74cc04a2c1bbc","href":"https://static.observableusercontent.com/files/40676807f861b520136c6671c1890706b1eae673a51a2afcafa20a9757adc75f9820f605c851a4b3773a361e6612feb5f00969ff883032b025e74cc04a2c1bbc","name":"py.png","type":"image/png","lastModified":1614437995483.587,"size":472991},{"id":"3dfd24c183fbfc309726af65436f68c4e53c502e526e2d47ef0a54e57d55fc0e82d40377540ceb90cb802f4a41036aa389ffc00e7e73253d365003c7aa074f9e","href":"https://static.observableusercontent.com/files/3dfd24c183fbfc309726af65436f68c4e53c502e526e2d47ef0a54e57d55fc0e82d40377540ceb90cb802f4a41036aa389ffc00e7e73253d365003c7aa074f9e","name":"nx.png","type":"image/png","lastModified":1614437995483.587,"size":475126},{"id":"d005653ecf0b4ea481788f5e5a400605ff7d91dac3c4695de94341eeb7b910f73bcf6eebe365e6ebc1d1d5ece1374cf577e95fd14c98023ac2b32c302c49b4e4","href":"https://static.observableusercontent.com/files/d005653ecf0b4ea481788f5e5a400605ff7d91dac3c4695de94341eeb7b910f73bcf6eebe365e6ebc1d1d5ece1374cf577e95fd14c98023ac2b32c302c49b4e4","name":"px.png","type":"image/png","lastModified":1614437995483.587,"size":464459},{"id":"461c442521fbaef914140a2b9b4c04729a49d7954447280175b7ef4131e80276ec539a6f633cd240b2e3340b455035f580e63ff7683754623cec8558784eb9d3","href":"https://static.observableusercontent.com/files/461c442521fbaef914140a2b9b4c04729a49d7954447280175b7ef4131e80276ec539a6f633cd240b2e3340b455035f580e63ff7683754623cec8558784eb9d3","name":"loading.gif","type":"image/gif","lastModified":1614437995483.587,"size":8821},{"id":"1b82976ea4b594ee5bc43a75249aa0e0732c9e16e7a13599184cf48e5dc95e517b41f5670dc13ee03efb083dd360dddb6c8bd17a7d59d1b2e52a55cfa5755176","href":"https://static.observableusercontent.com/files/1b82976ea4b594ee5bc43a75249aa0e0732c9e16e7a13599184cf48e5dc95e517b41f5670dc13ee03efb083dd360dddb6c8bd17a7d59d1b2e52a55cfa5755176","name":"cross.png","type":"image/png","lastModified":1614437995483.587,"size":11879},{"id":"8e64db4f55cacdcd4b1c8bb0e32a1fc8c6451454a33817cfabebf983a98465fe93e78a9ac6ec3c9a4a5d369396659716e429847275cfcaa65a48f2da27b70b13","href":"https://static.observableusercontent.com/files/8e64db4f55cacdcd4b1c8bb0e32a1fc8c6451454a33817cfabebf983a98465fe93e78a9ac6ec3c9a4a5d369396659716e429847275cfcaa65a48f2da27b70b13","name":"louvre (1)-7@1.csv","type":"text/csv","lastModified":1648245223688.658,"size":3217},{"id":"1497977ff4622c7e3397e5c5d8a5adc70b36fcbf4ca8ab179f56f7fad0754c49a43c408637350e8761c112e94ca7e53917e084c377db273e9f855aed3b8e55c2","href":"https://static.observableusercontent.com/files/1497977ff4622c7e3397e5c5d8a5adc70b36fcbf4ca8ab179f56f7fad0754c49a43c408637350e8761c112e94ca7e53917e084c377db273e9f855aed3b8e55c2","name":"louvre (1)-7-1.csv","type":"text/csv","lastModified":1675069072198.167,"size":3682},{"id":"78556ac0f5dc4148a0caf1eea6ab377b897424e26bfafbd51516ba19c0c9650ea2c6f4213233272cc90f08ee2f86a90fea34ed38ca336d345e3e121d55c8c2bc","href":"https://static.observableusercontent.com/files/78556ac0f5dc4148a0caf1eea6ab377b897424e26bfafbd51516ba19c0c9650ea2c6f4213233272cc90f08ee2f86a90fea34ed38ca336d345e3e121d55c8c2bc","name":"louvre (1)-7-1@1.csv","type":"text/csv","lastModified":1675263097628.194,"size":4166},{"id":"24022ed6f817de03707d7b8cdb4e712ccfb1520e2246acf8baf1f01410f6ca3b33573a86228aa3876fcd7df73bc37020d118a2e66321061c99f9a7929db48aa4","href":"https://static.observableusercontent.com/files/24022ed6f817de03707d7b8cdb4e712ccfb1520e2246acf8baf1f01410f6ca3b33573a86228aa3876fcd7df73bc37020d118a2e66321061c99f9a7929db48aa4","name":"2814-200.png","type":"image/png","lastModified":1678037678480.603,"size":2000},{"id":"b7d82417f6c401b2340691a1a42983909375864a4a1dbbc9c263fb473890b3455b8f9f034658d72a5136498376ce55278b3898f962c8de6e88ede65dfc788408","href":"https://static.observableusercontent.com/files/b7d82417f6c401b2340691a1a42983909375864a4a1dbbc9c263fb473890b3455b8f9f034658d72a5136498376ce55278b3898f962c8de6e88ede65dfc788408","name":"fullscreen-icon.jpg","type":"image/jpeg","lastModified":1678040279441.817,"size":20632}] 2e:{"title":"3D Virtual Gallery of KHANH ACADEMY!","cells":[{"id":1751,"value":"viewof title2 = md`# 3D Virtual Gallery of KHANH ACADEMY!`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1742,"value":"viewof fullscreen1 = {\n const button = html`