[{"_1":2,"_175":-5,"_176":-5},"loaderData",{"_3":4,"_93":94},"root",{"_5":6,"_36":37,"_66":67},"ctx",{"_7":8,"_23":-5,"_24":25,"_26":27,"_28":20,"_29":20,"_30":20,"_31":-5,"_32":33,"_34":20,"_35":20},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20,"_21":22},"sessionClaims","sessionId","sessionStatus","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","isAuthenticated",false,"tokenType","session_token","user","preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesChatPanelState","notificationCount",0,"flagDenols","isTeamOrgMember","ENV",{"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59,"_60":61,"_62":63,"_64":65},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","57594e398b37849c5a5f36f8e9d9bb2356f5e36c","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","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","API_URL","https://api.val.town","clerkState",{"_68":69},"__internal_clerk_state",{"_70":71,"_72":47,"_73":74,"_75":74,"_76":20,"_77":74,"_78":74,"_79":74,"_80":74,"_81":82,"_91":20,"_92":20},"__clerk_ssr_state",{"_21":22,"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__clerk_debug",{"_83":20,"_19":20,"_84":74,"_85":86,"_87":74,"_88":47,"_89":20,"_90":74},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","routes/embed.x.$handle.$name.$",{"_95":96,"_97":98,"_99":100,"_101":102,"_153":154,"_172":173,"_174":-5},"handle","Raussy","name","untitled-8179","path","main.ts","project",{"_103":104,"_97":98,"_105":106,"_107":-5,"_108":20,"_109":110,"_111":-5,"_112":-5,"_12":113,"_114":-5,"_115":20,"_116":-5,"_117":-5,"_118":33,"_14":119,"_120":-5,"_121":-5,"_122":123,"_124":123,"_125":126,"_127":126,"_128":126,"_129":123,"_130":123,"_23":131,"_134":135,"_139":140,"_152":20},"id","b0a8deb6-004b-11f1-a094-42dde27851f2","createdAt",["D",1770046051156],"deletedAt","legacyEnvVars","privacy","public","description","imageUrl","019c1ed8-28e5-7428-a96a-245c8ac7ea5b","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","019c1ed8-28e5-7428-a96a-2aba2a1b9604","tursoName","tursoHostname","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_95":96,"_132":133},"profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzM5N1BCSTR2OFdnNkFpb2NsN3ZxTWk3YUhzSiJ9","org",{"_95":96,"_136":133,"_12":113,"_137":138},"avatar","tier","free","branch",{"_141":142,"_97":45,"_103":143,"_144":104,"_145":-5,"_146":-5,"_147":-5,"_148":-5,"_149":-5,"_150":98,"_151":96},"version",6,"b0aaf7b4-004b-11f1-a094-42dde27851f2","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","isOwned","file",{"_103":155,"_97":100,"_156":157,"_158":-5,"_159":143,"_160":142,"_161":162,"_105":163,"_141":164,"_165":166,"_167":168,"_169":20,"_170":-5,"_99":171},"f09ec8d2-004b-11f1-843b-42dde27851f2","fileId","b0b089f4-004b-11f1-a094-42dde27851f2","parentId","branchId","branchVersion","latest",true,["D",1770046158457],5,"fileType","http","content","var canvas = document.getElementById(\"starfield\");\ncanvas.width = window.innerWidth;\ncanvas.height = window.innerHeight;\nvar context = canvas.getContext(\"2d\");\nvar stars = 500;\nvar colorrange = [0, 60, 240];\nvar starArray = [];\nfunction getRandom(min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n}\n// Initialize stars with random opacity values\nfor (var i = 0; i < stars; i++) {\n var x = Math.random() * canvas.offsetWidth;\n var y = Math.random() * canvas.offsetHeight;\n var radius = Math.random() * 1.2;\n var hue = colorrange[getRandom(0, colorrange.length - 1)];\n var sat = getRandom(50, 100);\n var opacity = Math.random();\n starArray.push({ x, y, radius, hue, sat, opacity });\n}\n\nvar frameNumber = 0;\nvar opacity = 0;\nvar secondOpacity = 0;\nvar thirdOpacity = 0;\n\nvar baseFrame = context.getImageData(\n 0,\n 0,\n window.innerWidth,\n window.innerHeight,\n);\n\nfunction drawStars() {\n for (var i = 0; i < stars; i++) {\n var star = starArray[i];\n\n context.beginPath();\n context.arc(star.x, star.y, star.radius, 0, 360);\n context.fillStyle = \"hsla(\" + star.hue + \", \" + star.sat + \"%, 88%, \" +\n star.opacity + \")\";\n context.fill();\n }\n}\n\nfunction updateStars() {\n for (var i = 0; i < stars; i++) {\n if (Math.random() > 0.99) {\n starArray[i].opacity = Math.random();\n }\n }\n}\n\nconst button = document.getElementById(\"valentinesButton\");\n\nbutton.addEventListener(\"click\", () => {\n if (button.textContent === \"Click Me! ❤\") {\n button.textContent = \"loading...\";\n fetch(\"send_mail.php\")\n .then((response) => {\n if (response.ok) {\n button.textContent = \"Check Your Email 🙃\";\n } else {\n console.error(\"Failed to send email\");\n button.textContent = \"Error 😞\";\n }\n })\n .catch((error) => {\n // Handle network errors or other issues\n console.error(\"Error:\", error);\n button.textContent = \"Error 😞\";\n });\n }\n});\n\nfunction drawTextWithLineBreaks(lines, x, y, fontSize, lineHeight) {\n lines.forEach((line, index) => {\n context.fillText(line, x, y + index * (fontSize + lineHeight));\n });\n}\n\nfunction drawText() {\n var fontSize = Math.min(30, window.innerWidth / 24); // Adjust font size based on screen width\n var lineHeight = 8;\n\n context.font = fontSize + \"px Comic Sans MS\";\n context.textAlign = \"center\";\n\n // glow effect\n context.shadowColor = \"rgba(45, 45, 255, 1)\";\n context.shadowBlur = 8;\n context.shadowOffsetX = 0;\n context.shadowOffsetY = 0;\n\n if (frameNumber < 250) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"everyday day I cannot believe how lucky I am\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity + 0.01;\n }\n //fades out the text by decreasing the opacity\n if (frameNumber >= 250 && frameNumber < 500) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"everyday day I cannot believe how lucky I am\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity - 0.01;\n }\n\n //needs this if statement to reset the opacity before next statement on canvas\n if (frameNumber == 500) {\n opacity = 0;\n }\n if (frameNumber > 500 && frameNumber < 750) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n\n if (window.innerWidth < 600) { //shortens long sentence for mobile screens\n drawTextWithLineBreaks(\n [\"amongst trillions and trillions of stars,\", \"over billions of years\"],\n canvas.width / 2,\n canvas.height / 2,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"amongst trillions and trillions of stars, over billions of years\",\n canvas.width / 2,\n canvas.height / 2,\n );\n }\n\n opacity = opacity + 0.01;\n }\n if (frameNumber >= 750 && frameNumber < 1000) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n\n if (window.innerWidth < 600) {\n drawTextWithLineBreaks(\n [\"amongst trillions and trillions of stars,\", \"over billions of years\"],\n canvas.width / 2,\n canvas.height / 2,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"amongst trillions and trillions of stars, over billions of years\",\n canvas.width / 2,\n canvas.height / 2,\n );\n }\n\n opacity = opacity - 0.01;\n }\n\n if (frameNumber == 1000) {\n opacity = 0;\n }\n if (frameNumber > 1000 && frameNumber < 1250) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"to be alive, and to get to spend this life with you\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity + 0.01;\n }\n if (frameNumber >= 1250 && frameNumber < 1500) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"to be alive, and to get to spend this life with you\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity - 0.01;\n }\n\n if (frameNumber == 1500) {\n opacity = 0;\n }\n if (frameNumber > 1500 && frameNumber < 1750) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"is so incredibly, unfathomably unlikely\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity + 0.01;\n }\n if (frameNumber >= 1750 && frameNumber < 2000) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n context.fillText(\n \"is so incredibly, unfathomably unlikely\",\n canvas.width / 2,\n canvas.height / 2,\n );\n opacity = opacity - 0.01;\n }\n\n if (frameNumber == 2000) {\n opacity = 0;\n }\n if (frameNumber > 2000 && frameNumber < 2250) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n\n if (window.innerWidth < 600) {\n drawTextWithLineBreaks(\n [\n \"and yet here I am to get the impossible\",\n \"chance to get to know you\",\n ],\n canvas.width / 2,\n canvas.height / 2,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"and yet here I am to get the impossible chance to get to know you\",\n canvas.width / 2,\n canvas.height / 2,\n );\n }\n\n opacity = opacity + 0.01;\n }\n if (frameNumber >= 2250 && frameNumber < 2500) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n\n if (window.innerWidth < 600) {\n drawTextWithLineBreaks(\n [\n \"and yet here I am to get the impossible\",\n \"chance to get to know you\",\n ],\n canvas.width / 2,\n canvas.height / 2,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"and yet here I am to get the impossible chance to get to know you\",\n canvas.width / 2,\n canvas.height / 2,\n );\n }\n\n opacity = opacity - 0.01;\n }\n\n if (frameNumber == 2500) {\n opacity = 0;\n }\n if (frameNumber > 2500 && frameNumber < 99999) {\n context.fillStyle = `rgba(45, 45, 255, ${opacity})`;\n\n if (window.innerWidth < 600) {\n drawTextWithLineBreaks(\n [\n \"I love you so much {name}, more than\",\n \"all the time and space in the universe can contain\",\n ],\n canvas.width / 2,\n canvas.height / 2,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"I love you so much {name}, more than all the time and space in the universe can contain\",\n canvas.width / 2,\n canvas.height / 2,\n );\n }\n\n opacity = opacity + 0.01;\n }\n\n if (frameNumber >= 2750 && frameNumber < 99999) {\n context.fillStyle = `rgba(45, 45, 255, ${secondOpacity})`;\n\n if (window.innerWidth < 600) {\n drawTextWithLineBreaks(\n [\n \"and I can't wait to spend all the time in\",\n \"the world to share that love with you!\",\n ],\n canvas.width / 2,\n canvas.height / 2 + 60,\n fontSize,\n lineHeight,\n );\n } else {\n context.fillText(\n \"and I can't wait to spend all the time in the world to share that love with you!\",\n canvas.width / 2,\n canvas.height / 2 + 50,\n );\n }\n\n secondOpacity = secondOpacity + 0.01;\n }\n\n if (frameNumber >= 3000 && frameNumber < 99999) {\n context.fillStyle = `rgba(45, 45, 255, ${thirdOpacity})`;\n context.fillText(\n \"Happy Valentine's Day <3\",\n canvas.width / 2,\n canvas.height / 2 + 120,\n );\n thirdOpacity = thirdOpacity + 0.01;\n\n button.style.display = \"block\";\n }\n\n // Reset the shadow effect after drawing the text\n context.shadowColor = \"transparent\";\n context.shadowBlur = 0;\n context.shadowOffsetX = 0;\n context.shadowOffsetY = 0;\n}\n\nfunction draw() {\n context.putImageData(baseFrame, 0, 0);\n\n drawStars();\n updateStars();\n drawText();\n\n if (frameNumber < 99999) {\n frameNumber++;\n }\n window.requestAnimationFrame(draw);\n}\n\nwindow.addEventListener(\"resize\", function () {\n canvas.width = window.innerWidth;\n canvas.height = window.innerHeight;\n baseFrame = context.getImageData(0, 0, window.innerWidth, window.innerHeight);\n});\n\nwindow.requestAnimationFrame(draw);","deleted","label",[100],"permalink","https://www.val.town/x/Raussy/untitled-8179/code/main.ts","extension","actionData","errors"]