#19 — Fancybox shows raw data instead of image

by Harald Friessnegger last modified May 22, 2010 05:09 AM
State Resolved
Version: 0.8.2b2
Area Functionality
Issue type Bug
Severity Medium
Submitted by Harald Friessnegger
Submitted on Feb 16, 2010
Responsible Nathan Van Gheem
Target release: 0.9.0b1
The Fancy Box Gallery shows raw data instead of the image (see attached screenshot)

Calling the URLs loaded by the Javascript (path/to/image/image_large) work out fine.

Steps to reproduce:
create a folder, add images (i tried jpg and png)
make it a gallery
set displaytype to "fancy box"
and view the gallery
Attached:
fancybox-data.png — PNG image, 45 kB (46880 bytes)
Added by Nathan Van Gheem on Feb 16, 2010 03:09 PM
Issue state: UnconfirmedConfirmed
Responsible manager: (UNASSIGNED)vangheem
Target release: None0.8.2b2
Very odd behavior. Have you tested this is multiple browsers? Also, what version of Plone?
Added by Harald Friessnegger on Feb 17, 2010 07:51 AM
i'm using a plone4.0a4 buildout and truegallery trunk version (0.8.2b2)

same results with ff3.6, konqueror4.3.2 and chromium5.0

other gallery tyes such as slideshow2 and highslide do work well.
Added by Nathan Van Gheem on Feb 18, 2010 12:38 PM
Very odd. I can't seem to reproduce the issue on my box. Is it possible that it could be some kind of weird Linux issue with handling images?
Added by Harald Friessnegger on Feb 22, 2010 10:39 AM
tests in macOS ended up with the same error. also tried w/o nginx and w/ different themes (sunburst, ploneclassic)
maybe there is something in my buildout that leads to that phenomenon.
do you have a simple testing buildout somewhere in the repos that i could try out on my machine?
Added by Nathan Van Gheem on Mar 10, 2010 05:23 AM
I am very sorry for the delay in my response. I have looked at it again and I still can't reproduce it. I'm just running the default Plone 4b1 with the svn checkout of plonetruegallery.
Added by Harald Friessnegger on Mar 10, 2010 10:07 AM
i found out why some pictures don't work out in the gallery: i uploaded them using collective.uploadify

upload a picture via "add..image" results in the id: dsc01344.jpg, using uploadify the id is dsc01344-jpg

strangely plone recognizes the image as a file (according to the icon) in the folder_contents view but the title attribute tells me it's an image (see attached screenshot)
a click on the image takes me to the /view action that shows the image and editing gives me the atct image's edit form.

edit and save (w/o changes) makes the uploaded file be recognized as an image. so does renaming to dsc01344.jpg

so basically this is an uploadify or even more general ATContentTypes/Mimetypes issue.

the reason i initially thought is has something to do with truegallery is that the error only occures with the displaytype fancybox, the others (including portlets) work fine.
Attached:
gallery-file-or-image.png — image/png, 14 Kb
Added by Nathan Van Gheem on Mar 16, 2010 10:12 AM
Issue state: ConfirmedResolved
Added by Harald Friessnegger on Mar 16, 2010 10:43 AM
Issue state: ResolvedTested and confirmed closed
i filed an issue in the uploadify tracker: http://plone.org/products/collective.uploadify/issues/7
Added by Federico on May 11, 2010 03:45 PM
I tried to open a similar issue a couple of weeks ago.. I see just now there is something similar.

I'd like just to point out that I had the same problem but I did not use uploadify, I used the usual "Add image".
So I'm not sure if uploadify is the real reason of this odd behaviour (but I'm a total ignorant in Python and programming in general, so I wait for your opinions).

Also, now if I choose Fancybox I have a different problem: I get an error (see attached traceback file).
No problem with the other galleries.

I'm using Plone 4 beta (the latest) on Debian.
Attached:
fancybox-error.txt — text/plain, 4 Kb
Added by Harald Friessnegger on May 12, 2010 07:50 AM
i'm quite sure the problem here is that fancybox guesses the filetype of a gallery item by searching for image extensions in the url (http://groups.google.com/[…]/8df1379566348b48)

if your image has an url like plone/my-image.jpg/image_large it will work fine.
if it has plone/my-image/image_large it won't.

your error most probably is caused by fancybox loading binary image data as text into the pagetemplate. if that's the case renaming your images into *.png *.jpg etc should fix that.
Added by Federico on May 17, 2010 08:44 AM
yes, my images have an url like plone/my-image/image_large

The thing is: I'm using Plone 4, so images are stored in blobstorage/ as a .blob file. I can't rename these files.

Also, the name of the URL for the image actually comes from the title of the image. So, in order to have "my-image.jpg" I should put "my image.jpg" in the title.
You might agree with me that this is not nice at all. The title is for humans, not for computers ;-)

So there's any workaround? (I ask just because I'm curious.. actually I like very much the Highslide gallery, which works fine)

The last message in the url you posted before provides a possible solution maybe?
He "used the type= attribute of the a tag, which is intended to specify the MIME type of the linked resource
(e.g. <a type="image/jpeg">" and then changed the js code to get what we wanted.

Can we expect such an emprovement in fancybox in the future?
Added by Harald Friessnegger on May 17, 2010 09:16 AM
hi frederico

workaround
----------

you need not rename the blob files, just change the id of the atctimage object:
* action / rename
* or folder_contents; select items; press rename (for batch processing)

this way the title can be "My Image" and the id image01.jpg


improvement
-----------

for the feature request you proposed i'd suggest to file a new ticket and refer this one.
this issue has been closed already and there is a workaround for the problem.
Added by Nathan Van Gheem on May 17, 2010 12:40 PM
I already specify the type in the javascript.

fancybox({'type' : 'image'});

I thought that was the workaround so that we're still getting issues is frustrating. Can you confirm that putting the type in the "a" type works in all cases?

Added by Federico on May 17, 2010 01:27 PM
Hi Harald,

thanks for the explanation.
I changed the ID of all the images in the gallery, adding a .jpg suffix.

But my problem is totally different from this issue (I jumped in because I experienced the same problem until this major problem came out):

UnicodeDecodeError: 'ascii' codec can't decode byte 0xc3 in position 17: ordinal not in range(128)

(see also the traceback file attached above)

0xc3 is the name of a directory inside var/blobstorage.

@Nathan: should I file a report? (I searched the tracker and couldn't find anything similar)
Added by Nathan Van Gheem on May 17, 2010 01:41 PM
Issue state: Tested and confirmed closedConfirmed
Yes, add a new ticket. Please include a detailed listing of versions of Plone, plonetruegallery, z3c.form, plone.app.z3cform, and plone.z3cform.

Also, if you can include a sample image with configuration settings that produce the error.

I have a feeling the bug might be difficult to trace down.
Added by Nathan Van Gheem on May 22, 2010 05:09 AM
Issue state: ConfirmedResolved
Target release: 0.8.2b20.9.0b1
Turns out that the newer version of fancybox is needed for this to be forced image type. I've just updated the svn and will make a new release soon.

No responses can be added.