Can anyone fix the blur problem?

[brente]

It appears that Charles has abandoned this project. Can anyone look
into and fix the blur problem which occurs on the click focus of any
image? This bug was there from the beginning and was never fixed. It
basically makes this coverFlow unusable in any way other than a demo.
Blurry photos are not photos.

If anyone with wicked mad JS skills could look into the code and see
if they can improve on this focus issue it would be highly appreciated
by the entire group.

thanks, B

[Charles Ying]

Hi everyone,

Sorry it's taken so long to get back into gear on this project.

Brente, I haven't yet figured out a good solution to the blur problem, but I'll write what I understand to be the problem and offer up some pointers for those working out a fix:

What's happening is that the images are loaded and projected at a smaller size to make them fit in the carousel (which sits at translateZ(0px)). When you transform the image "forward", there's blurriness in the image as the original rendering surface is still the smaller size.

Thus I see 2 initial approaches, and am stuck trying to debate which one might be best:

1. Load the images in a larger size and base the carousel at a negative Z (transforming to Z=0 when zoomed in). Pros are: should be fairly straightforward to implement. Cons: Larger images may potentially make the carousel animate slower since more pixels need to be moved. Can't pinch zoom any further.

2. When the blurred image is zoomed in, load a second panel and fade in with a high res version. Pros: most optimal performance wise, and can allow for even greater detail with additional pinch zoom code. Cons: much trickier to implement (why I haven't done it yet) since the panel needs to be added and removed based on whether the image is zoomed in.

Maybe this can help someone, or at least get the conversation started on how to proceed.

Best,

Charles

[Anna]

Has anyone tried to implement Charles' suggestions or fixed the issue
in any other manner? I'd really like my images to be clearer...
Also, I am having the same problem I saw someone else mention - I'm
using static images and whenever the app loads, the images are in a
different, random order. Anyone know how I can lock the display order
of the images?
I've been working with this code for months and no one seems to be
able to help...I've finished the rest of my web app now, just trying
to implement this so any help would be GREATLY APPRECIATED!!
Thanks in advance, Anna