Skip to content

Commit

Permalink
refactored level 3 to use spotify api to retrieve artists name and image
Browse files Browse the repository at this point in the history
  • Loading branch information
walter-0 committed Sep 29, 2015
1 parent 608b3dc commit 90fe5f4
Show file tree
Hide file tree
Showing 2 changed files with 112 additions and 67 deletions.
173 changes: 109 additions & 64 deletions client/hello/level3.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,77 +2,80 @@ Template.hello.events({
//start level 3
'click h2.start3': function () {
currentLevel = 3;
var startArtist;

//hide the genres
$('.genre1').hide();
$('.genre2').hide();
//randomize start artist
function getStartArtist () {
startArtist = Math.floor((Math.random() * 7000) + 1);
return startArtist;
};
$('#genre1').hide();
$('#genre2').hide();

function getTargetArtist () {
//randomize target artist
targetArtist = Math.floor((Math.random() * 7000) + 1);
// function getStartArtistId () {
// //randomize start artist
// startArtistId = Math.floor((Math.random() * 7000) + 1);
// return startArtistId;
// };
//
// function getTargetArtistId () {
// //randomize target artist
// targetArtistId = Math.floor((Math.random() * 7000) + 1);
// return targetArtistId;
// };

function getRandomOffset() {
offset = Math.floor((Math.random() * 99999) + 1);
};


//get request for start artist
function getStartArtistName () {
HTTP.get('http://developer.echonest.com/api/v4/artist/profile?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + startArtist + '&format=json',
//get two random artists
function getArtists() {
HTTP.get('https://api.spotify.com/v1/search?query=year%3A0000-2015&offset=' + offset + '&limit=2&type=artist&market=US',
{},
function (error, result) {
if (result.statusCode === 200) {
//continue if the artist id exists
if (result.data.response.artist) {
//clear current artist then update
$('#currentArtist span').empty().append(result.data.response.artist.name);
//get new artist if id does not exist
}else{
startArtist = Math.floor((Math.random() * 5000) + 1);
getStartArtistName();
console.log(result.data.artists.items);
if (result.data.artists.items[0].images.length == 0 || result.data.artists.items[1].images.length == 0) {
console.log('no images, running again');
getRandomOffset();
getArtists();
}
var startArtistName = result.data.artists.items[0].name;
var targetArtistName = result.data.artists.items[1].name;
//append names to html
$('#currentArtist span').empty().append(startArtistName);
$('#targetArtist span').empty().append(targetArtistName);

var startArtistImageUrl = result.data.artists.items[0].images[0].url;
var targetArtistImageUrl = result.data.artists.items[1].images[0].url;

//append images to html
$('#currentArtistImage').removeAttr('src').attr('src', startArtistImageUrl);
$('#targetArtistImage').removeAttr('src').attr('src', targetArtistImageUrl);
}
});
};
}
)};

//get request for start artist image
//Image URLs are unreliable. Will continue to search for solutions
// function getStartArtistImage () {
// HTTP.get('http://developer.echonest.com/api/v4/artist/images?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + startArtist + '&format=json&results=1',
// //get request for start artist
// function getStartArtistName () {
// HTTP.get('http://developer.echonest.com/api/v4/artist/profile?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + startArtistId + '&format=json',
// {},
// function (error, result) {
// if (result.statusCode === 200) {
// if(result.data.response.images){ //check if artist has an image file
// var currentImageUrl = result.data.response.images[0].url;
// //check if image URL is good
// function checkImage(src) {
// var img = new Image();
// img.onload = function() {
// // code to set the src on success
// $('#currentImage').attr('src', src)
// };
// img.onerror = function() {
// // doesn't exist or error loading
// $('#currentImage').attr('alt', 'No Image')
//
// };
// img.src = src; // fires off loading of image
// }
// checkImage(currentImageUrl);
// //continue if the artist id exists
// if (result.data.response.artist) {
// //clear current artist then update
// startArtistName = result.data.response.artist.name;
// $('#currentArtist span').empty().append(startArtistName);
// //get new artist if id does not exist
// }else{
// getStartArtistImage();
// startArtistId = Math.floor((Math.random() * 5000) + 1);
// getStartArtistName();
// }
// }
// })
// });
// console.log('start artist name ' + startArtistName);
// };


//get request for similar artists
function getSimilarArtists () {
HTTP.get('http://developer.echonest.com/api/v4/artist/similar?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + startArtist + '&format=json&results=12&start=0',
HTTP.get('http://developer.echonest.com/api/v4/artist/similar?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + startArtistId + '&format=json&results=12&start=0',
{},
function (error, result) {
if (result.statusCode === 200) {
Expand All @@ -88,27 +91,69 @@ Template.hello.events({
);
};

//get request for target artist
function getTargetArtistName () {
HTTP.get('http://developer.echonest.com/api/v4/artist/profile?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + targetArtist + '&format=json',
// //get request for target artist
// function getTargetArtistName () {
// HTTP.get('http://developer.echonest.com/api/v4/artist/profile?api_key=X2VQTSJP3SIFYYMVT&id=7digital-US:artist:' + targetArtistId + '&format=json',
// {},
// function (error, result) {
// if (result.statusCode === 200) {
// //continue if the artist id exists
// if (result.data.response.artist) {
// //clear current artist then update
// targetArtistName = result.data.response.artist.name;
// $('#targetArtist span').empty().append(targetArtistName)
// }else{
// targetArtistId = Math.floor((Math.random() * 7000) + 1);
// getTargetArtistName();
// }
// }
// });
// };

//http.get top track for start artist
// function getArtistTracks(artistName) {
// HTTP.get('https://api.spotify.com/v1/search?q=' + artistName + '&type=track&market=us&limit=1',
// {},
// function (error, result) {
// if (result.statusCode === 200) {
// var trackUrl = result.data.tracks.items[0].preview_url;
// var audio = $('#currentTrack');
// $('#currentTrack source').attr('src', trackUrl)
// audio[0].pause();
// audio[0].load();
// audio[0].oncanplaythrough = audio[0].play();
// }
// })
// };

//http.get image for input artist
function getArtistImages(artistName) {
HTTP.get('https://api.spotify.com/v1/search?q=' + artistName + '&type=artist&limit=1',
{},
function (error, result) {
if (result.statusCode === 200) {
//continue if the artist id exists
if (result.data.response.artist) {
//clear current artist then update
$('.targetArtist span').empty().append(result.data.response.artist.name)
}else{
targetArtist = Math.floor((Math.random() * 7000) + 1);
getTargetArtistName();
if (result.data.artists.items[0]) {
var artistImageUrl = result.data.artists.items[0].images[0].url;
if (artistName == startArtistName) {
//set the startArtistImage url on the html
$('#currentArtistImage').removeAttr('src').attr('src', artistImageUrl);
}else if (artistName == targetArtistName) {
//set the targetArtistImage url on the html
$('#targetArtistImage').removeAttr('src').attr('src', artistImageUrl);
}
}
}
});
};
getStartArtist();
getTargetArtist();
getStartArtistName();
getSimilarArtists();
getTargetArtistName();
getRandomOffset();
getArtists();
// getStartArtistId();
// getTargetArtistId();
// getStartArtistName();
// getSimilarArtists();
// getTargetArtistName();
// getArtistTracks(startArtistName);
// getArtistImages(startArtistName);
// getArtistImages(targetArtistName);
}
});
6 changes: 3 additions & 3 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -53,20 +53,20 @@ <h1 class='flashWin'>
<div class='artistContainer'>
<div class="targetArtistContainer">
<h2 id='targetArtist'>Target Artist<br> <span></span></h2>
<img id='targetArtistImage' src=''>
<img id='targetArtistImage' alt='No image. sorry.'>
</div>

<div class="currentArtistContainer">
<h2 id='currentArtist'>Current Artist<br> <span></span> </h2>
<img id='currentArtistImage' src=''>
<img id='currentArtistImage' alt='No image. sorry.'>
</div>
</div>

<div class='genreContainer'>
<h2 id='genre2'>Target Genre<br> <span></span></h2>
<h2 id='genre1'>Starting Genre<br> <span></span></h2>
</div>

</div>
<div class='listContainer'>
<ul class='artists'></ul>
Expand Down

0 comments on commit 90fe5f4

Please sign in to comment.