Devlog 2 — Things Finally Started Moving

Picked this back up today and this was basically the point where I started adding JavaScript and making things actually work. Up until now everything was just static UI. At first, I was building app content directly inside JavaScript strings… which worked but got messy really fast. The big breakthrough was moving all of that into proper HTML <template> tags instead. Sounds small but it made the code way easier to manage. Don’t have to squint at quotation marks trying to understand layout and styles.

Got the window manager fully working! open, close, minimize, maximize, drag around. Each window now gets a taskbar button that reflects its state. Clicking a minimized window restores it, clicking an active one minimizes it. The Start menu can launch apps now and desktop icons work too. You can double-click an icon to open an app which is a small thing but makes it feel a lot more real. Also wired up the Settings panel. Toggles switch between ON/OFF, accent colors update the theme live and dark mode works (kind of a hack using CSS filters but it works). The Apps folder opens in its own window and can launch other apps from inside it. It’s all small features but they’re finally connected.

Spent way too long debugging why desktop icons weren’t responding. Turned out to be a typo in a template ID (“windows-template” vs “window-template”) combined with the script running before the DOM loaded. Very classic… huh? Wrapped everything in DOMContentLoaded and double-checked all IDs after that. Most of the apps (Browser, Terminal, Calculator, Mood Lamp, Fortune Cookie) are still just placeholders with static content. But the system around them feels solid now. Next step is making at least one of them actually do something interesting.. probably either a fake-command Terminal or a Mood Lamp with real color interaction.

Also: the Start button didn’t even have an icon before. Just an empty button sitting there. Fixed that. Small wins matter!