pimusicbox / mopidy-musicbox-webclient

Web Client for Mopidy Music Server and the Pi MusicBox
https://www.pimusicbox.com
Apache License 2.0
398 stars 106 forks source link

play button misplaced #235

Open xsteadfastx opened 7 years ago

xsteadfastx commented 7 years ago

i updated my favourite mopidy interface aka the musicbox webclient and in firefox the play button seems to be misplaced. tried it on different boxes with the same results. in chrome it looks normal.

mopidy on 192 168 39 115

kingosticks commented 7 years ago

Wow, that's a bizarre effect. I must confess I didn't do any testing in Firefox, presumably neither did @jcass77. I'll look into this sometime in the next few days, currently a bit busy with Musicbox itself right now.

jcass77 commented 7 years ago

I primarily us Firefx for testing and saw the above once, a long time ago, but could not reproduce it thereafter.

Are you sure that you are using the latest versions of both Firefox and the webclient, and did you perhaps try clearing the cache of everything?

xsteadfastx commented 7 years ago

i use firefox 52.0.1 and mopidy-musicbox-webclient version 2.4.0. cleared cache and everything. i installed 2.3.0 again to see if its somethign else... cleared cache there too and the play buttons are in place.

kingosticks commented 7 years ago

As in, now in the correct place, or still in the wrong place as per your screenshot?

xsteadfastx commented 7 years ago

in the correct place :)

xsteadfastx commented 7 years ago

No. It's in the correct place if I downgrade and clear the cache. If I install the new version again, clear cache, they are misplaced again. Sorry.

kingosticks commented 7 years ago

Ahhh right!

jcass77 commented 7 years ago

I have seen this once or twice while working on MMW, but am unable to reproduce this issue using version 2.4.0 and the latest Firefox on OS X. I even tried using the same album from the internet archive:

skitched-20170415-121721

The HTML on that particular page consists of a fairly standard unordered list:

<li class="song albumli currenttrack2" id="albumstable-internetarchive3ATortoiseBrettNauckeTheBishop231-01BrettNauckemp3" tlid="">
  <a href="#" class="moreBtn" onclick="return popupTracks(event, 'internetarchive:TortoiseBrettNauckeTheBishop','internetarchive:TortoiseBrettNauckeTheBishop#1-01BrettNaucke.mp3');">
    <i class="fa fa-play-circle"></i>
  </a>
  <a href="#" onclick="return controls.playTracks('', mopidy, 'internetarchive:TortoiseBrettNauckeTheBishop#1-01BrettNaucke.mp3', 'internetarchive:TortoiseBrettNauckeTheBishop');">
    <h1><i class="fa fa-university">
      </i> 1-01 Brett Naucke
    </h1>
  </a>
</li>

...and the play icon uses a float: right; style element to align with the rightmost edge of the screen. So there is not much that we can do unless you would like to try fiddling with the stylesheet using the Firefox developer tools. My UI skills aren't the best so if anybody thinks there is a more standard way of doing this that will have better browser support we can explore further. It may just be an unfortunate glitch in the specific OS and browser engine combination that you are using.

What happens if you try refreshing the browser while viewing the page on which the play icons are misaligned (I think that worked for me before).

kingosticks commented 7 years ago

I can reproduce this. The second image is quite interesting as it shows it's related to the way tracks from the same album are grouped together. screenshot from 2017-04-17 22-17-10

screenshot from 2017-04-17 22-19-11

xsteadfastx commented 7 years ago

oh finally you can reproduce it. i thought i do something strange ;-)