Devlog #2 - 6/11/2026

The windows are officially moving! After laying down the layout framework, I spent tonight diving straight into user interaction and window manipulation. Translating my Python logic over to JavaScript and the browser DOM was a massive mental puzzle, but the interface is finally starting to respond like a real desktop environment!

I spent tonight expanding the OS capabilities and bringing the window control interface to life:

Built a sleek top header bar for the app window equipped with operational minimize, maximize, and close buttons.

Implemented mouse event listeners (mousedown, mousemove, and mouseup) to make the window fully draggable around the workspace canvas.

Created an element tag safety check inside the dragging function to prevent the window buttons from triggering accidental window drags.

Built a responsive fullscreenToggle() state manager that snaps the window to the exact dimensions of the screen while perfectly clearing the taskbar.

Today was a massive learning curve for me regarding how JavaScript interacts with live styling. I learned that JavaScript can’t read values directly from an external CSS file (which is why checking layout strings directly fails), how accidentally mixing up assignment (=) and comparison (==) operators can completely stall your function, and how to use the CSS calc() function to flawlessly mix viewport units with pixel units (100vh - 47px) so the layout scales perfectly!

Hopefully next time I can work on starting the multi-window feature after I finish studying for my finals tmrw, which means looking into updating my query selectors and implementing a dynamic z-index layering system so windows can stack without getting confused.

Onwards!