[{"_1":2,"_184":-5,"_185":-5},"loaderData",{"_3":4,"_58":59,"_183":-5},"root",{"_5":6,"_21":-5,"_22":-5,"_23":24,"_41":-5,"_42":-5,"_43":-5,"_44":45,"_54":55,"_56":57},"env",{"_7":8,"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":20},"SUPABASE_URL","https://hello.websim.com","SUPABASE_KEY","eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im9jamVmZ2NqamlxeWt3YWR2dnJkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MTE4MzI5OTMsImV4cCI6MjAyNzQwODk5M30.vsreOYwk8pKsr8NFlzpIzWAiD-vXj6ijv_Bhn1vYtHs","POSTHOG_KEY","phc_VHMOlrdxAbgSZHeF0SdSf07LZLRLAg5pZuTHkJGn050","POSTHOG_API_HOST","https://e.wbsm.ai","POSTHOG_UI_HOST","https://app.posthog.com","GOOGLE_OAUTH_CLIENT_ID","891181648870-i708rj1bgjol84hie20shfr4u4ecf3o7.apps.googleusercontent.com","ACTIVITY_DIRECT_PAGEVIEW","on","authUser","user","snapshotData",{"_25":-5,"_26":-5,"_27":-5,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5,"_33":-5,"_34":-5,"_35":-5,"_36":-5,"_37":-5,"_38":-5,"_39":-5,"_40":-5},"lastProjectId","sidebarTab","homepageTab","pinSidebar","settingsOpen","maximized","assetsExpanded","focusedAssetFilename","authError","authErrorCode","authErrorDescription","sidebarWidth","videoMuted","videoVolume","navigationContext","hasSeenFeedOnboarding","plan","balances","rewards","origins",{"_46":47,"_48":49,"_50":51,"_52":53},"origin","https://websim.com","apiOrigin","https://api.websim.com","contentOrigin","https://{PROJECT_ID}.c.websim.com","appDomainOrigin","https://{SUBDOMAIN}.on.websim.com","isMobile",false,"theme","auto","slug",{"_60":61,"_62":63,"_118":119,"_138":139,"_175":176,"_177":-5,"_178":179,"_180":181},"version","1","project",{"_64":62,"_65":66,"_67":68,"_69":70,"_80":81,"_82":83,"_84":85,"_86":87,"_88":89,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":95,"_96":97,"_58":106,"_107":95,"_108":95,"_109":55,"_110":-5,"_111":-5,"_112":-5,"_113":114,"_115":-5,"_116":-5,"_117":55},"_type","id","j0drjgwwyn5hy6q4jjxo","created_at","2026-02-12T01:46:02.894Z","created_by",{"_64":22,"_65":71,"_72":73,"_67":74,"_75":76,"_77":-5,"_78":-5,"_79":55},"2f7a6c72-31f5-46a8-a1e1-8795cb9b63f4","username","jerrystacy297612","2026-01-16T03:44:05.245Z","avatar_url","https://avatars.websim.com/2f7a6c72-31f5-46a8-a1e1-8795cb9b63f4/Wc927u0q4igoYTAUE.webp","discord_username","discord_id","is_admin","updated_at","2026-02-12T01:48:57.907Z","title","Colorbox Web","comments_mode","open","visibility","public","current_version",1,"last_posted_version","parent_id","parent_version","deleted_at","posted",true,"stats",{"_98":99,"_100":66,"_101":102,"_103":104,"_105":89},"~type","project_stats","project_id","views",71,"likes",0,"comments","colorbox-web-7","auto_set_current","allow_automatic_improvements","board_enabled","description","generated_description","from_template","domains",[],"thumbnail","video","has_active_experiment","project_revision",{"_64":118,"_65":120,"_60":89,"_67":121,"_122":-5,"_91":-5,"_123":-5,"_124":-5,"_69":125,"_126":127,"_100":66,"_80":128,"_93":-5,"_96":129,"_131":55,"_132":133,"_134":-5,"_135":-5,"_136":137},"019c4f86-d89e-743b-9502-2ef31d0a0037","2026-02-12T01:46:03.294Z","visited_at","parent_revision_version","parent_revision_project_id",{"_64":22,"_65":71,"_72":73,"_67":74,"_75":76,"_77":-5,"_78":-5,"_79":55},"meta",{"_60":61},"2026-02-12T01:48:58.011Z",{"_130":104},"multiplayer_count","draft","site_id","1O3NL5kZq17ygh6VI","chat_session_id","chat_session_run_index","current_screenshot_url","https://project-screenshots.websim.com/019c4f87-8702-78dc-a9d0-f773dd247eb4","site",{"_64":138,"_65":133,"_91":-5,"_67":140,"_141":142,"_143":144,"_145":146,"_82":83,"_158":159,"_160":161,"_166":-5,"_167":168,"_169":170,"_93":-5,"_171":172,"_173":174},"2026-02-12T01:46:10.354Z","state","done","model","gemini-3-flash","lore",{"_60":89,"_147":148,"_149":55,"_150":55,"_151":55,"_152":55,"_153":55,"_154":55,"_155":55,"_156":55,"_157":55},"attachments",[],"enableMultiplayer_v2","enableMobilePrompt","enableLLM2","enableComments","enableVideo","enableApi","enableTweaks","enableDB","enableDB_v2_1","owner",{"_64":22,"_65":71,"_72":73,"_67":74,"_75":76,"_77":-5,"_78":-5,"_79":55},"prompt",{"_162":163,"_164":165},"type","plaintext","text","\n#!/usr/bin/env python3\nimport os, math, random, time\nimport pygame\nfrom collections import deque\n\nWIDTH, HEIGHT = 1280, 720\nFPS_TARGET = 60\n\n# Modes\nRAINBOW, HUGE = 0, 1\nMODE_NAMES = [\"Rainbow\", \"HUGE\"]\n\ndef clamp(x, a, b):\n return a if x < a else b if x > b else x\n\ndef randf(a,b):\n return random.uniform(a,b)\n\ndef hsv_to_rgb(h): # h 0..6\n c = 255\n x = int(255 * (1 - abs((h % 2) - 1)))\n if 0 <= h < 1: return (c, x, 0)\n if 1 <= h < 2: return (x, c, 0)\n if 2 <= h < 3: return (0, c, x)\n if 3 <= h < 4: return (0, x, c)\n if 4 <= h < 5: return (x, 0, c)\n return (c, 0, x)\n\n# ---------- layered sphericalized skybox ----------\nclass SkyLayer:\n \"\"\"rainbow!!\"\"\"\n def __init__(self, tiles=16, radius=1.0, intensity=1.0, hue_shift=0.0):\n self.tiles = tiles\n self.radius = radius\n self.intensity = intensity\n self.hue_shift = hue_shift\n self.colors = self.make_colors()\n self.row_shift = [0]*6\n self.col_shift = [0]*6\n self.seeds = [random.random()*1000 for _ in range(6)]\n self._cache_pts = None\n self._cache_frame = -999\n\n def make_colors(self):\n N = self.tiles\n faces = [[[(0,0,0) for _ in range(N)] for _ in range(N)] for _ in range(6)]\n for f in range(6):\n for y in range(N):\n for x in range(N):\n h = (randf(0,6) + self.hue_shift) % 6\n col = hsv_to_rgb(h)\n col = tuple(clamp(ch + random.randint(-12,12), 0, 255) for ch in col)\n faces[f][y][x] = col\n\n neighbors = {\n 0: {0:(4,0), 1:(2,3), 2:(5,0), 3:(3,1)},\n 1: {0:(4,2), 1:(3,3), 2:(5,2), 3:(2,1)},\n 2: {0:(4,3), 1:(0,3), 2:(5,3), 3:(1,1)},\n 3: {0:(4,1), 1:(1,3), 2:(5,1), 3:(0,1)},\n 4: {0:(1,2), 1:(0,0), 2:(2,0), 3:(3,0)},\n 5: {0:(2,2), 1:(0,2), 2:(1,0), 3:(3,2)},\n }\n\n N1 = N-1\n for f in range(6):\n tf, te = neighbors[f][0]\n for x in range(N):\n faces[f][0][x] = faces[tf][N1 if te==2 else 0][x if te in (0,2) else (0 if te==3 else N1)]\n\n rf, re = neighbors[f][1]\n for y in range(N):\n faces[f][y][N1] = faces[rf][y if re in (1,3) else (0 if re==0 else N1)][N1 if re==3 else 0]\n\n bf, be = neighbors[f][2]\n for x in range(N):\n faces[f][N1][x] = faces[bf][0 if be==0 else N1][x if be in (0,2) else (0 if be==3 else N1)]\n\n lf, le = neighbors[f][3]\n for y in range(N):\n faces[f][y][0] = faces[lf][y if le in (1,3) else (0 if le==0 else N1)][0 if le==1 else N1]\n\n return faces\n\n def step(self, t):\n base = 0.12 * self.intensity\n for f in range(6):\n if random.random() < base:\n self.row_shift[f] = (self.row_shift[f] + random.choice([-1,0,1])) % self.tiles\n if random.random() < base:\n self.col_shift[f] = (self.col_shift[f] + random.choice([-1,0,1])) % self.tiles\n if random.random() < 0.03:\n self.hue_shift = (self.hue_shift + randf(-0.02, 0.02)) % 6\n self.colors = self.make_colors()\n\ndef face_to_sphere(radius, f, u, v):\n s = 1.0\n if f == 0: x,y,z = ( s, v, -u)\n elif f == 1: x,y,z = (-s, v, u)\n elif f == 2: x,y,z = ( u, s, -v)\n elif f == 3: x,y,z = ( u, -s, v)\n elif f == 4: x,y,z = ( u, v, s)\n else: x,y,z = (-u, v, -s)\n L = (x*x + y*y + z*z) ** 0.5 or 1.0\n return (radius * x / L, radius * y / L, radius * z / L)\n\nclass Camera:\n def __init__(self):\n self.yaw = 0.0\n self.pitch = 0.0\n self.pos = [0.0, 0.0, 0.0]\n self.speed = 1.0\n\n def forward_flat(self):\n return (math.sin(self.yaw), 0, math.cos(self.yaw))\n\n def right(self):\n return (math.cos(self.yaw), 0, -math.sin(self.yaw))\n\n def apply(self, v):\n x,y,z = v[0]-self.pos[0], v[1]-self.pos[1], v[2]-self.pos[2]\n cy, sy = math.cos(-self.yaw), math.sin(-self.yaw)\n x, z = cy*x - sy*z, sy*x + cy*z\n cp, sp = math.cos(-self.pitch), math.sin(-self.pitch)\n y, z = cp*y - sp*z, sp*y + cp*z\n return (x, y, z)\n\ndef project(v, cx, cy, f):\n x,y,z = v\n z = (z + 3.2)\n if z <= 0.1:\n z = 0.1\n s = f / z\n return (cx + x*s, cy - y*s)\n\ndef draw_layer(surface, cam, layer: SkyLayer, t, precision=False, warp_cache_every=3):\n if layer._cache_pts is None:\n layer._cache_pts = {f: [[None]*layer.tiles for _ in range(layer.tiles)] for f in range(6)}\n \n N = layer.tiles\n wob = 0.008 * layer.intensity\n melt = 0.02 if precision else 0.0\n \n w,h = surface.get_size()\n cx, cy = w/2, h/2\n f = 780 * (w / WIDTH)\n \n need_recalc = (pygame.time.get_ticks() // (1000//FPS_TARGET)) % warp_cache_every == 0\n \n for face in (5,1,0,3,2,4):\n seed = layer.seeds[face]\n for iy in range(N):\n for ix in range(N):\n jx = (ix + layer.col_shift[face]) % N\n jy = (iy + layer.row_shift[face]) % N\n col = layer.colors[face][jy][jx]\n \n jitter = int(30 * layer.intensity)\n col = (clamp(col[0]+random.randint(-jitter,jitter),0,255),\n clamp(col[1]+random.randint(-jitter,jitter),0,255),\n clamp(col[2]+random.randint(-jitter,jitter),0,255))\n \n if need_recalc or layer._cache_pts[face][iy][ix] is None:\n u0 = -1 + 2 * (ix / N); v0 = -1 + 2 * (iy / N)\n u1 = -1 + 2 * ((ix+1) / N); v1 = -1 + 2 * ((iy+1) / N)\n \n def warp(u, v, kadd):\n k = seed + ix*0.31 + iy*0.71 + kadd\n u += wob * math.sin(t*2.5 + k) + wob*0.5*math.sin((u+v+t)*4.8 + k*1.9)\n v += wob * math.cos(t*2.0 + k*0.6) + wob*0.5*math.sin((u-t)*5.2 + k*2.6)\n if melt:\n u += (random.random()-0.5) * melt\n v += (random.random()-0.5) * melt\n return u, v\n \n du0, dv0 = warp(u0, v0, 0)\n du1, dv0b = warp(u1, v0, 1)\n du1b, dv1 = warp(u1, v1, 2)\n du0b, dv1b = warp(u0, v1, 3)\n \n corners = [\n face_to_sphere(layer.radius, face, du0, dv0),\n face_to_sphere(layer.radius, face, du1, dv0b),\n face_to_sphere(layer.radius, face, du1b, dv1),\n face_to_sphere(layer.radius, face, du0b, dv1b),\n ]\n \n pts2d = [project(cam.apply(p), cx, cy, f) for p in corners]\n layer._cache_pts[face][iy][ix] = pts2d\n else:\n pts2d = layer._cache_pts[face][iy][ix]\n \n pygame.draw.polygon(surface, col, pts2d, 0)\n\ndef main():\n pygame.init()\n pygame.display.set_caption(\"colorbox\")\n screen = pygame.display.set_mode((WIDTH, HEIGHT))\n clock = pygame.time.Clock()\n \n base_radii = [1.4, 6.0]\n base_tiles = [16, 14]\n layers = [SkyLayer(base_tiles[i], base_radii[i], intensity=1.0 - i*0.2, hue_shift=i*0.9) for i in range(len(base_radii))]\n \n cam = Camera()\n mouse_locked = False\n invert_pitch = False\n precision = False\n mode = RAINBOW\n scale = 0.85\n \n rsurf = pygame.Surface((int(WIDTH*scale), int(HEIGHT*scale))).convert()\n fps_hist = deque(maxlen=30)\n \n pygame.mouse.set_visible(True)\n \n running = True\n while running:\n dt = clock.tick(FPS_TARGET) / 1000.0\n t = pygame.time.get_ticks() / 1000.0\n wheel_move = 0.0\n \n for e in pygame.event.get():\n if e.type == pygame.QUIT:\n running = False\n elif e.type == pygame.KEYDOWN:\n if e.key == pygame.K_ESCAPE:\n running = False\n elif e.key == pygame.K_l:\n mouse_locked = not mouse_locked\n pygame.mouse.set_visible(not mouse_locked)\n pygame.event.set_grab(mouse_locked)\n elif e.key == pygame.K_i:\n invert_pitch = not invert_pitch\n elif e.key == pygame.K_f:\n for lay in layers:\n lay.intensity = clamp(lay.intensity + 0.3, 0.5, 4.0)\n elif e.key == pygame.K_p:\n precision = not precision\n elif e.key == pygame.K_m:\n if mode == RAINBOW:\n mode = HUGE\n for i, lay in enumerate(layers):\n lay.radius = base_radii[i] * 12.0\n lay.tiles = max(10, int(base_tiles[i] * 0.75))\n lay.colors = lay.make_colors()\n else:\n mode = RAINBOW\n for i, lay in enumerate(layers):\n lay.radius = base_radii[i]\n lay.tiles = base_tiles[i]\n lay.colors = lay.make_colors()\n elif e.key == pygame.K_z:\n cam.pos = [0.0, 0.0, 0.0]\n cam.yaw = 0.0\n cam.pitch = 0.0\n elif e.type == pygame.MOUSEWHEEL:\n wheel_move += e.y\n \n if mouse_locked:\n mx, my = pygame.mouse.get_rel()\n cam.yaw += mx * 0.0030\n if invert_pitch:\n cam.pitch = clamp(cam.pitch + my * 0.0030, -1.2, 1.2)\n else:\n cam.pitch = clamp(cam.pitch - my * 0.0030, -1.2, 1.2)\n else:\n pygame.mouse.get_rel()\n \n keys = pygame.key.get_pressed()\n if keys[pygame.K_LEFT]:\n cam.yaw -= 0.035\n if keys[pygame.K_RIGHT]:\n cam.yaw += 0.035\n if keys[pygame.K_UP]:\n cam.pitch = clamp(cam.pitch - 0.035, -1.2, 1.2)\n if keys[pygame.K_DOWN]:\n cam.pitch = clamp(cam.pitch + 0.035, -1.2, 1.2)\n \n boost = 2.2 if keys[pygame.K_LSHIFT] or keys[pygame.K_RSHIFT] else 1.0\n spd = cam.speed * dt * boost\n fx, _, fz = cam.forward_flat()\n rx, _, rz = cam.right()\n \n if keys[pygame.K_w]:\n cam.pos[0] += fx*spd\n cam.pos[2] += fz*spd\n if keys[pygame.K_s]:\n cam.pos[0] -= fx*spd\n cam.pos[2] -= fz*spd\n if keys[pygame.K_a]:\n cam.pos[0] -= rx*spd\n cam.pos[2] -= rz*spd\n if keys[pygame.K_d]:\n cam.pos[0] += rx*spd\n cam.pos[2] += rz*spd\n if keys[pygame.K_q]:\n cam.pos[1] -= spd\n if keys[pygame.K_e]:\n cam.pos[1] += spd\n \n if wheel_move != 0.0:\n mx, my = pygame.mouse.get_pos()\n f = 760.0 * scale\n rx_cam = (mx - WIDTH/2) / (760.0)\n ry_cam = -(my - HEIGHT/2) / (760.0)\n rz_cam = 1.0\n \n cy, sy = math.cos(cam.yaw), math.sin(cam.yaw)\n cp, sp = math.cos(cam.pitch), math.sin(cam.pitch)\n \n x1, y1, z1 = rx_cam, ry_cam*cp + rz_cam*sp, -ry_cam*sp + rz_cam*cp\n dx, dy, dz = x1*cy - z1*sy, y1, x1*sy + z1*cy\n \n L = (dx*dx + dy*dy + dz*dz) ** 0.5 or 1.0\n dx, dy, dz = dx/L, dy/L, dz/L\n \n wheel_speed = 1.4 * wheel_move * (1.0 + 0.5*boost)\n cam.pos[0] += dx * wheel_speed * dt * 60.0\n cam.pos[1] += dy * wheel_speed * dt * 60.0\n cam.pos[2] += dz * wheel_speed * dt * 60.0\n \n for lay in layers:\n lay.step(t)\n \n iw, ih = rsurf.get_size()\n rsurf.fill((0,0,0))\n \n for lay in layers[::-1]:\n draw_layer(rsurf, cam, lay, t, precision, warp_cache_every=3)\n \n pygame.transform.smoothscale(rsurf, (WIDTH, HEIGHT), screen)\n \n fps = clock.get_fps()\n fps_hist.append(fps if fps > 0 else FPS_TARGET)\n avg = sum(fps_hist)/len(fps_hist)\n \n if len(fps_hist) == fps_hist.maxlen:\n if avg < 30 and scale > 0.6:\n scale = max(0.6, scale - 0.1)\n rsurf = pygame.Surface((int(WIDTH*scale), int(HEIGHT*scale))).convert()\n elif avg > 58 and scale < 1.0:\n scale = min(1.0, scale + 0.1)\n rsurf = pygame.Surface((int(WIDTH*scale), int(HEIGHT*scale))).convert()\n \n font = pygame.font.SysFont(\"consolas,monospace\", 16)\n hud = f\"[Mode {MODE_NAMES[mode]}] [Scale {scale:.2f}] [FPS {fps:.1f}]\"\n help1 = \"L lock | Wheel move-to-cursor | WASD+QE | Shift | F glitch | P precision | M HUGE | I invert | Z reset | ESC\"\n \n screen.blit(font.render(hud, True, (240,240,245)), (10, 8))\n screen.blit(font.render(help1, True, (185,185,195)), (10, 28))\n \n pygame.display.flip()\n \n pygame.quit()\n\nif __name__ == '__main__':\n main()\n ","url","link_url","/p/j0drjgwwyn5hy6q4jjxo","versioned_link_url","/p/j0drjgwwyn5hy6q4jjxo/1","yapping","**Considering Web Porting**\n\nI'm currently focused on how to best translate the Python script's skybox and cube-sphere projection into a web-based format. Three.js is a promising route, or perhaps custom 2D canvas logic. Replicating that layered, trippy skybox effect is the top priority! The cube faces projected onto a sphere will be another interesting challenge.\n\n\n**Refining Implementation Choices**\n\nI'm now leaning heavily towards using `Three.js` with a custom ShaderMaterial to capture the exact look. The goal is the retro \"software renderer\" style with the pixelated and glitchy effects. A low-resolution pass in `Three.js` could preserve this vibe. I also plan to add WASD and mouse controls for desktop and nipple.js for mobile, with dynamic resolution scaling.\n\n\n**Prioritizing Three.js Integration**\n\nI've decided to stick with `Three.js` and am outlining the core components. The Python logic for the cube-sphere skybox, which consists of `SkyLayer`, `face_to_sphere`, and other warping methods, will drive the shader's behavior. The shader will take `time`, `hueShift`, and `intensity` as input, determining which cube face is currently in view, and calculating the grid cell to generate its corresponding color and incorporate warping effects. I'm planning `index.html` for the entry point, and `main.js` to handle all the Three.js setup.\n\n\n**Defining Sphere Parameters**\n\nI'm now focusing on defining the sphere layers, establishing their radii for the visual effect. I'll need `base_radii = [1.4, 6.0]` for the inner and outer spheres, and ensure the shaders use this. I've chosen `app.js` for the main `Three.js` logic and have confirmed the file structure is correct. I'll use `three` and `nipplejs`. Performance-wise, I'll aim for high quality via a shader, which is a modern standard.\n\n\n\n\nindex.html\n```index.html\n```\n\napp.js\n```app.js\n```\n\nstyle.css\n```style.css\n```","page_description","The page features a web application with a dark-themed user interface designed primarily for interactive visual experiences. It includes an overlay…","cursor","eyJpZCI6ImowZHJqZ3d3eW41aHk2cTRqanhvIn0","token","included",[],"about",{"_182":-5},"parent","routes/browser/layout","actionData","errors"]