I have a high res monitor so I zoomed in my browser window to 160% and the cursor position math seems to be a bit wonky and jumpy as you try to adjust the slider

Currently, the website's images load very slowly. I've generated 2800x, 1400x, 700x, and 350x versions of all images used in the comparisons, and added HTML sizing declarations so the browser will automatically use the image best for the screen resolution.

Works fine on Windows. On MacOS, on some pictures the slider will show up, on some it won't and instead looks like a picture without any interactivity: Chrome 103 MacOS 12.3.

Nice to have: A clear CONTRIBUTING and CONTRIBUTORS file (jculpon can provide some examples) along with a code of content to make it clear (beyond people familiar with working with GPLv3) how to contribute to the repository (and be credited if desired).

It’s probably fine to have most of this in README.md at this stage, but this tool is likely to be passed around for a while in an education context in addition to the scientific one, so it’s good to have “teacher-friendly” or “not GPL programming” instructions in case students find issues they think should be fix during lectures.

https://www.nasa.gov/feature/goddard/2022/webb-captures-stellar-gymnastics-in-the-cartwheel-galaxy

https://www.nasa.gov/image-feature/goddard/2018/hubble-s-cartwheel

James Webb: https://www.reddit.com/r/jameswebb/comments/vzbrqg/comment/ig944ro/?utm_medium=android_app&utm_source=share&context=3

Hubble : https://www.nasa.gov/sites/default/files/thumbnails/image/stsci-h-p2042a-f-1663x1663.png https://www.nasa.gov/feature/goddard/2020/hubble-captures-crisp-new-portrait-of-jupiters-storms

Hi. First of all, really great project & idea! I love this!

Repro steps

1. Go to: https://johnedchristensen.github.io/WebbCompare/
2. Change browser window size to smaller (and finally to the smallest width)
3. See that sliders behavior is incorrect (jumpy or stuck)

Additional context

It's quite similar & perhaps related with issue #7 But in this case, the issue occurs just after changing browser' window size (smaller values than default). Browser: Firefox as well as Chrome

Best wishes,

The maximum size this site will show images at is 768px wide. That's very small on a desktop monitor. Would be much better if on desktop form-factor we could use more screen real-estate.

The mitigation for this right now is to zoom the whole page, but then the slider breaks.

The slider doesn't appear on mobile view for the Carina Nebula. Apparently I can trigger it to appear by going landscape mode. Brave desktop works just fine.

On some mobile devices that have a very wide aspect ratio, the slider will never be visible for the last image even if users scroll down entirely. Fixed it by changing checkPosition() to calculate visibility using getBoundingClientRect().

I used this command to do the resize:

$ magick 'image path' -resize x1000 -quality 100 'output path'

For concerned images, that's quite a gain! And the loss is barely perceptible on my 27'' screen.

| Image | Initial size | New size | Gain | |---|---|---|---| | Webb Deep Field Cropped.png | 12 524 KB | 1 346 KB | -89,25 % | | Hubble Cropped.png | 8 827 KB | 1 554 KB | -82,39 % | | Southern_nebula_webb.png | 21 813 KB | 1 219 KB | -94,41 % | | Southern_ring_nebula_Hubble_Rotated.png | 2 848 KB | 293 KB | -89,71 % | | Stephans_Quintent_Webb.jpg | 5 054 KB | 1 006 KB | -80,09 % | | Stephan's_Quintet_Hubble_Rotated.jpg | 584 KB | 382 KB | -34,59 % | | TOTAL | 51 650 KB | 5 800 KB | -88,77 % |

Feel free to close or make other suggestions 👍

(some changes are caused by my IDE automatically removing trailing spaces)

There was the infamous early teaser/calibration image, but I've also come across some reddit posts where people are processing data from Spitzer Heritage Archive themselves and then either using the officially-released JWST images or doing their own processing on stuff from MAST. For example:

• Southern Ring
• Carina
• Stephan's Quintet
• M74
• IC 5332
• NGC 7469

I suspect this would be way too big of an ask, but I thought I'd bring it to your attention anyway. :)

Adds a GitHub Dependabot YAML configuration and a sketch SECURITY policy for reporting more urgent/potential security vulnerability related bugs to WebbCompare.

Prepared via PUNCH ELVIS GAMES and merged/squashed into a smaller changeset for a simpler DIFF with upstream.

commit-by:jculpon

Zoom.js is throwing an index out of bound issue in safari. I don't have an apple device to troubleshoot and test a fix for this, but I'm guessing it would be a pretty straight forward fix. Issue with GIF was reported here https://twitter.com/hhill2020/status/1548160163131011073?s=20&t=deRQ7smQESmZzlVZZjnrYg

The brightness of each Hubble/Webb image is completely arbitrary, with the constraint that not too many pixels are oversaturated. With the exception of the Carina Nebula, the Hubble images you're using are darker than the Webb images, which makes the latter look brighter and "better." You should adjust the brightness of the pairs so that they are approximately equivalent, so that the comparison is based on the true differences between the images (resolution, ability to see further into the past).