https://oppomedical.ru/tools/js/init.js

1$(function () {
2    // Плавный скролл
3    $('.go_to').click(function () { // ловим клик по ссылке с классом go_to
4        var scroll_el = $($(this).attr('href')); // возьмем содержимое атрибута href, должен быть селектором, т.е. например начинаться с # или .
5        if (scroll_el.length != 0) { // проверим существование элемента чтобы избежать ошибки
6            $('html, body').animate({scrollTop: scroll_el.offset().top}, 500); // анимируем скроолинг к элементу scroll_el
7        }
8        return false; // выключаем стандартное действие
9    });
10
11    // Colorbox
12    (function () {
13        let commonParams = {
14            current: "фото {current} из {total}", // руссифицируем подписи
15            transition: "elastic",
16            speed: 250,
17            fixed: true,        // не прокручивать вместе со страничкой
18            opacity: 0.5,       // прозрачность оверлея, затемняющего страницу
19            scalePhotos: true,  // масштабировать фотки, если они не умещаются в экран
20            maxWidth: '95%',
21            maxHeight: '95%'
22        };
23
24        $('.js-colorbox').colorbox(commonParams);
25    })();
26
27    //Slick
28    (function () {
29        $('.js-slickslider-one-with-dots').each(function(){
30            var wrap = $(this);
31            wrap.slick({
32                //slide: '.b-carousel-list__item', // нужно указывать если каждый слайд обернут не в div
33                slidesToShow: 1,
34                slidesToScroll: 1,
35                arrows: false,  // не рендерить стрелки (если они у нас свои)
36                dots: true,    // не рендерить маркеры
37                infinite: true, // зациклить
38                speed: 300,
39                draggable: true // иначе глючит при щелчке мышью на слайдах
40            });
41        });
42    })();
43
44    // Плавающая шапка
45    (function () {
46        var hHeight;
47
48        function hCatPos() {
49            var hHeight = $('header').height() - $('header .h-nav').height(),
50                shHeight = $('.scroll-header').height();
51
52            $('.h-catalog').css({
53                'top': hHeight,
54            });
55        }
56
57        var $catLink = $('.catalog-link');
58
59        $catLink.click(function(){
60
61            hCatPos();
62
63            if ($catLink.hasClass('open')) {
64                $('.h-catalog').fadeOut(300);
65                $catLink.removeClass('open');
66            } else {
67                $('.h-catalog').fadeIn(300);
68                $catLink.addClass('open');
69
70                if ($('.scroll-header').hasClass('h-show')) {
71                    $("body,html").animate({
72                        scrollTop:0
73                    }, 500);
74                }
75            }
76        });
77
78        var headerScroll = function() {
79
80            var hHeight = $('header').height() - $('header .h-nav').height();
81
82            if ($(this).scrollTop() > (hHeight)){
83                $('.scroll-header').fadeIn(200).addClass('h-show');
84            }
85            else{
86                $('.scroll-header').fadeOut(200).removeClass('h-show');
87            }
88
89        };
90
91        window.addEventListener('scroll', headerScroll);
92
93        var $sShowBtn = $('.show-mobile-search'),
94            $mobSearch = $('.mobile-search');
95
96        $sShowBtn.click(function() {
97
98            if ($sShowBtn.hasClass('open')) {
99                $mobSearch.fadeOut(300, function(){
100                    hCatPos();
101                });
102                $sShowBtn.removeClass('open');
103            } else {
104                $mobSearch.fadeIn(300);
105                $sShowBtn.addClass('open');
106                hCatPos();
107            }
108
109        });
110
111        var $leav = $('.leav-nav > li > a:not([href])');
112
113        $leav.click(function(){
114
115            if ($(this).parent().hasClass('open')) {
116                $(this).parent().removeClass('open').find('.dropdown').hide(200);
117            } else {
118                $(this).parent().parent().find('.dropdown').hide(200);
119                $(this).parent().parent().find('li').removeClass('open');
120
121                $(this).parent().addClass('open').find('.dropdown').show(200);
122            }
123        });
124
125        // Tabs
126
127        $('.tabs .tab-back-link').parent().hide();
128
129        $('.tabs .tab-link:not([href])').click(function() {
130            var $id = $(this).attr('data-tab');
131
132            $('.tabs .tab-link').parent().hide(300);
133            $('.tabs .tab-back-link').parent().show(300);
134
135            $('.tabs-content .tab').hide(300);
136            $('.tabs-content').find($id).show(300);
137        });
138
139        $('.tabs .tab-back-link:not([href])').click(function() {
140            var $id = $(this).attr('data-tab');
141
142            $('.tabs .tab-link').parent().show(300);
143            $('.tabs .tab-back-link').parent().hide(300);
144
145            $('.tabs-content .tab').hide(300);
146            $('.tabs-content').find($id).show(300);
147        });
148    })();
149
150    // Формы
151    (function () {
152        if (typeof IexForms === 'undefined') return;
153
154        let cbUznatCenu = {
155            'onShow': function (form) {
156                let tovar = form.$button.attr('data-pform-tovar');
157                form.$wrap.find('.js-subtitle').text(tovar);
158                form.$wrap.find('[name="tovar"]').val(tovar);
159            }
160        };
161
162        let formsParams = {
163            'popup-zvonok' : {config: '/tools/iexForm/?config=onestep&template=name-phone'},
164            'popup-napishite' : {config: '/tools/iexForm/?config=onestep&template=name-phone-text'},
165            'popup-uznat' : {config: '/tools/iexForm/?config=onestep&template=uznat-cenu', callback: cbUznatCenu },
166            'inline-feedback' : {config: '/tools/iexForm/?config=onestep&template=feedback'},
167            'inline-contacts' : {config: '/tools/iexForm/?config=onestep&template=contacts'},
168        };
169
170        window.iexForms = new IexForms(formsParams);
171    })();
172
173    // Анированный маркер на фигуре человека /oppo/
174    (function () {
175        let
176            $wrap = $('.js-promo-oppo'),
177            $markers = $wrap.find('.js-marker'),
178            $texts = $wrap.find('.js-text'),
179            assets = {};
180
181        window.oppoAssets = assets;
182
183        if ( !($wrap.length && $markers.length && $texts.length) ) return;
184
185        $markers.each(function () {
186            let $marker = $(this);
187            let id = $marker.data('id');
188            assets[id] = {
189                text: $texts.filter('[data-id="'+id+'"]'),
190                anim: lottie.loadAnimation({
191                    container: $marker[0], // Required
192                    path: '/tools/animations/oppo/1.json', // Required
193                    renderer: 'svg', // Required
194                    loop: false, // Optional
195                    autoplay: false, // Optional
196                })
197            };
198        });
199
200        $markers.add($texts).hover(
201            function () {
202                let id = $(this).data('id');
203                assets[id].text.addClass('active');
204                assets[id].anim.play(); // setDirection(-1) - назад, setDirection(1) - вперед
205            },
206            function () {
207                let id = $(this).data('id');
208                assets[id].text.removeClass('active');
209                assets[id].anim.stop();
210            }
211        );
212    })();
213
214    (function () {
215        if ($(window).width() < 768) {
216            var $container = $('.js-mobile-content');
217            $('.js-tabs-content > div').each(function () {
218                var $self = $(this);
219                $container.append($self.html());
220                $self.html('');
221            });
222        }
223    })();
224});