[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_169":170,"_171":172},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_18":19,"_17":-7,"_127":-5,"_20":128,"_22":129,"_130":131,"_132":133,"_25":134,"_24":-5,"_135":136,"_137":138,"_139":51,"_140":141,"_142":70,"_143":-5,"_144":-5,"_145":146},"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":-7,"_25":26,"_27":28,"_29":-5,"_30":31,"_32":31,"_33":-5},"handle","artivilla","name","time_walk","branchName","main","version","path","","project",{"_34":84,"_13":14,"_36":85,"_49":-5,"_86":51,"_52":53,"_87":53,"_88":-5,"_89":-5,"_90":91,"_92":63,"_93":70,"_94":-5,"_95":-5,"_96":31,"_56":97,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":103,"_104":103,"_105":106,"_107":106,"_108":106,"_109":103,"_110":103,"_111":112,"_113":114,"_115":116,"_50":51},"tree",[79],"file","contents",[59],"upstream",{"_34":35,"_36":37,"_38":39,"_13":16,"_40":41,"_17":42,"_43":44,"_45":46,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":14},"pull","ahead",0,"behind","envVars","id","8bb4a06c-0a66-11f0-9f27-569c3dd06744","createdAt",["D",1743009599503],"updatedAt",["D",1743188539147],"projectId","8bb1b780-0a66-11f0-9f27-569c3dd06744",35,"forkedBranchId","4d08a0e4-0a65-11f0-971d-569c3dd06744","forkedBranchVersion",2,"lockfileKey","1744494117142-esm.town_v_shouser_time_walk@35-main","deletedAt","isOwned",false,"privacy","public","userHandle","shouser","orgId","a64c2ee7-6cd7-4fb7-9ff6-03782ed89739","projectName",{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":71,"_17":31,"_72":73,"_74":75,"_76":51,"_77":-5,"_18":78},"ee043d8c-0eac-11f0-9471-569c3dd06744","main.js","fileId","ad27201e-1afb-4eea-a89d-28aceb1cd71f","parentId","branchId","ee027128-0eac-11f0-9471-569c3dd06744","branchVersion",1,"latest",true,["D",1743479633853],"fileType","http","content","import type * as p5 from \"npm:@types/p5\";\n\n// Declare variables for comet particle system\nlet particles = [];\nlet cometPosition;\nlet cometTrail = [];\nlet tailPhase = 0;\nlet colorPhase = 0; // For changing background colors\n// Create a single unified speed variable for all animations\nlet unifiedSpeed = 0.8; // Slow movement speed - this now controls everything\n\nexport function setup() {\n // Create a canvas that fills the entire screen\n createCanvas(windowWidth, windowHeight);\n textAlign(CENTER);\n colorMode(HSB);\n\n // Initialize comet position fixed at the bottom center\n cometPosition = createVector(width / 2, height - height / 5);\n\n // Create initial particles\n for (let i = 0; i < 40; i++) {\n createCometParticle();\n }\n}\n\n// Handle window resizing\nexport function windowResized() {\n resizeCanvas(windowWidth, windowHeight);\n // Adjust comet position after resize\n cometPosition = createVector(width / 2, height - height / 5);\n}\n\nexport function draw() {\n // Create a continuously changing gradient background - simplified version\n colorPhase += 0.005; // Slow color change speed\n\n // Create top and bottom colors that change over time\n let topHue = (sin(colorPhase) * 30 + 210) % 360; // Hue cycles through blues\n let bottomHue = (sin(colorPhase + 1) * 30 + 220) % 360;\n\n // Draw a simple background color first to avoid any gaps\n background(topHue, 75, 80);\n\n // Draw simplified gradient using rect() instead of line-by-line\n noStroke(); // Ensure no stroke is applied to rectangles\n\n // Draw gradient with 10 rectangles (sufficient for smooth appearance but much faster)\n let steps = 10;\n for (let i = 0; i < steps; i++) {\n let inter = i / (steps - 1);\n let y = inter * height;\n let rectHeight = height / steps + 2; // Add extra height to ensure overlap\n\n let currentHue = lerp(topHue, bottomHue, inter);\n fill(currentHue, 75, 80);\n rect(0, y, width, rectHeight); // Slightly overlapping rectangles\n }\n\n // Perspective settings for timestamps\n let vanishingPointY = 0; // Vanishing point is at the top\n let horizon = height * 0.15; // Horizon line position\n let numTimestamps = 25; // More timestamps for smoother effect\n let minSize = 8; // Size at the top (distance)\n let maxSize = 36; // Size at the bottom (foreground)\n\n // Using the unified speed variable\n let totalDistance = height - horizon;\n\n // Draw the timestamps with perspective effect\n for (let i = 0; i < numTimestamps; i++) {\n // Get current time\n let now = new Date();\n let hours = now.getHours().toString().padStart(2, \"0\");\n let minutes = now.getMinutes().toString().padStart(2, \"0\");\n let seconds = now.getSeconds().toString().padStart(2, \"0\");\n let milliseconds = now.getMilliseconds().toString().padStart(3, \"0\");\n let timeString = `${hours}:${minutes}:${seconds}.${milliseconds}`;\n\n // Calculate base position for this timestamp\n let basePos = i * (totalDistance / numTimestamps);\n\n // Apply movement with modulo for looping - using unifiedSpeed\n let yOffset = (frameCount * unifiedSpeed) % totalDistance;\n let y = horizon + ((basePos + yOffset) % totalDistance);\n\n // Calculate size based on position\n let progress = (y - horizon) / totalDistance; // 0 at horizon, 1 at bottom\n let fontSize = minSize + (maxSize - minSize) * progress;\n\n // Fade in as they appear at horizon\n let alpha = 255;\n if (y < horizon + 20) {\n alpha = map(y, horizon, horizon + 20, 0, 255);\n }\n\n // Draw the center timestamp\n textSize(fontSize);\n fill(0, 0, 0, alpha);\n text(timeString, width / 2, y);\n }\n\n // Create perspective walls of timestamps - using unifiedSpeed\n for (let y = horizon; y < height; y += 5) {\n let progress = (y - horizon) / totalDistance;\n let fontSize = (minSize + (maxSize - minSize) * progress) * 0.8;\n\n // Fade in at horizon\n let alpha = 255;\n if (y < horizon + 20) {\n alpha = map(y, horizon, horizon + 20, 0, 255);\n }\n\n // Get time for this row\n let now = new Date();\n let hours = now.getHours().toString().padStart(2, \"0\");\n let minutes = now.getMinutes().toString().padStart(2, \"0\");\n let seconds = now.getSeconds().toString().padStart(2, \"0\");\n let milliseconds = now.getMilliseconds().toString().padStart(3, \"0\");\n\n // Create a central corridor (road) - NARROWER ROAD\n // Changed from 0.1-0.3 to 0.05-0.2 for narrower road so walls are closer\n let roadWidth = map(progress, 0, 1, 0.05, 0.2);\n\n // Only draw timestamps outside the road area\n if (random() < 0.3) { // Control density of timestamps\n // Left side wall - CLOSER TO ROAD\n // Changed to move wall closer to road edge\n let leftSideX = random(width * (0.5 - roadWidth) - width * 0.1, width * (0.5 - roadWidth));\n\n // Calculate angle - mirroring the right wall's angle calculation\n let angleToVanishing = atan2(leftSideX - width / 2, horizon - y);\n let leftAngle = angleToVanishing + PI / 2 + random(-0.1, 0.1);\n\n push();\n translate(leftSideX, y);\n rotate(leftAngle);\n textSize(fontSize * random(0.7, 1.0));\n fill(0, 0, 0, alpha * 0.8);\n text(`${hours}:${minutes}:${seconds}.${Math.floor(random(999))}`, 0, 0);\n pop();\n }\n\n if (random() < 0.3) {\n // Right side wall - CLOSER TO ROAD\n // Changed to move wall closer to road edge\n let rightSideX = random(width * (0.5 + roadWidth), width * (0.5 + roadWidth) + width * 0.1);\n\n // Calculate angle - pointing toward vanishing point but with randomness\n let angleToVanishing = atan2(rightSideX - width / 2, horizon - y);\n let rightAngle = angleToVanishing - PI / 2 + random(-0.1, 0.1);\n\n push();\n translate(rightSideX, y);\n rotate(rightAngle);\n textSize(fontSize * random(0.7, 1.0));\n fill(0, 0, 0, alpha * 0.8);\n text(`${hours}:${minutes}:${seconds}.${Math.floor(random(999))}`, 0, 0);\n pop();\n }\n }\n\n // Add more scattered timestamps throughout the sides - USING UNIFIED SPEED\n for (let i = 0; i < 90; i++) { // Increased from 70 to 90 for more density\n // Use unified speed for all animations\n let yOffset = (frameCount * unifiedSpeed) % totalDistance;\n let baseY = i * (totalDistance / 90); // Distribute timestamps evenly\n // Apply movement to the timestamps on the sides with the same speed\n let y = horizon + ((baseY + yOffset) % totalDistance);\n\n let progress = (y - horizon) / totalDistance;\n\n // NARROWER ROAD\n let roadWidth = map(progress, 0, 1, 0.05, 0.2); // Narrower road\n let fontSize = (minSize + (maxSize - minSize) * progress) * 0.7;\n\n // Get randomized times\n let now = new Date();\n let hours = now.getHours().toString().padStart(2, \"0\");\n let minutes = now.getMinutes().toString().padStart(2, \"0\");\n let seconds = now.getSeconds().toString().padStart(2, \"0\");\n let milliseconds = Math.floor(random(999)).toString().padStart(3, \"0\");\n\n // Alpha based on y-position\n let alpha = 255;\n if (y < horizon + 20) {\n alpha = map(y, horizon, horizon + 20, 0, 255);\n }\n\n // Left side random timestamps - CLOSER TO ROAD\n if (random() < 0.5) {\n // Changed to position timestamps closer to road\n let x = random(width * 0.1, width * (0.5 - roadWidth * 0.5));\n\n // Calculate angle toward vanishing point with more randomness - mirrored from right side\n let angleToVanishing = atan2(x - width / 2, horizon - y);\n let displayAngle = angleToVanishing + PI / 2 + random(-0.3, 0.3);\n\n push();\n translate(x, y);\n rotate(displayAngle);\n textSize(fontSize * random(0.6, 1.0));\n fill(0, 0, 0, alpha * random(0.4, 0.7));\n text(`${hours}:${minutes}:${seconds}.${milliseconds}`, 0, 0);\n pop();\n }\n\n // Right side random timestamps - CLOSER TO ROAD\n if (random() < 0.5) {\n // Changed to position timestamps closer to road\n let x = random(width * (0.5 + roadWidth * 0.5), width * 0.9);\n\n // Calculate angle toward vanishing point with more randomness\n let angleToVanishing = atan2(x - width / 2, horizon - y);\n let displayAngle = angleToVanishing - PI / 2 + random(-0.3, 0.3);\n\n push();\n translate(x, y);\n rotate(displayAngle);\n textSize(fontSize * random(0.6, 1.0));\n fill(0, 0, 0, alpha * random(0.4, 0.7));\n text(`${hours}:${minutes}:${seconds}.${milliseconds}`, 0, 0);\n pop();\n }\n }\n\n // Update comet and trail\n updateComet();\n\n // Draw comet trail first (behind the comet head)\n drawCometTrail();\n\n // Calculate a small bounce for the comet head\n let bounceAmount = sin(frameCount * 0.1) * 3; // Small vertical bounce\n\n // Draw comet head (the bright center) - with slight bounce\n noStroke();\n fill(40, 100, 100); // Orange-yellow color\n ellipse(cometPosition.x, cometPosition.y + bounceAmount, 20, 20);\n\n // Draw glow around comet head\n drawingContext.shadowBlur = 15;\n drawingContext.shadowColor = color(40, 100, 100, 0.8);\n ellipse(cometPosition.x, cometPosition.y + bounceAmount, 16, 16);\n drawingContext.shadowBlur = 0;\n\n // Run the particle system\n updateParticles();\n drawParticles();\n\n // Add new particles\n if (frameCount % 2 === 0) {\n createCometParticle();\n }\n}\n\nfunction updateComet() {\n // Fixed position for comet head (base position, bounce is added when drawing)\n cometPosition.x = width / 2;\n cometPosition.y = height - height / 5;\n\n // Update the tail phase to create sideways movement\n tailPhase += 0.05;\n\n // Calculate bounce for consistency with head\n let bounceAmount = sin(frameCount * 0.1) * 3;\n\n // Generate a trail point starting from the middle of the comet head\n // with smaller oscillation radius\n let trailPoint = createVector(\n cometPosition.x + sin(tailPhase) * 8, // Smaller amplitude for oscillation\n cometPosition.y + bounceAmount, // Start at the center of the head, not below it\n );\n\n // Keep track of trail\n cometTrail.push(trailPoint);\n if (cometTrail.length > 20) {\n cometTrail.shift();\n }\n}\n\nfunction drawCometTrail() {\n noStroke();\n\n // Draw trail with gradient - using smaller circles\n for (let i = 0; i < cometTrail.length; i++) {\n let pos = cometTrail[i];\n let alpha = map(i, 0, cometTrail.length, 0, 200);\n // Use even smaller sizes for the trail\n let size = map(i, 0, cometTrail.length, 1, 5);\n\n fill(40, 100, 100, alpha / 255);\n ellipse(pos.x, pos.y, size, size);\n }\n}\n\nfunction createCometParticle() {\n // Create particles around the current trail point rather than the comet head\n let trailPos = cometTrail.length > 0\n ? cometTrail[cometTrail.length - 1]\n : createVector(cometPosition.x, cometPosition.y); // Start from the center of the head\n\n particles.push(\n new CometParticle(\n trailPos.x + random(-3, 3), // Smaller random spread\n trailPos.y + random(-3, 3), // Smaller random spread\n ),\n );\n}\n\n// Comet particle class\nclass CometParticle {\n constructor(x, y) {\n this.position = createVector(x, y);\n\n // Random velocity with downward bias (away from the top, toward the bottom)\n let angle = random(-PI / 4, PI / 4) + PI / 2; // Mostly downward with some sideways variation\n let speed = random(0.5, 2);\n this.velocity = p5.Vector.fromAngle(angle, speed);\n\n this.acceleration = createVector(0, 0);\n this.size = random(2, 8);\n\n // Colors ranging from yellow to orange to red\n this.color = color(random(15, 45), random(80, 100), 100, 0.7);\n this.lifespan = random(100, 200);\n this.maxLife = this.lifespan;\n }\n\n update() {\n // Add some sideways movement based on the tail phase\n let sideForce = createVector(sin(tailPhase + this.lifespan / 100) * 0.05, 0);\n this.acceleration.add(sideForce);\n\n this.velocity.add(this.acceleration);\n this.velocity.mult(0.98); // Damping\n this.position.add(this.velocity);\n this.lifespan -= 2;\n this.acceleration.mult(0);\n }\n\n display() {\n noStroke();\n\n // Fade out as lifespan decreases\n let alpha = map(this.lifespan, 0, this.maxLife, 0, 255);\n let particleColor = color(\n hue(this.color),\n saturation(this.color),\n brightness(this.color),\n alpha / 255,\n );\n\n fill(particleColor);\n ellipse(this.position.x, this.position.y, this.size, this.size);\n }\n\n isDead() {\n return this.lifespan <= 0;\n }\n}\n\nfunction updateParticles() {\n // Update and remove dead particles\n for (let i = particles.length - 1; i >= 0; i--) {\n particles[i].update();\n if (particles[i].isDead()) {\n particles.splice(i, 1);\n }\n }\n}\n\nfunction drawParticles() {\n // Draw all particles\n for (let particle of particles) {\n particle.display();\n }\n}\n\nimport { sketch } from \"https://esm.town/v/saolsen/p5\";\nexport default sketch(import.meta.url);","deleted","label",[61],{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":80,"_17":31,"_72":73,"_74":75,"_76":51,"_77":-5,"_81":82,"_18":83},["D",1743479633853],"children",[],[61],"edfff83a-0eac-11f0-9471-569c3dd06744",["D",1743479633853],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","d56bd8b2-a31e-4821-93e6-bcbdd41c83ba","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","0d30098c-721f-4d42-b17b-1da1e51d05e7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_126":122},"org",{"_11":12,"_120":-5,"_121":122,"_90":91,"_123":124,"_125":51},"branch",{"_17":68,"_13":16,"_34":66,"_40":84,"_43":35,"_45":42,"_117":53,"_118":41,"_119":57,"_58":14,"_54":12},"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/05b096c6-70cf-4d2b-51e5-6c69c44dbf00/square512?exp=1789570799&sig=46173c10afe745f41ac7b43ece0289af162e2b9e8fc146b238bd137735ca366d","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_34":84,"_13":14,"_36":165,"_49":-5,"_86":51,"_52":53,"_87":53,"_88":-5,"_89":-5,"_90":91,"_92":63,"_93":70,"_94":-5,"_95":-5,"_96":31,"_56":97,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":103,"_104":103,"_105":106,"_107":106,"_108":106,"_109":103,"_110":103,"_111":166,"_113":167,"_115":168,"_50":51},[162],"files",[162],"counts",{"_153":31,"_154":68,"_155":31,"_33":156,"_157":158},[151],"upstreamProject",{"_34":41,"_13":14,"_88":-5,"_89":-5,"_52":53,"_111":149},"upstreamBranch",{"_34":35,"_36":147,"_38":148,"_13":16,"_40":41,"_17":42,"_43":44,"_45":46,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":14},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1743009599503],["D",1743188539147],{"_11":55,"_126":150},"https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJzR3VCb2xOR0loZEIwRWg5cnlVZUt4ajlpQiJ9",{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":71,"_17":31,"_72":73,"_74":75,"_76":51,"_77":-5,"_18":152},[61],"pulls","branches","forks",{"_159":31,"_161":31},"connections",{"_159":31,"_160":31},"count","unfilledCount","emptyCount",{"_34":60,"_13":61,"_62":63,"_64":-5,"_65":66,"_67":68,"_69":70,"_36":80,"_17":31,"_72":73,"_74":75,"_76":51,"_77":-5,"_81":163,"_18":164},[],[61],["D",1743479633853],{"_11":12,"_126":122},{"_11":12,"_120":-5,"_121":122,"_90":91,"_123":124,"_125":51},{"_17":68,"_13":16,"_34":66,"_40":84,"_43":35,"_45":42,"_117":53,"_118":41,"_119":57,"_58":14,"_54":12},"ctx",{"_111":-5,"_144":202,"_203":204,"_205":206,"_207":51,"_208":51,"_209":51,"_210":70,"_211":-5,"_212":-7,"_213":-7,"_214":31,"_215":51,"_216":51,"_217":-5,"_218":51,"_219":51,"_220":51,"_221":-5},"ENV",{"_173":174,"_175":176,"_177":16,"_178":179,"_180":181,"_182":183,"_184":185,"_186":187,"_188":189,"_190":191,"_192":193,"_194":195,"_196":197,"_198":199,"_200":201},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Code