732355 - Photos are not displayed in photo slideshows at flickr.com

Status: RESOLVED WORKSFORME

(Web Compatibility :: Mobile, defect)

Description

[Camelia Urian]

Attachment: Device Screenshot

Nightly 13.0a1 2012-02-29
Device: Samsung Nexus S (Android 2.3.6)

Steps to reproduce:
1. Go to flickr.com.
2. Tap on Explore and choose a Set.
3. Choose a picture from the set and open it.
4. Tap on the spyglass to open the photo in a larger slideshow.

Expected results:
The picture is displayed in the slideshow and the slideshow is usable.

Actual results:
The images in the slideshow are not displayed.

Notes:
-- The issue is not reproducible on the Android Browser

Comment 1

[Camelia Urian]

This issue is also reproducing on latest XUL tablet build:
Fennec/13.0a1 2012-02-29
Device: Samsung Galaxy Tab (Android 3.1)
User Agent: Mozilla/5.0 (Android; Tablet; rv:13.0) Geko/13.0 Firefox/13.0a1 Fennec/13.0a1

Comment 2

[Aaron Train [:aaronmt]]

I think the photos are transitioned and displayed with the code which is wrapped with Webkit prefixed tags. 

<div id="img-1" data-position="0" style="width: 1440px; height: 715px; top: 12px; display: block; -webkit-transition-property: -webkit-transform; -webkit-transition-duration: initial; -webkit-transition-timing-function: initial; -webkit-transition-delay: initial; -webkit-transform: translate(0px, 0px); " class="slide-wrap"><div role="img" aria-label="Upperworld /2" class="img" style="height: 692px; width: 1024px; background-size: 100%; background-image: url(http://farm8.staticflickr.com/7062/6943374773_8a0b19797c_b.jpg); " id="yui_3_4_0_1_1330704559029_291"></div></div>

Comment 3

[Damon Sicore (:damons)]

This bug is a big deal.  We need to make sure we make significant progress on this before we launch Firefox for Android 1.0 final.

Can we get an update here that we've reached out to Flickr and we're making progress (hopefully)?

Comment 4

[Aaron Train [:aaronmt]]

The desktop site has logic that redirects views of individual images to their mobile site, m.flickr.com which is great. The desktop site's slideshow utility loads a Flash carousel which works fine in today's Nightly. With this, this should be WFM.

Tested on Nightly (04/30), Galaxy Nexus (Android 4.0.4).

Comment 5

[Catalin Suciu [:csuciu]]

I'm still able to reproduce this issue on the latest Nightly (2012-05-01)using the original steps.

The pictures are not displayed in the slideshow mode

Samsung Galaxy SII (2.3.4)
Galaxy Nexus (4.0.2)

Comment 6

[Catalin Suciu [:csuciu]]

Attachment: Log Samsung Galaxy SII

Comment 7

[Brad Lassey [:blassey] (use needinfo?)]

not blocking on evangelism bugs

Comment 8

[Jason Smith [:jsmith]]

Nominating for kilimanjaro, as this affects a top google app and site for fennec native.

Comment 9

[Jason Smith [:jsmith]]

I meant to say top site/app from Ron's list.

Comment 10

[Lawrence Mandel [:lmandel] (use needinfo)]

This issue reproduces on Firefox desktop simply by using the mobile URL. For ex, http://m.flickr.com/photos/gen/2592947296/lightbox

I submitted a ticket to Flickr about this issue today.

Comment 14

[Hallvord R. M. Steen [:hallvors]]

Making this the master bug for the Flickr lightbox issue.

Lawrence, any feedback from Flickr? Can you check the status of your ticket? Ping them on Twitter? Do we have personal contacts

Comment 15

[Thomas Stache]

I know Markus Spiering... fwiw.

Comment 16

[Lawrence Mandel [:lmandel] (use needinfo)]

(In reply to Hallvord R. M. Steen from comment #14)
> Lawrence, any feedback from Flickr? Can you check the status of your ticket?
> Ping them on Twitter? Do we have personal contacts

I have heard no update and don't have a ticket number or other way to follow up.

Comment 17

[Hallvord R. M. Steen [:hallvors]]

Tried @Flickr on twitter.. https://twitter.com/hallvord/status/361847308364685313

Comment 18

[Anthony Ricaud (:rik)]

Stephen: Can you help us with this?

Comment 19

[Karl Dubost💡 :karlcow]

Hallvord: I have a contact at Flickr see Bug 878638

Comment 20

[Karl Dubost💡 :karlcow]

Flickr contacted.

Comment 21

[Stephen Woods]

Hello all, this is probably just the prefixes. I can get those removed. Am I correct in assuming that I can test this in FF for android to verify the fix?

Comment 22

[Lawrence Mandel [:lmandel] (use needinfo)]

Yes. You can test in Firefox for Android. If you'd like to test on Firefox OS, you can try the simulator. (We will test on our end once we hear from you as well.)

https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/

Comment 23

[Hallvord R. M. Steen [:hallvors]]

This is still a problem - any progress in removing those prefixes or adding equivalent CSS for other browsers?

Comment 24

[Karl Dubost💡 :karlcow]

I just tested again on Firefox OS and ZTE Open and it seems the issue is still here.

Comment 27

[Chris More [:cmore]]

(In reply to Stephen Woods from comment #21)
> Hello all, this is probably just the prefixes. I can get those removed. Am I
> correct in assuming that I can test this in FF for android to verify the fix?

Stephen: Where are we at with the bug and the prefixes?

This bug has been open for almost two years and flickr.com is a popular site that I can't believe we don't push harder on. Users won't know if it is the website or if it is the browser, but if they switch to Chrome to test and it works, they will probably blame Firefox.

Comment 28

[Chris More [:cmore]]

Attachment: Blank screen on Firefox OS

Comment 29

[Karl Dubost💡 :karlcow]

Pinged Flickr again http://twitter.com/MozWebCompat/status/408989097978777600
And sent a reminder to Ross (Flickr)

Comment 30

[Hallvord R. M. Steen [:hallvors]]

I'm not sure if this issue is understood after all. I see DIV elements that supposedly should have background-image set to make the image appear at all, and for some reason they're not styled with any background. Here's some of the code:
https://gist.github.com/hallvors/8555662 ..and it's a bit complicated :-p

Comment 32

[Hallvord R. M. Steen [:hallvors]]

It's a familiar issue.. (they share code with Google Images or something? But this seems to be in YUI code..): setting element.style['background-image'] instead of element.style['backgroundImage']. Here's some setStyle code:

            setStyle: function (e, t, n, r) {
                r = r || e.style;
                var i = d.CUSTOM_STYLES;
                if (r) {
                    n === null || n === "" ? n = "" : !isNaN(new Number(n)) && b.test(t) && (n += d.DEFAULT_UNIT);
                    if (t in i) {
                        if (i[t].set) {
                            i[t].set(e, n, r);
                            return
                        }
                        typeof i[t] == "string" && (t = i[t])
                    } else t === "" && (t = "cssText", n = "");
                    r[t] = n // note: no camel-casing of t happens here
                }

Adding this:

                    if(t=='background-image')t='backgroundImage';

fixes things, though obviously they will want to add some proper camel casing code (and YUI, as far as I remember, already has that - just they stopped worrying about whether someone would pass hyphenated names to this method).

Comment 33

[Mike Taylor [:miketaylr]]

YUI2.7 camel-cased properties, https://github.com/yui/yui2/blob/master/src/dom/js/Dom.js#L237-L248,
But YUI3 does not: https://github.com/yui/yui3/blob/7e93d66f39eecb3db3ccc6c3ac3fe7683dd4dff9/src/dom/js/dom-style.js#L59-L83

The YUI3 docs are pretty clear on which format to use though, http://yuilibrary.com/yui/docs/api/classes/Node.html#method_setStyle. Given that, I think reporting a bug to YUI is probably a waste of time. We really need Flickr to update their code to the YUI3 expected format.

Comment 34

[Karl Dubost💡 :karlcow]

I'm not sure this bug is still valid. 

The description says
Steps to reproduce:
1. Go to flickr.com.
2. Tap on Explore and choose a Set.
3. Choose a picture from the set and open it.
4. Tap on the spyglass to open the photo in a larger slideshow.


but testing on Firefox OS, Firefox Android, UCWeb gives me the exact same experience. There is no spyglass anymore.
Opera (Presto) Android doesn't receive the mobile version :/ :(

Should we close as INVALID?

Comment 35

[Karl Dubost💡 :karlcow]

ok after discussions with hallvors. Let's close it as FIXED.
Though Opera might want to reach out them.

Comment 36

[Thomas Stache]

Attachment: screenshot of the mobile Flickr photo page

I can very much still see this (on Firefox Android Beta 28.0).
1. Here's a link to a photo:
http://m.flickr.com/#/photos/thomasstache/13113772113/in/photostream/
See screenshot how the mobile photo page looks. Yes there is no spyglass.
2. Tap the photo to get to the lightbox view/slide show.
3. The lightbox is all black as in comment 0.

Comment 37

[Thomas Stache]

Attachment: Broken Lightbox/Slideshow screen.

Comment 38

[Aaron Train [:aaronmt]]

This is not fixed.

Comment 39

[Karl Dubost💡 :karlcow]

huh. Well I do not have this behavior at all on Firefox OS 1.2 and Firefox v26 Android 2.3.5 for the step

> 2. Tap the photo to get to the lightbox view/slide show.

Tapping the big image doesn't bring anything.

Comment 40

[Thomas Stache]

(In reply to Karl Dubost :karlcow from comment #39)
> huh. Well I do not have this behavior at all on Firefox OS 1.2 and Firefox
> v26 Android 2.3.5 for the step
> 
> > 2. Tap the photo to get to the lightbox view/slide show.
> 
> Tapping the big image doesn't bring anything.

Do you have a Flickr account? I think it depends on your status if you have permission to view large versions. If you search a bit there should be photos from other users that allow large versions for "public"/"anybody".
(Or just get a Flickr account for the QA team...)

Comment 41

[Karl Dubost💡 :karlcow]

I don't have a flickr account. 
But it would have been good to specify the requirement ;) in the initial bug.

So for people who want to enter the link you gave as a shortlink

0. Without Flickr account on Firefox OS
1. Go to http://bit.ly/1nptHbX
2. Tap the photo
3. After tapping, **for me now**, I just has the bigger image being downloaded. No slideshow. 
4. If I type again, it goes back to the previous page.

I can't test with Firefox for Android for now (my device got bricked today). It's 11pm Friday evening, if someone else can test, Erase cookies, then test without flickr account, and then with flickr account.

Thanks.

Comment 42

[Thomas Stache]

It appears to me that Flickr has launched a new m.flickr.com photo page layout, and this bug as filed has become obsolete. With the new page neither Chrome/Android nor Firefox/Android have a lightbox/slideshow (for the time being?). The rest of the pages' features appear to work as intended in Firefox/Android.

Comment 43

[Hallvord R. M. Steen [:hallvors]]

Thanks for confirming that. I've tested in Firefox on Android and Firefox OS, both logged-in and logged-out and with pictures both from the "interestingness" stream and the last one you linked to above - can't reproduce.

If anyone else can, please make sure you don't have any spoof settings and/or extensions interfering and please give very specific instructions on how to test it when you reopen :)

Comment 44

[Hallvord R. M. Steen [:hallvors]]

(To be clear: loading a URL that used to show this problem - http://m.flickr.com/photos/gen/2592947296/lightbox - still shows it, but I don't see any way from the front page to such a page now)