var api="https://api.openweathermap.org/data/2.5/weather?q="

var city="St Louis";

var APIkey="&appid=1bce8855c246f339b2384bc4e27930a6";

var units="&units=imperial";

​

var wind;

var clouds;

var temp; 

var humidity;

var pressure;

var start;

​

function setup() {

  createCanvas(windowWidth, windowHeight*.9, WEBGL);

  input=select('#city');

  var button=select('#submit');

  button.mousePressed(weatherAsk);

}

​

function weatherAsk() {

  var url=api+input.value()+APIkey+units;

  loadJSON(url, gotData);

}

​

function gotData(data) {

  weather=data;

}

​

function draw() {

  background(30, 3, 5);

  if(weather) {

    if(weather.wind.speed == 0) {

      wind = 0.5;

    } else {

      wind = weather.wind.speed;

    }

    clouds = weather.clouds.all;

    temp = weather.main.temp;

    humidity = weather.main.humidity;

    pressure = weather.main.pressure;

    noFill();

    windy();

    cloudy();

    humid();

    temperate();

  }

}

​

function windy() {

  rotateY(millis()/10000*wind);

  stroke(140);

  translate(0, windowHeight*0.38);

  cone(wind*10, 100, 20, 8, false);

  translate(0, windowHeight*-0.2);

}

​

function cloudy() {

  translate(clouds, -wind-clouds, wind);

  rotateX((millis()/5000)*clouds/50);

  stroke(255);

  fill(255);

  torus(clouds/2, clouds/20, 24, 12);

  translate(-clouds, wind+clouds, -wind);

  rotateX((-millis()/5000)*clouds/50);

}

​

function temperate() {

  translate(temp, -temp/2, wind);

  rotateX((millis()/5000)*temp/50);

  if(temp > 0) {

    stroke(252, 186, 3);

    fill(252, 186, 3);

  } else {

    stroke(50, 50, 255);

    noFill();

  }

  torus(temp, temp/10, 24, 12);

  translate(-temp, temp/2, -wind);

  rotateX((-millis()/5000)*temp/50);

}

​

function humid() {

  translate(humidity, -humidity, wind);

  rotateX(millis()/5000*humidity/50);

  stroke(100, 100, 240);

  fill(100, 100, 240);

  torus(humidity, humidity/10, 24, 12);

  translate(-humidity, humidity, -wind);

  rotateX(-millis()/5000*humidity/50);

}