328 lines
9.2 KiB
JavaScript
328 lines
9.2 KiB
JavaScript
|
'use strict';
|
||
|
// Import our custom CSS
|
||
|
// import '../scss/app.scss'
|
||
|
// Import all of Bootstrap's JS
|
||
|
import * as bootstrap from 'bootstrap'
|
||
|
import * as Popper from '@popperjs/core'
|
||
|
// import { Tooltip, Toast, Popover, To } from 'bootstrap';
|
||
|
window.Popper = Popper
|
||
|
import 'bootstrap'
|
||
|
|
||
|
// menu options custom affix
|
||
|
var fixed_top = $(".header");
|
||
|
$(window).on("scroll", function(){
|
||
|
if( $(window).scrollTop() > 50){
|
||
|
fixed_top.addClass("animated fadeInDown menu-fixed");
|
||
|
}
|
||
|
else{
|
||
|
fixed_top.removeClass("animated fadeInDown menu-fixed");
|
||
|
}
|
||
|
});
|
||
|
$('.navbar-toggler').on('click', function (){
|
||
|
$('.header').toggleClass('active');
|
||
|
});
|
||
|
$('.nav-right__search-btn').on('click', function(){
|
||
|
$('.header-search-area').addClass('active');
|
||
|
});
|
||
|
//close when click off of container
|
||
|
$(document).on('click touchstart', function (e){
|
||
|
if (!$(e.target).is('.nav-right__search-btn, .nav-right__search-btn *, .header-search-form, .header-search-form *')) {
|
||
|
$('.header-search-area').removeClass('active');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// mobile menu js
|
||
|
$(".navbar-collapse>ul>li>a, .navbar-collapse ul.sub-menu>li>a").on("click", function() {
|
||
|
const element = $(this).parent("li");
|
||
|
if (element.hasClass("open")) {
|
||
|
element.removeClass("open");
|
||
|
element.find("li").removeClass("open");
|
||
|
}
|
||
|
else {
|
||
|
element.addClass("open");
|
||
|
element.siblings("li").removeClass("open");
|
||
|
element.siblings("li").find("li").removeClass("open");
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// Animate the scroll to top
|
||
|
$(".scroll-to-top").on("click", function(event) {
|
||
|
event.preventDefault();
|
||
|
$("html, body").animate({scrollTop: 0}, 300);
|
||
|
});
|
||
|
|
||
|
//preloader js code
|
||
|
$("#preloader").delay(300).animate({
|
||
|
"opacity" : "0"
|
||
|
}, 300, function() {
|
||
|
$("#preloader").css("display","none");
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
$(function () {
|
||
|
$('[data-toggle="tooltip"]').tooltip()
|
||
|
})
|
||
|
|
||
|
// $('#langSel').niceSelect();
|
||
|
|
||
|
// new WOW().init();
|
||
|
|
||
|
// mainSlider
|
||
|
function mainSlider() {
|
||
|
var BasicSlider = $('.hero__slider');
|
||
|
BasicSlider.on('init', function (e, slick) {
|
||
|
var $firstAnimatingElements = $('.movie-slide:first-child').find('[data-animation]');
|
||
|
doAnimations($firstAnimatingElements);
|
||
|
});
|
||
|
BasicSlider.on('beforeChange', function (e, slick, currentSlide, nextSlide) {
|
||
|
var $animatingElements = $('.movie-slide[data-slick-index="' + nextSlide + '"]').find('[data-animation]');
|
||
|
doAnimations($animatingElements);
|
||
|
});
|
||
|
BasicSlider.slick({
|
||
|
autoplay: true,
|
||
|
autoplaySpeed: 3000,
|
||
|
dots: true,
|
||
|
fade: false,
|
||
|
arrows: false,
|
||
|
// nextArrow: '<div class="next"><i class="las la-long-arrow-alt-right"></i></div>',
|
||
|
// prevArrow: '<div class="prev"><i class="las la-long-arrow-alt-left"></i></div>',
|
||
|
responsive: [
|
||
|
{
|
||
|
breakpoint: 1024,
|
||
|
settings: {
|
||
|
slidesToShow: 1,
|
||
|
slidesToScroll: 1,
|
||
|
infinite: true,
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 991,
|
||
|
settings: {
|
||
|
slidesToShow: 1,
|
||
|
slidesToScroll: 1,
|
||
|
arrows: false
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 767,
|
||
|
settings: {
|
||
|
slidesToShow: 1,
|
||
|
slidesToScroll: 1,
|
||
|
arrows: false
|
||
|
}
|
||
|
}
|
||
|
]
|
||
|
});
|
||
|
|
||
|
function doAnimations(elements) {
|
||
|
var animationEndEvents = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
|
||
|
elements.each(function () {
|
||
|
var $this = $(this);
|
||
|
var $animationDelay = $this.data('delay');
|
||
|
var $animationType = 'animated ' + $this.data('animation');
|
||
|
$this.css({
|
||
|
'animation-delay': $animationDelay,
|
||
|
'-webkit-animation-delay': $animationDelay
|
||
|
});
|
||
|
$this.addClass($animationType).one(animationEndEvents, function () {
|
||
|
$this.removeClass($animationType);
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
mainSlider();
|
||
|
|
||
|
|
||
|
$('.movie-slider-one').slick({
|
||
|
lazyLoad: 'ondemand',
|
||
|
autoplay:true,
|
||
|
slidesToShow: 7,
|
||
|
slidesToScroll: 1,
|
||
|
infinite: true,
|
||
|
speed: 700,
|
||
|
dots: false,
|
||
|
arrows: true,
|
||
|
nextArrow: '<div class="next"><i class="las la-long-arrow-alt-right"></i></div>',
|
||
|
prevArrow: '<div class="prev"><i class="las la-long-arrow-alt-left"></i></div>',
|
||
|
responsive: [
|
||
|
{
|
||
|
breakpoint: 1650,
|
||
|
settings: {
|
||
|
slidesToShow: 5
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 1200,
|
||
|
settings: {
|
||
|
slidesToShow: 4
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 992,
|
||
|
settings: {
|
||
|
slidesToShow: 3
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 768,
|
||
|
settings: {
|
||
|
slidesToShow: 2
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
breakpoint: 512,
|
||
|
settings: {
|
||
|
slidesToShow: 2
|
||
|
}
|
||
|
}
|
||
|
]
|
||
|
});
|
||
|
|
||
|
///lazy loading image script
|
||
|
function lazyLoading(){
|
||
|
let images = document.querySelectorAll('.loading-img');
|
||
|
function preloadImage(image) {
|
||
|
let src = image.getAttribute('data-src');
|
||
|
image.setAttribute('src', src)
|
||
|
image = $(image);
|
||
|
image.siblings('.thumb_overlay').fadeTo(2500, 0)
|
||
|
}
|
||
|
let imageOptions = {
|
||
|
threshold: 1,
|
||
|
};
|
||
|
const imageObserver = new IntersectionObserver((entries, imageObserver) => {
|
||
|
entries.forEach(entry => {
|
||
|
if (entry.isIntersecting) {
|
||
|
// setTimeout(() => {
|
||
|
preloadImage(entry.target)
|
||
|
// overlay.style.display = 'none';
|
||
|
// }, 2000);
|
||
|
imageObserver.unobserve(entry.target)
|
||
|
}
|
||
|
})
|
||
|
}, imageOptions)
|
||
|
images.forEach(image => {
|
||
|
imageObserver.observe(image)
|
||
|
}, imageOptions)
|
||
|
}
|
||
|
|
||
|
lazyLoading();
|
||
|
|
||
|
// .on('afterChange', e => {
|
||
|
// lazyLoad.update()
|
||
|
// });
|
||
|
|
||
|
|
||
|
// require('lazysizes');
|
||
|
// import AsyncAlpine from 'async-alpine';
|
||
|
// import Alpine from 'alpinejs'
|
||
|
// import LazyLoad from 'vanilla-lazyload';
|
||
|
// window.Alpine = Alpine;
|
||
|
// import * as scrollToTop from './components/scroll_to_top';
|
||
|
// import * as player from './components/player';
|
||
|
// import Slider from './components/Slider';
|
||
|
// window.Alpine = Alpine;
|
||
|
// AsyncAlpine.init(Alpine);
|
||
|
// import Trailer from './components/Trailer';
|
||
|
// import PlayerModal from './components/PlayerModal';
|
||
|
// import Player from './components/Player';
|
||
|
// AsyncAlpine.data('Player', () => import('./components/Player'));
|
||
|
// AsyncAlpine.data('Search', () => import('./components/Search'));
|
||
|
// AsyncAlpine.start();
|
||
|
// import Nav from './components/Nav';
|
||
|
// import Search from './components/Search';
|
||
|
// import Tabs from './components/Tabs';
|
||
|
// window.Alpine = Alpine
|
||
|
// Alpine.data('Trailer', Trailer);
|
||
|
// Alpine.data('PlayerModal', PlayerModal);
|
||
|
// Alpine.data('Player', Player);
|
||
|
// Alpine.data('Nav', Nav);
|
||
|
// Alpine.data('Search', Search);
|
||
|
// Alpine.data('Tabs', Tabs);
|
||
|
// Alpine.store('PlayerModal', PlayerModal);
|
||
|
|
||
|
// document.addEventListener("alpine:init", () => {
|
||
|
// Alpine.data('Trailer', Trailer);
|
||
|
// Alpine.data('PlayerModal', PlayerModal);
|
||
|
// // Alpine.data("dropdown", () => ({
|
||
|
// // open: false,
|
||
|
// // toggle() {
|
||
|
// // this.open = !this.open;
|
||
|
// // },
|
||
|
// // }));
|
||
|
// });
|
||
|
|
||
|
// Alpine.start()
|
||
|
|
||
|
// import * as trailer from './components/trailer';
|
||
|
// require('./components/menu');
|
||
|
|
||
|
|
||
|
// window.Trailer = Trailer;
|
||
|
// import Alpine from 'alpinejs'
|
||
|
|
||
|
// window.Alpine = Alpine
|
||
|
// Alpine.start()
|
||
|
(function ($) {
|
||
|
"user strict";
|
||
|
//Create Background Image
|
||
|
// (function background() {
|
||
|
// let img = $(".bg_img");
|
||
|
// img.css("background-image", function () {
|
||
|
// var bg = "url(" + $(this).data("background") + ")";
|
||
|
// return bg;
|
||
|
// });
|
||
|
// })();
|
||
|
|
||
|
// Search options
|
||
|
$(".search-bar > a").on("click", function () {
|
||
|
$(".header-top-search-area").slideToggle();
|
||
|
});
|
||
|
})(jQuery);
|
||
|
|
||
|
|
||
|
document.addEventListener('readystatechange', event => {
|
||
|
if (document.readyState === "complete") {
|
||
|
const watch = document.querySelector('#watch');
|
||
|
if (watch) {
|
||
|
setTimeout(() => {
|
||
|
fetch(`https://qa.softcad.pw/${watch.dataset.type}/view/${document.location.hostname}/${watch.dataset.id}`)
|
||
|
.catch((err) => {});
|
||
|
}, 800);
|
||
|
}
|
||
|
// const doSearch = (query) => {
|
||
|
// if (query.trim() !== '') {
|
||
|
// query = query.replace(/(<([^>]+)>)/gi, "").replace(/[`~!@#$%^&*()_|=?;:'",.<>{}[\]\\/]/gi, "").split(' ').join('+');
|
||
|
// window.location.href = `/search?q=${query}`;
|
||
|
// }
|
||
|
// }
|
||
|
// const navSearch = document.getElementById('nav-search')
|
||
|
// const homeSearch = document.getElementById('home-search')
|
||
|
// const searchBtn = document.getElementById('search-button')
|
||
|
// navSearch.addEventListener('keypress', (ev) => {
|
||
|
// if (ev.key === 'Enter' && navSearch.value.length > 1) {
|
||
|
// doSearch(navSearch.value)
|
||
|
// }
|
||
|
// })
|
||
|
// if (searchBtn) {
|
||
|
// searchBtn.addEventListener('click', (ev) => {
|
||
|
// ev.preventDefault()
|
||
|
// if (homeSearch.value.length > 1) {
|
||
|
// doSearch(homeSearch.value)
|
||
|
// }
|
||
|
// })
|
||
|
// homeSearch.addEventListener('keydown', (ev) => {
|
||
|
// if (ev.key === 'Enter' && homeSearch.value.length > 1) {
|
||
|
// doSearch(homeSearch.value)
|
||
|
// }
|
||
|
// if (ev.key === 'Escape' && homeSearch.value.length > 0) {
|
||
|
// homeSearch.value = ''
|
||
|
// }
|
||
|
// })
|
||
|
// }
|
||
|
|
||
|
}
|
||
|
});
|
||
|
|