var preImages = new Array();
var sourcePath = 'img/';

function preloading(images){
  for(var i = 0; i < images.length; i++){
    preImages[i] = new Image();
    preImages[i].src = sourcePath + images[i];
  }
}

preloading(new Array('howitworksrollover.png', 'inforollover.png', 'directoryrollover.png','hotdealrollover.png', 'saledealrollover.png', 'facebookrollover.png', 'twitterrollover.png','liburan-seru-rollover.png'));

function isIE() {
  return /msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent);
}

var light1Interval;
var light2Interval;

var gedungWidth = window.screen.width;
var gedungHeight = 120;

var light1s = new Array( );
var l1PosArr = new Array();

var light2s = new Array( );
var l2PosArr = new Array();

var lamp1;
var lamp2;
var lamp1Interval;
var lamp2Interval;

window.onload = function(){
  for(var i = 0; i < 6; i++){
    l1PosArr.push([Math.floor(Math.random() * gedungWidth), Math.floor(Math.random() * gedungHeight)])
  }
  for(var j = 0; j < 12; j++){
    l2PosArr.push([Math.floor(Math.random() * gedungWidth), Math.floor(Math.random() * gedungHeight)])
  }
  generateLight1();
  generateLight2();
  light1Interval = setInterval("animateLight1()", 200);
  light2Interval = setInterval("animateLight2()", 200);

  lamp1 = document.getElementById('lamp1');
  lamp2 = document.getElementById('lamp2');
  
  //link1
  document.getElementById('link1').onmouseover = function(){
    lamp1.style.opacity = 0;
    lamp1.style.filter = 'alpha(opacity = 0)';
    if(!isIE()){ lamp1.style.display = 'inherit'; }
    lamp1Interval = setInterval('lamp1Show()', 100);
  }
  
  document.getElementById('link1').onmouseout = function(){
    clearInterval(lamp1Interval);
    lamp1.style.opacity = 0;
    lamp1.style.filter = 'alpha(opacity = 0)';
  }

  //link2
  document.getElementById('link2').onmouseover = function(){
    lamp2.style.opacity = 0;
    lamp2.style.filter = 'alpha(opacity = 0)';
    if(!isIE()){ lamp2.style.display = 'inherit'; }
    lamp2Interval = setInterval('lamp2Show()', 100);
  }
  document.getElementById('link2').onmouseout = function(){
    clearInterval(lamp2Interval);
    lamp2.style.opacity = 0;
    lamp2.style.filter = 'alpha(opacity = 0)';
  }

  //link3
  var link3 = document.getElementById('link3');
  link3.getElementsByTagName('img')[0].onmouseover = function(){
    this.src = preImages[0].src;
  }
  link3.getElementsByTagName('img')[1].onmouseover = function(){
    this.src = preImages[1].src;
  }
  link3.getElementsByTagName('img')[2].onmouseover = function(){
    this.src = preImages[2].src;
  }
  link3.getElementsByTagName('img')[3].onmouseover = function(){
    this.src = preImages[3].src;
  }
  link3.getElementsByTagName('img')[4].onmouseover = function(){
    this.src = preImages[4].src;
  }
   link3.getElementsByTagName('img')[5].onmouseover = function(){
    this.src = preImages[5].src;
  }
  link3.getElementsByTagName('img')[6].onmouseover = function(){
    this.src = preImages[6].src;
  }
    link3.getElementsByTagName('img')[7].onmouseover = function(){
    this.src = preImages[7].src;
  }

   link3.getElementsByTagName('img')[0].onmouseout = function(){
    this.src = 'img/howitworksnormal.png';
  }
  link3.getElementsByTagName('img')[1].onmouseout = function(){
    this.src = 'img/infonormal.png';
  }
  link3.getElementsByTagName('img')[2].onmouseout = function(){
    this.src = 'img/directorynormal.png';
  }
  link3.getElementsByTagName('img')[3].onmouseout = function(){
    this.src = 'img/hotdealnormal.png';
  }
  link3.getElementsByTagName('img')[4].onmouseout = function(){
    this.src = 'img/saledealnormal.png';
  }
  link3.getElementsByTagName('img')[5].onmouseout = function(){
    this.src = 'img/facebooknormal.png';
  }
  link3.getElementsByTagName('img')[6].onmouseout = function(){
    this.src = 'img/twitternormal.png';
  }
link3.getElementsByTagName('img')[7].onmouseout = function(){
    this.src = 'img/liburan-seru.png';
  }
 
}

function lamp1Show(){
  var opacity = parseFloat(lamp1.style.opacity);
  opacity += 0.1;

  if(parseInt(opacity) < 1){
    lamp1.style.opacity = opacity;
    lamp1.style.filter = 'alpha(opacity = ' + parseInt(opacity * 100) + ')';
  }
  else{
    clearInterval(lamp1Interval);
  }
}

function lamp2Show(){
  var opacity = parseFloat(lamp2.style.opacity);
  opacity += 0.1;

  if(parseInt(opacity) < 1){
    lamp2.style.opacity = opacity;
    lamp2.style.filter = 'alpha(opacity = ' + parseInt(opacity * 100) + ')';
  }
  else{
    clearInterval(lamp2Interval);
  }
}


function Light1(x, y){
  this.elm = document.createElement('div');
  this.elm.className = 'light1';
  this.elm.style.left = x + 'px';
  this.elm.style.bottom = y + 'px';
  this.elm.style.width = 80 + 'px';
  this.elm.style.height = 80 + 'px';
  this.elm.style.opacity = 1;
  this.elm.style.filter = 'alpha(opacity = 60)';
  this.elm.style.zoom = 1;
  this.elm.opacityPoint = Math.floor(Math.random() * 10);
  this.elm.style.background = 'url(img/light1.png) no-repeat';
  this.elm.style.position = 'absolute';
  this.elm.fadeOut = true;
  this.elm.finishing = false;
}

function Light2(x, y){
  this.elm = document.createElement('div');
  this.elm.className = 'light2';
  this.elm.style.left = x + 'px';
  this.elm.style.bottom = y + 'px';
  this.elm.style.width = 60 + 'px';
  this.elm.style.height = 34 + 'px';
  this.elm.style.opacity = 1;
  this.elm.style.filter = 'alpha(opacity = 60)';
  this.elm.style.zoom = 1;
  this.elm.opacityPoint = Math.floor(Math.random() * 10);
  this.elm.style.background = 'url(img/light2.png) no-repeat';
  this.elm.style.position = 'absolute';
  this.elm.fadeOut = true;
  this.elm.finishing = false;
}

function generateLight1(){
  for(var i = 0; i < l1PosArr.length; i++){
    var light1 = new Light1(l1PosArr[i][0], l1PosArr[i][1]);
    light1 = light1.elm;
    document.getElementById('gedungWrapper').appendChild(light1);
    light1s.push(light1);
  }
}

function generateLight2(){
  for(var i = 0; i < l2PosArr.length; i++){
    var light2 = new Light2(l2PosArr[i][0], l2PosArr[i][1]);
    light2 = light2.elm;
    document.getElementById('gedungWrapper').appendChild(light2);
    light2s.push(light2);
  }
}

function animateLight1(){
  for(var i = 0; i < light1s.length; i++){
    var opacityPoint = light1s[i].opacityPoint;
    
    if(opacityPoint < 0){
      light1s[i].fadeOut = false;
      if(light1s[i].finishing == true) {
        var newlight = new Light1(Math.floor(Math.random() * gedungWidth), Math.floor(Math.random() * gedungHeight));
        document.getElementById('gedungWrapper').replaceChild(newlight.elm, light1s[i]);
        light1s.splice(i, 1, newlight.elm);
        continue;
      }
    }
    else if(opacityPoint > 10){
      light1s[i].fadeOut = true;
      light1s[i].finishing = true;
    }

    if(isIE() && opacityPoint > 6){
      light1s[i].fadeOut = true;
      light1s[i].finishing = true;
    }

    if(light1s[i].fadeOut == true){
      opacityPoint -= 1;
    }
    else{
      opacityPoint += 1 ;
    }
    
    light1s[i].opacityPoint = opacityPoint;
    light1s[i].style.opacity = opacityPoint / 10;
    light1s[i].style.filter = 'alpha(opacity = ' + opacityPoint * 10 + ')';
  }
}

function animateLight2(){
  for(var i = 0; i < light2s.length; i++){
    var opacityPoint = light2s[i].opacityPoint;

    if(opacityPoint < 0){
      light2s[i].fadeOut = false;
      if(light2s[i].finishing == true) {
        var newlight = new Light2(Math.floor(Math.random() * gedungWidth), Math.floor(Math.random() * gedungHeight));
        document.getElementById('gedungWrapper').replaceChild(newlight.elm, light2s[i]);
        light2s.splice(i, 1, newlight.elm);
        continue;
      }
    }
    else if(opacityPoint > 10){
      light2s[i].fadeOut = true;
      light2s[i].finishing = true;
    }

    if(isIE() && opacityPoint > 6){
      light2s[i].fadeOut = true;
      light2s[i].finishing = true;
    }

    if(light2s[i].fadeOut == true){
      opacityPoint -= 1;
    }
    else{
      opacityPoint += 1 ;
    }

    light2s[i].opacityPoint = opacityPoint;
    light2s[i].style.opacity = opacityPoint / 10;
    light2s[i].style.filter = 'alpha(opacity = ' + opacityPoint * 10 + ')';
  }
}