https://clipbee.ai/js/script.js?v1.1

1  
2  //////////////FAQ/////////////
3$(document).ready(function () {
4    // Toggle the component with class accordion_body
5    $(".accordion_head").click(function () {
6        if ($('.accordion_body').is(':visible')) {
7            $(".accordion_body").slideUp(300);
8            $(".plusminus").html('<i class="fa fa-angle-down" aria-hidden="true"></i>');
9        }
10        if ($(this).next(".accordion_body").is(':visible')) {
11            $(this).next(".accordion_body").slideUp(300);
12            $(this).find(".plusminus").html('<i class="fa fa-angle-down" aria-hidden="true"></i>');
13        } else {
14            $(this).next(".accordion_body").slideDown(300);
15            $(this).find(".plusminus").html('<i class="fa fa-angle-up" aria-hidden="true"></i>');
16        }
17    });
18}); 
19
20//bannder-slider
21const multiplier = {
22  translate: .1,
23  rotate: .015
24}
25
26new Swiper('.swiper1', {
27  slidesPerView: 2.2,
28  spaceBetween: 150,
29  centeredSlides: true,
30  loop: true,
31  grabCursor: true,
32  navigation: {
33    nextEl: '.swiper-button-next.swiper1-button-next',
34    prevEl: '.swiper-button-prev.swiper1-button-prev',
35  },
36  breakpoints: {
37    1500: { spaceBetween: 150 }, 
38    1400: { spaceBetween: 100 },
39    992: { spaceBetween: 50 },
40    768: { spaceBetween: 30 },
41    640: {
42      slidesPerView: 1,  
43      spaceBetween: 0,
44    },
45    100: {
46      slidesPerView: 1,  
47      spaceBetween: 0,
48    } 
49  },
50});
51 
52function calculateWheel() {
53  const slides = document.querySelectorAll('.single')
54  slides.forEach((slide, i) => {
55      const rect = slide.getBoundingClientRect()
56      const r = window.innerWidth * .5 - (rect.x + rect.width * .5)
57      let ty = Math.abs(r) * multiplier.translate - rect.width * multiplier.translate
58
59      if (ty < 0) {
60          ty = 0
61      }
62      const transformOrigin = r < 0 ? 'left top' : 'right top'
63      slide.style.transform = `translate(0, ${ty}px) rotate(${-r * multiplier.rotate}deg)`
64      slide.style.transformOrigin = transformOrigin
65  })
66}
67
68function raf() {
69  requestAnimationFrame(raf)
70  calculateWheel()
71}
72
73raf();
74
75
76////////////
77 
78document.addEventListener("DOMContentLoaded", () => {
79    const wrapper = document.querySelector(".intro-detail-img");
80    const video = wrapper.querySelector(".my-video");
81
82    // Play / Pause
83    const playBtn = wrapper.querySelector(".play-toggle");
84    const playIcon = wrapper.querySelector(".icon-play");
85    const pauseIcon = wrapper.querySelector(".icon-pause");
86
87    // Mute / Unmute
88    const muteBtn = wrapper.querySelector(".mute-toggle");
89    const mutedIcon = wrapper.querySelector(".icon-muted");
90    const unmutedIcon = wrapper.querySelector(".icon-unmuted");
91
92    /* PLAY / PAUSE */
93    playBtn.addEventListener("click", () => {
94        // Ensure sources are loaded (fix for Firefox lazy loading)
95        var sources = video.querySelectorAll("source");
96        var needsLoad = false;
97        sources.forEach(function(source) {
98            if (!source.src && source.dataset.src) {
99                source.src = source.dataset.src;
100                needsLoad = true;
101            }
102        });
103        
104        if (needsLoad) {
105            video.load();
106            video.classList.remove("lazy");
107            // Wait for video to be ready then play
108            video.addEventListener("canplay", function onCanPlay() {
109                video.removeEventListener("canplay", onCanPlay);
110                video.play();
111            }, { once: true });
112        } else {
113            video.paused ? video.play() : video.pause();
114        }
115    });
116
117    video.addEventListener("play", () => {
118        wrapper.classList.add("playing");
119        playIcon.style.display = "none";
120        pauseIcon.style.display = "block";
121    });
122
123    video.addEventListener("pause", () => {
124        wrapper.classList.remove("playing");
125        playIcon.style.display = "block";
126        pauseIcon.style.display = "none";
127    });
128
129    /* MUTE / UNMUTE */
130    muteBtn.addEventListener("click", (e) => {
131        e.stopPropagation(); // IMPORTANT
132        video.muted = !video.muted;
133
134        mutedIcon.style.display = video.muted ? "block" : "none";
135        unmutedIcon.style.display = video.muted ? "none" : "block";
136    });
137});
138 
139
140