From 12894973ba88707b623a5eb6e82a23c3f220c25e Mon Sep 17 00:00:00 2001
From: Jurgita <jurgita.eicinaite@yahoo.com>
Date: Wed, 25 Jan 2023 15:44:57 +0200
Subject: [PATCH 1/4] #136 express.js file, tiles function, import

---
 index.html                                     |  2 +-
 js/components/express-functionality/express.js | 17 +++++++++++++++++
 js/pages/home.js                               |  3 +++
 3 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 js/components/express-functionality/express.js

diff --git a/index.html b/index.html
index 9cfb211..80d8650 100644
--- a/index.html
+++ b/index.html
@@ -145,7 +145,7 @@ <h2 class="section-title">Express Functionality</h2>
             </div>
         </div>
 
-        <div class="row feature-boxes">
+        <div class="row feature-boxes" id="feature-boxes">
             <div class="col-12 col-md-6 col-lg-4 box">
                 <img src="img/premium-features/featured_image_1.png" alt="featured-icon-1" class="icon">
                 <h3 class="box-header">Fully functional</h3>
diff --git a/js/components/express-functionality/express.js b/js/components/express-functionality/express.js
new file mode 100644
index 0000000..664b4d3
--- /dev/null
+++ b/js/components/express-functionality/express.js
@@ -0,0 +1,17 @@
+function tiles() {
+    const expressDOM = document.getElementById('feature-boxes');
+
+    let HTML = '';
+    for (let i = 0; i < 6; i++) {
+        HTML += `<div class="col-12 col-md-6 col-lg-4 box">
+                <img src="img/premium-features/featured_image_1.png" alt="featured-icon-1" class="icon">
+                <h3 class="box-header">Fully functional</h3>
+                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.
+                </p>
+            </div>`;
+    }
+
+    expressDOM.innerHTML = HTML;
+}
+
+export { tiles };
diff --git a/js/pages/home.js b/js/pages/home.js
index ebc30a0..1075bbf 100644
--- a/js/pages/home.js
+++ b/js/pages/home.js
@@ -1,5 +1,7 @@
 // IMPORT
 import { hamburgerClick } from '../components/mobile-menu/mobile-menu.js';
+import { tiles } from '../components/express-functionality/express.js';
+
 // EXECUTION
 
 /* header NAV start */
@@ -10,6 +12,7 @@ hamburgerClick();
 /* hero end */
 
 /* Express Functionality start */
+tiles();
 /* Express Functionality end */
 
 /* Easily communicate start */

From 2cd0b148a36f3fbdb0ae780de0f45cb119ff06ed Mon Sep 17 00:00:00 2001
From: Jurgita <jurgita.eicinaite@yahoo.com>
Date: Wed, 25 Jan 2023 16:13:31 +0200
Subject: [PATCH 2/4] expressData, main logic

---
 .../express-functionality/express.js          | 11 ++---
 js/data/expressData.js                        | 40 +++++++++++++++++++
 js/pages/home.js                              |  3 +-
 3 files changed, 48 insertions(+), 6 deletions(-)
 create mode 100644 js/data/expressData.js

diff --git a/js/components/express-functionality/express.js b/js/components/express-functionality/express.js
index 664b4d3..2c50d7b 100644
--- a/js/components/express-functionality/express.js
+++ b/js/components/express-functionality/express.js
@@ -1,12 +1,13 @@
-function tiles() {
+function tiles(data) {
     const expressDOM = document.getElementById('feature-boxes');
 
     let HTML = '';
-    for (let i = 0; i < 6; i++) {
+    for (let i = 0; i < data.length; i++) {
         HTML += `<div class="col-12 col-md-6 col-lg-4 box">
-                <img src="img/premium-features/featured_image_1.png" alt="featured-icon-1" class="icon">
-                <h3 class="box-header">Fully functional</h3>
-                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.
+                <img src="img/premium-features/${data[i].img}" 
+                alt="featured-icon-${i + 1}" class="icon">
+                <h3 class="box-header">${data[i].title}</h3>
+                <p>${data[i].text}
                 </p>
             </div>`;
     }
diff --git a/js/data/expressData.js b/js/data/expressData.js
new file mode 100644
index 0000000..60ec3bc
--- /dev/null
+++ b/js/data/expressData.js
@@ -0,0 +1,40 @@
+const expressData = [
+    {
+        img: 'featured_image_1.png',
+        title: 'Fully functional',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+    {
+        img: 'featured_image_2.png',
+        title: 'Live Chat',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+    {
+        img: 'featured_image_3.png',
+        title: 'Secure Data',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+    {
+        img: 'featured_image_4.png',
+        title: 'Easy to Customize',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+    {
+        img: 'featured_image_5.png',
+        title: 'Responsive Design',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+    {
+        img: 'featured_image_6.png',
+        title: 'Help Documentation',
+        text:
+            'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.',
+    },
+];
+
+export { expressData };
diff --git a/js/pages/home.js b/js/pages/home.js
index 1075bbf..e1663a1 100644
--- a/js/pages/home.js
+++ b/js/pages/home.js
@@ -1,6 +1,7 @@
 // IMPORT
 import { hamburgerClick } from '../components/mobile-menu/mobile-menu.js';
 import { tiles } from '../components/express-functionality/express.js';
+import { expressData } from '../data/expressData.js';
 
 // EXECUTION
 
@@ -12,7 +13,7 @@ hamburgerClick();
 /* hero end */
 
 /* Express Functionality start */
-tiles();
+tiles(expressData);
 /* Express Functionality end */
 
 /* Easily communicate start */

From a8f167fdfc5bc248e0095baf66216ed0d730d412 Mon Sep 17 00:00:00 2001
From: Jurgita <jurgita.eicinaite@yahoo.com>
Date: Mon, 30 Jan 2023 09:28:26 +0200
Subject: [PATCH 3/4] hidden content

---
 index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 80d8650..296115b 100644
--- a/index.html
+++ b/index.html
@@ -146,7 +146,7 @@ <h2 class="section-title">Express Functionality</h2>
         </div>
 
         <div class="row feature-boxes" id="feature-boxes">
-            <div class="col-12 col-md-6 col-lg-4 box">
+            <!--  <div class="col-12 col-md-6 col-lg-4 box">
                 <img src="img/premium-features/featured_image_1.png" alt="featured-icon-1" class="icon">
                 <h3 class="box-header">Fully functional</h3>
                 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.
@@ -181,7 +181,7 @@ <h3 class="box-header">Responsive Design</h3>
                 <h3 class="box-header">Help Documentation</h3>
                 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis culpa expedita dignissimos.
                 </p>
-            </div>
+            </div> -->
         </div>
     </section>
     <!-- Express Functionality end -->

From 3eb77564cc24133d5c9e7866c2d7b72ed1de6b87 Mon Sep 17 00:00:00 2001
From: Jurgita <jurgita.eicinaite@yahoo.com>
Date: Tue, 31 Jan 2023 22:49:41 +0200
Subject: [PATCH 4/4] selector validation, renaming

---
 .../express.js => tiles/tiles.js}                    | 12 ++++++++++--
 js/pages/home.js                                     |  4 ++--
 2 files changed, 12 insertions(+), 4 deletions(-)
 rename js/components/{express-functionality/express.js => tiles/tiles.js} (59%)

diff --git a/js/components/express-functionality/express.js b/js/components/tiles/tiles.js
similarity index 59%
rename from js/components/express-functionality/express.js
rename to js/components/tiles/tiles.js
index 2c50d7b..16a76c7 100644
--- a/js/components/express-functionality/express.js
+++ b/js/components/tiles/tiles.js
@@ -1,5 +1,13 @@
-function tiles(data) {
-    const expressDOM = document.getElementById('feature-boxes');
+function tiles(selector, data) {
+    if (typeof selector !== 'string') {
+        throw new Error('Selector must be string');
+    }
+
+    const expressDOM = document.getElementById(selector);
+
+    if (expressDOM === null) {
+        throw new Error('No element was found with indicated selector.');
+    }
 
     let HTML = '';
     for (let i = 0; i < data.length; i++) {
diff --git a/js/pages/home.js b/js/pages/home.js
index e1663a1..a262588 100644
--- a/js/pages/home.js
+++ b/js/pages/home.js
@@ -1,6 +1,6 @@
 // IMPORT
 import { hamburgerClick } from '../components/mobile-menu/mobile-menu.js';
-import { tiles } from '../components/express-functionality/express.js';
+import { tiles } from '../components/tiles/tiles.js';
 import { expressData } from '../data/expressData.js';
 
 // EXECUTION
@@ -13,7 +13,7 @@ hamburgerClick();
 /* hero end */
 
 /* Express Functionality start */
-tiles(expressData);
+tiles('feature-boxes', expressData);
 /* Express Functionality end */
 
 /* Easily communicate start */