﻿//HOME ---------------------------
var L_HHE = 383; //Home Height Expanded
var L_HBE = -110; //Home Bottom Expanded
var L_HDT = 300; //Home Duration Time
var L_HHC = 163; //Home Height Collapsed
var L_HCT = 150; //Home Collapsed Time
//PRODUCT ------------------------
var L_PDT = 300; //Product Duration Time
var L_PCT = 150; //Product Collapsed Time
var L_PFT = 150; //Product Fade Time
//MATERIAL
var StartMatPos = 120; //Posizione di partenza materiali
var MaterialOnOpen = false; //Dichiara il processo di apertura dei materiali (True durante l'animazione)

$(document).ready(function() {

    var config = {
        over: makeTall01h, // function = onMouseOver callback (REQUIRED)    
        timeout: 10, // number = milliseconds delay before onMouseOut    
        out: makeShort01h // function = onMouseOut callback (REQUIRED)    
    };

    $("#Square_01_h").hoverIntent(config);
    config.over = makeTall02h;
    config.out = makeShort02h;
    $("#Square_02_h").hoverIntent(config);
    config.over = makeTall03h;
    config.out = makeShort03h;
    $("#Square_03_h").hoverIntent(config);
    config.over = makeTall04h;
    config.out = makeShort04h;
    $("#Square_04_h").hoverIntent(config);

    //PRODOTTI
    config.over = makeTall01;
    config.out = makeShort01;
    $("#Square_01").hoverIntent(config);
    config.over = makeTall02;
    config.out = makeShort02;
    $("#Square_02").hoverIntent(config);
    config.over = makeTall03;
    config.out = makeShort03;
    $("#Square_03").hoverIntent(config);
    config.over = makeTall04;
    config.out = makeShort04;
    $("#Square_04").hoverIntent(config);
    config.over = makeTall05;
    config.out = makeShort05;
    $("#Square_05").hoverIntent(config);
    config.over = makeTall06;
    config.out = makeShort06;
    $("#Square_06").hoverIntent(config);
    config.over = makeTall07;
    config.out = makeShort07;
    $("#Square_07").hoverIntent(config);
    config.over = makeTall08;
    config.out = makeShort08;
    $("#Square_08").hoverIntent(config);
    config.over = makeTall09;
    config.out = makeShort09;
    $("#Square_09").hoverIntent(config);

    // MATERIALI //
    $("div#MaterialRowButton").click(function() {
        GeneralMatClick();
    });
    $("div#MaterialRowText").click(function() {
        GeneralMatClick();
    });
    $("div#MaterialSlide").click(function() {
        GeneralMatClick();
    });

    $("div#MaterialSlide").height(StartMatPos);

    //AL REZIZE
    $(window).resize(function() {
        AdjustOpenMaterial()//Riposiziona l'apertura materiali
    });
});

function ShowMatText() {
    $("div#MatTextBox").css("opacity", 0.0);
    $("div#MatTextBox").css("display", "inline");
    $("div#MatTextBox").animate({ opacity: 1.0 }, 150, "easeInCubic");
    MaterialOnOpen = false;
};

function GeneralMatClick() {
    if (MaterialOnOpen == true) { return } //Se durante l'animazione riclicco
    MaterialOnOpen = true;
    if ($("div#MaterialSlide").height() > StartMatPos) {
        $("div#MaterialSlide").animate({ height: StartMatPos }, { "duration": 800, "easing": "easeOutCubic" });
        $("div.InfinitySquare").animate({ 'margin-top': -55 }, { "duration": 800, "easing": "easeOutCubic" });
        $("div#Product_TopLine").animate({ 'margin-top': 0 }, { "duration": 800, "easing": "easeOutCubic" });
        $("div#MatTextBox").css("display", "none");
        MaterialOnOpen = false;
    } else {
        var h = $("div#ContentsMenu").height() - 50;
        var L_TxtH = $("div#MatTextBox").height();
        var L_To = 523; //Altezza immagini + riflesso
        if (h < L_To + L_TxtH) {
            L_To = h - L_TxtH;
        };
        $("div#MaterialSlide").animate({ height: L_To }, { "duration": 800, "easing": "easeOutCubic" });
        $("div.InfinitySquare").animate({ 'margin-top': L_To + L_TxtH }, { "duration": 800, "easing": "easeOutCubic" });
        $("div#Product_TopLine").animate({ 'margin-top': L_To + L_TxtH }, { "duration": 800, "easing": "easeOutCubic" });
        $("div#MatTextBox").css("top", L_To + 135); //Sommo header
        setTimeout(ShowMatText, 800);
    };
};

//Se materiali aperti e ridimensiono la pagina vado a riposizionarli
function AdjustOpenMaterial() {
    if ($("div#MaterialSlide").height() > StartMatPos) {//Solo se è in stato aperto
        var h = $("div#ContentsMenu").height() - 50;
        var L_TxtH = $("div#MatTextBox").height();
        var L_To = 523; //Altezza immagini + riflesso
        if (h < L_To + L_TxtH) {
            L_To = h - L_TxtH;
        };
        $("div#MaterialSlide").css('height', L_To);
        $("div.InfinitySquare").css('margin-top',L_To + L_TxtH);
        $("div#Product_TopLine").css('margin-top',L_To + L_TxtH);
        $("div#MatTextBox").css("top", L_To + 135); //Sommo header
    }
}

//-------------------------------------
function makeTall01h() {
    $("div#Square_01_h").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_01_h_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort01h() {
    $("div#Square_01_h").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_01_h_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall02h() {
    $("div#Square_02_h").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_02_h_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort02h() {
    $("div#Square_02_h").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_02_h_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall03h() {
    $("div#Square_03_h").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_03_h_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort03h() {
    $("div#Square_03_h").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_03_h_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall04h() {
    $("div#Square_04_h").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_04_h_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort04h() {
    $("div#Square_04_h").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_04_h_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};

function makeTall01() {
    $("div#Square_01").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_01_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort01() {
    $("div#Square_01").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_01_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall02() {
    $("div#Square_02").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_02_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort02() {
    $("div#Square_02").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_02_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall03() {
    $("div#Square_03").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_03_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort03() {
    $("div#Square_03").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_03_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall04() {
    $("div#Square_04").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_04_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort04() {
    $("div#Square_04").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_04_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall05() {
    $("div#Square_05").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_05_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort05() {
    $("div#Square_05").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_05_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};function makeTall06() {
    $("div#Square_06").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_06_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
};function makeShort06() {
    $("div#Square_06").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_06_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
}; function makeTall07() {
    $("div#Square_07").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_07_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
}; function makeShort07() {
    $("div#Square_07").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_07_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
}; function makeTall08() {
    $("div#Square_08").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_08_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
}; function makeShort08() {
    $("div#Square_08").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_08_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
}; function makeTall09() {
    $("div#Square_09").animate({ height: L_HHE, bottom: L_HBE }, { "duration": L_HDT, "easing": "easeOutCubic" });
    $("div#Square_09_On").animate({ opacity: 1.0 }, 150, "easeInCubic");
}; function makeShort09() {
    $("div#Square_09").animate({ height: L_HHC, bottom: 0 }, L_HCT, "easeInCubic");
    setTimeout(function() { $("div#Square_09_On").animate({ opacity: 0.0 }, L_HCT, "easeOutCubic"), 150 });
};




