Server IP : 15.235.198.142 / Your IP : 216.73.216.0 Web Server : Apache/2.4.58 (Ubuntu) System : Linux ballsack 6.8.0-45-generic #45-Ubuntu SMP PREEMPT_DYNAMIC Fri Aug 30 12:02:04 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 8.3.6 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /var/www/yme/wp-content/themes/oceanwp/assets/src/js/theme/search/ |
Upload File : |
import { options } from "../../constants"; import { fadeIn, fadeOut } from "../../lib/utils"; import SearchBase from "./base"; class MobileSearchIcon extends SearchBase { #elements; constructor() { super(); if (options.mobileMenuSearchStyle === "disabled") { return; } this.#setElements(); this.#setupEventListeners(); } #setElements = () => { this.#elements = { dropdownSearchIcon: document.querySelector(".search-icon-dropdown"), dropdownSearchForm: document.querySelector(".search-style-dropdown"), overlaySearch: document.querySelector(".search-style-overlay"), overlaySearchIcon: document.querySelector(".search-icon-overlay"), overlaySearchCloseIcon: document.querySelector( ".search-style-overlay .search-overlay-close" ), html: document.querySelector("html"), }; }; #setupEventListeners = () => { if ( ! this.#elements ) { return; } if (options.mobileMenuSearchStyle === "drop_down") { this.#elements.dropdownSearchIcon?.addEventListener( "click", this.#toggleDropdownSearch ); document.addEventListener("click", this.#onClickDocument); } else if (options.mobileMenuSearchStyle === "overlay") { this.#elements.overlaySearchIcon?.addEventListener( "click", this.#openOverlaySearch ); this.#elements.overlaySearchCloseIcon?.addEventListener( "click", this.#closeOverlaySearch ); this.#elements.overlaySearch?.addEventListener( "click", this.#onClickOverlaySearch ); } }; #toggleDropdownSearch = (event) => { event.preventDefault(); event.stopPropagation(); this.#elements.dropdownSearchForm.classList.toggle("show"); this.#elements.dropdownSearchIcon.classList.toggle("active"); this.focus( this.#elements.dropdownSearchForm.querySelector("form"), "input.field" ); }; #openOverlaySearch = (event) => { event.preventDefault(); this.#elements.overlaySearch.classList.add("active"); fadeIn(this.#elements.overlaySearch); this.focus( this.#elements.overlaySearch.querySelector("form"), "input.mobile-search-overlay-input" ); setTimeout(() => { this.#elements.html.style.overflow = "hidden"; }, 400); }; #closeOverlaySearch = (event) => { event.preventDefault(); this.#elements.overlaySearch.classList.remove("active"); fadeOut(this.#elements.overlaySearch); setTimeout(() => { this.#elements.html.style.overflow = "visible"; }, 400); }; #onClickOverlaySearch = (event) => { this.#elements.overlaySearch.querySelector("input").focus(); }; #onClickDocument = (event) => { if (!event.target.closest("#icon-searchform-dropdown.show")) { this.#elements.dropdownSearchIcon.classList.remove("active"); this.#elements.dropdownSearchForm.classList.remove("show"); } }; } ("use script"); window.oceanwp = window.oceanwp || {}; oceanwp.mobileSearchIcon = new MobileSearchIcon();