@eroga

So I think the project is finished and I’m actually pretty happy with how it turned out.

The OS has a desktop with a gradient background, a topbar with a live clock and fake battery, and five apps: a welcome screen, an about me section with a sidebar, a projects grid, a contact window, and a terminal. The terminal was the most work by far. I had to add command history with the arrow keys, escape user input so nobody breaks it with echo, and set up a command system that’s easy to extend.

The custom feature I added is sticky notes. You can make one from the topbar button, the desktop icon, or by typing nota in the terminal. Each note is a draggable window with a text area, and they come in four colors so you can tell them apart. The way it works is each note gets created with document.createElement and then I just pass it to the same dragElement() function everything else uses — nothing had to be rewritten.

The biggest thing I learned from this whole jam is how mouse events actually work. Before this I’d never done drag and drop from scratch. The key detail is you have to put mousemove and mouseup on the document, not on the element — otherwise if you move the mouse too fast it slips off and the drag breaks. Took me a while to figure that out.

Anyway, it works, it looks decent, and it’s all vanilla JS with no libraries.

Got window dragging working. The key thing I learned: you have to attach mousemove and mouseup to the document, not to the window element itself otherwise if you move the mouse too fast it slips off the element and the drag breaks.

Added the About, Projects, Contact, and Terminal apps. The About app has a sidebar you can click through, and Projects renders cards from a JavaScript array which made it easy to add new ones. The terminal took the most time.

Also added z-index stacking so clicking a window always brings it to the front, and desktop icons that select on single click and open on double click.

First day on the webOS jam. The idea of building an OS inside a browser felt weird at first, but also really cool.

I got the desktop background working using a CSS gradient and added a live clock to the topbar using setInterval. The hardest part was figuring out position: absolute windows kept showing up in completely wrong places until I understood that everything is positioned relative to the body.

By the end of the session I had a working desktop with a welcome window sitting in the middle.

So I travel a bit, and I’ve always wanted one of those maps where you can see every place you’ve been at a glance. The flat pin-board ones never felt right to me. The Earth is a sphere, so I wanted a sphere.

That’s the whole idea behind VISIT3D: a 3D globe you can spin around, drop a pin on a city you’ve visited, and just… look at your life on a planet.

Started it this week, here’s where it’s at:

A globe actually renders and you can drag to spin it
I can type a city, hit add, and a little dot shows up where it should
The dots survive a refresh
That last one took me longer than I’d like to admit.

Backend: Flask (Python). All it does for now is save my list of places to a JSON file and hand it back.
Frontend: Three.js / globe.gl for the actual 3D Earth.