Closed Bug 1010614 Opened 5 years ago Closed 5 years ago

[B2G][Mobile] now playing graphic will become transparent in SoundCloud and overlap the download app button

Categories

(Web Compatibility :: Mobile, defect)

ARM
Gonk (Firefox OS)
defect
Not set

Tracking

(b2g-v1.3 affected, b2g-v1.4 affected)

RESOLVED FIXED
Tracking Status
b2g-v1.3 --- affected
b2g-v1.4 --- affected

People

(Reporter: psiphantong, Unassigned)

References

()

Details

(Whiteboard: [openc-1.4-exploratory] [country-all] [css][sitewait])

Attachments

(1 file)

Attached image 1970-01-01-02-03-45.png
Description:
When the user plays music on SoundCloud, the now playing graphic will become transparent and overlap the download app button


Repro Steps:
1. Go to SoundCloud
2. Choose a artist and play the music
3. Tap on the artist/song banner.


Actual:
The now playing graphic is transparent and overlap the download app button


Expected:
User should see the now playing graphic and the graphic should not overlap the download app button


1.4 Environmental Variables:
Device: Open_c 1.4 MOZ
BuildID: 20140512000204
Gaia: 17fb44880e95bc7ae363a609d811bf5a9a067b5b
Gecko: ec24f847e7c0
Version: 30.0
Firmware Version: P821A10v1.0.0B06_LOG_DL


1.3 Environmental Variables:
Device: Open_C 1.3 MOZ
BuildID: 20140505052400
Gaia: Unknown Git commit; build date shown here.
Gecko:
Version: 28.0
Firmware Version: P821A10V1.0.0B06_LOG_DL

 
Repro frequency: 100%
See attached: Screenshot
Component: Preinstalled B2G Apps → Mobile
Summary: [B2G][Preinstalled b2g Apps] now playing graphic will become transparent in SoundCloud and overlap the download app button → [B2G][Mobile] now playing graphic will become transparent in SoundCloud and overlap the download app button
Other layout issues in that screenshot: the interactions icons, number of views, favs, etc. :)

 psiphantong,
do not forget to put the full URI, when you create a bug report.
It helps to find out where is the issue.
Flags: needinfo?(psiphantong)
Whiteboard: [openc-1.4-exploratory] → [openc-1.4-exploratory] [country-all] [css]
#header #now-playing {
  ...
  right: 80px;
  ...
}

Needs to be adjusted--but the header isn't well suited to handle narrow widths. 

Furthermore, clicking "Download App" just reloads the page (and is present when you're looking at the installed Soundcloud app...). Do we have an open bug for that?

Here's the code that handles that:

SC.OpenInApp = {
    className: '.open-in-app',
    iTunesUrl: 'itms://itunes.apple.com/us/app/soundcloud/id336353151?mt=8&uo=6',
    marketUrl: 'market://details?id=com.soundcloud.android',
    $el: null,
    clicked: null,
    initialize: function () {
        this.$el = $(this.className);
        this.decorate()
    },
    decorate: function () {
        if (SC.isAndroid) this.$el.attr('href', this.marketUrl);
         else SC.isIOS && this.$el.attr('href', this.iTunesUrl);
        SC.authorization.isLoggedIn || $(document.body) .addClass('showAppButton')
    }
};
Whiteboard: [openc-1.4-exploratory] [country-all] [css] → [openc-1.4-exploratory] [country-all] [css][contactready]
Yves,
Can you help?
See the screenshot:
https://bugzilla.mozilla.org/attachment.cgi?id=8422829

* Now playing overlapping on download app
* interactions icons, number of views, favs, etc

thanks.
Flags: needinfo?(yves.vangoethem)
SoundCloud is aware of the issue, but has no specific date planned for resolution.
Flags: needinfo?(yves.vangoethem)
Whiteboard: [openc-1.4-exploratory] [country-all] [css][contactready] → [openc-1.4-exploratory] [country-all] [css][sitewait]
Karl, this has been fixed and can be closed
Thanks Yves. <3
Status: NEW → RESOLVED
Closed: 5 years ago
Resolution: --- → FIXED
Product: Tech Evangelism → Web Compatibility
You need to log in before you can comment on or make changes to this bug.