// slider
var b_composition = document.querySelector('.b-composition'); 
var b_composition_Btn = document.querySelector('.b-composition').querySelectorAll('.b-btn');
var b_composition_Btn_left = document.querySelector('.b-composition').querySelector('.b-btn-left');
var b_composition_Btn_right = document.querySelector('.b-composition').querySelector('.b-btn-right');
var b_composition_Sliders = document.querySelector('.b-composition').querySelectorAll('.b-slider');

var b_comments = document.querySelector('.b-comments'); 
var b_comments_Btn = document.querySelector('.b-comments').querySelectorAll('.b-btn');
var b_comments_Sliders = document.querySelector('.b-comments').querySelectorAll('.b-slider');

function b_sliders(block, btn) {
    
    for (var k=0; k < btn.length; k++) {
        Ddd(k, block, btn);
    }
}

function Ddd(k, block, btn) {
    var index = k;
    btn[index].addEventListener('click', function (k) {
        for (var y=0; y < block.length; y++) {
            block[y].classList.remove("active");
            btn[y].classList.remove("active");
        }
        block[index].classList.add("active");
        btn[index].classList.add("active");
    });
}

// в лево
function b_sliderLeft(block, btn) {
    var position = 0;
    var positionNext = 0;
    for (var i=0; i < btn.length; i++) {
        if (btn[i].className == "b-btn active") {
            position = i;
        }
    }
    if (position == 0) {
        positionNext = (btn.length - 1);
    } else {
        positionNext = position - 1;
    }
    block[position].classList.remove("active");
    btn[position].classList.remove("active");
    block[positionNext].classList.add("active");
    btn[positionNext].classList.add("active");
}
// в право
function b_sliderRight(block, btn) {
        var position = 0;
        var positionNext = 0;
        for (var i=0; i < btn.length; i++) {
            if (btn[i].className == "b-btn active") {
                position = i;
            }
        }
        if (position == (btn.length - 1)) {
            positionNext = 0;
        } else {
            positionNext = position + 1;
        }
        block[position].classList.remove("active");
        btn[position].classList.remove("active");
        block[positionNext].classList.add("active");
        btn[positionNext].classList.add("active");
}
// перелистывания пальцем
function b_touchSlider(box, slider, btn) {

    var touchStartX = null; //Точка начала касания
    var touchPositionX = null; //Текущая позиция
    const sensitivity = 50; // Чувствительность

    //Перехватываем события
    box.addEventListener("touchstart", function (e) {TouchStart(e)}); //Начало касания
    box.addEventListener("touchmove", function (e) {TouchMove(e)}); //Движение пальцем по экрану
    box.addEventListener("touchend", function (e) {TouchEnd(e)}); //Пользователь отпустил экран

    function TouchStart(e) {
        touchPositionX = null;
        //Получаем текущую позицию касания
        touchStartX = e.changedTouches[0].pageX;
    }

    function TouchMove(e) {
        //Получаем новую позицию
        touchPositionX = e.changedTouches[0].pageX;
    }

    function TouchEnd(e) {
        if ((touchPositionX < (touchStartX - sensitivity )) && (touchPositionX != null)) {
                b_sliderRight(slider, btn);
        } else if ((touchPositionX > (touchStartX + sensitivity)) && (touchPositionX != null)) {
                b_sliderLeft(slider, btn);
        }
    }
}

b_sliders(b_comments_Sliders, b_comments_Btn);
b_touchSlider(b_comments, b_comments_Sliders, b_comments_Btn);
b_touchSlider(b_composition, b_composition_Sliders, b_composition_Btn);

b_composition_Btn_left.addEventListener('click', function() {
    b_sliderLeft(b_composition_Sliders, b_composition_Btn);
});

b_composition_Btn_right.addEventListener('click', function() {
    b_sliderRight(b_composition_Sliders, b_composition_Btn);
});


// --------------------------------------------------
// Прокрутка до блоков

// B-1
$(document).ready(function(){
    var $element = $('.b-block-1');
    $element.find('.b-h1').css('opacity', '0');
    $element.find('.a1-1').css('opacity', '0');
    $element.find('.a1-2').css('opacity', '0');
    $element.find('.a2-1').css('opacity', '0');
    $element.find('.a2-2').css('opacity', '0');
    $element.find('.a3-1').css('opacity', '0');
    $element.find('.a3-2').css('opacity', '0');

    setTimeout(function(){$element.find('.b-h1').addClass("a-rotate-3");}, 0);
    setTimeout(function(){$element.find('.a1-1').addClass("a-rotate-3");}, 300);
    setTimeout(function(){$element.find('.a1-2').addClass("a-rotate");}, 300);
    setTimeout(function(){$element.find('.a2-1').addClass("a-rotate-3");}, 500);
    setTimeout(function(){$element.find('.a2-2').addClass("a-rotate");}, 500);
    setTimeout(function(){$element.find('.a3-1').addClass("a-rotate-3");}, 800);
    setTimeout(function(){$element.find('.a3-2').addClass("a-rotate");}, 800);
});

// B-2
$(document).ready(function(){   
    var $element = $('.b-block-2');
    var counter = 0;

    $element.find('.b-arrow').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.b-arrow').addClass("a-o-2");}, 100);

        counter = 1;
        }
    });
});

// B-3
$(document).ready(function(){   
    var $element = $('.b-block-3');
    var counter = 0;

    $element.find('.a1').css('opacity', '0');
    $element.find('.a2').css('opacity', '0');
    $element.find('.a3').css('opacity', '0');
    $element.find('.a4').css('opacity', '0');
    $element.find('.a5').css('opacity', '0');
    $element.find('.a6').css('opacity', '0');
    $element.find('.a7').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.a1').addClass("a-rotate");}, 0);
        setTimeout(function(){$element.find('.a2').addClass("a-rotate");}, 150);
        setTimeout(function(){$element.find('.a3').addClass("a-rotate");}, 300);
        setTimeout(function(){$element.find('.a4').addClass("a-rotate");}, 450);
        setTimeout(function(){$element.find('.a5').addClass("a-rotate");}, 600);
        setTimeout(function(){$element.find('.a6').addClass("a-rotate");}, 750);
        setTimeout(function(){$element.find('.a7').addClass("a-rotate");}, 900);

        counter = 1;
        }
    });
});

// B-4
$(document).ready(function(){   
    var $element = $('.b-block-4');
    var counter = 0;

    $element.find('.p1').css('opacity', '0');
    $element.find('.p2').css('opacity', '0');
    $element.find('.p3').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.p1').addClass("a-rotate");}, 0);
        setTimeout(function(){$element.find('.p2').addClass("a-rotate");}, 200);
        setTimeout(function(){$element.find('.p3').addClass("a-rotate");}, 400);
        setTimeout(function(){$element.find('.a1').addClass("a-flash-2");}, 200);
        setTimeout(function(){$element.find('.a2').addClass("a-scale");}, 100);
        setTimeout(function(){$element.find('.a3').addClass("a-scale");}, 200);

        counter = 1;
        }
    });
});

// B-6
$(document).ready(function(){   
    var $element = $('.b-block-6');
    var counter = 0;

    $element.find('.b-right').find('.b-slider').css('opacity', '0');
    $element.find('.b-left').find('.b-slider').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.b-right').find('.b-slider').addClass("a-right");}, 100);
        setTimeout(function(){$element.find('.b-left').find('.b-slider').addClass("a-left");}, 100);

        counter = 1;
        }
    });
});

// B-7
$(document).ready(function(){   
    var $element = $('.b-block-7');
    var counter = 0;

    $element.find('.b-doctor-box').css('opacity', '0');
    $element.find('.b-text-box').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.b-doctor-box').addClass("a-o-2");}, 0);
        setTimeout(function(){$element.find('.b-text-box').addClass("a-o-2");}, 500);

        counter = 1;
        }
    });
});

// B-8
$(document).ready(function(){   
    var $element = $('.b-block-8');
    var counter = 0;

    $element.find('.p-100').css('width', '0');
    $element.find('.p-99').css('width', '0');
    $element.find('.p-98').css('width', '0');
    $element.find('.p-97').css('width', '0');
    $element.find('.p-95').css('width', '0');
    $element.find('.p-93').css('width', '0');
    $element.find('.p-90').css('width', '0');
    $element.find('.p-88').css('width', '0');
    $element.find('.p-85').css('width', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.a11').addClass("a-100");}, 0);
        setTimeout(function(){$element.find('.a12').addClass("a-95");}, 300);
        setTimeout(function(){$element.find('.a21').addClass("a-97");}, 0);
        setTimeout(function(){$element.find('.a22').addClass("a-85");}, 300);
        setTimeout(function(){$element.find('.a31').addClass("a-100");}, 0);
        setTimeout(function(){$element.find('.a32').addClass("a-95");}, 300);
        setTimeout(function(){$element.find('.a41').addClass("a-98");}, 0);
        setTimeout(function(){$element.find('.a42').addClass("a-88");}, 300);
        setTimeout(function(){$element.find('.a51').addClass("a-93");}, 0);
        setTimeout(function(){$element.find('.a52').addClass("a-85");}, 300);
        setTimeout(function(){$element.find('.a61').addClass("a-99");}, 0);
        setTimeout(function(){$element.find('.a62').addClass("a-90");}, 300);

        counter = 1;
        }
    });
});

// B-10
$(document).ready(function(){   
    var $element = $('.b-block-10');
    var counter = 0;

    $element.find('.a1').css('opacity', '0');
    $element.find('.a2').css('opacity', '0');
    $element.find('.a3').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.b-circle-border-2').addClass("a-scale-2");}, 100);
        setTimeout(function(){$element.find('.a1').addClass("a-o");}, 0);
        setTimeout(function(){$element.find('.a2').addClass("a-o");}, 400);
        setTimeout(function(){$element.find('.a3').addClass("a-o");}, 800);

        counter = 1;
        }
    });
});

// B-11
$(document).ready(function(){   
    var $element = $('.b-block-11');
    var counter = 0;

    $element.find('.a11').css('opacity', '0');
    $element.find('.b-arrow').css('opacity', '0');
    $element.find('.a21').css('opacity', '0');
    $element.find('.a31').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.a11').addClass("a-360deg");}, 0);
        setTimeout(function(){$element.find('.a12').addClass("a-o-4");}, 300);
        setTimeout(function(){$element.find('.a21').addClass("a-360deg");}, 600);
        setTimeout(function(){$element.find('.a22').addClass("a-o-4");}, 900);
        setTimeout(function(){$element.find('.a31').addClass("a-360deg");}, 1200);

        counter = 1;
        }
    });
});

// B-12
$(document).ready(function(){   
    var $element = $('.b-block-12');
    var counter = 0;

    $element.find('.b-h1').css('opacity', '0');
    $element.find('.b-sale-box').css('opacity', '0');
    $element.find('.b-price').css('opacity', '0');

$(window).scroll(function() {
  var scroll = $(window).scrollTop()  + ($(window).height() / 2);
  //Если скролл до начала елемента
  var offset = $element.offset().top;
 
    if (scroll > offset && counter == 0) {

        setTimeout(function(){$element.find('.b-h1').addClass("a-rotate-3");}, 0);
        setTimeout(function(){$element.find('.b-sale-box').addClass("a-rotate-2");}, 300);
        setTimeout(function(){$element.find('.b-price').addClass("a-rotate");}, 300);

        counter = 1;
        }
    });
});