1/*************************************************** 2==================== JS INDEX ====================== 3**************************************************** 401. PreLoader Js 502. Mobile Menu Js 603. Common Js 704. Menu Controls JS 805. Offcanvas Js 906. Search Js 1007. cartmini Js 1108. filter 1209. Body overlay Js 1310. Sticky Header Js 1411. Theme Settings Js 1512. Nice Select Js 1613. Smooth Scroll Js 1714. Slider Activation Area Start 1815. Masonary Js 1916. Wow Js 2017. Counter Js 2118. InHover Active Js 2219. Line Animation Js 2320. Video Play Js 2421. Password Toggle Js 25****************************************************/ 26 27(function ($) { 28 "use strict"; 29 30 var windowOn = $(window); 31 //////////////////////////////////////////////////// 32 // 01. PreLoader Js 33 windowOn.on("load", function () { 34 $("#loading").fadeOut(500); 35 }); 36 37 // last child menu 38 //$(".main-menus nav > ul > li").slice(-2).addClass("menu-last"); 39 40 //////////////////////////////////////////////////// 41 // 03. Common Js 42 43 $("[data-background").each(function () { 44 $(this).css( 45 "background-image", 46 "url( " + $(this).attr("data-background") + " )" 47 ); 48 }); 49 50 $("[data-width]").each(function () { 51 $(this).css("width", $(this).attr("data-width")); 52 }); 53 54 $("[data-padding-top]").each(function () { 55 $(this).css("padding-top", $(this).attr("data-padding-top")); 56 }); 57 58 $("[data-padding-bottom]").each(function () { 59 $(this).css("padding-bottom", $(this).attr("data-padding-bottom")); 60 }); 61 62 $("[data-bg-color]").each(function () { 63 $(this).css("background-color", $(this).attr("data-bg-color")); 64 }); 65 66 $("[data-text-color]").each(function () { 67 $(this).css("color", $(this).attr("data-text-color")); 68 }); 69 70 $(".has-img").each(function () { 71 var imgSrc = $(this).attr("data-menu-img"); 72 var img = `<img class="mega-menu-img" src="${imgSrc}" alt="img">`; 73 $(this).append(img); 74 }); 75 76 $(".wp-menu nav > ul > li").slice(-4).addClass("menu-last"); 77 78 $(".tp-hamburger-toggle").on("click", function () { 79 $(".tp-header-side-menu").slideToggle("tp-header-side-menu"); 80 }); 81 82 if ($(".tp-main-menu-content").length && $(".tp-main-menu-mobile").length) { 83 let navContent = document.querySelector( 84 ".tp-main-menu-content" 85 ).outerHTML; 86 let mobileNavContainer = document.querySelector(".tp-main-menu-mobile"); 87 mobileNavContainer.innerHTML = navContent; 88 89 let arrow = $(".tp-main-menu-mobile .has-dropdown > a"); 90 91 arrow.each(function () { 92 let self = $(this); 93 let arrowBtn = document.createElement("BUTTON"); 94 arrowBtn.classList.add("dropdown-toggle-btn"); 95 arrowBtn.innerHTML = "<i class='fa-regular fa-angle-right'></i>"; 96 97 self.append(function () { 98 return arrowBtn; 99 }); 100 101 self.find("button").on("click", function (e) { 102 e.preventDefault(); 103 let self = $(this); 104 self.toggleClass("dropdown-opened"); 105 self.parent().toggleClass("expanded"); 106 self 107 .parent() 108 .parent() 109 .addClass("dropdown-opened") 110 .siblings() 111 .removeClass("dropdown-opened"); 112 self.parent().parent().children(".tp-submenu").slideToggle(); 113 }); 114 }); 115 } 116 117 //////////////////////////////////////////////////// 118 // 03. Offcanvas Js 119 $(".offcanvas-open-btn").on("click", function () { 120 $(".offcanvas__area").addClass("offcanvas-opened"); 121 $(".body-overlay").addClass("opened"); 122 }); 123 $(".offcanvas-close-btn").on("click", function () { 124 $(".offcanvas__area").removeClass("offcanvas-opened"); 125 $(".body-overlay").removeClass("opened"); 126 }); 127 128 //////////////////////////////////////////////////// 129 // 05. One Page Scroll Js 130 function scrollNav() { 131 $(".tp-onepage-menu li a").click(function () { 132 $(".tp-onepage-menu li a.active").removeClass("active"); 133 $(this).addClass("active"); 134 135 $("html, body") 136 .stop() 137 .animate( 138 { 139 scrollTop: $($(this).attr("href")).offset().top - 76, 140 }, 141 300 142 ); 143 return false; 144 }); 145 } 146 scrollNav(); 147
148 //////////////////////////////////////////////////// 149 // 06. Search Js 150 $(".tp-search-open-btn").on("click", function () { 151 $(".tp-search-area").addClass("opened"); 152 $(".body-overlay").addClass("opened"); 153 }); 154 $(".tpsearchbar__close").on("click", function () { 155 $(".tp-search-area").removeClass("opened"); 156 $(".body-overlay").removeClass("opened"); 157 }); 158 159 //////////////////////////////////////////////////// 160 // 07. cartmini Js 161 $(".cartmini-open-btn").on("click", function () { 162 $(".cartmini__area").addClass("cartmini-opened"); 163 $(".body-overlay").addClass("opened"); 164 }); 165 166 $(".cartmini-close-btn").on("click", function () { 167 $(".cartmini__area").removeClass("cartmini-opened"); 168 $(".body-overlay").removeClass("opened"); 169 }); 170 171 //////////////////////////////////////////////////// 172 // 09. Body overlay Js 173 $(".body-overlay").on("click", function () { 174 $(".offcanvas__area").removeClass("offcanvas-opened"); 175 $(".tp-search-area").removeClass("opened"); 176 $(".cartmini__area").removeClass("cartmini-opened"); 177 $(".body-overlay").removeClass("opened"); 178 }); 179 180 //////////////////////////////////////////////////// 181 // 10. Sticky Header Js 182 windowOn.on("scroll", function () { 183 var scroll = $(window).scrollTop(); 184 if (scroll < 100) { 185 $("#header-sticky").removeClass("header-sticky"); 186 } else { 187 $("#header-sticky").addClass("header-sticky"); 188 } 189 }); 190 191 //////////////////////////////////////////////////// 192 // 11. Theme Settings Js 193 194 // settings append in body 195 function tp_settings_append($x) { 196 var settings = $("body"); 197 let dark; 198 $x == true ? (dark = "d-block") : (dark = "d-none"); 199 var settings_html = `<div class="tp-theme-settings-area transition-3"> 200 <div class="tp-theme-wrapper"> 201 <div class="tp-theme-header text-center"> 202 <h4 class="tp-theme-header-title">Harry Theme Settings</h4> 203 </div> 204 205 <!-- THEME TOGGLER --> 206 <div class="tp-theme-toggle mb-20 ${dark}"> 207 <label class="tp-theme-toggle-main" for="tp-theme-toggler"> 208 <span class="tp-theme-toggle-dark active"><i class="fa-light fa-moon"></i> Dark</span> 209 <input type="checkbox" id="tp-theme-toggler"> 210 <i class="tp-theme-toggle-slide"></i> 211 <span class="tp-theme-toggle-light"><i class="fa-light fa-sun-bright"></i> Light</span> 212 </label> 213 </div> 214 215 <!-- RTL SETTINGS --> 216 <div class="tp-theme-dir mb-20"> 217 <label class="tp-theme-dir-main" for="tp-dir-toggler"> 218 <span class="tp-theme-dir-rtl"> RTL</span> 219 <input type="checkbox" id="tp-dir-toggler"> 220 <i class="tp-theme-dir-slide"></i> 221 <span class="tp-theme-dir-ltr active"> LTR</span> 222 </label> 223 </div> 224 225 <!-- COLOR SETTINGS --> 226 <div class="tp-theme-settings"> 227 <div class="tp-theme-settings-wrapper"> 228 <div class="tp-theme-settings-open"> 229 <button class="tp-theme-settings-open-btn"> 230 <span class="tp-theme-settings-gear"> 231 <i class="fa-light fa-gear"></i> 232 </span> 233 <span class="tp-theme-settings-close"> 234 <i class="fa-regular fa-xmark"></i> 235 </span> 236 </button> 237 </div> 238 <div class="row row-cols-4 gy-2 gx-2"> 239 <div class="col"> 240 <div class="tp-theme-color-item tp-color-active"> 241 <button class="tp-theme-color-btn tp-color-settings-btn d-none" data-color-default="#F50963" type="button" data-color="#F50963"></button> 242 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#F50963"></button> 243 </div> 244 </div> 245 <div class="col"> 246 <div class="tp-theme-color-item tp-color-active"> 247 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#008080"></button> 248 </div> 249 </div> 250 <div class="col"> 251 <div class="tp-theme-color-item tp-color-active"> 252 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#AB6C
25256"></button> 253 </div> 254 </div> 255 <div class="col"> 256 <div class="tp-theme-color-item tp-color-active"> 257 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#3661FC"></button> 258 </div> 259 </div> 260 <div class="col"> 261 <div class="tp-theme-color-item tp-color-active"> 262 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#2CAE76"></button> 263 </div> 264 </div> 265 <div class="col"> 266 <div class="tp-theme-color-item tp-color-active"> 267 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#FF5A1B"></button> 268 </div> 269 </div> 270 <div class="col"> 271 <div class="tp-theme-color-item tp-color-active"> 272 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#03041C"></button> 273 </div> 274 </div> 275 <div class="col"> 276 <div class="tp-theme-color-item tp-color-active"> 277 <button class="tp-theme-color-btn tp-color-settings-btn" type="button" data-color="#ED212C"></button> 278 </div> 279 </div> 280 </div> 281 </div> 282 <div class="tp-theme-color-input"> 283 <h6>Choose Custom Color</h6> 284 <input type="color" id="tp-color-setings-input" value="#F50963"> 285 <label id="tp-theme-color-label" for="tp-color-setings-input"></label> 286 </div> 287 </div> 288 </div> 289 </div>`; 290 settings.append(settings_html); 291 } 292 // tp_settings_append(true); // if want to enable dark light mode then send "true"; 293 294 // settings open btn 295 $(".tp-theme-settings-open-btn").on("click", function () { 296 $(".tp-theme-settings-area").toggleClass("settings-opened"); 297 }); 298 299 // rtl settings 300 function tp_rtl_settings() { 301 $("#tp-dir-toggler").on("change", function () { 302 toggle_rtl(); 303 }); 304 305 // set toggle theme scheme 306 function tp_set_scheme(tp_dir) { 307 localStorage.setItem("tp_dir", tp_dir); 308 document.documentElement.setAttribute("dir", tp_dir); 309 310 if (tp_dir === "rtl") { 311 var list = $("[href='assets/css/bootstrap.css']"); 312 $(list).attr("href", "assets/css/bootstrap-rtl.css"); 313 } else { 314 var list = $("[href='assets/css/bootstrap.css']"); 315 $(list).attr("href", "assets/css/bootstrap.css"); 316 } 317 } 318 319 // toogle theme scheme 320 function toggle_rtl() { 321 if (localStorage.getItem("tp_dir") === "rtl") { 322 tp_set_scheme("ltr"); 323 var list = $("[href='assets/css/bootstrap-rtl.css']"); 324 $(list).attr("href", "assets/css/bootstrap.css"); 325 } else { 326 tp_set_scheme("rtl"); 327 var list = $("[href='assets/css/bootstrap.css']"); 328 $(list).attr("href", "assets/css/bootstrap-rtl.css"); 329 } 330 } 331 332 // set the first theme scheme 333 function tp_init_dir() { 334 if (localStorage.getItem("tp_dir") === "rtl") { 335 tp_set_scheme("rtl"); 336 var list = $("[href='assets/css/bootstrap.css']"); 337 $(list).attr("href", "assets/css/bootstrap-rtl.css"); 338 document.getElementById("tp-dir-toggler").checked = true; 339 } else { 340 tp_set_scheme("ltr"); 341 document.getElementById("tp-dir-toggler").checked = false; 342 var list = $("[href='assets/css/bootstrap.css']"); 343 $(list).attr("href", "assets/css/bootstrap.css"); 344 } 345 } 346 tp_init_dir(); 347 } 348 if ($("#tp-dir-toggler").length > 0) { 349 tp_rtl_settings(); 350 } 351 352 // dark light mode toggler 353 function tp_theme_toggler() { 354 $("#tp-theme-toggler").on("change", function () { 355 toggleTheme(); 356 }); 357 358 // set toggle theme scheme 359 function tp_set_scheme(tp_theme) { 360 localStorage.setItem("tp_theme_scheme", tp_theme); 361 document.documentElement.setAttribute("tp-theme", tp_theme); 362 } 363 364 // toogle theme scheme 365 function toggleTheme() { 366 if (localStorage.getItem("tp_theme_scheme") === "tp-theme-dark") { 367 tp_set_scheme("tp-theme-light"); 368 } else { 369 tp_set_scheme("tp-theme-dark"); 370 } 371 } 372 373 // set the first theme scheme 374 function tp_init_theme() { 375 if (localStorage.getItem("tp_theme_scheme") === "tp-theme-dark") { 376 tp_set_scheme("tp-theme-dark"); 377 document.getElementById("tp-theme-toggler").checked = true; 378 } else { 379 tp_set_scheme("tp-theme-light"); 380 document.getElementById("tp-theme-toggler").checked = false; 381 } 382 } 383 tp_init_theme(); 384 } 385 if ($("#tp-theme-toggler").length > 0) { 386 tp_theme_toggler(); 387 } 388 389 // color settings 390 function tp_color_settings() { 391 // set color scheme 392 function tp_set_color(tp_color_scheme) { 393 localStorage.setItem("tp_color_scheme", tp_color_scheme); 394 document 395 .querySelector(":root") 396 .style.setProperty("--tp-theme-1", tp_color_scheme); 397 document.getElementById("tp-color-setings-input").value = 398 tp_color_scheme; 399 document.getElementById("tp-theme-color-label").style.backgroundColor = 400 tp_color_scheme; 401 } 402 403 // set color 404 function tp_set_input() { 405 var color = localStorage.getItem("tp_color_scheme"); 406 document.getElementById("tp-color-setings-input").value = color; 407 document.getElementById("tp-theme-color-label").style.backgroundColor = 408 color; 409 } 410 tp_set_input(); 411 412 function tp_init_color() { 413 var defaultColor = $(".tp-color-settings-btn").attr( 414 "data-color-default" 415 ); 416 var setColor = localStorage.getItem("tp_color_scheme"); 417 418 if (setColor != null) { 419 } else { 420 setColor = defaultColor; 421 } 422 423 if (defaultColor !== setColor) { 424 document 425 .querySelector(":root") 426 .style.setProperty("--tp-theme-1", setColor); 427 document.getElementById("tp-color-setings-input").value = setColor; 428 document.getElementById( 429 "tp-theme-color-label" 430 ).style.backgroundColor = setColor; 431 tp_set_color(setColor); 432 } else { 433 document 434 .querySelector(":root") 435 .style.setProperty("--tp-theme-1", defaultColor); 436 document.getElementById("tp-color-setings-input").value = 437 defaultColor; 438 document.getElementById( 439 "tp-theme-color-label" 440 ).style.backgroundColor = defaultColor; 441 tp_set_color(defaultColor); 442 } 443 } 444 tp_init_color(); 445 446 let themeButtons = document.querySelectorAll(".tp-color-settings-btn"); 447 448 themeButtons.forEach((color) => { 449 color.addEventListener("click", () => { 450 let datacolor = color.getAttribute("data-color"); 451 document 452 .querySelector(":root") 453 .style.setProperty("--tp-theme-1", datacolor); 454 document.getElementById( 455 "tp-theme-color-label" 456 ).style.backgroundColor = datacolor; 457 tp_set_color(datacolor); 458 }); 459 }); 460 461 const colorInput = document.querySelector("#tp-color-setings-input"); 462 const colorVariable = "--tp-theme-1"; 463 464 colorInput.addEventListener("change", function (e) { 465 var clr = e.target.value; 466 document.documentElement.style.setProperty(colorVariable, clr); 467 tp_set_color(clr); 468 tp_set_check(clr); 469 }); 470 471 function tp_set_check(clr) { 472 const arr = Array.from(document.querySelectorAll("[data-color]")); 473 474 var a = localStorage.getItem("tp_color_scheme"); 475 476 let test = arr 477 .map((color) => { 478 let datacolor = color.getAttribute("data-color"); 479 480 return datacolor; 481 }) 482 .filter((color) => color == a); 483 484 var arrLength = test.length; 485 486 if (arrLength == 0) { 487 $(".tp-color-active").removeClass("active"); 488 } else { 489 $(".tp-color-active").addClass("active"); 490 } 491 } 492 493 function tp_check_color() { 494 var a = localStorage.getItem("tp_color_scheme"); 495 496 var list = $(`[data-color="${a}"]`); 497 498 list 499 .parent() 500 .addClass("active") 501 .parent() 502 .siblings() 503 .find(".tp-color-active") 504 .removeClass("active"); 505 } 506 tp_check_color(); 507 508 $(".tp-color-active").on("click", function () { 509 $(this) 510 .addClass("active") 511 .parent() 512 .siblings() 513 .find(".tp-color-active") 514 .removeClass("active"); 515 }); 516 } 517 if ( 518 $(".tp-color-settings-btn").length > 0 && 519 $("#tp-color-setings-input").length > 0 && 520 $("#tp-theme-color-label").length > 0 521 ) { 522 tp_color_settings();
523 } 524 525 //////////////////////////////////////////////////// 526 // 12. Nice Select Js 527 $(".tp-header-search-category select, .variations select").niceSelect(); 528 529 //////////////////////////////////////////////////// 530 // 13. Smooth Scroll Js 531 function smoothSctoll() { 532 $(".smooth a").on("click", function (event) { 533 var target = $(this.getAttribute("href")); 534 if (target.length) { 535 event.preventDefault(); 536 $("html, body") 537 .stop() 538 .animate( 539 { 540 scrollTop: target.offset().top - 120, 541 }, 542 1500 543 ); 544 } 545 }); 546 } 547 smoothSctoll(); 548 549 function back_to_top() { 550 var btn = $("#back_to_top"); 551 var btn_wrapper = $(".back-to-top-wrapper"); 552 553 windowOn.scroll(function () { 554 if (windowOn.scrollTop() > 300) { 555 btn_wrapper.addClass("back-to-top-btn-show"); 556 } else { 557 btn_wrapper.removeClass("back-to-top-btn-show"); 558 } 559 }); 560 561 btn.on("click", function (e) { 562 e.preventDefault(); 563 $("html, body").animate({ scrollTop: 0 }, "300"); 564 }); 565 } 566 back_to_top(); 567 568 var tp_rtl = localStorage.getItem("tp_dir"); 569 let rtl_setting = tp_rtl == "rtl" ? true : false; 570 571 //////////////////////////////////////////////////// 572 // 14. Slider Activation Area Start 573 $(".tp-slider-active-4").slick({ 574 infinite: true, 575 slidesToShow: 1, 576 slidesToScroll: 1, 577 arrows: true, 578 fade: true, 579 centerMode: true, 580 prevArrow: `<button type="button" class="tp-slider-3-button-prev"><svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 581 <path d="M1.00073 6.99989L15 6.99989" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> 582 <path d="M6.64648 1.5L1.00011 6.99954L6.64648 12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg></button>`, 583 nextArrow: `<button type="button" class="tp-slider-3-button-next"><svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 584 <path d="M14.9993 6.99989L1 6.99989" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> 585 <path d="M9.35352 1.5L14.9999 6.99954L9.35352 12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> 586 </svg></button>`, 587 asNavFor: ".tp-slider-nav-active", 588 appendArrows: $(".tp-slider-arrow-4"), 589 }); 590 591 // BLog 592 var slider = new Swiper(".tp-blog-main-slider-active", { 593 slidesPerView: 3, 594 spaceBetween: 20, 595 loop: true, 596 autoplay: { 597 delay: 4000, 598 }, 599 rtl: rtl_setting, 600 // Navigation arrows 601 navigation: { 602 nextEl: ".tp-blog-main-slider-button-next", 603 prevEl: ".tp-blog-main-slider-button-prev", 604 }, 605 pagination: { 606 el: ".tp-blog-main-slider-dot", 607 clickable: true, 608 renderBullet: function (index, className) { 609 return ( 610 '<span class="' + 611 className + 612 '">' + 613 "<button>" + 614 (index + 1) + 615 "</button>" + 616 "</span>" 617 ); 618 }, 619 }, 620 breakpoints: { 621 1200: { 622 slidesPerView: 3, 623 }, 624 992: { 625 slidesPerView: 2, 626 }, 627 768: { 628 slidesPerView: 2, 629 }, 630 576: { 631 slidesPerView: 1, 632 }, 633 0: { 634 slidesPerView: 1, 635 }, 636 }, 637 }); 638 639 // Home Slider One 640 var slider = new Swiper(".tp-slider-active", { 641 slidesPerView: 1, 642 loop: true, 643 autoplay: { 644 delay: 4500, 645 }, 646 rtl: rtl_setting, 647 pagination: { 648 el: ".tp-blog-main-slider-dot", 649 clickable: true, 650 renderBullet: function (index, className) { 651 return ( 652 '<span class="' + 653 className + 654 '">' + 655 "<button>" + 656 (index + 1) + 657 "</button>" + 658 "</span>" 659 ); 660 }, 661 }, 662 breakpoints: { 663 1200: { 664 slidesPerView: 1, 665 }, 666 992: { 667 slidesPerView: 1, 668 }, 669 768: { 670 slidesPerView: 1, 671 }, 672 576: { 673 slidesPerView: 1, 674 }, 675 0: { 676 slidesPerView: 1, 677 }, 678 }, 679 }); 680 681 // Home Slider Two
682 var slider = new Swiper(".tp-slider-2-active", { 683 slidesPerView: 1, 684 loop: true, 685 effect: "fade", 686 autoplay: { 687 delay: 4500, 688 }, 689 // Navigation arrows 690 navigation: { 691 nextEl: ".tp-slider-btn-2-next", 692 prevEl: ".tp-slider-btn-2-prev", 693 }, 694 autoplay: { 695 delay: 4500, 696 }, 697 breakpoints: { 698 1200: { 699 slidesPerView: 1, 700 }, 701 992: { 702 slidesPerView: 1, 703 }, 704 768: { 705 slidesPerView: 1, 706 }, 707 576: { 708 slidesPerView: 1, 709 }, 710 0: { 711 slidesPerView: 1, 712 }, 713 }, 714 }); 715 716 // Home Slider Two 717 var slider = new Swiper(".tp-slider-3-active", { 718 slidesPerView: 1, 719 loop: true, 720 effect: "fade", 721 autoplay: { 722 delay: 4500, 723 }, 724 // Navigation arrows 725 navigation: { 726 nextEl: ".tp-slider-btn-3-next", 727 prevEl: ".tp-slider-btn-3-prev", 728 }, 729 autoplay: { 730 delay: 4500, 731 }, 732 breakpoints: { 733 1200: { 734 slidesPerView: 1, 735 }, 736 992: { 737 slidesPerView: 1, 738 }, 739 768: { 740 slidesPerView: 1, 741 }, 742 576: { 743 slidesPerView: 1, 744 }, 745 0: { 746 slidesPerView: 1, 747 }, 748 }, 749 }); 750 751 // Home Two Project 752 var slider = new Swiper(".tp-project-2-active", { 753 slidesPerView: 4, 754 spaceBetween: 30, 755 loop: true, 756 autoplay: { 757 delay: 4500, 758 }, 759 // Navigation arrows 760 navigation: { 761 nextEl: ".tp-project-2-button-next", 762 prevEl: ".tp-project-2-button-prev", 763 }, 764 autoplay: { 765 delay: 4500, 766 }, 767 breakpoints: { 768 1600: { 769 slidesPerView: 4, 770 }, 771 1400: { 772 slidesPerView: 3, 773 }, 774 1200: { 775 slidesPerView: 3, 776 }, 777 992: { 778 slidesPerView: 3, 779 }, 780 768: { 781 slidesPerView: 2, 782 }, 783 576: { 784 slidesPerView: 1, 785 }, 786 0: { 787 slidesPerView: 1, 788 }, 789 }, 790 }); 791 792 // Home Two Project 793 var slider = new Swiper(".tp-instagram-2-active", { 794 slidesPerView: 5, 795 spaceBetween: 10, 796 loop: true, 797 autoplay: { 798 delay: 3000, 799 }, 800 autoplay: { 801 delay: 4500, 802 }, 803 breakpoints: { 804 1600: { 805 slidesPerView: 5, 806 }, 807 1400: { 808 slidesPerView: 4, 809 }, 810 1200: { 811 slidesPerView: 4, 812 }, 813 992: { 814 slidesPerView: 3, 815 }, 816 768: { 817 slidesPerView: 2, 818 }, 819 576: { 820 slidesPerView: 2, 821 }, 822 0: { 823 slidesPerView: 1, 824 }, 825 }, 826 }); 827 828 // Home Two Event 829 var slider = new Swiper(".tp-event-2-active", { 830 slidesPerView: 3, 831 spaceBetween: 30, 832 loop: true, 833 autoplay: { 834 delay: 4500, 835 }, 836 // Navigation arrows 837 navigation: { 838 nextEl: ".tp-event-2-button-next", 839 prevEl: ".tp-event-2-button-prev", 840 }, 841 autoplay: { 842 delay: 4500, 843 }, 844 breakpoints: { 845 1200: { 846 slidesPerView: 3, 847 }, 848 992: { 849 slidesPerView: 3, 850 }, 851 768: { 852 slidesPerView: 2, 853 }, 854 576: { 855 slidesPerView: 1, 856 }, 857 0: { 858 slidesPerView: 1, 859 }, 860 }, 861 }); 862 863 // Home Two Project 864 var slider = new Swiper(".tp-testimonial-2-active", { 865 slidesPerView: 1, 866 loop: true, 867 dots: true, 868 autoplay: { 869 delay: 6000, 870 }, 871 pagination: { 872 el: ".tp-testimonial-2-pagination", 873 clickable: true, 874 }, 875 breakpoints: { 876 1200: { 877 slidesPerView: 1, 878 }, 879 992: { 880 slidesPerView: 1, 881 }, 882 768: { 883 slidesPerView: 1, 884 }, 885 576: { 886 slidesPerView: 1, 887 }, 888 0: { 889 slidesPerView: 1, 890 }, 891 }, 892 }); 893 894 // Home Two Event 895 var slider = new Swiper(".tp-event-3-active", { 896 slidesPerView: 4, 897 spaceBetween: 30, 898 loop: true, 899 autoplay: { 900 delay: 4500, 901 }, 902 // Navigation arrows 903 navigation: { 904 nextEl: ".tp-event-2-button-next", 905 prevEl: ".tp-event-2-button-prev", 906 }, 907 autoplay: { 908 delay: 4500, 909 }, 910 breakpoints: { 911 1200: { 912 slidesPerView: 4, 913 }, 914 992: { 915 slidesPerView: 3, 916 }, 917 768: { 918 slidesPerView: 2, 919 }, 920 576: { 921 slidesPerView: 1, 922 }, 923 0: { 924 slidesPerView: 1, 925 }, 926 }, 927 }); 928 929 // Home Three Brand 930 var slider = new Swiper(".tp-brand-active", { 931 slidesPerView: 5, 932 loop: true, 933 dots: true, 934 autoplay: { 935 delay: 4000, 936 }, 937 breakpoints: { 938 1200: { 939 slidesPerView: 5, 940 }, 941 992: { 942 slidesPerView: 3, 943 }, 944 768: { 945 slidesPerView: 2, 946 }, 947 576: { 948 slidesPerView: 2, 949 }, 950 0: { 951 slidesPerView: 1, 952 }, 953 }, 954 }); 955 956 // Home Three Social 957 var slider = new Swiper(".tp-social-active", { 958 slidesPerView: 6, 959 loop: true, 960 dots: true, 961 autoplay: { 962 delay: 4000, 963 }, 964 breakpoints: { 965 1400: { 966 slidesPerView: 6, 967 }, 968 1200: { 969 slidesPerView: 5, 970 }, 971 992: { 972 slidesPerView: 4, 973 }, 974 768: { 975 slidesPerView: 3, 976 }, 977 576: { 978 slidesPerView: 2, 979 }, 980 0: { 981 slidesPerView: 1, 982 }, 983 }, 984 }); 985 986 // Testimonial Slider One 987 var slider = new Swiper(".tp-testimonial-active", { 988 slidesPerView: 3, 989 spaceBetween: 30, 990 centeredSlides: true, 991 loop: true, 992 autoplay: { 993 delay: 4000, 994 }, 995 rtl: rtl_setting, 996 // Navigation arrows 997 pagination: { 998 el: ".tp-blog-main-slider-dot", 999 clickable: true, 1000 }, 1001 breakpoints: { 1002 1200: { 1003 slidesPerView: 3, 1004 }, 1005 992: { 1006 slidesPerView: 3, 1007 }, 1008 768: { 1009 slidesPerView: 2, 1010 centeredSlides: false, 1011 }, 1012 576: { 1013 slidesPerView: 1, 1014 centeredSlides: false, 1015 }, 1016 0: { 1017 slidesPerView: 1, 1018 centeredSlides: false, 1019 }, 1020 }, 1021 }); 1022 1023 // Project Slider One 1024 var slider = new Swiper(".tp-project-active", { 1025 slidesPerView: 3, 1026 spaceBetween: 0, 1027 centeredSlides: true, 1028 loop: true, 1029 autoplay: { 1030 delay: 4000, 1031 }, 1032 rtl: rtl_setting, 1033 1034 breakpoints: { 1035 1200: { 1036 slidesPerView: 3, 1037 }, 1038 992: { 1039 slidesPerView: 3, 1040 }, 1041 768: { 1042 slidesPerView: 2, 1043 }, 1044 576: { 1045 slidesPerView: 1, 1046 }, 1047 0: { 1048 slidesPerView: 1, 1049 }, 1050 }, 1051 }); 1052 1053 // Shop Slider 1054 var slider = new Swiper(".tp-shop-active", { 1055 slidesPerView: 4, 1056 spaceBetween: 30, 1057 loop: true, 1058 autoplay: { 1059 delay: 3500, 1060 }, 1061 breakpoints: { 1062 1200: { 1063 slidesPerView: 4, 1064 }, 1065 992: { 1066 slidesPerView: 3, 1067 }, 1068 768: { 1069 slidesPerView: 2, 1070 centeredSlides: false, 1071 }, 1072 576: { 1073 slidesPerView: 1, 1074 centeredSlides: false, 1075 }, 1076 0: { 1077 slidesPerView: 1, 1078 centeredSlides: false, 1079 }, 1080 }, 1081 }); 1082 1083 // postbox slider 1084 var postboxSlider = new Swiper(".postbox-slider", { 1085 slidesPerView: 1, 1086 spaceBetween: 0, 1087 loop: true, 1088 rtl: rtl_setting, 1089 autoplay: { 1090 delay: 3000, 1091 }, 1092 // Navigation arrows 1093 navigation: { 1094 nextEl: ".postbox-slider-button-next", 1095 prevEl: ".postbox-slider-button-prev", 1096 }, 1097 breakpoints: { 1098 1200: { 1099 slidesPerView: 1, 1100 }, 1101 992: { 1102 slidesPerView: 1, 1103 }, 1104 768: { 1105 slidesPerView: 1, 1106 }, 1107 576: { 1108 slidesPerView: 1, 1109 }, 1110 0: { 1111 slidesPerView: 1, 1112 }, 1113 }, 1114 }); 1115
1116 //////////////////////////////////////////////////// 1117 // 15. Masonary Js 1118 $(".grid").imagesLoaded(function () { 1119 // init Isotope 1120 var $grid = $(".grid").isotope({ 1121 itemSelector: ".grid-item", 1122 percentPosition: true, 1123 masonry: { 1124 // use outer width of grid-sizer for columnWidth 1125 columnWidth: ".grid-item", 1126 }, 1127 }); 1128 1129 // filter items on button click 1130 $(".masonary-menu").on("click", "button", function () { 1131 var filterValue = $(this).attr("data-filter"); 1132 $grid.isotope({ filter: filterValue }); 1133 }); 1134 1135 //for menu active class 1136 $(".masonary-menu button").on("click", function (event) { 1137 $(this).siblings(".active").removeClass("active"); 1138 $(this).addClass("active"); 1139 event.preventDefault(); 1140 }); 1141 }); 1142 1143 /* magnificPopup img view */ 1144 $(".popup-image").magnificPopup({ 1145 type: "image", 1146 gallery: { 1147 enabled: true, 1148 }, 1149 }); 1150 1151 /* magnificPopup video view */ 1152 $(".popup-video").magnificPopup({ 1153 type: "iframe", 1154 }); 1155 1156 if ($(".scene").length > 0) { 1157 $(".scene").parallax({ 1158 scalarX: 5.0, 1159 scalarY: 5.0, 1160 }); 1161 } 1162 1163 //////////////////////////////////////////////////// 1164 // 16. Wow Js 1165 new WOW().init(); 1166 1167 function tp_ecommerce() { 1168 $(".tp-cart-minus").on("click", function () { 1169 var $input = $(this).parent().find("input"); 1170 var count = parseInt($input.val()) - 1; 1171 count = count < 1 ? 1 : count; 1172 $input.val(count); 1173 $input.change(); 1174 return false; 1175 }); 1176 1177 $(".tp-cart-plus").on("click", function () { 1178 var $input = $(this).parent().find("input"); 1179 $input.val(parseInt($input.val()) + 1); 1180 $input.change(); 1181 return false; 1182 }); 1183 1184 $("#slider-range").slider({ 1185 range: true, 1186 min: 0, 1187 max: 500, 1188 values: [75, 300], 1189 slide: function (event, ui) { 1190 $("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]); 1191 }, 1192 }); 1193 $("#amount").val( 1194 "$" + 1195 $("#slider-range").slider("values", 0) + 1196 " - $" + 1197 $("#slider-range").slider("values", 1) 1198 ); 1199 1200 $(".tp-checkout-payment-item label").on("click", function () { 1201 $(this).siblings(".tp-checkout-payment-desc").slideToggle(400); 1202 }); 1203 1204 $(".tp-color-variation-btn").on("click", function () { 1205 $(this).addClass("active").siblings().removeClass("active"); 1206 }); 1207 1208 $(".tp-size-variation-btn").on("click", function () { 1209 $(this).addClass("active").siblings().removeClass("active"); 1210 }); 1211 1212 //////////////////////////////////////////////////// 1213 // 17. Show Login Toggle Js 1214 $(".tp-checkout-login-form-reveal-btn").on("click", function () { 1215 $("#tpReturnCustomerLoginForm").slideToggle(400); 1216 }); 1217 1218 //////////////////////////////////////////////////// 1219 // 18. Show Coupon Toggle Js 1220 $(".tp-checkout-coupon-form-reveal-btn").on("click", function () { 1221 $("#tpCheckoutCouponForm").slideToggle(400); 1222 }); 1223 1224 //////////////////////////////////////////////////// 1225 // 19. Create An Account Toggle Js 1226 $("#cbox").on("click", function () { 1227 $("#cbox_info").slideToggle(900); 1228 }); 1229 1230 //////////////////////////////////////////////////// 1231 // 20. Shipping Box Toggle Js 1232 $("#ship-box").on("click", function () { 1233 $("#ship-box-info").slideToggle(1000); 1234 }); 1235 } 1236 tp_ecommerce(); 1237 1238 //////////////////////////////////////////////////// 1239 // 17. Counter Js 1240 new PureCounter(); 1241 new PureCounter({ 1242 filesizing: true, 1243 selector: ".filesizecount", 1244 pulse: 2, 1245 }); 1246 1247 //////////////////////////////////////////////////// 1248 // 18. InHover Active Js 1249 $(".hover__active").on("mouseenter", function () { 1250 $(this) 1251 .addClass("active") 1252 .parent() 1253 .siblings() 1254 .find(".hover__active") 1255 .removeClass("active"); 1256 }); 1257 1258 $(".col-custom").on("click", function () { 1259 // $('#services-item-thumb').removeClass().addClass($(this).attr('rel')); 1260 $(this).addClass("active").siblings().removeClass("active"); 1261 }); 1262 1263 $("").on("click", function () { 1264 // $('#features-item-thumb').removeClass().addClass($(this).attr('rel')); 1265 $(this).addClass("active").siblings().removeClass("active"); 1266 }); 1267
1268 //////////////////////////////////////////////////// 1269 // 19. Line Animation Js 1270 if ($("#marker").length > 0) { 1271 function tp_tab_line() { 1272 var marker = document.querySelector("#marker"); 1273 var item = document.querySelectorAll(".menu-style-3 > nav > ul > li"); 1274 var itemActive = document.querySelector( 1275 ".menu-style-3 > nav > ul > li.active" 1276 ); 1277 1278 function indicator(e) { 1279 marker.style.left = e.offsetLeft + "px"; 1280 marker.style.width = e.offsetWidth + "px"; 1281 } 1282 1283 item.forEach((link) => { 1284 link.addEventListener("mouseenter", (e) => { 1285 indicator(e.target); 1286 }); 1287 }); 1288 1289 var activeNav = $(".menu-style-3 > nav > ul > li.active"); 1290 var activewidth = $(activeNav).width(); 1291 var activePadLeft = parseFloat($(activeNav).css("padding-left")); 1292 var activePadRight = parseFloat($(activeNav).css("padding-right")); 1293 var totalWidth = activewidth + activePadLeft + activePadRight; 1294 1295 var precedingAnchorWidth = anchorWidthCounter(); 1296 1297 $(marker).css("display", "block"); 1298 1299 $(marker).css("width", totalWidth); 1300 1301 function anchorWidthCounter() { 1302 var anchorWidths = 0; 1303 var a; 1304 var aWidth; 1305 var aPadLeft; 1306 var aPadRight; 1307 var aTotalWidth; 1308 $(".menu-style-3 > nav > ul > li").each(function (index, elem) { 1309 var activeTest = $(elem).hasClass("active"); 1310 marker.style.left = elem.offsetLeft + "px"; 1311 if (activeTest) { 1312 // Break out of the each function. 1313 return false; 1314 } 1315 1316 a = $(elem).find("li"); 1317 aWidth = a.width(); 1318 aPadLeft = parseFloat(a.css("padding-left")); 1319 aPadRight = parseFloat(a.css("padding-right")); 1320 aTotalWidth = aWidth + aPadLeft + aPadRight; 1321 1322 anchorWidths = anchorWidths + aTotalWidth; 1323 }); 1324 1325 return anchorWidths; 1326 } 1327 } 1328 tp_tab_line(); 1329 } 1330 1331 if ($("#productTabMarker").length > 0) { 1332 function tp_tab_line_2() { 1333 var marker = document.querySelector("#productTabMarker"); 1334 var item = document.querySelectorAll(".tp-product-tab button"); 1335 var itemActive = document.querySelector( 1336 ".tp-product-tab .nav-link.active" 1337 ); 1338 1339 // rtl settings 1340 var tp_rtl = localStorage.getItem("tp_dir"); 1341 let rtl_setting = tp_rtl == "rtl" ? "right" : "left"; 1342 1343 function indicator(e) { 1344 marker.style.left = e.offsetLeft + "px"; 1345 marker.style.width = e.offsetWidth + "px"; 1346 } 1347 1348 item.forEach((link) => { 1349 link.addEventListener("click", (e) => { 1350 indicator(e.target); 1351 }); 1352 }); 1353 1354 var activeNav = $(".nav-link.active"); 1355 var activewidth = $(activeNav).width(); 1356 var activePadLeft = parseFloat($(activeNav).css("padding-left")); 1357 var activePadRight = parseFloat($(activeNav).css("padding-right")); 1358 var totalWidth = activewidth + activePadLeft + activePadRight; 1359 1360 var precedingAnchorWidth = anchorWidthCounter(); 1361 1362 $(marker).css("display", "block"); 1363 1364 $(marker).css("width", totalWidth); 1365 1366 function anchorWidthCounter() { 1367 var anchorWidths = 0; 1368 var a; 1369 var aWidth; 1370 var aPadLeft; 1371 var aPadRight; 1372 var aTotalWidth; 1373 $(".tp-product-tab button").each(function (index, elem) { 1374 var activeTest = $(elem).hasClass("active"); 1375 marker.style.left = elem.offsetLeft + "px"; 1376 if (activeTest) { 1377 // Break out of the each function. 1378 return false; 1379 } 1380 1381 a = $(elem).find("button"); 1382 aWidth = a.width(); 1383 aPadLeft = parseFloat(a.css("padding-left")); 1384 aPadRight = parseFloat(a.css("padding-right")); 1385 aTotalWidth = aWidth + aPadLeft + aPadRight; 1386
1387 anchorWidths = anchorWidths + aTotalWidth; 1388 }); 1389 1390 return anchorWidths; 1391 } 1392 } 1393 tp_tab_line_2(); 1394 } 1395 1396 //////////////////////////////////////////////////// 1397 // 20. Video Play Js 1398 var play = false; 1399 $(".tp-video-toggle-btn").on("click", function () { 1400 if (play === false) { 1401 $(".tp-slider-video").addClass("full-width"); 1402 $(this).addClass("hide"); 1403 play = true; 1404 1405 $(".tp-slider-video") 1406 .find("video") 1407 .each(function () { 1408 $(this).get(0).play(); 1409 }); 1410 } else { 1411 $(".tp-slider-video").removeClass("full-width"); 1412 $(this).removeClass("hide"); 1413 play = false; 1414 $(".tp-slider-video") 1415 .find("video") 1416 .each(function () { 1417 $(this).get(0).pause(); 1418 }); 1419 } 1420 }); 1421 1422 //////////////////////////////////////////////////// 1423 // 21. Password Toggle Js 1424 if ($(".password-show-toggle").length > 0) { 1425 var showBtn = $(".password-show-toggle"); 1426 1427 showBtn.each(function (e) { 1428 $(this).on("click", function (x) { 1429 let inputField = $(this).parent().find("input"); 1430 if (inputField.attr("type") === "password") { 1431 inputField.attr("type", "text"); 1432 $(this).children(".open-eye-icon").css({ 1433 display: "block", 1434 }); 1435 $(this).children(".close-eye-icon").css({ 1436 display: "none", 1437 }); 1438 } else { 1439 inputField.attr("type", "password"); 1440 $(this).children(".open-eye-icon").css({ 1441 display: "none", 1442 }); 1443 $(this).children(".close-eye-icon").css({ 1444 display: "block", 1445 }); 1446 } 1447 }); 1448 }); 1449 } 1450 1451 if ($(".tp-header-height").length > 0) { 1452 var headerHeight = document.querySelector(".tp-header-height"); 1453 var setHeaderHeight = headerHeight.offsetHeight; 1454 1455 $(".tp-header-height").each(function () { 1456 $(this).css({ 1457 height: setHeaderHeight + "px", 1458 }); 1459 }); 1460 } 1461 1462 // product details thumb slider 1463 $(document).ready(function () { 1464 setTimeout(() => { 1465 $(".flex-control-thumbs").addClass("product-thumbnails"); 1466 if ($(".woocommerce-product-gallery").hasClass("vertical") && $(window).width() > 992) { 1467 var verti = true; 1468 } else { 1469 var verti = false; 1470 } 1471 1472 $('.product-thumbnails').slick({ 1473 dots: false, 1474 arrows: false, 1475 prevArrow: '<div class="prev"><i class="far fa-angle-left"></i></div>', 1476 nextArrow: '<div class="next"><i class="far fa-angle-right"></i></div>', 1477 autoplay: false, 1478 Speed: 2000, 1479 slidesToShow: 5, 1480 slidesToScroll: 1, 1481 focusOnSelect: true, 1482 vertical: false, 1483 }); 1484 }, 10); 1485 }); 1486 1487})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.