Test JS modules...

js/fara.js

@@ -0,0 +1,16 @@
+//use strict;
+
+export {Farapp};
+
+const Farapp = {
+    slider : /*** Fade in??*/ function (element, nextimage) {
+       opacity = 1;
+
+       if(nextimage >= images.length) {
+           nextimage = 0;
+       }
+       element.style = 
+           'background-image : url("' +images[nextimage++] + '");';
+       setTimeout(slider, 2000);
+   }
+}

js/ui.js

@@ -0,0 +1,51 @@
+//use strict;
+import { Farapp } from "./fara";'fara.js';
+
+window.addEventListener('load', () => {
+    let navlinks = Array.from(document.querySelectorAll('#links a'));
+
+    navlinks.forEach(element => {
+        let ref = element.href.substr(element.href.lastIndexOf('/'), element.href.length);
+        
+        if (window.location.href.includes(ref) || element.href.includes('index.html')) {
+            element.setAttribute('class', 'active');
+        }
+    });
+
+    let images = [
+        'img/fara_background.jpg',
+        //'img/fara_bg_2.jpg',
+        'img/fara_bg_3.jpg',
+        'img/fara_bg_4.jpg',
+        'img/fara_bg_5.jpg',
+        //'img/fara_bg_6.jpg',
+        'img/fara_bg_7.jpg',
+        'img/fara_bg_8.jpg',
+        'img/fara_bg_9.jpg',
+        'img/fara_bg_10.png',
+        'img/fara_bg_11.jpg',
+    ];
+    let nextimage = 0;
+    let header = document.querySelector('header');
+    
+    Farapp.slider(header, nextimage);
+ 
+});
+
+window.addEventListener('scroll', event => {
+    let nav = document.querySelector('#nav');
+    let links = document.querySelector('#links');
+
+    if (window.pageYOffset !== 0) {
+        nav.classList.add('bg-white');
+        nav.classList.remove('text-gray');
+        links.classList.add('nav-dark');
+        links.classList.remove('nav-light');
+    }
+    else {
+        nav.classList.add('text-gray');
+        nav.classList.remove('bg-white');
+        links.classList.add('nav-light');
+        links.classList.remove('nav-dark');
+    }
+});