https://parisaline.com/template/js/app.js

1
2
3
4/*********************************/
5/*         INDEX                 */
6/*================================
7 *     01.  Loader               *
8 *     02.  Toggle Menus         *
9 *     03.  Menu Active          *
10 *     04.  Clickable Menu       *
11 *     05.  Menu Sticky          *
12 *     06.  Back to top          *
13 *     07.  Active Sidebar       *
14 *     08.  Feather icon         *
15 *     09.  Small Menu           *
16 *     10.  Wow Animation JS     *
17 *     11.  Contact us           *
18 *     12.  Dark & Light Mode    *
19 *     13.  LTR & RTL Mode       *
20 ================================*/
21
22
23window.addEventListener('load', fn, false)
24
25//  window.onload = function loader() {
26function fn() {
27    // Preloader
28    if (document.getElementById('preloader')) {
29        setTimeout(() => {
30            document.getElementById('preloader').style.visibility = 'hidden';
31            document.getElementById('preloader').style.opacity = '0';
32        }, 350);
33    }
34    // Menus
35    activateMenu();
36}
37
38//Menu
39/*********************/
40/* Toggle Menu */
41/*********************/
42function toggleMenu() {
43    document.getElementById('isToggle').classList.toggle('open');
44    var isOpen = document.getElementById('navigation')
45    if (isOpen.style.display === "block") {
46        isOpen.style.display = "none";
47    } else {
48        isOpen.style.display = "block";
49    }
50};
51/*********************/
52/*    Menu Active    */
53/*********************/
54function getClosest(elem, selector) {
55
56    // Element.matches() polyfill
57    if (!Element.prototype.matches) {
58        Element.prototype.matches =
59            Element.prototype.matchesSelector ||
60            Element.prototype.mozMatchesSelector ||
61            Element.prototype.msMatchesSelector ||
62            Element.prototype.oMatchesSelector ||
63            Element.prototype.webkitMatchesSelector ||
64            function (s) {
65                var matches = (this.document || this.ownerDocument).querySelectorAll(s),
66                    i = matches.length;
67                while (--i >= 0 && matches.item(i) !== this) {}
68                return i > -1;
69            };
70    }
71
72    // Get the closest matching element
73    for (; elem && elem !== document; elem = elem.parentNode) {
74        if (elem.matches(selector)) return elem;
75    }
76    return null;
77
78};
79
80function activateMenu() {
81    var menuItems = document.getElementsByClassName("sub-menu-item");
82    if (menuItems) {
83
84        var matchingMenuItem = null;
85        for (var idx = 0; idx < menuItems.length; idx++) {
86            if (menuItems[idx].href === window.location.href) {
87                matchingMenuItem = menuItems[idx];
88            }
89        }
90
91        if (matchingMenuItem) {
92            matchingMenuItem.classList.add('active');
93         
94         
95            var immediateParent = getClosest(matchingMenuItem, 'li');
96      
97            if (immediateParent) {
98                immediateParent.classList.add('active');
99            }
100            
101            var parent = getClosest(immediateParent, '.child-menu-item');
102            if(parent){
103                parent.classList.add('active');
104            }
105
106            var parent = getClosest(parent || immediateParent , '.parent-menu-item');
107        
108            if (parent) {
109                parent.classList.add('active');
110
111                var parentMenuitem = parent.querySelector('.menu-item');
112                if (parentMenuitem) {
113                    parentMenuitem.classList.add('active');
114                }
115
116                var parentOfParent = getClosest(parent, '.parent-parent-menu-item');
117                if (parentOfParent) {
118                    parentOfParent.classList.add('active');
119                }
120            } else {
121                var parentOfParent = getClosest(matchingMenuItem, '.parent-parent-menu-item');
122                if (parentOfParent) {
123                    parentOfParent.classList.add('active');
124                }
125            }
126        }
127    }
128}
129/*********************/
130/*  Clickable manu   */
131/*********************/
132if (document.getElementById("navigation")) {
133    var elements = document.getElementById("navigation").getElementsByTagName("a");
134    for (var i = 0, len = elements.length; i < len; i++) {
135        elements[i].onclick = function (elem) {
136            if (elem.target.getAttribute("href") === "javascript:void(0)") {
137                var submenu = elem.target.nextElementSibling.nextElementSibling;
138                submenu.classList.toggle('open');
139            }
140        }
141    }
142}
143/*********************/
144/*   Menu Sticky     */
145/*********************/
146function windowScroll() {
147    const navbar = document.getElementById("topnav");
148    if (navbar != null) {
149        if (
150            document.body.scrollTop >= 50 ||
151            document.documentElement.scrollTop >= 50
152        ) {
153            navbar.classList.add("nav-sticky");
154        } else {
155            navbar.classList.remove("nav-sticky");
156        }
157    }
158}
159
160window.addEventListener('scroll', (ev) => {
161    ev.preventDefault();
162    windowScroll();
163})
164/*********************/
165/*    Back To TOp    */
166/*********************/
167
168window.onscroll = function () {
169    scrollFunction();
170};
171
172function scrollFunction() {
173    var mybutton = document.getElementById("back-to-top");
174    if(mybutton!=null){
175        if (document.body.scrollTop > 500 || document.documentElement.scrollTop > 500) {
176            mybutton.classList.add("block");
177            mybutton.classList.remove("hidden");
178        } else {
179            mybutton.classList.add("hidden");
180            mybutton.classList.remove("block");
181        }
182    }
183}
184

185function topFunction() {
186    document.body.scrollTop = 0;
187    document.documentElement.scrollTop = 0;
188}
189
190/*********************/
191/*  Active Sidebar   */
192/*********************/
193(function () {
194    var current = location.pathname.substring(location.pathname.lastIndexOf('/') + 1);;
195    if (current === "") return;
196    var menuItems = document.querySelectorAll('.sidebar-nav a');
197    for (var i = 0, len = menuItems.length; i < len; i++) {
198        if (menuItems[i].getAttribute("href").indexOf(current) !== -1) {
199            menuItems[i].parentElement.className += " active";
200        }
201    }
202})();
203
204/*********************/
205/*   Feather Icons   */
206/*********************/
207feather.replace();
208
209/*********************/
210/*     Small Menu    */
211/*********************/
212try {
213    var spy = new Gumshoe('#navmenu-nav a');
214} catch (err) {
215
216}
217
218/*********************/
219/*      WoW Js       */
220/*********************/
221try {
222    new WOW().init();
223} catch (error) {
224    
225}
226
227/*************************/
228/*      Contact Js       */
229/*************************/
230
231try {
232    function validateForm() {
233        var name = document.forms["myForm"]["name"].value;
234        var email = document.forms["myForm"]["email"].value;
235        var subject = document.forms["myForm"]["subject"].value;
236        var comments = document.forms["myForm"]["comments"].value;
237        document.getElementById("error-msg").style.opacity = 0;
238        document.getElementById('error-msg').innerHTML = "";
239        var $msg;
240        if (name == "" || name == null) {
241            $msg=document.getElementById('name_msg').innerHTML;
242            document.getElementById('error-msg').innerHTML = "<div class='alert alert-warning error_message'>"+$msg+"</div>";
243            fadeIn();
244            return false;
245        }
246        if (email == "" || email == null) {
247            $msg=document.getElementById('email_msg').innerHTML;
248            document.getElementById('error-msg').innerHTML = "<div class='alert alert-warning error_message'>"+$msg+"</div>";
249            fadeIn();
250            return false;
251        }
252        if (subject == "" || subject == null) {
253            $msg=document.getElementById('subject_msg').innerHTML;
254            document.getElementById('error-msg').innerHTML = "<div class='alert alert-warning error_message'>"+$msg+"</div>";
255            fadeIn();
256            return false;
257        }
258        if (comments == "" || comments == null) {
259            $msg=document.getElementById('comment_msg').innerHTML;
260            document.getElementById('error-msg').innerHTML = "<div class='alert alert-warning error_message'>"+$msg+"</div>";
261            fadeIn();
262            return false;
263        }
264        var xhttp = new XMLHttpRequest();
265        xhttp.onreadystatechange = function () {
266            if (this.readyState == 4 && this.status == 200) {
267                document.getElementById("simple-msg").innerHTML = this.responseText;
268                document.forms["myForm"]["name"].value = "";
269                document.forms["myForm"]["email"].value = "";
270                document.forms["myForm"]["subject"].value = "";
271                document.forms["myForm"]["comments"].value = "";
272            }
273        };
274        xhttp.open("POST", "php/contact.php", true);
275        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
276        xhttp.send("name=" + name + "&email=" + email + "&subject=" + subject + "&comments=" + comments);
277        return false;
278    }
279
280    function fadeIn() {
281        var fade = document.getElementById("error-msg");
282        var opacity = 0;
283        var intervalID = setInterval(function () {
284            if (opacity < 1) {
285                opacity = opacity + 0.5
286                fade.style.opacity = opacity;
287            } else {
288                clearInterval(intervalID);
289            }
290        }, 200);
291    }
292} catch (error) {
293    
294}
295
296
297/*********************/
298/* Dark & Light Mode */
299/*********************/
300try {
301    function changeTheme(e){
302        e.preventDefault()
303        const htmlTag = document.getElementsByTagName("html")[0]
304        
305        if (htmlTag.className.includes("dark")) {
306            htmlTag.className = 'light'
307        } else {
308            htmlTag.className = 'dark'
309        }
310    }
311
312    const switcher = document.getElementById("theme-mode")
313    switcher?.addEventListener("click" ,changeTheme )
314    
315    const chk = document.getElementById('chk');
316
317    chk.addEventListener('change',changeTheme);
318} catch (err) {
319    
320}
321
322
323/*********************/
324/* LTR & RTL Mode */
325/*********************/
326try{
327    const htmlTag = document.getElementsByTagName("html")[0]
328    function changeLayout(e){
329        e.preventDefault()
330        const switcherRtl = document.getElementById("switchRtl")
331        if(switcherRtl.innerText === "LTR"){
332            htmlTag.dir = "ltr"
333        }
334        else{
335            htmlTag.dir = "rtl"
336        }
337        
338    }
339    const switcherRtl = document.getElementById("switchRtl")
340    switcherRtl?.addEventListener("click" ,changeLayout )
341}
342catch(err){}