[{"_1":2,"_182":-5,"_183":-5},"loaderData",{"_3":4,"_96":97},"root",{"_5":6,"_37":38,"_69":70},"ctx",{"_7":8,"_23":-5,"_24":25,"_26":27,"_28":20,"_29":20,"_30":20,"_31":-5,"_32":33,"_34":20,"_35":20,"_36":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","isBusinessOrgMember","isHigherTownieTier","ENV",{"_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":66,"_67":68},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","efeea19332d9bfe7de1049656877be9cb817c45f","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","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","API_URL","https://api.val.town","clerkState",{"_71":72},"__internal_clerk_state",{"_73":74,"_75":48,"_76":77,"_78":77,"_79":20,"_80":77,"_81":77,"_82":77,"_83":77,"_84":85,"_94":20,"_95":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",{"_86":20,"_19":20,"_87":77,"_88":89,"_90":77,"_91":48,"_92":20,"_93":77},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","routes/embed.x.$handle.$name.$",{"_98":99,"_100":101,"_102":103,"_104":105,"_159":160,"_179":180,"_181":-5},"handle","dcm31","name","atomMatrix","path","state.ts","project",{"_106":107,"_100":101,"_108":109,"_110":-5,"_111":20,"_112":113,"_114":115,"_116":-5,"_12":117,"_118":-5,"_119":20,"_120":-5,"_121":-5,"_122":33,"_14":123,"_124":-5,"_125":-5,"_126":-5,"_127":-5,"_128":129,"_130":129,"_131":132,"_133":132,"_134":132,"_135":129,"_136":129,"_23":137,"_140":141,"_145":146,"_158":20},"id","f7671208-050c-11f1-8e5f-42dde27851f2","createdAt",["D",1770568867364],"deletedAt","legacyEnvVars","privacy","unlisted","description","Atom Matrix LED controller - all logic server-side","imageUrl","9319c175-2593-4f88-ba21-04f2ef7b1c28","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","d663a026-6449-42f6-9156-1d4a2d64d38c","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_98":99,"_138":139},"profileImageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/3e904faa-3764-4629-c475-f561a49b0000/square512","org",{"_98":99,"_142":139,"_12":117,"_143":144},"avatar","tier","pro","branch",{"_147":148,"_100":46,"_106":149,"_150":107,"_151":-5,"_152":-5,"_153":-5,"_154":-5,"_155":-5,"_156":101,"_157":99},"version",23,"f76785a8-050c-11f1-8e5f-42dde27851f2","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","isOwned","file",{"_106":161,"_100":103,"_162":163,"_164":-5,"_165":149,"_166":167,"_168":169,"_108":170,"_147":171,"_172":173,"_174":175,"_176":20,"_177":-5,"_102":178},"53b9f140-0514-11f1-8c92-42dde27851f2","fileId","0348097e-050d-11f1-883f-42dde27851f2","parentId","branchId","branchVersion",16,"latest",true,["D",1770572028721],5,"fileType","script","content","/**\n * Atom Matrix State Management\n * All display logic lives here — the device is just a dumb LED terminal.\n */\nimport { blob } from \"https://esm.town/v/std/blob\";\n\nconst STATE_KEY = \"atomMatrix_state\";\nconst GALLERY_KEY = \"atomMatrix_gallery\";\n\nexport type Mode = \"off\" | \"fill\" | \"static\" | \"smiley\" | \"scroll\" | \"animation\";\n\nexport interface MatrixState {\n mode: Mode;\n version: number; // bumped on every change, device tracks this\n brightness: number; // 0-255 (careful, >40 is blinding)\n pollInterval: number; // seconds between device polls (default 30)\n\n // fill mode — solid color\n color: string; // hex \"#rrggbb\"\n\n // static mode — individual pixel control\n leds: string[]; // 25 hex colors, row-major [0]=top-left [24]=bottom-right\n\n // smiley mode\n smileyColor: string;\n bgColor: string;\n happy: boolean; // true=smile, false=frown\n\n // scroll mode\n text: string;\n textColor: string;\n scrollBg: string;\n scrollSpeed: number; // ms per pixel shift (lower = faster)\n\n // animation mode — frame sequence, played locally on device\n frames: string[][]; // array of frames, each frame is 25 hex colors\n frameDelay: number; // ms between frames\n animLoop: boolean; // loop the animation?\n\n // metadata (not sent to device)\n lastCheckin: number; // epoch ms\n lastButtonPress: number;\n deviceIP: string;\n}\n\n// ==========================================\n// Gallery — library of saved states\n// ==========================================\n\nexport interface GalleryItem {\n id: string;\n name: string;\n state: Partial; // the display-relevant fields\n createdAt: number;\n lastDeployed: number; // 0 = never deployed\n previewCount: number;\n deployCount: number;\n}\n\nconst DEFAULT_STATE: MatrixState = {\n mode: \"smiley\",\n version: 1,\n brightness: 20,\n pollInterval: 30,\n color: \"#ff6600\",\n leds: Array(25).fill(\"#000000\"),\n smileyColor: \"#ff6600\",\n bgColor: \"#000000\",\n happy: true,\n text: \"HELLO\",\n textColor: \"#00ff00\",\n scrollBg: \"#000000\",\n scrollSpeed: 80,\n frames: [],\n frameDelay: 150,\n animLoop: true,\n lastCheckin: 0,\n lastButtonPress: 0,\n deviceIP: \"\",\n};\n\n// ==========================================\n// Built-in animations\n// ==========================================\n\nconst _ = \"#000000\";\nconst O = \"#ff6600\"; // orange\nconst G = \"#00ff00\"; // green\nconst R = \"#ff0000\"; // red\nconst W = \"#ffffff\"; // white\n\n/** Blink animation: smiley with occasional blink */\nexport const ANIM_BLINK: { frames: string[][]; frameDelay: number; name: string } = {\n name: \"Blinky\",\n frameDelay: 150,\n frames: [\n // eyes open, happy (hold 6 frames = ~900ms)\n ...(Array(6).fill([\n _,O,_,O,_,\n _,O,_,O,_,\n _,_,_,_,_,\n O,_,_,_,O,\n _,O,O,O,_,\n ])),\n // eyes closing\n [\n _,_,_,_,_,\n _,O,_,O,_,\n _,_,_,_,_,\n O,_,_,_,O,\n _,O,O,O,_,\n ],\n // eyes closed (hold 2 frames = ~300ms)\n ...(Array(2).fill([\n _,_,_,_,_,\n _,_,_,_,_,\n _,_,_,_,_,\n O,_,_,_,O,\n _,O,O,O,_,\n ])),\n // eyes opening\n [\n _,_,_,_,_,\n _,O,_,O,_,\n _,_,_,_,_,\n O,_,_,_,O,\n _,O,O,O,_,\n ],\n ],\n};\n\n/** Heartbeat: heart pulses between two sizes */\nexport const ANIM_HEARTBEAT: { frames: string[][]; frameDelay: number; name: string } = {\n name: \"Heartbeat\",\n frameDelay: 120,\n frames: [\n // small heart (hold)\n ...(Array(4).fill([\n _,_,_,_,_,\n _,R,_,R,_,\n _,R,R,R,_,\n _,_,R,_,_,\n _,_,_,_,_,\n ])),\n // big heart (hold)\n ...(Array(4).fill([\n _,R,_,R,_,\n R,R,R,R,R,\n R,R,R,R,R,\n _,R,R,R,_,\n _,_,R,_,_,\n ])),\n ],\n};\n\n/** Rainbow cycle across the grid */\nexport const ANIM_RAINBOW: { frames: string[][]; frameDelay: number; name: string } = {\n name: \"Rainbow\",\n frameDelay: 100,\n frames: (() => {\n const colors = [\"#ff0000\",\"#ff7700\",\"#ffff00\",\"#00ff00\",\"#0000ff\",\"#8b00ff\"];\n const frames: string[][] = [];\n for (let offset = 0; offset < 6; offset++) {\n const frame: string[] = [];\n for (let y = 0; y < 5; y++) {\n for (let x = 0; x < 5; x++) {\n frame.push(colors[(x + offset) % colors.length]);\n }\n }\n frames.push(frame);\n }\n return frames;\n })(),\n};\n\nexport const BUILT_IN_ANIMS = [ANIM_BLINK, ANIM_HEARTBEAT, ANIM_RAINBOW];\n\n// ==========================================\n// Built-in static bitmaps\n// ==========================================\n\nconst B = \"#0088ff\"; // blue\n\n/** Helper: make a static gallery entry from a 25-element bitmap */\nfunction staticBitmap(name: string, pixels: string[]): { name: string; state: Partial } {\n return { name, state: { mode: \"static\" as Mode, leds: pixels } };\n}\n\nexport const BUILT_IN_STATICS = [\n // \"13\" in red — burpee goal (turns green when button pressed = done)\n staticBitmap(\"Burpees: 13\", [\n _,R,_,R,R,\n R,R,_,_,R,\n _,R,_,R,R,\n _,R,_,_,R,\n _,R,_,R,R,\n ]),\n // Checkmark\n staticBitmap(\"Checkmark\", [\n _,_,_,_,G,\n _,_,_,G,_,\n G,_,G,_,_,\n _,G,_,_,_,\n _,_,_,_,_,\n ]),\n // Arrow right\n staticBitmap(\"Arrow →\", [\n _,_,O,_,_,\n _,_,_,O,_,\n O,O,O,O,O,\n _,_,_,O,_,\n _,_,O,_,_,\n ]),\n // X mark in red\n staticBitmap(\"X Mark\", [\n R,_,_,_,R,\n _,R,_,R,_,\n _,_,R,_,_,\n _,R,_,R,_,\n R,_,_,_,R,\n ]),\n // Star\n staticBitmap(\"Star\", [\n _,_,O,_,_,\n _,O,O,O,_,\n O,O,O,O,O,\n _,O,_,O,_,\n O,_,_,_,O,\n ]),\n];\n\n// ==========================================\n// State CRUD\n// ==========================================\n\nexport async function getState(): Promise {\n try {\n const stored = await blob.getJSON(STATE_KEY) as Partial;\n return { ...DEFAULT_STATE, ...stored };\n } catch {\n return { ...DEFAULT_STATE };\n }\n}\n\nexport async function setState(partial: Partial): Promise {\n const current = await getState();\n const updated = { ...current, ...partial, version: current.version + 1 };\n await blob.setJSON(STATE_KEY, updated);\n return updated;\n}\n\nexport async function recordCheckin(ip: string): Promise {\n const current = await getState();\n await blob.setJSON(STATE_KEY, { ...current, lastCheckin: Date.now(), deviceIP: ip });\n}\n\nexport async function recordButtonPress(): Promise {\n const current = await getState();\n await blob.setJSON(STATE_KEY, { ...current, lastButtonPress: Date.now() });\n}\n\n// ==========================================\n// Gallery CRUD\n// ==========================================\n\nexport async function getGallery(): Promise {\n try {\n const stored = await blob.getJSON(GALLERY_KEY);\n return Array.isArray(stored) ? stored as GalleryItem[] : [];\n } catch {\n return [];\n }\n}\n\nexport async function saveToGallery(name: string, state: Partial): Promise {\n const gallery = await getGallery();\n // Strip metadata fields\n const { lastCheckin, lastButtonPress, deviceIP, version, ...displayState } = state as any;\n const item: GalleryItem = {\n id: crypto.randomUUID().slice(0, 8),\n name,\n state: displayState,\n createdAt: Date.now(),\n lastDeployed: 0,\n previewCount: 0,\n deployCount: 0,\n };\n gallery.unshift(item); // newest first\n await blob.setJSON(GALLERY_KEY, gallery);\n return item;\n}\n\nexport async function deployFromGallery(id: string): Promise {\n const gallery = await getGallery();\n const item = gallery.find(g => g.id === id);\n if (!item) return null;\n item.lastDeployed = Date.now();\n item.deployCount++;\n await blob.setJSON(GALLERY_KEY, gallery);\n return await setState(item.state);\n}\n\nexport async function previewFromGallery(id: string): Promise {\n const gallery = await getGallery();\n const item = gallery.find(g => g.id === id);\n if (!item) return null;\n item.previewCount++;\n await blob.setJSON(GALLERY_KEY, gallery);\n return item;\n}\n\nexport async function deleteFromGallery(id: string): Promise {\n const gallery = await getGallery();\n const idx = gallery.findIndex(g => g.id === id);\n if (idx === -1) return false;\n gallery.splice(idx, 1);\n await blob.setJSON(GALLERY_KEY, gallery);\n return true;\n}\n\n/** Seed gallery with built-in items if empty */\nexport async function seedGallery(): Promise {\n const gallery = await getGallery();\n if (gallery.length > 0) return;\n // Animations\n for (const anim of BUILT_IN_ANIMS) {\n await saveToGallery(anim.name, {\n mode: \"animation\",\n frames: anim.frames,\n frameDelay: anim.frameDelay,\n animLoop: true,\n });\n }\n // Static bitmaps\n for (const item of BUILT_IN_STATICS) {\n await saveToGallery(item.name, item.state);\n }\n}\n\n// ==========================================\n// Device Protocol\n// ==========================================\n\n/** Convert state to compact JSON for device */\nexport function stateForDevice(state: MatrixState): object {\n const base = {\n v: state.version,\n mode: state.mode === \"animation\" ? \"anim\" : state.mode,\n bright: state.brightness,\n poll: state.pollInterval,\n };\n\n switch (state.mode) {\n case \"off\":\n return base;\n case \"fill\":\n return { ...base, color: hexToRgb(state.color) };\n case \"static\":\n return { ...base, leds: state.leds.map(hexToRgb) };\n case \"smiley\":\n return {\n ...base,\n sc: hexToRgb(state.smileyColor),\n bg: hexToRgb(state.bgColor),\n happy: state.happy ? 1 : 0,\n };\n case \"scroll\":\n return {\n ...base,\n text: state.text,\n tc: hexToRgb(state.textColor),\n bg: hexToRgb(state.scrollBg),\n spd: state.scrollSpeed,\n };\n case \"animation\":\n return {\n ...base,\n frames: state.frames.map(f => f.map(hexToRgb)),\n delay: state.frameDelay,\n loop: state.animLoop ? 1 : 0,\n };\n default:\n return base;\n }\n}\n\n/** \"#ff6600\" → [255, 102, 0] */\nfunction hexToRgb(hex: string): number[] {\n const h = hex.replace(\"#\", \"\");\n return [\n parseInt(h.substring(0, 2), 16),\n parseInt(h.substring(2, 4), 16),\n parseInt(h.substring(4, 6), 16),\n ];\n}\n","deleted","label",[103],"permalink","https://www.val.town/x/dcm31/atomMatrix/code/state.ts","extension","actionData","errors"]