\n Το Ψηφιακό μας Σκυλάκι 🐾\n

\n\n {/* Στατιστικά (Μπάρες) */}\n

\n \n \n \n \n

\n\n {/* Κεντρική Οθόνη Παιχνιδιού */}\n \n {/* Μήνυμα Σκύλου */}\n

\n {message}\n

\n\n {/* Ακαθαρσίες */}\n {poops.map((p) => (\n

💩

\n ))}\n\n {/* --- INTERACTIVE MINI-GAMES RENDER --- */}\n {activeMiniGame === \"feed\" && (\n

\n \n 🍖\n \n

\n )}\n\n {activeMiniGame === \"play\" && (\n \n \n 🎾\n \n \n )}\n\n {activeMiniGame === \"potty\" && (\n

\n \n 🚪\n \n

\n )}\n\n {activeMiniGame === \"sleep_switch\" && (\n \n \n 💡\n \n \n )}\n\n {activeMiniGame === \"sleeping_active\" && (\n \n \n ☀️\n \n \n )}\n\n {/* Το Σκυλάκι */}\n

\n {/* Αν είναι χαρούμενο/κοιμάται, προσθέτουμε εφέ γύρω του! */}\n {stats.happiness > 80 && actionState === \"idle\" && (\n

💖

\n )}\n {activeMiniGame === \"sleeping_active\" && (\n

💤

\n )}\n\n

{petEmoji}

\n\n {/* Σκιά */}\n

\n\n {/* Κουμπιά Ελέγχου */}\n

\n {poops.length > 0\n ? (\n \n 🧹 Καθάρισε τα κακά!\n \n )\n : (\n <>\n \n 🍖 Τάισε\n \n \n 🎾 Παίξε\n \n \n 🚪 Βόλτα\n \n \n 💤 Ύπνος\n \n \n )}\n

\n \n );\n}\n\n// Υπο-component για τις μπάρες\nfunction StatBar(\n { label, value, color, inverted = false }: {\n label: string;\n value: number;\n color: string;\n inverted?: boolean;\n },\n) {\n return (\n

{label}

\n \n

\n );\n}\n\n// --- CSS Styles ---\nconst styles: { [key: string]: React.CSSProperties } = {\n page: {\n fontFamily: FONT_FAMILY,\n minHeight: \"100vh\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n padding: \"20px\",\n boxSizing: \"border-box\",\n userSelect: \"none\",\n WebkitUserSelect: \"none\",\n touchAction: \"manipulation\",\n },\n title: {\n fontSize: \"26px\",\n marginBottom: \"20px\",\n textShadow: \"0 2px 4px rgba(0,0,0,0.1)\",\n textAlign: \"center\",\n },\n\n statsGrid: {\n display: \"grid\",\n gridTemplateColumns: \"1fr 1fr\",\n gap: \"15px\",\n width: \"100%\",\n maxWidth: \"400px\",\n marginBottom: \"20px\",\n backgroundColor: \"rgba(255,255,255,0.5)\",\n padding: \"15px\",\n borderRadius: \"15px\",\n boxShadow: \"0 4px 6px rgba(0,0,0,0.05)\",\n },\n statItem: {\n display: \"flex\",\n flexDirection: \"column\",\n },\n statLabel: {\n fontSize: \"14px\",\n fontWeight: \"bold\",\n color: \"#475569\",\n marginBottom: \"5px\",\n },\n barBg: {\n height: \"12px\",\n backgroundColor: \"#e2e8f0\",\n borderRadius: \"6px\",\n overflow: \"hidden\",\n },\n barFill: {\n height: \"100%\",\n borderRadius: \"6px\",\n transition: \"width 0.3s ease, background-color 0.3s ease\",\n },\n\n gameScreen: {\n width: \"100%\",\n maxWidth: \"400px\",\n height: \"300px\",\n borderRadius: \"20px\",\n position: \"relative\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"flex-end\",\n paddingBottom: \"30px\",\n boxShadow: \"inset 0 0 20px rgba(0,0,0,0.05), 0 10px 20px rgba(0,0,0,0.1)\",\n border: \"4px solid #cbd5e1\",\n overflow: \"hidden\",\n transition: \"background-color 1s ease\",\n },\n\n speechBubble: {\n position: \"absolute\",\n top: \"20px\",\n backgroundColor: \"rgba(255, 255, 255, 0.95)\",\n padding: \"10px 20px\",\n borderRadius: \"20px\",\n fontSize: \"15px\",\n fontWeight: \"bold\",\n color: \"#334155\",\n boxShadow: \"0 4px 10px rgba(0,0,0,0.1)\",\n zIndex: 5,\n border: \"2px solid #e2e8f0\",\n textAlign: \"center\",\n },\n\n interactiveItem: {\n position: \"absolute\",\n zIndex: 20,\n animation: \"breathe 1s infinite\",\n padding: \"10px\",\n },\n\n petContainer: {\n zIndex: 5,\n transformOrigin: \"bottom center\",\n position: \"relative\",\n },\n petEmoji: {\n fontSize: \"100px\",\n filter: \"drop-shadow(0 10px 10px rgba(0,0,0,0.2))\",\n },\n floatingHeart: {\n position: \"absolute\",\n top: \"-20px\",\n right: \"-20px\",\n fontSize: \"30px\",\n animation: \"floatUp 1.5s infinite\",\n },\n shadow: {\n width: \"80px\",\n height: \"15px\",\n backgroundColor: \"rgba(0,0,0,0.1)\",\n borderRadius: \"50%\",\n marginTop: \"5px\",\n zIndex: 1,\n },\n poop: {\n position: \"absolute\",\n bottom: \"20px\",\n fontSize: \"30px\",\n zIndex: 2,\n animation: \"popIn 0.3s ease-out\",\n },\n\n controls: {\n display: \"grid\",\n gridTemplateColumns: \"1fr 1fr\",\n gap: \"10px\",\n width: \"100%\",\n maxWidth: \"400px\",\n marginTop: \"20px\",\n },\n button: {\n padding: \"15px\",\n fontSize: \"16px\",\n fontWeight: \"bold\",\n backgroundColor: \"#fff\",\n border: \"2px solid #cbd5e1\",\n borderRadius: \"15px\",\n cursor: \"pointer\",\n boxShadow: \"0 4px 0 #cbd5e1\",\n transition: \"transform 0.1s, box-shadow 0.1s, opacity 0.3s\",\n fontFamily: FONT_FAMILY,\n color: \"#475569\",\n },\n};\n\n// --- Client / Server Setup ---\nfunction client() {\n const styleSheet = document.createElement(\"style\");\n styleSheet.type = \"text/css\";\n styleSheet.innerText = `\n @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700;900&display=swap');\n body { margin: 0; background-color: #f0fdf4; } \n \n button:active:not(:disabled) { \n transform: translateY(4px); \n box-shadow: 0 0 0 transparent !important; \n }\n button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n /* Animations */\n @keyframes breathe {\n 0%, 100% { transform: scale(1) translateY(0); }\n 50% { transform: scale(1.05) translateY(-5px); }\n }\n @keyframes bounce {\n 0%, 100% { transform: translateY(0); }\n 50% { transform: translateY(-20px); }\n }\n @keyframes jump {\n 0% { transform: translateY(0) rotate(0deg); }\n 50% { transform: translateY(-30px) rotate(10deg); }\n 100% { transform: translateY(0) rotate(-10deg); }\n }\n @keyframes shake {\n 0%, 100% { transform: translateX(0); }\n 25% { transform: translateX(-5px) rotate(-5deg); }\n 75% { transform: translateX(5px) rotate(5deg); }\n }\n @keyframes popIn {\n 0% { transform: scale(0); }\n 80% { transform: scale(1.2); }\n 100% { transform: scale(1); }\n }\n @keyframes floatUp {\n 0% { transform: translateY(0); opacity: 1; }\n 100% { transform: translateY(-30px); opacity: 0; }\n }\n `;\n document.head.appendChild(styleSheet);\n createRoot(document.getElementById(\"root\")!).render();\n}\n\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n \n Το ψηφιακό μας σκυλάκι 🐶\n \n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html; charset=UTF-8\" } },\n );\n}","deleted","label",[128],"fde84568-4597-11f1-9532-42b51c65c3df","README.md","019de51e-2ab1-76b8-8643-62914436b90a",1,["D",1777665452647],"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.",[144],"pulls","forks","envVars",{"_156":55,"_158":55},"connections",{"_156":55,"_157":55},"count","unfilledCount","emptyCount",{"_20":143,"_13":144,"_129":145,"_130":-5,"_131":21,"_132":146,"_133":51,"_22":165,"_29":55,"_136":105,"_138":148,"_140":40,"_141":-5,"_162":166,"_93":167},{"_20":127,"_13":128,"_129":49,"_130":-5,"_131":21,"_132":30,"_133":51,"_22":161,"_29":135,"_136":137,"_138":139,"_140":40,"_141":-5,"_162":163,"_93":164},["D",1777666052432],"children",[],[128],["D",1777665452647],[],[144],["D",1777665452647],{"_11":12,"_91":87},{"_11":12,"_85":-5,"_86":87,"_46":47,"_88":89,"_90":40},{"_29":30,"_13":26,"_20":21,"_27":28,"_31":32,"_33":34,"_78":42,"_79":80,"_81":82,"_83":14,"_84":12},"ctx",{"_71":-5,"_115":205,"_206":207,"_208":209,"_210":40,"_211":40,"_212":40,"_213":51,"_214":-5,"_215":-7,"_216":-7,"_217":55,"_218":40,"_219":40,"_220":-5,"_221":40,"_222":40,"_223":40,"_224":-5},"ENV",{"_176":177,"_178":179,"_180":26,"_181":182,"_183":184,"_185":186,"_187":188,"_189":190,"_191":192,"_193":194,"_195":196,"_197":198,"_199":200,"_201":202,"_203":204},"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"]

Branches1

Branches
1