[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_179":180,"_181":182},"routes/_app.x.$handle.$name",{"_99":98,"_32":45,"_107":85,"_27":108,"_13":14,"_109":-5,"_11":110,"_111":112,"_113":114,"_115":116,"_117":118,"_20":-5,"_119":120,"_121":122,"_123":25,"_124":125,"_126":57,"_127":-5,"_128":-5,"_129":130},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":31,"_56":57,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",64,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","main.tsx","latestPath","fileId","019c5388-435c-778c-b07b-cf25b1e65d5c","name","fileType","http","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\nconst NO_PHRASES = [\n \"No?\",\n \"No?!? 😔\",\n \"My lil'dinosaur 🦖😘\",\n \"Honey my love so sweet are you okay? 🥲\",\n \"Yoohooo 👋🏻🥺\",\n \"Promise hindi na ako mag paugtas 🥺\",\n \"Mii?!\",\n \"Budi.. Maby?!?!?!\",\n \"Please? 🙏🏻🙇🏻\",\n \"Miiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii?!?!?!?!?!?!?!\"\n];\n\nfunction FloatingHearts() {\n return (\n

\n {Array.from({ length: 25 }).map((_, i) => (\n 💖\n ))}\n

\n );\n}\n\nfunction Sparkles({ sparkles }) {\n return (\n <>\n {sparkles.map((s, i) => (\n \n ✨\n \n ))}\n \n );\n}\n\nfunction App() {\n const [noClicks, setNoClicks] = useState(0);\n const [currentGif, setCurrentGif] = useState(1);\n const [fade, setFade] = useState(true);\n const [playMusic, setPlayMusic] = useState(false);\n const [showSecondText, setShowSecondText] = useState(false);\n const [showThirdText, setShowThirdText] = useState(false);\n const [sparkles, setSparkles] = useState<{x:number,y:number,dx:number,dy:number,scale:number,opacity:number}[]>([]);\n\n const yesButtonSize = noClicks * 20 + 16;\n\n const gifs = [\n \"https://media.giphy.com/media/ffzhLUixCtlsc/giphy.gif\",\n \"https://media.giphy.com/media/0cdbJBHZXG2hm132X2/giphy.gif\",\n \"https://media.giphy.com/media/FvPr1G9virFmffGWYH/giphy.gif\",\n ];\n\n const createSparkles = (e: React.MouseEvent) => {\n const newSparkles = Array.from({ length: 8 }).map(() => ({\n x: e.clientX,\n y: e.clientY,\n dx: Math.random() * 80 - 40,\n dy: Math.random() * -80,\n scale: Math.random() * 0.8 + 0.5,\n opacity: 1\n }));\n setSparkles(newSparkles);\n setTimeout(() => setSparkles([]), 400);\n };\n\n const handleNo = (e: React.MouseEvent) => {\n createSparkles(e);\n setNoClicks(prev => Math.min(prev + 1, NO_PHRASES.length - 1));\n };\n\n const handleYes = (e: React.MouseEvent) => {\n createSparkles(e);\n setFade(false);\n setTimeout(() => {\n setCurrentGif(2);\n setFade(true);\n setPlayMusic(true);\n }, 500);\n };\n\n const handleGifClick = () => {\n if (currentGif === 2) {\n setFade(false);\n setTimeout(() => {\n setCurrentGif(3);\n setFade(true);\n }, 500);\n }\n };\n\n useEffect(() => {\n if (currentGif === 2) setTimeout(() => setShowSecondText(true), 400);\n else setShowSecondText(false);\n\n if (currentGif === 3) setTimeout(() => setShowThirdText(true), 400);\n else setShowThirdText(false);\n }, [currentGif]);\n\n return (\n

\n \n \n\n {playMusic && (\n \n )}\n\n

\n \n

\n\n {currentGif === 1 && (\n <>\n

Mi, will you be my Valentine? 💘✨

\n \n Yes\n \n \n {NO_PHRASES[noClicks]}\n \n

\n \n )}\n\n {currentGif === 2 && (\n

\n Yeeyyy!!!! Happy Valentine's Day Mi 🥂💗\n

\n )}\n\n {currentGif === 3 && (\n

\n Mag o-oo ka rin pala iihhh! I love you so much Mi! ☺️😘\n

\n )}\n\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Valentine's Day Invitation\n \n \n \n

\n \n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } }\n );\n}","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\n// Your 10 custom \"No\" phrases\nconst NO_PHRASES = [\n \"No\",\n \"No?!? 😔\",\n \"My lil'dinosaur 🦖😘\",\n \"Honey my love so sweet are you okay? 🥲\",\n \"Yoohooo 👋🏻🥺\",\n \"Promise hindi na ako mag paugtas 🥺\",\n \"Mii?!\",\n \"Miiiiiiiiiiiiii?!?!?!\",\n \"Miiiiiiiiiiiiiiiiiiii?!?!?!?!\",\n];\n\nfunction App() {\n const [noClicks, setNoClicks] = useState(0);\n const [currentGif, setCurrentGif] = useState(1); // 1=first, 2=second, 3=third\n const [fade, setFade] = useState(true); // fade animation\n const [playMusic, setPlayMusic] = useState(false); // music state\n const yesButtonSize = noClicks * 20 + 16;\n\n const gifs = [\n \"https://media.giphy.com/media/ffzhLUixCtlsc/giphy.gif\", // 1st\n \"https://media.giphy.com/media/FvPr1G9virFmffGWYH/giphy.gif\", // 2nd\n \"https://media.giphy.com/media/0cdbJBHZXG2hm132X2/giphy.gif\", // 3rd\n ];\n\n // Handle \"No\" button click → cycle through custom phrases\n const handleNo = () =>\n setNoClicks((prev) => Math.min(prev + 1, NO_PHRASES.length - 1));\n\n // Handle \"Yes\" button click → show 2nd GIF with fade + start music\n const handleYes = () => {\n setFade(false); // fade out first GIF\n setTimeout(() => {\n setCurrentGif(2); // show second GIF\n setFade(true); // fade in\n setPlayMusic(true); // music starts immediately\n }, 500);\n };\n\n // Handle click on second GIF → show third GIF\n const handleGifClick = () => {\n if (currentGif === 2) {\n setFade(false);\n setTimeout(() => {\n setCurrentGif(3);\n setFade(true);\n }, 500);\n }\n };\n\n const gifStyle = {\n cursor: currentGif === 1 ? \"default\" : \"pointer\",\n maxWidth: \"80%\",\n height: \"auto\",\n opacity: fade ? 1 : 0,\n transition: \"opacity 0.5s ease-in-out\",\n };\n\n const messageStyle = {\n fontSize: \"48px\",\n color: \"pink\",\n fontWeight: \"bold\",\n marginTop: \"20px\",\n opacity: fade ? 1 : 0,\n transition: \"opacity 0.5s ease-in-out\",\n };\n\n return (\n \n {/* Music iframe */}\n {playMusic && (\n \n \n )}\n\n {/* GIF Display */}\n \n\n {/* Valentine Question / Buttons (only on first GIF) */}\n {currentGif === 1 && (\n <>\n

Will you be my Valentine? 💘

\n \n Yes\n \n \n {NO_PHRASES[noClicks]}\n \n

\n \n )}\n\n {/* Yay Message (shows on 2nd and 3rd GIF) */}\n {currentGif >= 2 &&

Yay!!! 💖🎉

}\n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Valentine's Day Invitation\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\n );\n}","createdAt",["D",1770948676169],"branchVersion","branchId","0e47c2f0-0851-11f1-8a7e-42dde27851f2","id","0e450e02-0851-11f1-8a7e-42dde27851f2","Mikenietes",["D",1770927964922],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","019c52ff-ec54-71dd-8bf2-31aef29f1407","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019c52ff-ec54-71dd-8bf2-3633ceaeafd6","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_99":98,"_106":102},"org",{"_99":98,"_100":-5,"_101":102,"_18":54,"_103":104,"_105":25},"branch",{"_13":84,"_32":85,"_43":42,"_86":44,"_87":88,"_89":90,"_91":50,"_92":93,"_94":95,"_96":45,"_97":98},"isOwned",76,"main","projectId","forkedBranchId","fdd9b22e-27b0-11f0-aecd-569c3dd06744","forkedBranchVersion",11,"forkedProjectPrivacy","forkedProjectId","fdd966ca-27b0-11f0-aecd-569c3dd06744","forkedProjectOrgId","1ea2ca52-aecd-4993-8c60-cb61483dff1b","projectName","userHandle","nieteseu","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18zOWEwbFFjd1U2WGFoRmp6RlNZdDFmOHNHU1IifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":175,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":31,"_56":57,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":176,"_79":177,"_81":178,"_83":25},"tree",[166,167],"files",[166,167],"counts",{"_156":61,"_157":152,"_158":61,"_159":160,"_161":162},"contents",[140,141],"upstreamProject",{"_43":93,"_32":137,"_52":-5,"_53":-5,"_49":50,"_77":138},"upstreamBranch",{"_43":88,"_38":131,"_132":133,"_32":85,"_86":93,"_13":90,"_87":-5,"_89":-5,"_134":135,"_47":-5,"_83":25,"_49":50,"_97":136,"_62":95,"_96":137},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1746230157507],"updatedAt",["D",1739338420215],"lockfileKey","1767110342515-esm.town_v_mewtru_valentine@11-main","mewtru","valentine",{"_99":136,"_106":139},"https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yaWlEbWhXRTJ3Y3kwcTR0VjZYZEdyYmZFZVkifQ",{"_43":149,"_32":150,"_30":151,"_143":-5,"_41":42,"_40":152,"_144":57,"_38":153,"_13":61,"_33":20,"_35":154,"_24":25,"_147":-5,"_27":155},{"_43":142,"_32":28,"_30":31,"_143":-5,"_41":42,"_40":14,"_144":25,"_38":145,"_13":146,"_33":34,"_35":37,"_24":25,"_147":-5,"_27":148},"472d9ef2-0881-11f1-a7b0-42dde27851f2","parentId","latest",["D",1770948676169],63,"label",[28],"0e49d2ca-0851-11f1-8a7e-42dde27851f2","README.md","019c5388-435c-778c-b07b-c857d2686428",1,["D",1770927964922],"Hello!!! \n\nFeel free to mess around with this val and make it your own :). Just click on \"Fork\" in the top right.\n\nYou can change the phrases that show up as you click no, you can change the firstImg and secondImg, maybe even add more images. And you can also change the colors and any of the text on the screen!\n\nHave fun with it and hopefully your crush says yes hehe.",[150],"pulls","branches","forks","envVars",{"_163":61,"_165":61},"connections",{"_163":61,"_164":61},"count","unfilledCount","emptyCount",{"_43":149,"_32":150,"_30":151,"_143":-5,"_41":42,"_40":152,"_144":57,"_38":172,"_13":61,"_33":20,"_35":154,"_24":25,"_147":-5,"_169":173,"_27":174},{"_43":142,"_32":28,"_30":31,"_143":-5,"_41":42,"_40":14,"_144":25,"_38":168,"_13":146,"_33":34,"_35":37,"_24":25,"_147":-5,"_169":170,"_27":171},["D",1770948676169],"children",[],[28],["D",1770927964922],[],[150],["D",1770927964922],{"_99":98,"_106":102},{"_99":98,"_100":-5,"_101":102,"_18":54,"_103":104,"_105":25},{"_13":84,"_32":85,"_43":42,"_86":44,"_87":88,"_89":90,"_91":50,"_92":93,"_94":95,"_96":45,"_97":98},"ctx",{"_77":-5,"_128":212,"_213":214,"_215":216,"_217":25,"_218":25,"_219":25,"_220":57,"_221":-5,"_222":-7,"_223":-7,"_224":61,"_225":25,"_226":25,"_227":-5,"_228":25,"_229":25,"_230":25,"_231":-5},"ENV",{"_183":184,"_185":186,"_187":85,"_188":189,"_190":191,"_192":193,"_194":195,"_196":197,"_198":199,"_200":201,"_202":203,"_204":205,"_206":207,"_208":209,"_210":211},"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"]

Diff · v64