Devlog 5:

Glancer is done, and it was fun! i touched up some fo the read-me, added the demo, and just polished a couple of things. Overall, it was really great

View it Here!: https://vismaysjayaram.github.io/glancer-desktop-view/

Comment your thoughts please!

I’ll add more dog photos to the demo if you comment!

Devlog 4!

It’s finally done.
After a lot of work, Glancer is finally feature complete. Before finishing everything off though, I decided to test it on an actual iPad instead of just my desktop browser. I’m really glad I did, because it immediately exposed a bunch of bugs caused by deprecated CSS. After a bit of trial and error (and Googling), I managed to iron them out.
The first new feature I tackled was the photo carousel. Originally my plan was to have the iPad handle everything locally, but I quickly realised that wasn’t a great idea. Since I already had a Flask server running, it made much more sense to let it serve the photos as well.
I ended up using what I’ve affectionately named the YOLO (You Only Load Once) method. The browser loads a photo, keeps displaying it until it eventually errors, then simply requests the next one from the server. It’s surprisingly simple, but it works really well. I also added photo shuffling and a photo counter, which rounded out the card nicely.
After that I moved onto the French card, my mot du jour. That one was pretty straightforward. The hardest part was actually finding a good word list. After spending way too long looking, I gave up and had AI generate one that I could use instead.
The final boss was the calendar.
Compared to what I expected, the frontend was easy. The backend definitely wasn’t. There were plenty of Python bugs, Apple Calendar quirks and recurring event weirdness to work through, but eventually everything clicked into place and I finally got today’s events showing correctly.
And with that…
Glancer is done.
There are still a few things I’d like to polish and test, but as far as the original vision goes, it’s complete. It’s honestly really satisfying seeing it all come together. What started as a simple dashboard idea is now something I actually use, and that’s a pretty cool feeling. Sure, i had to cut a lot of features, but i think what i lost, i gained thrice more.

Devlog 3! Return of the killer Adblocker!

This session was basically split into two parts: the weather card and the media card. The weather card was pretty simple, the media card absolutely was not.
I started with the weather card as a bit of a warm up. I used the OpenWeather API to grab the data and then spent most of my time getting everything to display nicely. The one thing I wasn’t expecting was how annoying SVGs are in plain HTML. I ended up making one massive lookup table full of SVG markup so I could swap icons depending on the weather. Is it elegant? No. Did it work? Yep.
After that I moved onto the main boss fight of this devlog: the media card.
Unlike the weather card, this one actually needed the frontend and backend to communicate. That meant learning Flask for the first time. Surprisingly, Flask was really enjoyable to work with. Setting up routes and returning JSON was much easier than I expected.
Then came AppleScript.
Honestly, AppleScript wasn’t nearly as bad as I’d heard. It’s probably one of the most readable programming languages I’ve used. I used it to grab information from the Music app like the current song, artist, duration and playback position, then passed all of that through Flask so the browser could fetch it as JSON.
Of course, nothing ever works the first time.
One thing that really annoyed me was discovering that my ad blocker was blocking the HTTP requests to my own local Flask server. Good on it for doing its job, but it made debugging miserable. I downloaded another browser to test it… only to realise it also had a built-in ad blocker. In the end I gave up and switched to Safari. I didn’t even know Safari had DevTools, but they’re actually pretty decent.
Once the backend was working I started designing the actual card. I tried a bunch of layouts before settling on one with the song title, artist, progress bar and a little animated equalizer. I also wanted playback controls and album art, but they just made the card feel cramped, so I scrapped both ideas.
The JavaScript was honestly the hardest part. Nothing was particularly difficult, it was just lots of connecting everything together and trying not to confuse myself with variable names. I split everything into smaller functions so I could update different parts of the card independently, and I also got to experiment with try and catch for error handling.
The rest of the session was mostly bug fixing, CSS animations and fighting JavaScript every step of the way.
Overall this felt like a pretty big milestone. Glancer isn’t just displaying static information anymore. It’s actually talking to my Mac in real time, which makes it feel a lot more like a real application than just another webpage.

Devlog 2!

Just got to work on the actual HTML progress. Eight hours later here’s what I’ve got.I started by quickly laying out the grid with CSS and HTML. I was going through my last devlog and decided to get straight into the first card the clock.The clock is running on Bebas Neue, centered and it uses a simple JS setup. I had no idea you could animate things with CSS like that, which was actually pretty fun to figure out.After that I moved on to the calendar since I hadn’t really planned it out properly. That kicked off what I’m calling the calendar arc and yeah it was painful.The calendar itself is pretty simple. It shows your next event, how much time is left, and the event details etc etc. But it ended up taking a lot of JavaScript work. Nothing complex just really annoying to deal with.What really got me was how JavaScript handles constants. How assigning something to a const doesn’t always create a fresh copy it just links back to the original reference. I had no idea about that.Eventually I got the calendar working, added a bit of styling and that was basically the full eight hours.

Devlog 1:

Hey there, excited to start my project Glancer. It’s an ambient desk display that will show the time, weather, my 3d printer status, maybe a media player, my calendar, and a selected photo that I plan to keep.
I’m designing the system to run on an iPad Mini 2 (d original) , which makes CSS and HTML much easier since I only need to define a single area.
I spent a crazy amount of time trying to understand how to define CSS headings and grids. Even though I only have to work with a single display resolution, it didn’t save me from going through way too many Web3Schools pages. who designed css? Who hurt you?
Overall, it looks like it will turn into a great project. I also plan to add a Mac side screen acting as a pseudo-server-thingie, which could provide the iPad with data about the printer, weather, and more; though I might also just have the iPad handle everything directly.
I spent a couple of hours designing and sketching before moving into Figma to prototype it. I’m now working on the actual code and I’m excited to see how it turns out.
Overall, a solid amount of work done before starting development.