var songHue = [120, 80, 60, 45, 30, 0, 330, 285, 260, 235, 190, 160]

​

​

​

var s = new SpotifyWebApi()

var searchList

var mySong

var songID = ""

var ColH

var ColS

var ColB

var radiusSize

var radiusRatio = 1

var myInput

let good = false;

​

function getURLQuery(u) {

  var q = window.location.hash.substring(1)

  var v = q.split('&')

  for (var i = 0; i < v.length; i++) {

    var pair = v[i].split("=")

    if (pair[0] == u){return pair[1]}

    good = true

  }

  return false

}

​

​

if (window.location.hash == "") {

  window.alert("Please authorise your Spotify account")

}

else {

  s.setAccessToken(getURLQuery('access_token'))

}

​

function searchAudioFeatures() {

  s.getAudioFeaturesForTrack(songID, function(err, data) {

      if (err) console.error(err)

      else {

        mySong = returnData(data)

        ColH = songHue[mySong.key]              

        ColS = Math.round(mySong.valence * 100)  

        ColB = Math.round(mySong.energy * 100)    

        radiusSize = Math.round(mySong.tempo)    

      }

  })

}

​

function returnData(responseData){

  return responseData

}

​

if (good == true){

  getCurrentTrack()

}

function getCurrentTrack() {

  s.getGeneric("https://api.spotify.com/v1/me/top/tracks&limit=2&time_range=long_term", function(err, data) {

    if (err) console.error(err)

    else {

      console.log(data)

      // searchList = returnData(data)

      // if (searchList.item == 0) {

      //   document.getElementById("name").innerHTML = "No Results"

      //   document.getElementById("artist").innerHTML = "Please try another search"

      // }

      // else {

      //   songID = searchList.item.id

      //   searchAudioFeatures(songID)

      //   document.getElementById("name").innerHTML = searchList.item.name

      //   document.getElementById("artist").innerHTML = searchList.item.artists[0].name

      }

    }

  // }

 )

}

​

function setup() {

  var canvas = createCanvas(400,400)

  canvas.parent(mySketch)

​

}

​

function draw() {

  background(255)

  colorMode(HSB)

  var c = color(ColH, ColS, ColB, 0.5)

  // strokeWeight(1)

  // stroke(0, 0, 100)

  noStroke()

  fill(c)

  translate(width/2, height/2)

  rotate(45)

  rectMode(RADIUS)

  angleMode(DEGREES)

  // Create ring

  // for (var i =0; i < 40; i++) {

  //   push()

  //   rotate(i / 6.35 )

  //   triangle(0, 0, radiusSize, 0, ColB, 50)

  //   pop()

  // }

  for (var i = 0; i < ColB; i++) {

    rotate(540 / ColB)

    rect(0,0, 1, radiusSize - i/2)

  }

​

  // randomSeed(Date.now())

  // var w = random(-15,15)

  fill(255)

  ellipse(0, 0, radiusSize*1.1, radiusSize*1.1)

  fill(c)

  ellipse(0, 0, radiusSize, radiusSize)

  // loadImage(albArt, function(img) {

  //   image(img, 0, 0)

  // })

  // background(ColH+30, ColS, ColB, 0.1)

​

  var cssCol = 'hsl(' + ColH + ',' + ColS + '%,' + ColB + '%)'

  select("#info").style('color', cssCol)

}