Starting point for your Easter project.

Look at the face example below. If the real-time temperature in Martorell is lower than 15ºC I will be sad, otherwise I will be happy

Project contents:


var weather;
var url1 = "http://api.openweathermap.org/data/2.5/weather?q="
var city = "Martorell"
var url2 = "&APPID=5461bacb468ffb47cb3f97bb095ee4e8&units=metric"
function setup() {
  createCanvas(600,400);
  loadJSON(url1 + city + url2, gotData); 
}
function gotData(data){
  //println(data);
  weather = data; 
}
function draw() {
  background(0,0,100);
  colorMode(HSB);
  if (weather) {
    var h = map(weather.main.temp,-15,35,0,360);
    fill(0,100,0);
    textSize(22);
    text("Humidity: " +weather.main.humidity+"%",300,30);
    fill(0,100,0);
    textSize(22);
    text("Temperature: " +weather.main.temp+"ºC",40,30);
    if (weather.main.temp<15) {
    fill(h,100,100);
    ellipse(200,150,200,200);
    fill(h,100,100);
    arc(160,115,50,50,0,PI);
    fill(h,100,100);
    arc(240,115,50,50,0,PI);
    fill(h,100,100);
    arc(200,200,75,75,PI,0);
  } else {
    fill(h,100,100);
    ellipse(200,150,200,200);
    ellipseMode(RADIUS);
    fill(0,0,100);
    ellipse(160,125,25,25);
    ellipseMode(CENTER);
    fill(0,100,0);
    ellipse(160,125,25,25);
    ellipseMode(RADIUS);
    fill(0,0,100);
    ellipse(240,125,25,25);
    ellipseMode(CENTER);
    fill(0,100,0);
    ellipse(240,125,25,25);
    fill(325,45,100);
    arc(200,175,100,100,0,PI, CHORD); 
  } 
  }
}