Pixelation

General => General Discussion => Topic started by: Gil on July 16, 2014, 09:13:13 am

Title: Chrome now supports pixel zoom!
Post by: Gil on July 16, 2014, 09:13:13 am
If you update Chrome to 41, you'll have pixel-perfect zoom! THE FUTURE IS HERE.

Outdated Haxx:

This doesn't work anymore in the latest versions of Chrome! But don't worry, proper support for non-blurry zoom is already in the latest Chrome (Canary 41)

I made this TamperMonkey script for Chrome to disable the blurry zoom, based on the excellent work over at PixelJoint (http://www.pixeljoint.com/forum/forum_posts.asp?TID=18023):
https://openuserjs.org/scripts/meskens.simongmail.com/Crisp_Pixel_Zoom

You can install TamperMonkey here:
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo

I was pretty tired of people claiming you can't make a zoomer for Pixelation due to cross-origin policies, when there's several ways to get around that, a TamperMonkey script being one, using the createPattern hack being another.

Have fun with it! Should work for recent Chrome and probably Opera (I didn't test Opera, as I don't like it).

Title: Re: No more blurry zoom in Chrome!
Post by: Crow on July 16, 2014, 10:19:31 am
Hm, that's interesting. I couldn't get anything to work without running into cross origin trouble, so I'll be looking into that.
Title: Re: No more blurry zoom in Chrome!
Post by: Gil on July 16, 2014, 03:41:34 pm
I just updated to version 2.0. The code is way cleaner and better, for those looking into that. I just need to redo the hack for fixing large GIFs, so if you see a large GIF that doesn't work, tell me.

Also, I'd be interested to know if this works at all for you. If it doesn't, mention OS/Browser please :)

Here's what Rikfuzz found out so far:
iOS7:
Chrome -  :y: :y: (both good)
Safari -  :y: :y: (both good)

Android:
Chrome -  :n:  :y: (image blurry)
Firefox -  :y:   ???  (canvas is crisp but no animation)

OSX:
Chrome -  :n:  :y: (image blurry)
Safari -  :y: :y: (both good)
Opera -  :y:  :n: (canvas is broken https://dl.dropboxusercontent.com/u/1534394/osx_opera.jpg (http://))
Firefox current -  :y:   ???  (canvas is crisp but no animation, no errors in console)
Firefox old (3.6) - :y: :n: (don't think canvas is available, didn't think it was worth looking into. Shows unzoomed image)

Windows 7:
IE10 -  :y: :n: (canvas blurry and not animated)
Chrome -  :n:  :y: (image blurry)

XP (lol):
IE8 -  :y: :n:  (JSfiddle doesn't actually manage to initialise, haha, but IE8 was pre-antialiasing and pre-canvas so... assumption).
Title: Re: No more blurry zoom!
Post by: Crow on July 16, 2014, 04:06:07 pm
For the record, keep in mind this is still a workaround. Tests done on non-Webkit browsers are not exactly necessary.
Title: Re: No more blurry zoom!
Post by: PixelPiledriver on July 16, 2014, 06:49:37 pm
Cool.  :y:
Windows 8: Chrome --> works
Title: Re: No more blurry zoom!
Post by: Mathias on July 16, 2014, 07:59:45 pm
I'm on Windows 7, Chrome. It's working! Images zoom with nearest neighbor. Thank you!!
Title: Re: No more blurry zoom!
Post by: Crow on July 16, 2014, 08:22:13 pm
Stuck.
Title: Re: No more blurry zoom!
Post by: Batzy on July 16, 2014, 08:33:23 pm
win8.1 chrome works like a charm <3 thank you so much Gil  :y:
Title: Re: No more blurry zoom!
Post by: Mr. Fahrenheit on July 16, 2014, 11:16:18 pm
Thank you!  :'( I've waited so long.

Actually, on some pages, such as the daily challenge thread pictures near the bottom of the page didn't load when I had this script on. When I turned the script off it loaded just fine. Is this happening for anyone else?
Title: Re: No more blurry zoom!
Post by: Gil on July 17, 2014, 06:01:48 am
Thank you!  :'( I've waited so long.

Actually, on some pages, such as the daily challenge thread pictures near the bottom of the page didn't load when I had this script on. When I turned the script off it loaded just fine. Is this happening for anyone else?
Yep, I ran into that one too. I haven't figured out yet why it's happening, but yes, your best bet is to turn it off for a sec :/

In time I'll try to iron out the kinks. Do note that you can right click an image -> open in new tab and it will act like Pixelation where you can click to zoom. So if you had to turn off the script, you can still look at images that way.

Good to know that most forms of Windows/Chrome work. That's the most important one I want to support.

Edit: actually, I figured out some tricks I can do to optimize. The next version will have these and I'm assuming it'll fix that elusive bug where the images stop rendering halfway down a thread.
Title: Re: No more blurry zoom!
Post by: Helm on July 17, 2014, 07:25:00 pm
Works. You're a rockstar.  :crazy:
Title: Re: No more blurry zoom!
Post by: Gil on July 17, 2014, 09:53:47 pm
Works. You're a rockstar.  :crazy:
Heh, I've been trying to get this to work for a while now, because I knew it would be possible. I've been working on similar stuff for a while now and I suddenly gained the knowledge to tackle this :)

The only issue is that animation support is basically a hack. I will try to find a solution though and hopefully donate all the resulting code for Pixelation's use.
Title: Re: No more blurry zoom!
Post by: Mathias on July 17, 2014, 10:06:14 pm
. . .
The next version will have these and I'm assuming it'll fix that elusive bug where the images stop rendering halfway down a thread.

Yep, this is a problem. My workaround is hitting a "Quote" link on a post on the page and then using the browser's Back button. Shouldn't make a difference, but it does - all images show up.
Title: Re: No more blurry zoom!
Post by: Gil on July 18, 2014, 12:37:11 am
Yep, this is a problem. My workaround is hitting a "Quote" link on a post on the page and then using the browser's Back button. Shouldn't make a difference, but it does - all images show up.
The sporadity of the bug and the fact that it shows up more or less for certain users, combined with how it shows up, leads me to believe that it's a bug in the browser's rendering, possibly caused by either too many zoomable images or by setting up too many render loops.

Next version will contain a fix for both issues. I will only make an image zoomable once you try to zoom in on it and I'll make one render loop that renders all images.



Version 2.1 is up. Apparently something went wrong with the last version, as I can tell not a lot installed it. I changed the link above to properly represent the new url, which should fix this issue. From now on, if set in the options, this should auto-update.

Changes include a fix to the bug where images stop rendering. Please tell me if everything works.
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: Crow on July 18, 2014, 02:25:07 pm
Cookie'd. Pretty sure the others agree. No more double posts, though, please :crazy:
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: Ambivorous on July 18, 2014, 06:13:07 pm
The good news is that it works (the images are now loading all the way through a thread), Gil. Nicely done and thanks because it really is awesome.

The bad news is that a friend just linked a 2818x4062 image to me and I clicked it once to make it native size, then once to make it small again, then again because I thought the click hadn't registered (where actually it was just slowly trying to render it) and then my PC crashed.
I'm thinking maybe you should set a max size, or switch off that feature if it's no longer needed (as I understand it, it's only there as a workaround for images not loading?).

I have a quad-core i5, a GTX 470, Windows 7 Pro SP1 and the latest Chrome, by the by.
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: Gil on July 19, 2014, 02:33:02 pm
The good news is that it works (the images are now loading all the way through a thread), Gil. Nicely done and thanks because it really is awesome.

The bad news is that a friend just linked a 2818x4062 image to me and I clicked it once to make it native size, then once to make it small again, then again because I thought the click hadn't registered (where actually it was just slowly trying to render it) and then my PC crashed.
I'm thinking maybe you should set a max size, or switch off that feature if it's no longer needed (as I understand it, it's only there as a workaround for images not loading?).

I have a quad-core i5, a GTX 470, Windows 7 Pro SP1 and the latest Chrome, by the by.
Ah yes, I'll have to remedy that happening. I'll set up a max size for the next version. For now, the easiest way is to turn the script off when looking at large images. It will only start to render when first clicked.
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: Mathias on July 19, 2014, 02:51:36 pm
You should put an image in the first post so people can easily and quickly do a test.

___

"Version 2.0 is here. Should have way better browser support. Now supports image tabs, PixelJoint gallery . . ."

??

Is this supposed to affect PixelJoint somehow?
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: Crow on July 19, 2014, 04:20:10 pm
The good news is that it works (the images are now loading all the way through a thread), Gil. Nicely done and thanks because it really is awesome.

The bad news is that a friend just linked a 2818x4062 image to me and I clicked it once to make it native size, then once to make it small again, then again because I thought the click hadn't registered (where actually it was just slowly trying to render it) and then my PC crashed.
I'm thinking maybe you should set a max size, or switch off that feature if it's no longer needed (as I understand it, it's only there as a workaround for images not loading?).

I have a quad-core i5, a GTX 470, Windows 7 Pro SP1 and the latest Chrome, by the by.
Ah yes, I'll have to remedy that happening. I'll set up a max size for the next version. For now, the easiest way is to turn the script off when looking at large images. It will only start to render when first clicked.

Why does it even work on those images? Should restrict it to certain ones. On Pixelation, img elements with the zoom class will do.
Title: Re: No more blurry zoom v2.1! [UPDATE: July 18]
Post by: tim on July 19, 2014, 09:05:10 pm
Yes the script is now loading on every page. It should be restricted to wayofthepixel.
Title: Re: No more blurry zoom v2.13! [UPDATE: July 21]
Post by: Gil on July 20, 2014, 01:38:16 pm
Yes the script is now loading on every page. It should be restricted to wayofthepixel.
The current script is not specific to Wayofthepixel, it's an all-around script. Changing it to only work on Wayofthepixel is easy though. I'm just not sure if I can make options for this. I'll look into it.

Do note that it only works on specific images, so it doesn't actually do anything on most pages.

Right now, you will get zoom on the following pages:
- Pixelation
- Pixeljoint
- Any image opened by itself

I'll try to look for a solution for the next version coming out later today hopefully.

EDIT: Released version 2.12:

This matches only Pixelation and Pixeljoint. I was having troubles with it running on every page. I want to have it work with images in new tabs, that'll probably be in the next version more or less, but I can't promise anything, as I can't match on mime type (which is dumb).
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: rikfuzz on October 10, 2014, 08:17:28 am
Doesn't seem to work with animated images anymore? 

(https://dl.dropboxusercontent.com/u/1534394/lsp.gif)
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: Gil on October 21, 2014, 08:08:09 am
I just noticed that. Very odd indeed. It probably means that the bug I abused to get animated images working is now fixed. This is bad news, there's no easy way to fix it :/
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: Decroded on November 27, 2014, 01:40:00 am
Thanks Gil  :y: :y:

Any chance of android plugin?
Or anyone recommend a workaround for android?
Even if it involves saving the image and viewing in some app?
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: JackieTarr on November 27, 2014, 09:57:01 pm
Thank you! I'm brand new to this forum, and the blurry zoom was already getting frustrating.
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: hawken on February 02, 2015, 11:12:44 am
works (yay!)

but not for animated gif sadly.

Chrome / OSX Version 40.0.2214.94 (64-bit)
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: Crow on February 05, 2015, 09:11:19 am
(Kinda) on topic of this, I've done some adjustments to the current zoom script to allow zooming of images before all images on the page have been downloaded. This should allow you to use the zoom features even if there are some images on non-responsive/slow servers, but it may break zoom functionality if you click an image that hasn't finished loading yet (lazy implementation, sorry).
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: Ambivorous on March 12, 2015, 11:05:23 am
I don't know if this is a thing that happened a while ago and I haven't noticed, or if somehow Chrome is lying to me, but it seems like nearest-neighbour zooming works in Chrome now - even for animated gifs.  :y:

EDIT (specs):
Windows 7, Chrome Version 41.0.2272.89 m
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: surt on March 12, 2015, 12:22:01 pm
CSS's image-rendering: pixelated is supported in Chrome from 41.
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: Crow on March 13, 2015, 11:07:06 am
CSS's image-rendering: pixelated is supported in Chrome from 41.

Which I had already added to the stylesheet a while ago ;)
Title: Re: No more blurry zoom v2.12! [UPDATE: July 21]
Post by: wzl on March 13, 2015, 12:15:30 pm
Oh thanks for the hint with version 41. i was wondering why it was all blurry still. Seems updating helps :D
Title: Re: Chrome now supports pixel zoom!
Post by: hawken on March 23, 2015, 01:45:32 am
seems like animated GIF is working now!  ;D