var delay = 50;
var rain_speed = 4;
var rain_amount = 20;
var rain_length = 40;
var rain_width = 1;
var rain_angle = 7;

var big_sun = 40;
var small_sun = 30;
var hot_pulse = 1.5;

var raining = false;
var hot = false;

function addSlider( type, left, top, speed ) {
  speed = delay*speed/1000;

  // object attributes
  objectID = type + ($("#sky").children().length + 1);
 
  // add dom node
  $("#sky").append("<div class='"+type+" slider' id='"+objectID+"' style='left:"+left+"%; top:"+top+"%;'></div>");
  var o = $("#"+objectID);
  // set up animation
  o[0].setAttribute("speed", speed);
}

function animation_loop() 
{
  $(".slider").each( function(i,o) {
    oj = $(o);
    left = oj.css("left")
    speed = Number(o.getAttribute("speed"));
    left = Number(left.substr(0,left.length-1)) + speed;
    if (left < -10) {
      left = 110;
    }
    if (left > 110)
    {
      left = -10;
    }
    oj.css("left", left+"%");
  });

  sun = $("#sun");
  s0 = sun[0];
  if (hot == true && sun.length > 0) {
    size = Number(s0.getAttribute("size"));
    if (s0.getAttribute("growing") == "1")    
    {
      size = size + hot_pulse;
      if (size >= big_sun) {
        s0.setAttribute("growing", "0");
      }
    } else {
      size = size - hot_pulse;
      if (size <= small_sun) {
        s0.setAttribute("growing", "1");
      }
    }
    setSunSize(sun,size);
  }

  if (raining == false) {
    //remove all rain
    $(".rain").remove();
  } else {
    for (i=0;i<rain_speed;i++)
      addRain();
    //if there are more than the right number of rains delete as many as we added
    rains = $(".rain")
    if (rains.length > rain_amount) 
    {
      rains.slice(0,rains.length - rain_amount).remove();
    }
  }
}

function addCloud( speed )
{
  x = Math.random() * 120 - 10;
  y = Math.random() * 100;
  addSlider( "cloud", x, y, speed );
}

function addRain()
{
  x = Math.random() * 100;
  y = Math.random() * 100;
  a = rain_angle + "deg";
  angle = "transform:rotate("+a+");"+
          "-ms-transform:rotate("+a+");"+ /* IE 9 */
          "-moz-transform:rotate("+a+");"+ /* Firefox */
          "-webkit-transform:rotate("+a+");"+ /* Safari and Chrome */
          "-o-transform:rotate("+a+");";  /* Opera */
  $("#sky").append("<div class='rain' style='left:"+x+"%; top:"+y+"%; height:"+rain_length+"%; margin-top:"+(0-rain_length)/2+"%; width:"+rain_width+"px; "+angle+"'></div>");
}

function stopRain() {
  raining = false;
}
function startRain() {
  raining = true;
}

function setRain(s, am, l, w, an)
{
  rain_speed = s;
  rain_amount = am;
  rain_length = l;
  rain_width = w;
  rain_angle = an;
}

function addSun( x, y ) {
  sun = $("#sun");
  if (sun.length == 0)
  {
    $("#sky").append("<div class='sun' id='sun' style='left:"+x+"%; top:"+y+"%;'></div>");  
    sun = $("#sun");
  }
  sun.css("left", x+"%");
  sun.css("top", y+"%");
  sun[0].setAttribute("growing", "1");
  setSunSize(sun,small_sun);
}

function setSunSize(sun,size)
{
  sun[0].setAttribute("size", size);
  sun.css("width", size+"%");
  sun.css("height", size+"%");
  sun.css("margin-top", -size/2+"%");
  sun.css("margin-left", -size/2+"%");
}

function clearAll()
{
  $(".cloud").remove();
  $("#sun").remove();
  stopRain();
  hot=false;
}

function addNoonSun() 
{
  addSun(50, 20); 
}

function setConditions(c)
{
  $("#conditions").html("<p>" + c + "</p>");
}
setInterval(animation_loop, delay);