79 lines
1.8 KiB
JavaScript
79 lines
1.8 KiB
JavaScript
var Pages = {
|
|
|
|
renderArtist: function(data){
|
|
var artist_info = $('\
|
|
<div class="artist-info">\
|
|
<div class="pic">\
|
|
<img src="'+ data.artist.pic +'" alt="'+ data.artist.name +'" width="250" />\
|
|
</div>\
|
|
<h1 class="name">'+ data.artist.name +'</h1>\
|
|
<div class="info">\
|
|
'+ data.artist.desc +'\
|
|
</div>\
|
|
</div>\
|
|
');
|
|
|
|
var albums_info = $('<div class="albums"></div>');
|
|
$.each(data.albums, function(i, album){
|
|
var album_info = $('\
|
|
<div class="album">\
|
|
<h2 class="name">'+ album.name +' ('+ album.year +')</h2>\
|
|
<div class="pic">\
|
|
<img src="'+ album.pic +'" alt="'+ album.name +' by '+ data.artist.name +'" width="250" />\
|
|
<div class="add-album">Add to playlist</div>\
|
|
</div>\
|
|
<div class="tracklist">\
|
|
<ul>\
|
|
</ul>\
|
|
</div>\
|
|
</div>\
|
|
');
|
|
|
|
$.each(album.tracks.album, function(i, track){
|
|
var track_info = $('\
|
|
<li>\
|
|
<span class="index">'+ (i+1) +'</span>\
|
|
<div class="trackname">'+ track.name +'</div>\
|
|
<div class="length">'+ track.duration +'</div>\
|
|
</li>\
|
|
');
|
|
|
|
$(album_info).find('.tracklist ul').append(track_info);
|
|
});
|
|
|
|
$(albums_info).append(album_info);
|
|
})
|
|
|
|
$('#data-container').html('').append(artist_info).append(albums_info);
|
|
}
|
|
}
|
|
|
|
/*
|
|
|
|
<div class="albums">
|
|
<div class="album">
|
|
<h2 class="name">Get Born</h2>
|
|
<div class="pic">
|
|
<img src="pics/getborn.jpg" alt="Get Born by Jet" width="250" />
|
|
<div class="add-album">Add to playlist</div>
|
|
</div>
|
|
<div class="tracklist">
|
|
<ul>
|
|
<li>
|
|
<div class="trackname">Last Chance</div>
|
|
<div class="length">1:52</div>
|
|
</li>
|
|
<li>
|
|
<div class="trackname">Are You Gonna Be My Girl</div>
|
|
<div class="length">3:34</div>
|
|
</li>
|
|
<li>
|
|
<div class="trackname">Rollover DJ</div>
|
|
<div class="length">3:17</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
*/ |