<!--КОД ДЛЯ КАЛЬКУЛЯТОРА-->
<a href="#popup:day-limit" class="day-limit-popup"></a>

<script>
const daysMinimal = 2;
const startOpeningHour = 9;
const endOpeningHour = 22;


document.addEventListener("DOMContentLoaded", function() {
    (function () {
        
        t_onFuncLoad("t_zeroForms__init", (function() {
            setTimeout(function() {
                
                //Блок с калькулятором
                const calcBlock = document.querySelector('.uc-car-calc ');
                
                if(calcBlock!=null){
                    
                    
                    calcBlock.addEventListener('keydown', function(e) {
                        if (e.keyCode == 13) {
                            e.preventDefault();
                            return false;
                        };
                    });
                    
                    //Получение элементов калькулятора
                    const calcButton = calcBlock.querySelector('.calc-btn');
                    const formButton = calcBlock.querySelector('.t-submit');
                    
                    calcButton.addEventListener('click', function(){
                        formButton.click(); 
                    });
                    
                    
                    
                    const number_of_days = calcBlock.querySelector('.number_of_days .tn-atom');
                    const number_of_days_input = calcBlock.querySelector('input[name="number_of_days"]');
                    
                    const carName_input = calcBlock.querySelector('input[name="car_model"]');
                    
                    const dayPrice_text = calcBlock.querySelector('.day_price .tn-atom');
                    const dayPrice_text_input = calcBlock.querySelector('input[name="day_price"]');
                    
                    const final_price_text = calcBlock.querySelector('.final_price .tn-atom');
                    const final_price_input = calcBlock.querySelector('input[name="final_price"]');
                    
                    const start_night_time_text = calcBlock.querySelector('.start_night_time .tn-atom');
                    const start_night_time_descr = calcBlock.querySelector('.start_night_time_descr .tn-atom');
                    const start_night_time_input = calcBlock.querySelector('input[name="start_night_time"]');
                    
                    const finish_night_time_text = calcBlock.querySelector('.finish_night_time .tn-atom');
                    const finish_night_time_descr = calcBlock.querySelector('.finish_night_time_descr .tn-atom');
                    const finish_night_time_input = calcBlock.querySelector('input[name="finish_night_time"]');
                    
                    
                    
                    //Название авто
                    const carName = document.querySelector('.car_model .tn-atom').textContent;
                    carName_input.value = carName;
                    const rateArr = [];
                    
                    //Тарифы по кол-ву дней
                    const rateElm = document.querySelectorAll('div[class*="rate_"]');
                    if(rateElm.length){
                        for(let i=1; i<=rateElm.length; i++){
                            let dayPrice = document.querySelector(`div[class*="rate_${i}"] .tn-atom`).textContent;   
                            dayPrice = +dayPrice.replace(/[^0-9.]/g, ' ').trim();
                            rateArr.push(dayPrice);
                        };
                    };
                    
                    
                    //Обработка цен Страховки
                    const insuranceSelect = calcBlock.querySelector('select[name="insurance"]');
                    const insuranceOptions = insuranceSelect.querySelectorAll('option');
                    for(let i=0; i<insuranceOptions.length; i++){
                        let optionVal = insuranceOptions[i].value.split('=');
                        let optionCalc = 0;
                        if(optionVal.length>1){
                            optionCalc = optionVal[1];
                            insuranceOptions[i].value = optionVal[0];
                            insuranceOptions[i].textContent = optionVal[0];
                        };
                        insuranceOptions[i].setAttribute('data-calc-option', optionCalc);
                    };
                    
                    //Обработка цен Детское кресло
                    const safetSeatSelect = calcBlock.querySelector('select[name="safety_seat"]');
                    const safetSeatOptions = safetSeatSelect.querySelectorAll('option');
                    for(let i=0; i<safetSeatOptions.length; i++){
                        let optionVal = safetSeatOptions[i].value.split('=');
                        let optionCalc = 0;
                        if(optionVal.length>1){
                            optionCalc = optionVal[1];
                            safetSeatOptions[i].value = optionVal[0];
                            safetSeatOptions[i].textContent = optionVal[0];
                        };
                        safetSeatOptions[i].setAttribute('data-calc-option', optionCalc);
                    };
                    
                    
                    //Обработка цен получения авто в ночное время
                    start_night_time_text.setAttribute('data-calc-option', start_night_time_text.textContent );
                    start_night_time_text.textContent = 0;
                    
                    //Обработка цен сдача авто в ночное время
                    finish_night_time_text.setAttribute('data-calc-option', finish_night_time_text.textContent );
                    finish_night_time_text.textContent = 0;
                    
                    
                    
                    //При изменениях в полях калькулятора
                    document.addEventListener('change', function(event) { 
                        if(event.target.closest('.uc-car-calc select[name="insurance"]')) calculation();  
                        if(event.target.closest('.uc-car-calc select[name="safety_seat"]')) calculation();  
                    });
                    
                    document.addEventListener('focusout', function(event) { 
                        if(event.target.closest('.uc-car-calc .t-input-group_tm input')) calculation();   
                        if(event.target.closest('.uc-car-calc .t-input-group_da input')) calculation();   
                    });
                    
                    document.addEventListener('click', function(event) { 
                        if(event.target.closest('.t_datepicker__day-cell'))  calculation();  
                    });
                    
                    function numberWithSpaces(x) {
                        return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
                    };
                    
                    
                    function calculation(){
                        setTimeout(function() {
                        
                            let dateStartVal = calcBlock.querySelector('[name="date_start"]').value;
                            let timeStartVal = calcBlock.querySelector('[name="time_start"]').value;
                            
                            let dateFinishVal = calcBlock.querySelector('[name="date_finish"]').value;
                            let timeFinishVal = calcBlock.querySelector('[name="time_finish"]').value;
                            
                            
                            if(dateStartVal!='' && timeStartVal!='' && dateFinishVal!='' && timeFinishVal!=''){
                                
                                
                                //Проверяем кол-во дней между датами и временем
                                //Дата получения
                                dateStartVal = dateStartVal.split('-');
                                if(dateStartVal[0][0]==0){ dateStartVal[0] = dateStartVal[0].slice(1) };
                                if(dateStartVal[1][0]==0){ dateStartVal[1] = (+dateStartVal[1].slice(1))-1 };
                                //Время получения
                                timeStartVal = timeStartVal.split(':');
                                if(timeStartVal[0][0]==0){ timeStartVal[0] = +timeStartVal[0].slice(1) };
                                if(timeStartVal[1][0]==0){ timeStartVal[1] = +timeStartVal[1].slice(1) };
                                
                                
                                //Дата возврата
                                dateFinishVal = dateFinishVal.split('-');
                                if(dateFinishVal[0][0]==0){ dateFinishVal[0] = dateFinishVal[0].slice(1) };
                                if(dateFinishVal[1][0]==0){ dateFinishVal[1] = (+dateFinishVal[1].slice(1))-1 };
                                //Время возврата
                                timeFinishVal = timeFinishVal.split(':');
                                if(timeFinishVal[0][0]==0){ timeFinishVal[0] = +timeFinishVal[0].slice(1) };
                                if(timeFinishVal[1][0]==0){ timeFinishVal[1] = +timeFinishVal[1].slice(1) };
                                
                                //Считаем разницу между днями
                                let startDate = new Date(dateStartVal[2], dateStartVal[1], dateStartVal[0], timeStartVal[0], timeStartVal[1], 0, 0).getTime();
                                let finishDate = new Date(dateFinishVal[2], dateFinishVal[1], dateFinishVal[0], timeFinishVal[0], timeFinishVal[1], 0, 0).getTime();
                                let dayDifference = (finishDate-startDate)/1000/60/60/24;
                                
                                //Если больше или равно минимума дней аренды
                                if(dayDifference>=daysMinimal){
                                    
                                    dayDifference = Math.ceil(dayDifference);
                                    number_of_days.textContent = dayDifference;
                                    number_of_days_input.value = dayDifference;
               
                                    //Если Получение в нерабочее время 
                                    if(timeStartVal[0]<startOpeningHour || timeStartVal[0]>=endOpeningHour){
                                        let summ = start_night_time_text.getAttribute('data-calc-option');
                                        start_night_time_text.textContent = summ;
                                        start_night_time_input.value = summ;
                                        start_night_time_text.classList.add('show-night-option');
                                        start_night_time_descr.classList.add('show-night-option');
                                    }else{
                                        let summ = 0;
                                        start_night_time_text.textContent = summ;
                                        start_night_time_input.value = '';
                                        start_night_time_text.classList.remove('show-night-option');
                                        start_night_time_descr.classList.remove('show-night-option');
                                    };
                                    
                                    //Если Сдача в нерабочее Время
                                    if(timeFinishVal[0]>=endOpeningHour || timeFinishVal[0]<startOpeningHour ){
                                        let summ = finish_night_time_text.getAttribute('data-calc-option');
                                        finish_night_time_text.textContent = summ;
                                        finish_night_time_input.value = summ;
                                        finish_night_time_text.classList.add('show-night-option');
                                        finish_night_time_descr.classList.add('show-night-option');
                                    }else{
                                        let summ = 0;
                                        finish_night_time_text.textContent = summ;
                                        finish_night_time_input.value = '';
                                        finish_night_time_text.classList.remove('show-night-option');
                                        finish_night_time_descr.classList.remove('show-night-option');
                                    };
                                    
                                    
                                    //Считаем цену аренды*************
                                    
                                       //Получаем цену за ночную работу
                                    let nightPrice = (+finish_night_time_text.textContent) + (+start_night_time_text.textContent);
                                    
                                    //Получаем цену за страховку
                                    let insurancePrice = +insuranceSelect.querySelector('option:checked').getAttribute('data-calc-option');
                                    //Получаем цену за кресло
                                    let safety_seatPrice = +safetSeatSelect.querySelector('option:checked').getAttribute('data-calc-option');
                                    
                                    
                                    //Вычисляем цену за сутки
                                    let dayPrice = rateArr[5];
                                    if(dayDifference<=30) dayPrice = rateArr[4];
                                    if(dayDifference<=20) dayPrice = rateArr[3];
                                    if(dayDifference<=14) dayPrice = rateArr[2];
                                    if(dayDifference<=7) dayPrice = rateArr[1];
                                    if(dayDifference<=3) dayPrice = rateArr[0];
                                    
                                    //Выводим стоимость суток
                                    dayPrice_text.textContent = numberWithSpaces(dayPrice+insurancePrice);
                                    dayPrice_text_input.value = numberWithSpaces(dayPrice+insurancePrice);
                                    
                                    
                                    //Считаем полную цену
                                    let fullPrice = numberWithSpaces( (dayPrice+insurancePrice)*dayDifference + safety_seatPrice + nightPrice);
                                    
                                    //Выводим общую сумму
                                    final_price_text.textContent = fullPrice;
                                    final_price_input.value = fullPrice;
                                    
                                    calcButton.classList.add('active-btn');
                                    
                                }else{
                                    //При ошибке очищаем поля
                                    document.querySelector('.day-limit-popup').click();
                                    calcButton.classList.remove('active-btn');
                                    number_of_days.textContent = 0;
                                    number_of_days_input.value = 0;
                                    dayPrice_text.textContent = 0;
                                    dayPrice_text_input.value = 0;
                                    final_price_text.textContent = fullPrice;
                                    final_price_input.value = fullPrice;
                                };
                                
                            }else{
                                calcButton.classList.remove('active-btn');
                            };
                        
                        }, 500);
                    };
                    
                    calcBlock.classList.add('show-calc');
                    
                };
                
            }, 1000);
        }));
    })();    
});    
</script>


<style>


.uc-car-calc{
    opacity: 0;
    pointer-events: none;
}
.uc-car-calc.show-calc{
    opacity: 1;
    pointer-events: auto;
}



.uc-car-calc .day_price .tn-atom:after, 
.uc-car-calc .final_price .tn-atom:after,
.uc-car-calc .start_night_time .tn-atom:after,
.uc-car-calc .finish_night_time .tn-atom:after
{
    content: " €";
}

.uc-car-calc .number_of_days .tn-atom:after
{
    content: " дн.";
}

.uc-car-calc .calc-btn {
    pointer-events: none;
    cursor: pointer;
    opacity: 0.6;
}

.uc-car-calc .calc-btn.active-btn {
    pointer-events: auto;
    opacity: 1;
}


#allrecords .uc-car-calc  .t-datepicker__icon {
    display: block;
}

.uc-car-calc .t-input-group_tm .t-input-block:after {
    content: "";
    position: absolute;
    z-index: 99;
    width: 40px;
    height: 40px;
    background-image: url(https://static.tildacdn.com/lib/icons/tilda/-/paint/ffffff--1-0-100/watch_clock_time.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    right: 12px;
    top: 4px;
    opacity: 0.8;
}

.uc-car-calc .t-input-group_tm .t-input-block {
    position: relative;
} 

.start_night_time_descr .tn-atom,
.start_night_time .tn-atom,
.finish_night_time_descr .tn-atom,
.finish_night_time .tn-atom
{
    opacity: 0.2;
}


.start_night_time_descr .tn-atom.show-night-option,
.start_night_time .tn-atom.show-night-option,
.finish_night_time_descr .tn-atom.show-night-option,
.finish_night_time .tn-atom.show-night-option
{
    opacity: 1;
}


@media screen  and (min-width:480px) and (max-width:960px){
.uc-car-calc .t-form__inputsbox_inrow .t-input-group_width25.t-input-group_inonerow {
    width: calc(50% - 11.25px);
}
}

</style>