$(document).ready(function(){
 //    var w = screen.width,
 //        h = screen.height;
 //    alert(w + 'x' + h + '('+$(window).width()+'x'+$(window).height()+')')
 //
 // // alert($(window).width()+'x'+$(window).height())


    startPreloader()
    function startPreloader() {
        $('body').append('<div id="preload_"></div>').attr('id', 'no-scroll')

    }
    window.onload = function () {
        $('body, html').animate({scrollTop: 0}, 1)
        resetPreloader()
        setTimeout(function () {
            // if(windowHeight>1199) {
            //     $('body').attr('id', '')
            // } else {
            //
            // }
            if (device.desktop()){

            } else {
                $('body').attr('id', '');
            }



        },1600)

    }



    function resetPreloader() {
        $('#preload_').addClass('hide_')
        setTimeout(function () {
            $('#preload_').addClass('hide_up_')
        }, 910)
        setTimeout(function () {
            $('#preload_').remove()
        }, 1410)
    }








//глобалные перемнные
    var sections = $('.sections')
    var sectLength = sections.length

    var windowHeight = $(window).height()
    var windowWidth = $(window).width()


    var timeDelay = 800;
    var easy_name = 'easeOutExpo'
    var modelcolor


    function separatorColorAdd() {
        $('.menu-line').addClass('black')
    }
    function separatorColorRemove() {
        $('.menu-line').removeClass('black')
    }

    var logoImg = $('.logo')
    var logoImgWhite = logoImg.attr('src')
    var logoImgRed = logoImg.attr('data-red')
    function logoBlueAdd() {
        logoImg.attr('src',logoImgRed)
    }
    function logoBlueRemove() {
        logoImg.attr('src',logoImgWhite)
    }

//end глобалные перемнные
    imgBgWidth()



    $(window).resize(function () {
        windowHeight = $(window).height()
        windowWidth = $(window).width()
        sectionsWidth()
        imgBgWidth()
    })

    sectionsWidth()
    function sectionsWidth() {
        sections.each(function () {
            $(this).css({width:windowWidth})
        })
    }



    var menuWrapper = $('.menu_wrapper')
    function hideMenu() {
        menuWrapper.addClass('hide_menu').removeClass('open-menu')
    }
    function addMenu() {
        menuWrapper.removeClass('hide_menu')
    }
    $('.menu_wrapper').on('click',function () {
        $(this).addClass('hide_menu')

    })
    $('.menu-line').on('click',function () {
        $('.menu_wrapper').addClass('open-menu')
    })

    function imgBgWidth() {


    }

    onLoad()
    function onLoad() {
        // Функция для добавления обработчика событий
        function addHandler(object, event, handler) {
            if (object.addEventListener) {
                object.addEventListener(event, handler, false);
            }
            else if (object.attachEvent) {
                object.attachEvent('on' + event, handler);
            }
            // else alert("Обработчик не поддерживается");
        }

        // Добавляем обработчики для разных браузеров
        addHandler(window, 'DOMMouseScroll', wheel);
        addHandler(window, 'mousewheel', wheel);
        // addHandler(document, 'mousewheel', wheel);
        // Функция, обрабатывающая событие
        function wheel(event) {
            var delta; // Направление колёсика мыши

            event = event || window.event;
            //Opera и IE работают со свойством wheelDelta
            if (event.wheelDelta) { // В Opera и IE
                delta = event.wheelDelta / 120;
                // В Опере значение wheelDelta такое же, но с противоположным знаком
                if (window.opera) delta = -delta; // Дополнительно для Opera
            }
            else if (event.detail) { // Для Gecko
                delta = -event.detail / 3;
            }


            //Запрещаем обработку события браузером по умолчанию
             if (event.preventDefault) event.preventDefault();
             event.returnValue = false;
             //console.log(delta); // Выводим направление колёсика мыши



            statusBlok();
           function statusBlok() {

               var statusScroll = $('#statusScroll')
               var statusScrollData = statusScroll.attr('data-active');
               var datascroll = 0;


               //Arrow keys scroll update
               $(document).keydown(function(e) {
                switch(e.which) {
                    case 37: // left
                    break;

                    case 38:
                    if(statusScrollData>0) {
                        --statusScrollData
                        $('body, html').animate({scrollTop: windowHeight*statusScrollData}, timeDelay, easy_name, function () {
                            statusScroll.attr('data-scroll',0)
                        })
                        statusScrollData = statusScroll.attr('data-active', statusScrollData)
                        statusScroll.attr('data-scroll',1)
                    } // up
                    break;

                    case 39: // right
                    break;

                    case 40:
                    if(statusScrollData<sectLength-1) {
                        statusScrollData++
                        $('body, html').animate({scrollTop: windowHeight*statusScrollData}, timeDelay, easy_name, function () {
                            statusScroll.attr('data-scroll',0)
                        })
                        statusScrollData = statusScroll.attr('data-active', statusScrollData)
                        statusScroll.attr('data-scroll',1)
                    } // down
                    break;

                    default: return; // exit this handler for other keys
                }
                e.preventDefault(); // prevent the default action (scroll / move caret)
            });
            // /Arrow keys scroll update

               if(statusScroll.attr('data-scroll')==0){

                   if(delta<0) { //скролл down
                       if(statusScrollData<sectLength-1) {
                           statusScrollData++
                           $('body, html').animate({scrollTop: windowHeight*statusScrollData}, timeDelay, easy_name, function () {
                               statusScroll.attr('data-scroll',0)
                           })
                           statusScrollData = statusScroll.attr('data-active', statusScrollData)
                           statusScroll.attr('data-scroll',1)
                       }

                   } else  {  //скролл up

                       if(statusScrollData>0) {
                           --statusScrollData
                           $('body, html').animate({scrollTop: windowHeight*statusScrollData}, timeDelay, easy_name, function () {
                               statusScroll.attr('data-scroll',0)
                           })
                           statusScrollData = statusScroll.attr('data-active', statusScrollData)
                           statusScroll.attr('data-scroll',1)
                       }

                   }

                   var navCrkl = $('#navi_circle li')
                   var navCrklIndex = statusScroll.attr('data-active')

                   if(navCrklIndex>0) {
                       $('#navi_circle li').removeClass('active')
                       $(navCrkl[navCrklIndex]).addClass('active')
                       $('#navi_circle').css({opacity:1})
                       // hideMenu()
                   } else {
                       $('#navi_circle').css({opacity:0})
                       $('#navi_circle li').removeClass('active')
                       if(device.mobile() || device.tablet()){

                       } else  {
                            // addMenu()
                       }
                   }

                  var screenNum = $('#statusScroll').attr('data-active')

                   if(screenNum==0){
                       $('.menu_wrapper').removeClass('open-menu')
                       logoBlueRemove()
                       separatorColorRemove()
                   }
                   if(screenNum==1){
                       separatorColorAdd()
                       // logoBlueAdd()
                       if(($(window).width())<=1200){
                           logoBlueAdd()
                       } else  {
                           logoBlueRemove()
                       }
                   }
                   if(screenNum>1) {
                       separatorColorRemove()
                   }
                   if(screenNum==2){

                       // logoBlueAdd()
                       logoBlueRemove()
                   }
                   if(screenNum==3){

                       // separatorColorAdd()
                       logoBlueAdd()
                   }
                   if(screenNum==4){

                        // logoBlueAdd()
                       logoBlueRemove()
                   }
                   if(screenNum==5){
                       logoBlueRemove()
                   }
                   if(screenNum==6){
                       logoBlueRemove()
                   }
                   if(screenNum==7){
                       logoBlueRemove()
                   }


                   var active = $('#menu_nav li');
                   $(active).removeClass('active')
                   $(active[(screenNum-1)]).addClass('active')

               }



           }
        }

    }





    all();
    function all() {



        var height = $('.txt-1-wr').height()
        $('.txt-1-wr').css({marginTop:-(height/2)})

        for (var i = 0; i < sectLength; i++) {
            $(sections[i]).attr('data-num', i)
        }
        $('body').append('<div id="statusScroll" data-active="0" data-scroll="0" style="display: none !important;"></div><ul id="navi_circle"></ul>')
        for (var i2=0;i2<sectLength;i2++) {
            $('#navi_circle').append('<li>')
        }
        var newHeightNavi = (sectLength*(11+17)-17)+64
        $('#navi_circle').css({height:newHeightNavi, marginTop:-(newHeightNavi/2),top:'50%'})

        naviClick()
        function naviClick() {
            var statusScroll = $('#statusScroll')
            var navi = $('#navi_circle li')


            navi.click(function () {
               if(statusScroll.attr('data-scroll')==0){

                   var thisIndex = $(this).index()

                   if(thisIndex==0){
                       logoBlueRemove()
                       separatorColorRemove()
                   }
                   if(thisIndex==1){
                       separatorColorAdd()

                       if(($(window).width())<=1200){
                           logoBlueAdd()
                       } else  {
                           logoBlueRemove()
                       }
                   }
                   if(thisIndex>1){ separatorColorRemove()}
                   if(thisIndex==2){

                       logoBlueRemove()

                   }
                   if(thisIndex==3){

                       logoBlueAdd()
                   }
                   if(thisIndex>3){

                       logoBlueRemove()
                   }
                   if(thisIndex==4 || thisIndex==5){
                       separatorColorRemove()
                       logoBlueRemove()
                   }

                   if(thisIndex>0) {
                       navi.removeClass('active')
                       $(navi[thisIndex]).addClass('active')
                       // hideMenu()
                   } else  {
                       $('#navi_circle').css({opacity:0})
                       navi.removeClass('active')
                       if(device.mobile() || device.tablet()){
                           // hideMenu()
                       } else  {
                           // addMenu()
                       }
                   }

                   $('#statusScroll').attr('data-active', thisIndex)

                   var active = $('#menu_nav li');
                   $(active).removeClass('active')
                   $(active[(thisIndex-1)]).addClass('active')


                   $('body, html').animate({scrollTop: windowHeight*thisIndex}, timeDelay, easy_name, function () {
                       statusScroll.attr('data-scroll',0)
                   })


                   statusScroll.attr('data-scroll',1)


               }

           })

            $('.circle-next').click(function () {
                $('body, html').animate({scrollTop: windowHeight}, timeDelay, easy_name, function () {
                    statusScroll.attr('data-scroll',0)
                })


                $('#statusScroll').attr('data-active', 1)
                statusScroll.attr('data-scroll',1)

                $(navi[1]).addClass('active')
                $('#navi_circle').css({opacity:1})

                // hideMenu()

                if(($(window).width())<=1200){
                    logoBlueAdd()
                } else  {
                    logoBlueRemove()
                }
            })

            $('.btn_by_link ').click(function (e) {
                e.preventDefault()
                $('body, html').animate({scrollTop: windowHeight*2}, timeDelay, easy_name, function () {
                    statusScroll.attr('data-scroll',0)
                })
                $('#statusScroll').attr('data-active', 2)
                statusScroll.attr('data-scroll',2)

                $(navi[2]).addClass('active')
                $('#navi_circle').css({opacity:1})
            })

            var menuNav =  $('#menu_nav li')
            menuNav.click(function () {
                // hideMenu()

                $(menuNav).removeClass('active')
                $(this).addClass('active')

                var lastMenuOneScreen = 5 //количество последних пунктов меню которые скроляться на один экран
                if(statusScroll.attr('data-scroll')==0){

                    var indexMenuNav = $(this).index()+1
                    console.log(indexMenuNav)

                    if(indexMenuNav==0){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==1){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==2){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==3){
                        logoBlueAdd()
                    }
                    if(indexMenuNav==4){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==5){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==6){
                        logoBlueRemove()
                    }
                    if(indexMenuNav==7){
                        logoBlueRemove()
                    }


                    if(indexMenuNav<=lastMenuOneScreen+1) {
                        navi.removeClass('active')
                        $(navi[indexMenuNav]).addClass('active')
                        $('body, html').animate({scrollTop: windowHeight*indexMenuNav}, timeDelay, easy_name, function () {
                            statusScroll.attr('data-scroll',0)
                        })
                        $('#statusScroll').attr('data-active', indexMenuNav)
                        $(navi[indexMenuNav]).addClass('active')
                    } else  {
                        $('#navi_circle').css({opacity:0})
                        navi.removeClass('active')
                        $('body, html').animate({scrollTop: windowHeight*(menuNav.length-1)}, timeDelay, easy_name, function () {
                            statusScroll.attr('data-scroll',0)
                        })
                        $('#statusScroll').attr('data-active', menuNav.length-1)
                        $(navi[menuNav.length-1]).addClass('active')
                    }


                        $('#navi_circle').css({opacity:1})

                    statusScroll.attr('data-scroll',1)


                }

            })


        }

        firstScreenSlider()
        function firstScreenSlider() {
            var list1 = $('.list-1 li')
            var list1FirstAct = $('.list-1 li.active').index()
            $('.arr-txt1').html(list1FirstAct+1)
            $('.arr-txt3').html(list1.length)

            $('.arr-left').click(function () {
                clickListprev()
            })
            $('.arr-right').click(function () {
                clickListNext()
            })
            function clickListNext() {
                var activeLi = ($('.list-1 li.active').index())+1
                if (activeLi<=(list1.length-1)){
                    list1.removeClass('active')
                    $(list1[activeLi]).addClass('active')
                    $('.arr-txt1').html(activeLi+1)
                } else  {
                    list1.removeClass('active')
                    $(list1[0]).addClass('active')
                    $('.arr-txt1').html(1)
                }

            }
            function clickListprev() {
                var activeLi = ($('.list-1 li.active').index())-1
                // console.log(activeLi)
                if (activeLi>-1){
                    list1.removeClass('active')
                    $(list1[activeLi]).addClass('active')
                    $('.arr-txt1').html(activeLi+1)
                } else  {
                    list1.removeClass('active')
                    $(list1[list1.length-1]).addClass('active')
                    $('.arr-txt1').html(list1.length)

                }
            }





        }



    }


















    sliderCar()
function sliderCar() {
    //при удачной подгрузке выполнять ф-цию removeLoadIco()

    function addLoadIco() {$('.car-list').append('<div class="load_content"><div></div></div>')}
    function removeLoadIco(){$('.load_content').remove()}

    $('.models_select ul li').click(function (e) {
        e.preventDefault()
        $('.models_select ul li').removeClass('active')
        $(this).addClass('active')
        removeLoadIco()
        addLoadIco()
        var link = $(this).find('a');
        var model = link.data('model');
        var year = link.data('year');
        $('a.year-picker').data('model', model);
        var data = {
            'CarSearch[model]': model, 'CarSearch[year]': year
        };
        data = $.param(data);
        scrollDestroy();
        $('#content-1').load('/?'+data+' #content-1 ul', { 'Car[model]': link.data('model'), 'Car[year]': link.data('year') }, function() {
            removeLoadIco();
            scrollInit();
        });
    })

    $('.years_select ul li').click(function (e) {
        e.preventDefault()
        $('.years_select ul li').removeClass('active')
        $(this).addClass('active')
        removeLoadIco()
        addLoadIco()
        var link = $(this).find('a');
        var model = link.data('model');
        var year = link.data('year');
        $('a.model-picker').data('year', year);
        var data = {
            'CarSearch[model]': model, 'CarSearch[year]': year
        };
        data = $.param(data);
        scrollDestroy();
        $('#content-1').load('/?'+data+' #content-1 ul', { 'Car[model]': link.data('model'), 'Car[year]': link.data('year') }, function() {
            removeLoadIco();
            scrollInit();
        });
    })

    scrollInit();

}
function scrollInit()
{
    var amount = Math.max.apply(
        Math, $("#content-1 li").map(
            function()
            {
                return $(this).outerWidth(true);
            }
        ).get()
    );

    $("#content-1").mCustomScrollbar(
        {
            axis : "x",
            theme : "inset",
            advanced : {
                autoExpandHorizontalScroll : true
            },
            scrollButtons : {
                enable : true,
                scrollType : "stepped"
            },
            keyboard : {scrollType : "stepped"},
            snapAmount : amount,
            mouseWheel : {scrollAmount : amount}
        }
    );
}

    function scrollDestroy() {
        $('#content-1').mCustomScrollbar('destroy');
    }

     scrollBlocks()
    function scrollBlocks() {
        $(".stock-txt-bl").mCustomScrollbar({
            axis:"y",
            theme:"inset",
            advanced:{
                autoExpandHorizontalScroll:true
            },
            scrollButtons:{
                enable:true,
                scrollType:"stepped"
            },
            keyboard:{scrollType:"stepped"}
        });
    }
//после удачной отправки формы, запустить ф-цию success()
    form()
    function form() {
        $('a.btn_test_drive').click( function(event){
            event.preventDefault();

            $('#overlay').fadeIn(400,
                function(){
                    $('#modal_test_drive')
                        .css('display', 'block')
                        .animate({opacity: 1, top: '10%'}, 200);
                });

        });

$(document).on('click', 'a.btn_buy', function(event){
            event.preventDefault();

            var modelName = $('.models_select li.active a').text()
            var modelYear = $('.years_select li.active a').text()
            var expr = new RegExp('<span>.*<\/span>');
            modelcolor = $(this).parent().parent().find(".style.specifications p:first").html().replace(expr,'');

            $('._model_').empty()
            $('._model_').html(modelName)
            $('._year_').empty()
            $('._year_').html(modelYear)

            $('#overlay').fadeIn(400,
                function(){
                    $('#modal_buy')
                        .css('display', 'block')
                        .animate({opacity: 1, top: '10%'}, 200);
                });
        });

        $('a.btn-application').click( function(event){
            event.preventDefault();

            $('#overlay').fadeIn(400,
                function(){
                    $('#modal_key_on_a_key')
                        .css('display', 'block')
                        .animate({opacity: 1, top: '10%'}, 200);
                });

        });

        $('a.btn_reserved').click( function(event){
            event.preventDefault();

            $('#overlay').fadeIn(400,
                function(){
                    $('#modal_book_cars')
                        .css('display', 'block')
                        .animate({opacity: 1, top: '10%'}, 200);
                });

        });

        $('a.btn_questions').click( function(event){
            event.preventDefault();

            $('#overlay').fadeIn(400,
                function(){
                    $('#modal_questions')
                        .css('display', 'block')
                        .animate({opacity: 1, top: '10%'}, 200);
                });

        });

        $(document).on('click', '#modal_close, #overlay', function(){
            $('.modal_form').animate({opacity: 0, top: '2%'}, 200,function(){
                $(this).css('display', 'none');
                $('#overlay').fadeOut(400);
            });
            $('#success_form').animate({opacity: 0, top: '0'}, 200,function(){
                $(this).css('display', 'none');
                $(this).css({top:'50%'});
            });

        });
    }

    // success()
    function success() {
        $('#modal_form').animate({opacity: 0, top: '2%'}, 200,function(){
            $(this).css('display', 'none');
        });
        setTimeout(function () {
            $('#success_form').css('display', 'block').animate({opacity: 1}, 700);
        },400)
    }

    //

    var all_phone = $("body").find(".form-group.field-orderform-phone");
    if(all_phone.val() == '') {
        all_phone.removeClass('has-success').addClass('has-error');
    };

    $(document).on('submit', "#form_buy", function(event){
        var username = $(this).find("#orderform-username").val();
        email = $(this).find("#orderform-email").val();
        phonenum = $(this).find("#orderform-phone").val();
        model_name = $(".models_select.style .active a").html();
        model_year = $(".years_select.style .active a").html();
        model_color = modelcolor;
        action = $(this).attr('action');

        event.preventDefault();
        if($(this).find('.form-group').hasClass('has-error')){}
        else{
            $.post({
                type: 'post',
                url: action,
                data: {
                    'OrderForm[username]':username,
                    'OrderForm[email]':email,
                    'OrderForm[phone]':phonenum,
                    'OrderForm[model_name]':model_name,
                    'OrderForm[model_year]':model_year,
                    'OrderForm[model_color]':model_color,
                },
                success: function(data){
                    console.log(data);
                }
            });
            $("#modal_buy").animate({opacity: 0, top: '2%'}, 400);
            success();
            $(this)[0].reset();
        }
    });

$(document).on('submit', "#form_testdrive", function(event){
        event.preventDefault();
        var username = $(this).find("#testdriveform-username").val();
            email = $(this).find("#testdriveform-email").val();
            phonenum = $(this).find("#testdriveform-phone").val();
            action = $(this).attr('action');

        if($(this).find('.form-group').hasClass('has-error')){}
        else{
            $.post({
                type: 'post',
                url: action,
                data: {
                    'TestdriveForm[username]':username,
                    'TestdriveForm[email]':email,
                    'TestdriveForm[phone]':phonenum,
                },
                success: function(data){
                    console.log(data);
                }
            });
            $("#modal_test_drive").animate({opacity: 0, top: '2%'}, 400);
            console.log(username+email+phonenum);
            success();
            $(this)[0].reset();
        };
    });
    $("#orderform-phone").mask("+380 (999) 999-99-99");
    $("#testdriveform-phone").mask("+380 (999) 999-99-99");




    hoverMenu();
    function hoverMenu() {
        $('#menu_nav').hover(function () {

        },function () {
            $('#menuwrapper').removeClass('open-menu')
        })
    }

    heightMap()

    function heightMap() {
        var box5Height = $('.box-5').height()
        var box5Partn = $('.box-5 .container-wrapper').innerHeight()
        var box5mapMerg = $('.box-5 .maps-contacts-wr').css('marginTop')
        box5mapMerg = box5mapMerg.replace('px', '')
        box5mapMerg = +box5mapMerg
        var box5Stud = $('.box-5 .studio-copy-wr').height()
        var mapHeight = box5Height - box5Partn - box5mapMerg - box5Stud
        $('.maps-contacts-wr').css({
            height: mapHeight
        })
    }
    $(window).resize(function () {
        heightMap()
    })

    datepicker()
    function datepicker() {
        $( ".date_first input" ).datepicker({
            changeMonth: true,
            changeYear: true,
            numberOfMonths: 1,
            dateFormat: 'dd.mm.yy',
            closeText: 'Закрыть',
            prevText: 'Пред',
            nextText: 'След',
            monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
            monthNamesShort: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
            dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
            dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
            dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
        });
        $( ".date_second input" ).datepicker({
            changeMonth: true,
            changeYear: true,
            numberOfMonths: 1,
            dateFormat: 'dd.mm.yy',
            closeText: 'Закрыть',
            prevText: 'Пред',
            nextText: 'След',
            monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
            monthNamesShort: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
            dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
            dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
            dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
        });
    }

});