var adDiv;

var container = document.getElementById('container') 
//var icon_1 = document.getElementById('icon_1');
//var icon_2 = document.getElementById('icon_2');
//var icon_3 = document.getElementById('icon_3');
//var icon_4 = document.getElementById('icon_4');
//var icon_5 = document.getElementById('icon_5');
//var icon_6 = document.getElementById('icon_6');
//var icon_7 = document.getElementById('icon_7');

var bg = document.getElementById('bgDiv');
var chatArea = document.getElementById('chatArea');
var loadingAnimation = document.getElementById('loadingAnimation');
var whiteDot1 = document.getElementById('whiteDot1');
var whiteDot2 = document.getElementById('whiteDot2');
var whiteDot3 = document.getElementById('whiteDot3');

var text_1 = document.getElementById('text_1');
var text1_BG = document.querySelector('#text1_BG');
var text1_img = document.querySelector('#text1_img');
var text1Area = document.getElementById('text1Area');

var text_2 = document.getElementById('text_2');
var text2_BG = document.getElementById('text2_BG');
var text2_img = document.querySelector('#text2_img');
var text2Area = document.getElementById('text2Area');

var text_3 = document.getElementById('text_3');
var text3_BG = document.getElementById('text3_BG');
var text3_img = document.querySelector('#text3_img');
var text3Area = document.getElementById('text3Area');

var text2 = document.getElementById('text2');
var text3 = document.getElementById('text3');

var blueBG = document.getElementById('blueBG');

var blue = document.getElementById('blue');




var icon2 = document.getElementById('icon2');
var iconAnimation = document.getElementById('iconAnimation');

var blueDot1 = document.getElementById('blueDot1');
var blueDot2 = document.getElementById('blueDot2');
var blueDot3 = document.getElementById('blueDot3');



/*
var donald = document.getElementById('donald');
var sora = document.getElementById('sora');
var goofy = document.getElementById('goofy');

//var sparkle = document.getElementById('sparkle');
var circleBg = document.getElementById('circleBg');

var heart = document.getElementById('heart');
var I = document.getElementById('I');
var II = document.getElementById('II');
var III = document.getElementById('III');
var kh = document.getElementById('kh');
var ray = document.getElementById('ray');
var crown = document.getElementById('crown');
var disney = document.getElementById('disney');
*/

var tl = new TimelineMax(); 
var tl2 = new TimelineMax(); 
var tl3 = new TimelineMax();

var icon_tl = new TimelineMax(); 
var icon_tl2 = new TimelineMax(); 
var icon_tl3 = new TimelineMax();


//Function to run with any animations starting on load, or bringing in images etc
function init(){

    ///Reset image locations and then play animation
    resetimages();
    
    //loadingAnim();
    document.getElementsByClassName("bannerClick")[0].addEventListener("click", exit);   
    
}
//  CUSTOM


function loadingAnim() { 
 
    tl.fromTo(whiteDot1, .4, {y:0},{y:-5, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.1,  repeatDelay:0.01})
    tl2.fromTo(whiteDot2, .4, {y:0},{y:-5, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.2, repeatDelay:0.03})
    tl3.fromTo(whiteDot3, .4, {y:0},{y:-5, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.3, repeatDelay:0.05})
    
}

function loadingReset() { 
    TweenMax.to(loadingAnimation, 0, {alpha:1});
    tl.restart();
    tl2.restart();
    tl3.restart();
    
}

function loadingStop() { 
    TweenMax.to(loadingAnimation, 0, {alpha:0});
    tl.stop();
    tl2.stop();
    tl3.stop();
    
}



function iconAnim() { 
    icon_tl.fromTo(blueDot1, .4, {y:0},{y:-7, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.1,  repeatDelay:0.01})
    icon_tl2.fromTo(blueDot2, .4, {y:0},{y:-7, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.2, repeatDelay:0.03})
    icon_tl3.fromTo(blueDot3, .4, {y:0},{y:-7, repeat:9, yoyo:true, ease: Power1.easeInOut, delay:.3, repeatDelay:0.05})
}

function icon_Stop() { 
    icon_tl.stop();
    icon_tl2.stop();
    icon_tl3.stop();
}





function allAnimations() { 
    
 
    
    
    
    TweenMax.to(chatArea, 9, {y:90,  ease: Power1.easeInOut, delay:1.8});
    TweenMax.to(chatArea, .8, {alpha:1, ease: Expo.easeOut, delay:0.8,onComplete:loadingAnim});
    
    var tl = new TimelineMax({repeat:0, yoyo:false, repeatDelay:1.8, overwrite: true})
        tl.to(text1_img, 9, {y:167, ease: Power1.easeInOut},"+=1.8")
        .to(text1_img, .5, {y:"+=35px", ease: Power1.easeOut, overwrite: false}, "-=2")
        //.fromTo(text1_img, tl.duration() - tl.time(), {y:text1_img.y}, {y:167},"-=3");
   
    var tl2 = new TimelineMax({repeat:0, yoyo:false, repeatDelay:0, overwrite: true})
        tl2.to(text2_img, 8.2, {y:167, ease: Power1.easeInOut},"+=1.8")
        .to(text2_img, .5, {y:"+=17px", ease: Power1.easeInOut, overwrite: false}, "-=4")
    
    var tl3 = new TimelineMax({repeat:0, yoyo:false, repeatDelay:3.6, overwrite: true})
        tl3.to(text3_img, 7, {y:110, ease: Power1.easeInOut},"+=1.8")
        .to(text3_img, .5, {y:"+=17px", ease: Power1.easeInOut, overwrite: false}, "-=4")
    
    //TweenMax.to(text1_img, 9, {y:"+=140", ease: Power1.easeInOut, delay:1.8});
    //TweenMax.to(text1_img, .5, {y:"+=100", ease: Elastic.easeOut.config(1, 0.5), delay:5});
   
    TweenMax.to(loadingAnimation, .5, {alpha:1, ease: Sine.easeOut, delay:1.8});
    TweenMax.to(loadingAnimation, .5, {y:0, scale:1, ease: Elastic.easeOut.config(1, 0.3), delay:1.8});
    
    TweenMax.to(text1_BG, .5, {alpha:1, scaleX:1, ease: Expo.easeOut, delay:3.6});
    TweenMax.to(text_1, .5, {alpha:1, ease: Expo.easeOut, delay:3.7,onComplete:loadingStop});
     
    TweenMax.to(loadingAnimation, 0, {y:10, scale:0, delay:3.6});
    TweenMax.to(loadingAnimation, .5, {y:0, scale:1, ease: Elastic.easeOut.config(1, 0.5), delay:5});
    TweenMax.to(text1Area, .5, {y:-35, ease: Elastic.easeOut.config(1, 0.5), delay:5});
    //TweenMax.to(text1_img, .5, {y:text1_img.y+100, ease: Elastic.easeOut.config(1, 0.5), delay:5});
    
    TweenMax.to(text_1, .5, {alpha:1, ease: Back.easeOut, delay:4.5, onComplete:loadingReset });
    
    
    TweenMax.to(text2_BG, .5, {alpha:1, scaleX:1, ease: Expo.easeOut, delay:7});
    TweenMax.to(text_2, .5, {alpha:1, ease: Expo.easeOut, delay:7.1, onComplete:loadingStop});
    
    TweenMax.to(loadingAnimation, 0, {y:10, scale:0, delay:7.8});
    TweenMax.to(loadingAnimation, .5, {y:0, scale:1, ease: Elastic.easeOut.config(1, 0.5), delay:8});
    TweenMax.to(text1Area, .7, {y:-35, alpha:0, ease: Power2.easeOut, delay:8});
    TweenMax.to(text2Area, .5, {y:-35, ease: Elastic.easeOut.config(1, 0.5), delay:8});
    TweenMax.to(text2_BG, 0, {scaleY:-1, delay:8});
    
    TweenMax.to(text_1, .5, {alpha:1, ease: Back.easeOut, delay:7.5, onComplete:loadingReset });
    
    TweenMax.to(text3_BG, .5, {alpha:1, scaleX:1, ease: Expo.easeOut, delay:10});
    TweenMax.to(text_3, .5, {alpha:1, ease: Expo.easeOut, delay:10.2,onComplete:loadingStop});
    
    
    
    
    
}

function exit() {
	console.log("Exit")
	
	window.open(window.clickTag);
}

function resetimages(){
    

    
    TweenMax.to(chatArea, 0, {y:225,});
    
    TweenMax.to(blue, 0, {scaleX:0});
    
    TweenMax.to(loadingAnimation, 0, {alpha:0, y:20, scale:.6});
    
    TweenMax.to(iconAnimation, 0, {alpha:1, x:100, scale:0});
    
    
    TweenMax.to([whiteDot1,whiteDot2,whiteDot3], 0, {y:0});
    TweenMax.to([blueDot1,blueDot2,blueDot3], 0, {y:0});
    
    
    
    
    TweenMax.to(text_1, 0, {alpha:0, x:0});
    TweenMax.to(text1_BG, 0, {alpha:0, scaleX:0});
    TweenMax.to(text1Area, 0, {alpha:1});
    
    TweenMax.to(text_2, 0, {alpha:0, x:0});
    TweenMax.to(text2_BG, 0, {alpha:0, scaleX:0});
    TweenMax.to(text2Area, 0, {alpha:1});
    
    TweenMax.to(text_3, 0, {alpha:0, x:0});
    TweenMax.to(text3_BG, 0, {alpha:0, scaleX:0});
    TweenMax.to(text3Area, 0, {alpha:1});
    allAnimations();

}