search

ppeccin / javatari.js

Javatari - Online Atari 2600 Emulator
https://javatari.org
GNU Affero General Public License v3.0
215 stars 54 forks source link

Blurry pixels #2

Closed BenMcLean closed 7 years ago

BenMcLean commented 7 years ago

I've set up Javatari.js to run my demo here but I immediately notice that the pixels all look ugly and blurred. It seems to happen at any browser zoom level and on both Chrome and FireFox. This might be related to Windows using GUI scaling as I'm not sure whether/how that affects Javascript.

This app should be using nearest neighbor scaling so the pixels look like absolutely sharp squares instead of being blurred around the edges.

ppeccin commented 7 years ago

Did you try ALT-T to toggle screen filtering? Isn't it working in your setup? (please tell me your setup: machine, OS, browser, etc)

Nearest neighbor is not good for all applications, only when you have an exact multiple of the original scale. If not, you end up having pixels with different sizes on the screen. THAT looks ugly.... :-)

BenMcLean commented 7 years ago

Rows / columns of pixels of slightly different sizes (as long as it's consistent across the entire row/column) is much better than blurred pixels IMO.

My computer is an ASUS Q551LN-BBI706 laptop with NVIDIA GeForce 840M built-in graphics running Windows 10 at 1080p resolution with 175% DPI scaling.

On Chrome, the CRT filter (Alt+T) has no effect. Nasty pixel blur happens whether it's on or off and the results look identical. On FireFox, turning the CRT filter off makes the pixels relatively sharper, but they still don't make absolutely sharp squares / rectangles like I think they should.

ppeccin commented 7 years ago

I think with Windows scaling ON maybe you will never see sharp pixels in content rendered inside the browser, but I' not 100% sure.

I'll have to take a deeper look into this. Maybe something has changed in Chrome and the "Filter OFF" option is not working correctly.

On Mon, Dec 19, 2016 at 2:46 PM, Benjamin McLean notifications@github.com wrote:

Rows / columns of pixels of slightly different sizes (as long as it's consistent across the entire row/column) is much better than blurred pixels IMO.

My computer is an ASUS Q551LN-BBI706 laptop http://www.asus.com/supportonly/Q551LN/HelpDesk_Manual/ with a NVIDIA GeForce 840M graphics card running Windows 10 at 1080p resolution with 175% DPI scaling.

On Chrome, the CRT filter (Alt+T) has no effect. Nasty pixel blur happens whether it's on or off and the results look identical. On FireFox, turning the CRT filter off makes the pixels relatively sharper, but they still don't make absolutely sharp squares / rectangles like I think they should.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/ppeccin/javatari.js/issues/2#issuecomment-268014106, or mute the thread https://github.com/notifications/unsubscribe-auth/AArloNtUWLaFDSzoB9ulyDrcROpRFyqZks5rJrTMgaJpZM4LQy6F .

BenMcLean commented 7 years ago

I think with Windows scaling ON maybe you will never see sharp pixels in content rendered inside the browser, but I' not 100% sure.

Ah, well, I hope Microsoft, Google, Mozilla or whoever is responsible for that will fix it.

In the meantime, you might want to look at the CRT filter not turning off in Chrome.

And BTW, thanks for making this program so I can show off my game in the browser! 👍

ppeccin commented 7 years ago

Fixed. Chrome v55 changed a very small detail that was breaking this. Please update to version 0.92