Show HN: JWST Image Slideshow
jwst.seanchenpiano.com
jwst.seanchenpiano.com
I was inspired to make this after seeing the JWST images. I thought it would be cool to have something that would zoom in on random parts of those huge images, and maybe you could see things that you wouldn't otherwise see. This resulted from that.
First time using ViteJS and Mantine, and second project using TailwindCSS. I enjoyed how quick it was to develop with Vite and Tailwind. I did have trouble getting the behavior of the fading to work correctly, because rendering those huge files in <canvas>, you can't predict how long it takes for the compositor to display. Also, using React hooks doesn't seem to be as ergonomic for something like a long-running timer, because you have to reset and re-run the timers when dependencies change. Part of the solution was updating Refs using useEffect, and using those refs within the timer function.
The nice thing about this is that it works on my LG tv, so I can have a slideshow on that!
I think you could also consider a 'next' (previous too?) control to allow skipping something, but that might be more useful once there are many many JWST images.
If you want a user-zoomable interface, the official Webb site actually has them, for example: https://webbtelescope.org/news/first-images/gallery/zoomable...
As far as a next and prev, that would be easy, but I guess since the slideshow is only X seconds per slide, I didn't think it would be that necessary (at least to my use case) to skip or go back.
Another feature request: Add upvote/downvote and later try to increase the probability of showing a photo with more upvotes.
Edit Lol, well I finally got it open in the built in browser, but I'm not sure I'd say it works, exactly. My TV crashed, and based on the browser's behavior, I think it's less the website and more the browser. I may be better off just moving some photos with a USB drive.