No album artworks are displayed

[meps92]

Hello, is this still in development? Unfortunately, no album artworks are displayed. Is there a way to fix that?

Otherwise, the Apollo-Player is awesome!

[Alladinsane]

I think this project is well out of development(last update was 3 years ago), but it is nevertheless the best web client I've found for Mopidy in terms of something that can be used as a collaborative jukebox, so I wanted to find a way to fix it. After mucking around for a while, I found a fix. If you don't mind digging into the source code:

In controllers/player.js, about line 369, you'll find the function concerned with fetching the album art. It looks like this:

 getArt: function(p_track, callback) {
            // return dummy image as track by default
            p_track.album.art = '../public/images/default_cover.png';

            // Only send cover art request to spotify if track uri points to spotify
            if (p_track.uri.substr(0, 'spotify:'.length) === 'spotify:') {
                request({
                    uri: "https://embed.spotify.com/oembed/?url=" + p_track.uri,
                    method: "GET",
                    headers: {
                        'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:25.0) Gecko/20100101 Firefox/25.0'
                    }
                }, function(error, response, body) {
                    var response = JSON.parse(body);
                    var album_art_640 = function(str) {
                        str = str.split('cover');
                        return str[0] + '640' + str[1];
                    }(response.thumbnail_url);
                    p_track.album.art = album_art_640;
                    callback.apply(self, [null, p_track]);
                });
            } else {
                callback.apply(self, [null, p_track]);
            }
        },

I'm not real up on my nodejs, but I gather this fetches the url for the album art, and then passes it through a function to rename it, adding some aspect ratio info that I guess was to make all the art a uniform thumbnail size. That last bit seems to be happening here:

var album_art_640 = function(str) {
                       str = str.split('cover');
                       return str[0] + '640' + str[1];
                   }(response.thumbnail_url);
                   p_track.album.art = album_art_640;
                   callback.apply(self, [null, p_track]);

This seems to be where it goes off the rails. "response.thumbnail_url" definitely contains the correct url for the art. I'm not sure what goes wrong, so on my install I just cut that bit out, which I accomplished by simply setting p_track.album.art equal to response.thumbnail_url, instead of whatever album_art_640 was meant to be. In other words this line:

p_track.album.art = album_art_640;

Becomes this:

p_track.album.art = response.thumbnail_url

This seems to get the album art back. I'm not convinced this might not break the layout later on down the line, but so far so good. The response from spotify is already a thumbnail, so maybe we don't need to add the extra aspect ratio info.

[Alladinsane]

Just a quick update, I've tested this on iPad, iPhone, Android, Chrome, Firefox, and Safari. So far this change hasn't broken anything and album art is correctly displayed.