/**
 * Created by Pascal on 02/11/17.
 */

// Define parameters
var mouseX = null;
var mouseY = null;
var windowWidth = null;
var windowHeight = null;

// Add event listeners
document.addEventListener('mousemove', onMouseUpdate, false);
window.addEventListener('resize', updateWindow, false);

// Define mapping method to number
Number.prototype.map = function (in_min, in_max, out_min, out_max) {
    return (this - in_min) * (out_max - out_min) / (in_max - in_min) + out_min;
};

updateWindow();

// Update windows parameters
function updateWindow() {
    windowHeight = window.innerHeight;
    windowWidth = window.innerWidth;
    //console.log(windowWidth + ' x ' + windowHeight);
}

// Animation on mouse position (when view is larger then mobile)
function onMouseUpdate(e) {

    var homeOurWork = document.querySelector('.home .our-work figure');
    var homeOurStudio = document.querySelector('.home .our-studio figure');

    var homeRocket = document.querySelector('#rocket.allowMouseAnimation .rocket-placeholder');
    var homePigeon = document.querySelector('#rocket.allowMouseAnimation .pigeon');
    var homePigeons1 = document.querySelector('#rocket.allowMouseAnimation .pigeons-1');
    var homePigeons2 = document.querySelector('#rocket.allowMouseAnimation .pigeons-2');
    var homeClouds = document.querySelector('#rocket.allowMouseAnimation .cloud');
    var homeShape = document.querySelector('#rocket.allowMouseAnimation #shape');
    var homeText = document.querySelector('#rocket.allowMouseAnimation .text');

    if (windowWidth > 900 && windowHeight > 700 && homeOurWork && homeOurStudio && homeRocket && homePigeon && homePigeons1 && homePigeons2 && homeClouds && homeShape && homeText) {

        mouseX = e.pageX;
        mouseY = e.pageY;
        var mouseXPercentage = mouseX / windowWidth;
        var mouseYPercentage = mouseY / windowHeight;

        var homeBlockMovement = 20;
        var rocketMovement = 30;
        var pigeonMovement = 20;
        var pigeonsMovement = 15;
        var cloudMovement = 40;

        homeOurWork.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, -homeBlockMovement, homeBlockMovement) + 'px,' + mouseYPercentage.map(0, 1, -homeBlockMovement, homeBlockMovement) + 'px, 0)';
        homeOurStudio.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, homeBlockMovement, -homeBlockMovement) + 'px,' + mouseYPercentage.map(0, 1, homeBlockMovement, -homeBlockMovement) + 'px, 0)';


        homeRocket.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, rocketMovement, -rocketMovement) + 'px,' + mouseYPercentage.map(0, 1, rocketMovement, -rocketMovement) + 'px, 0)';

        homePigeon.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, -pigeonMovement, pigeonMovement) + 'px,' + mouseYPercentage.map(0, 1, -pigeonMovement, 1.5 * pigeonMovement) + 'px, 0)';
        homePigeons1.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, pigeonsMovement, -pigeonsMovement) + 'px,' + mouseYPercentage.map(0, 1, -pigeonsMovement, -2 * pigeonsMovement) + 'px, 0)';
        homePigeons2.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, -pigeonsMovement, pigeonsMovement) + 'px,' + mouseYPercentage.map(0, 1, -pigeonsMovement, pigeonsMovement) + 'px, 0)';

        homeClouds.style.transform = 'translate3d(' + mouseXPercentage.map(0, 1, -cloudMovement, cloudMovement) + 'px, 0, 0)';
        homeShape.style.transform = 'rotate(' + mouseXPercentage.map(0, 1, -2, 2) + 'deg)';
        homeText.style.transform = 'scale3d(' + mouseYPercentage.map(0, 1, 0.98, 1.02) + ',' + mouseYPercentage.map(0, 1, 0.98, 1.02) + ',1)';
    }
}

setTimeout(function () {
    $('#rocket').addClass('allowMouseAnimation');
    $('.home .video').addClass('allowMouseAnimation').removeClass('preFlight');
}, 1000);