Unable to create Spotify app playlist view

Question

I'm trying to display a simple playlist view in my Spotify app with the following code:

sp = getSpotifyApi(1);
var m = sp.require("sp://import/scripts/api/models");
var v = sp.require("sp://import/scripts/api/views");
var jq = sp.require('sp://XXX/jquery/jquery-1.7.1.min');

var pl = m.Playlist.fromURI('spotify:user:d3marcus:playlist:4zPZzImEYkUOVBvxIo42im');
var player = new v.Player();
player.track = pl.get(0);
player.context = pl;
var list = new v.List(pl);
$('XXX').append(list.node);

This will result in an empty list view and an error caught in sp://import/scripts/language.js:44: "Uncaught TypeError: Cannot read property 'length' of undefined"

Any suggestions?

Answer 1

I would say you are getting this error because the playlist has not yet loaded when you do pl.get(0). To make sure the playlist model has loaded you could either do

pl = m.Playlist.fromURI('spotify:user:d3marcus:playlist:4zPZzImEYkUOVBvxIo42im');
pl.observe(models.EVENT.LOAD, function() {
  player.track = pl.get(0);
  ...
});

or

m.Playlist.fromURI("spotify:user:d3marcus:playlist:4zPZzImEYkUOVBvxIo42im", function(pl) {
  player.track = pl.get(0);
  ...
});

Answer 2

I'm not sure, but could you try this :

$('YYY').append($(player.node));
$('XXX').append($(list.node));

instead of

$('XXX').append(list.node);

let us know...

Answer 3

For the 1.0 API:

require([
  '$api/models',
  '$views/list#List'
], function (models,List) { 

 var addList = function(list) {
    list.load('tracks').done(function(list) {
        list.tracks.snapshot().done(function(trackSnapshot){

            // Make the playlist view
            var multiple_tracks_player = document.getElementById('addedTracksList');
            var playableList = List.forPlaylist(list);
            multiple_tracks_player.appendChild(playableList.node);
            playableList.init();

        });
    });
 }

 exports.addList = addList;
}

// Example of use:
addList(models.Playlist.fromURI(...))

I've tested it as used above, so it should work.

I found this in the tutorial-app available on github under "Playing music"-section -> "Play a list of tracks"

I hope this is helpfull.