You are browsing as a guest. Sign up (or log in) to start making projects!

54m 55s logged

NebulaOS devlog — v2: music, browser, desktops, shortcuts, installable app

NebulaOS got a big update this round. It now has five things the workshop guide didn’t ask for.

🎵 Music player: three tracks (ambient, chiptune, lo-fi) with a live visualizer. There are no audio files at all. Every note is synthesised in the browser with the Web Audio API, using a look-ahead scheduler so the beat never drifts. It keeps playing when you minimise it or switch desktops.

🌐 Mini browser: an address bar, back/forward/reload, and a home page with tiles. Typing something that isn’t a URL does a Wikipedia search. Sites that forbid being embedded (GitHub, Google) are detected up front and show an “open in new tab” panel instead of a blank frame.

🖥️ 4 virtual desktops: switch from the top bar or with Alt+1–4. Right-click a window’s title bar to move it to another desktop.

⌨️ Shortcuts: Esc closes the front window. Browsers never let a page capture Alt+Tab, so I built a window switcher on Alt+instead. Hold Alt, tap to cycle, release to pick (Shift goes backwards).

📲 Installable: it now has a web manifest, icons and a service worker, so you can add it to your phone’s home screen. It opens full-screen and works offline.

Hardest bug: the snap-preview overlay and backdrop-filter. A window with backdrop-filter becomes the containing block for position:fixed children, so the preview had to live outside the windows.

Stack: React 18 + TypeScript + Vite, no UI library.
Live: https://maddulasriharsha.github.io/webos/
Code: https://github.com/maddulasriharsha/webos

0
177

Comments 0

No comments yet. Be the first!