diff --git a/controllers/productsCtrlFile.js b/controllers/productsCtrlFile.js
deleted file mode 100644
index 39b2f9af836cf1ae82adee902dbbab45556814e5..0000000000000000000000000000000000000000
--- a/controllers/productsCtrlFile.js
+++ /dev/null
@@ -1,18 +0,0 @@
-const { productList } = require('../products');
-
-
-// productsCtrlFile.js
-const productsCtrlFunction = (req, res) => {
- try{
- res.status(200).json({
- products: productList
- });
- }catch(error){
- console.log(error);
- }
- // res.send('This is the products page');
-};
-
-module.exports = {
- productsCtrlFunction: productsCtrlFunction
-};
diff --git a/diary.md b/diary.md
index ad510517b3bf48016d3184b578c2c86c48846c74..446030afe05ec82c750032e3588f1922091a0b2a 100644
--- a/diary.md
+++ b/diary.md
@@ -75,6 +75,10 @@ Today 20/01/24 completed the payment functionality but still face a minor issue
18/02/2024 solved most of the search function issues and only one step left to complete this feature which is flatten the products array and the matching the input string with the relevant item.
24/02/2024 solved displaying items on the cart page issue but still another issue with displaying items on the other pages to be sorted and the solution might be by moving all item to the databse so it can be queried accordingly.
02/03/2024 most of the pages are now fetching products from the database, but still have to refactor the function that adding and displaying products to the basket page so that it will functional again.
+04/03/2024 work stopped due to health issue, seeking medical help so the work could continue ASAP.
+10/03/2024 Start working on the project again, sorting the fetching issue by refactoring the Shopping basket file and deleting the files that is not wanted anymore such as products file.
+12/03/2024 created login/register system as well as creating STMP for the notification emails.
+
## Support
For any question please contact me on zfac125@live.rhul.ac.uk
diff --git a/products.js b/products.js
deleted file mode 100644
index 6f17703ceda7f73dc2b5bbcd9cbff03469c0c9a6..0000000000000000000000000000000000000000
--- a/products.js
+++ /dev/null
@@ -1,406 +0,0 @@
-/* async function populateProducts(endpoint) {
- const container = document.querySelector('.container');
-
-
-
- try {
- const response = await fetch(endpoint);
- const products = await response.json();
-
-
- container.innerHTML = '';
-
-
- products.forEach(product => {
- const productsHtml = document.createElement('div');
- productsHtml.innerHTML = `
- <div class="product">
- <div class="product-card">
- <h2 class="name">${product.name}</h2>
- <span class="price">£${product.price}</span>
- <a class="popup-btn">Quick View</a>
- <img src="${product.image}" class="product-img" alt="Image of ${product.name}">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="${product.image}" class="product-img" alt="Image of ${product.name}">
- </div>
- <div class="info">
- <h2>Your fashion<br><span>Modern styles</span></h2>
- <p>${product.description}</p>
- <span class="price">£${product.price}</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- `;
- container.appendChild(productsHtml);
-
- if (products.image) {
- const img = new Image();
- img.src = product.image;
- productsHtml.querySelector('.product-img').appendChild(img);
- }
-
-
- if(container){
- container.appendChild(productsHtml);
- }else{
- console.error('Container element not found');
- }
- });
- } catch (error) {
- console.error('Failed to populate products:', error);
- }
- //console.log(container);
- addCartActions(container);
-}
-
-async function getProducts(endpoint = 'http://localhost:7000/products') {
- try {
- const response = await fetch(endpoint);
-
- if (!response.ok) {
- throw new Error(`HTTP error! Status: ${response.status}`);
- }
- const products = await response.json();
-
- // const data = await response.json();
- //products = data.products;
-
- populateProducts(products);
- // console.log(data.products);
- // console.log('Products:', products);
- } catch (error) {
- console.error('error fetching products:', error);
- }
-
-
-}
-
-
- const ProductsLink = getProducts('products');
- // getProducts();
-
- if (ProductsLink) {
- ProductsLink.addEventListener('click', (e) => {
- e.preventDefault(); // Prevent the default link behavior
- populateProducts('/products');
- });
- } else {
- console.error("products link not found.");
- } */
-
-/* exports.productList =
-[
-
- {
- name: 'Blue Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlueShirt',
- price: 29.99,
- inCart: 0,
- Image: '/images/BlueShirt.jpg'
- },
- {
- name: 'Black Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlackShirt',
- price: 23.99,
- inCart: 0,
- Image: '/images/BlackShirt.jpg',
-
- },
- {
- name: 'White Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'WhiteShirt',
- price: 89.99,
- inCart: 0,
- Image: '/images/WhiteShirt.jpg'
- },
- {
- name: 'Denim jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'DenimJeans',
- price: 150.00,
- inCart: 0,
- Image: '/images/DenimJeans.jpg'
- },
- {
- name: 'Light blue jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'LightBlue',
- price: 50.00,
- inCart: 0,
- Image: '/images/LightBlue.jpg'
- },
- {
- name: 'Cotton jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'Cottonjeans',
- price: 200.00,
- inCart: 0,
- Image: '/images/Cottonjeans.jpg'
- },
-
-
- {
- name: 'Blue blouse',
- description: 'This is a Blue blouse',
- tag: 'Blueblouse',
- price: 59.99,
- inCart: 0,
- Image: '/images/BlueBlouse.jpg'
- },
- {
- name: 'Off White blouse',
- description: 'This is an Off White blouse',
- tag: 'OffWhiteblouse',
- price: 73.99,
- inCart: 0,
- Image: '/images/OffWhiteblouse.jpg'
- },
- {
- name: 'White blouse',
- description: 'This is a White blouse',
- tag: 'Whiteblouse',
- price: 89.99,
- inCart: 0,
- Image: '/images/white-blouse.jpg'
- },
- {
- name: 'Brown trouser',
- description: 'This is a Brown trouser',
- tag: 'Browntrouser',
- price: 140.00,
- inCart: 0,
- Image: '/images/brown-trouser.jpg'
- },
- {
- name: 'Cream trouser',
- description: 'This is a Cream trouser',
- tag: 'Creamtrouser',
- price: 59.00,
- inCart: 0,
- Image: '/images/creamTrouser.jpg'
- },
- {
- name: 'Grey trouser',
- description: 'This is a Grey trouser',
- tag: 'Greytrouser',
- price: 201.00,
- inCart: 0,
- Image: '/images/greyTrouser.jpg'
- },
-
-
- {
- name: 'Girls dress',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'GirlsDress',
- price: 64.00,
- inCart: 0,
- Image: '/images/girls-dress.jpg'
- },
- {
- name: 'Girls dress',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'GirlsDress',
- price: 57.00,
- inCart: 0,
- Image: '/images/girls-dress1.webp',
-
- },
- {
- name: 'Girls dress',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'GirlsDress',
- price: 89.99,
- inCart: 0,
- Image: '/images/girls-dress2.webp'
- },
- {
- name: 'Boys jumper',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BoysJumper',
- price: 80.00,
- inCart: 0,
- Image: '/images/boys-jumper.avif'
- },
- {
- name: 'Boys jumper',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BoysJumper',
- price: 50.00,
- inCart: 0,
- Image: '/images/boys-jumper1.webp'
- },
- {
- name: 'Boys jumper',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BoysJumper',
- price: 70.00,
- inCart: 0,
- Image: '/images/boys-jumper2.webp'
- },
-
- // from this position down to be fixed at a later date or until a better solution is found
- {
- name: 'Blue Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlueShirt',
- price: 29.99,
- inCart: 0,
- Image: '' //'https://img.fruugo.com/product/2/90/617160902_max.jpg'
- },
- {
- name: 'Black Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlackShirt',
- price: 23.99,
- inCart: 0,
- Image: '' //'https://ng.jumia.is/unsafe/fit-in/680x680/filters:fill(white)/product/85/0545391/3.jpg?5946',
-
- },
- {
- name: 'White Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'WhiteShirt',
- price: 89.99,
- inCart: 0,
- Image: '' //'https://img.fruugo.com/product/6/45/507046456_max.jpg'
- },
- {
- name: 'Denim jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'DenimJeans',
- price: 150.00,
- inCart: 0,
- Image: '' //'https://i8.amplience.net/i/egl/MensJeans-220407-slim.jpg'
- },
- {
- name: 'Light blue jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'LightBlue',
- price: 50.00,
- inCart: 0,
- Image: '' //'https://eg.jumia.is/unsafe/fit-in/500x500/filters:fill(white)/product/33/055233/1.jpg?5486'
- },
- {
- name: 'Cotton jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'Cottonjeans',
- price: 200.00,
- inCart: 0,
- Image: '' //'https://static-01.daraz.pk/p/5838623fb612626ae33c2f67d1b7179c.jpg'
- },
-
-
- {
- name: 'Blue Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlueShirt',
- price: 29.99,
- inCart: 0,
- Image: '' //'https://img.fruugo.com/product/2/90/617160902_max.jpg'
- },
- {
- name: 'Black Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlackShirt',
- price: 23.99,
- inCart: 0,
- Image: '' //'https://ng.jumia.is/unsafe/fit-in/680x680/filters:fill(white)/product/85/0545391/3.jpg?5946',
-
- },
- {
- name: 'White Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'WhiteShirt',
- price: 89.99,
- inCart: 0,
- Image: '' // 'https://img.fruugo.com/product/6/45/507046456_max.jpg'
- },
- {
- name: 'Denim jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'DenimJeans',
- price: 150.00,
- inCart: 0,
- Image: '' //'https://i8.amplience.net/i/egl/MensJeans-220407-slim.jpg'
- },
- {
- name: 'Light blue jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'LightBlue',
- price: 50.00,
- inCart: 0,
- Image: '' //'https://eg.jumia.is/unsafe/fit-in/500x500/filters:fill(white)/product/33/055233/1.jpg?5486'
- },
- {
- name: 'Cotton jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'Cottonjeans',
- price: 200.00,
- inCart: 0,
- Image:'' //'https://static-01.daraz.pk/p/5838623fb612626ae33c2f67d1b7179c.jpg'
- },
-
-
- {
- name: 'Blue Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlueShirt',
- price: 29.99,
- inCart: 0,
- Image:'' //'https://img.fruugo.com/product/2/90/617160902_max.jpg'
- },
- {
- name: 'Black Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'BlackShirt',
- price: 23.99,
- inCart: 0,
- Image:'' //'https://ng.jumia.is/unsafe/fit-in/680x680/filters:fill(white)/product/85/0545391/3.jpg?5946',
-
- },
- {
- name: 'White Shirt',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'WhiteShirt',
- price: 89.99,
- inCart: 0,
- Image:'' //'https://img.fruugo.com/product/6/45/507046456_max.jpg'
- },
- {
- name: 'Denim jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'DenimJeans',
- price: 150.00,
- inCart: 0,
- Image:'' // 'https://i8.amplience.net/i/egl/MensJeans-220407-slim.jpg'
- },
- {
- name: 'Light blue jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'LightBlue',
- price: 50.00,
- inCart: 0,
- Image:'' //'https://eg.jumia.is/unsafe/fit-in/500x500/filters:fill(white)/product/33/055233/1.jpg?5486'
- },
- {
- name: 'Cotton jeans',
- description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
- tag: 'Cottonjeans',
- price: 200.00,
- inCart: 0,
- Image:'' //'https://static-01.daraz.pk/p/5838623fb612626ae33c2f67d1b7179c.jpg'
- }
-
-]; */
-
diff --git a/public/shopping-basket.js b/public/shopping-basket.js
index b106a832e2e911cd1e82bf6ce6b367417a6316a7..a40cd96cbfb2ccac2d20532ecd00b2c702325505 100644
--- a/public/shopping-basket.js
+++ b/public/shopping-basket.js
@@ -57,8 +57,8 @@ async function getProducts() {
throw new Error(`HTTP error! Status: ${response.status}`);
}
const data = await response.json();
- const copied = Array(20).fill(data[0])
- populateProducts(copied);
+ //const copied = Array(20).fill(data[0])
+ populateProducts(data);
} catch (error) {
console.error('error fetching products:', error);
}
diff --git a/routes/productsRouteFile.js b/routes/productsRouteFile.js
deleted file mode 100644
index 397b3728ae7ab128d66d903cf2405b52ad182ab7..0000000000000000000000000000000000000000
--- a/routes/productsRouteFile.js
+++ /dev/null
@@ -1,8 +0,0 @@
-const express = require('express');
-const { productsCtrlFunction } = require('../controllers/productsCtrlFile');
-
-const router = express.Router();
-
-router.get('/', productsCtrlFunction);
-
-module.exports = router;
\ No newline at end of file
diff --git a/views/activate.hbs b/views/activate.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..56fc63f924a233a24802af59e80c401ae53a0aae
--- /dev/null
+++ b/views/activate.hbs
@@ -0,0 +1,78 @@
+<DOCTYPE! html>
+ <html>
+
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+ <link rel="preconnect" href="https://fonts.gstatic.com">
+ <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+ <link rel="stylesheet" href="/style.css">
+
+ <style>
+ .c {
+ display:flex;
+ display:flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 100vh;
+ }
+
+ .title {
+ font-size:24px;
+ margin-bottom:16px;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div class="c">
+ <div class="title">
+ <p>
+ Input your email and the code you received to activate your account
+ </p>
+ </div>
+ <div>
+ <div class="input-group mb-3">
+ <input type="email" class="form-control" placeholder="example@example.com" id="email" aria-label="Email" aria-describedby="basic-addon1">
+ </div>
+ </div>
+ <div>
+ <div class="input-group mb-3">
+ <input type="text" id="code" class="form-control" placeholder="code" aria-label="code" aria-describedby="basic-addon1">
+ </div>
+ </div>
+
+ <button onclick="sendCode()" type="button" class="btn btn-secondary">Send code</button>
+
+ </div>
+ </body>
+ <script>
+ async function sendCode(){
+ const options = {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({
+ code: document.getElementById('code').value,
+ email: document.getElementById('email').value
+ })
+ };
+
+ const url = `http://localhost:7000/activate-account`
+
+ const response = await fetch(url, options);
+ if (!response.ok) {
+ alert('Could not activate account')
+ throw new Error(`HTTP error! Status: ${response.status}`);
+ }
+
+ alert('Account activated, you can log in now')
+ window.location.href = "/";
+ }
+ </script>
+ </html>
\ No newline at end of file
diff --git a/views/authenticate.hbs b/views/authenticate.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..eb794d3f1a6264b5f867c4ac91dfb3576cafacb5
--- /dev/null
+++ b/views/authenticate.hbs
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+ <html>
+
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+ <title>Your Fashion</title>
+ <link rel="preconnect" href="https://fonts.gstatic.com">
+ <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+ <link rel="stylesheet" href="/style.css">
+
+
+
+ <!--<script type="text/javascript" src="js/LocalLogin.js"></script>-->
+
+ </head>
+
+ <body class="responsive">
+
+
+ <header>
+ {{> common/navbar}}
+ </header>
+
+ <div class="authenticate-form">
+
+ <div class="input-group mb-3">
+ <span class="input-group-text" id="email">Email</span>
+ <input type="email" class="form-control" placeholder="example@example.com" aria-label="email" aria-describedby="basic-addon1">
+ </div>
+ <div class="input-group mb-3">
+ <span class="input-group-text" id="password">Password</span>
+ <input type="password" class="form-control" aria-label="password" aria-describedby="basic-addon1">
+ </div>
+ <div class="input-group mb-3" id="c-pass-container">
+ <span class="input-group-text" id="cpassword">Confirm Password</span>
+ <input type="password" class="form-control" aria-label="confirm-password" aria-describedby="basic-addon1">
+ </div>
+ <div class="input-group mb-3" id="c-username-container">
+ <span class="input-group-text" id="username">Username</span>
+ <input type="text" class="form-control" aria-label="username" placeholder="optional" aria-describedby="basic-addon1">
+ </div>
+ <div>
+ <button onclick="handleClick()" type="button" id="btn" class="btn btn-secondary"></button>
+ </div>
+
+
+
+
+
+
+{{!-- 2. login with username password confirm password email , with notification to confirm account --}}
+
+
+ </body>
+ <script src="/authenticate.js"></script>
+ </html>
\ No newline at end of file
diff --git a/views/cart.hbs b/views/cart.hbs
index d0fddd7173a7ffbaa5131cae66e990871f40146d..a3d68fbcda2f1850b977bfe748d5499992ec3e9c 100644
--- a/views/cart.hbs
+++ b/views/cart.hbs
@@ -33,7 +33,7 @@
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
<div class="container-fluid">
- <a href="index.hbs" class="actives"><i class="fa fa-home"></i></a>
+ <a href="/" class="actives"><i class="fa fa-home"></i></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"></span>
</button>
@@ -44,7 +44,7 @@
<li class="nav-item">
- <a class="nav-link" id="men-products" href="men.hbs">Men</a>
+ <a class="nav-link" id="men-products" href="/men">Men</a>
</li>
<li class="nav-item">
<a class="nav-link" id="women-products" href="/women">Women</a>
diff --git a/views/common/navbar.hbs b/views/common/navbar.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..7b2a8e5ba71d2c9e9620b2abb1692ec20e28edfa
--- /dev/null
+++ b/views/common/navbar.hbs
@@ -0,0 +1,62 @@
+ <div>
+ <div class="your-fashion-text-box">
+ <a href="/" class="shopname">Your Fashion</a>
+ </div>
+
+
+ <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
+ <div class="container-fluid">
+ <a href="/" class="actives"><i class="fa fa-home"></i></a>
+ <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
+ <span class="navbar-toggler-icon"></span>
+ </button>
+
+ <div class="collapse navbar-collapse" id="collapsibleNavbar">
+
+ <ul class="navbar-nav">
+
+
+ <li class="nav-item" onclick="handleAnchorClick('/men')">
+ <a class="nav-link" id="men-products" href="/men">Men</a>
+ </li>
+ <li class="nav-item" onclick="handleAnchorClick('/women')">
+ <a class="nav-link" id="women-products" href="/women">Women</a>
+ </li>
+ <li class="nav-item" onclick="handleAnchorClick('/kids')">
+ <a class="nav-link" id="kids-products" href="/kids">Kids</a>
+ </li>
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
+ <ul class="dropdown-menu" id="submenu">
+ <li onclick="handleAnchorClick('/men-shoes')"><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
+ <li onclick="handleAnchorClick('/women-shoes')"><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
+ <li onclick="handleAnchorClick('/kids-shoes')"><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ <a class="login-button" href="/authenticate?mode=register">Register</a>
+ <a class="login-button" href="/authenticate?mode=login">Login</a>
+ <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
+ </div>
+ </nav>
+ <div class="search-bar">
+ <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
+ </div>
+ <script>
+ function handleAnchorClick(category){
+ window.location.href = category;
+ }
+
+ const user = JSON.parse(localStorage.getItem('user'))
+
+ if(user) {
+ document.querySelectorAll(".login-button").forEach(el => {
+ el.style.display = "none"
+ })
+ }
+ </script>
+
+ <script src="/init-shoppingcart.js"></script>
+
+ </div>
\ No newline at end of file
diff --git a/views/index.hbs b/views/index.hbs
index 92a4537fc0100a1543afd6f2675c52b2037943a9..a67b52aa2685b629f64b81b44ffe36af60d65718 100644
--- a/views/index.hbs
+++ b/views/index.hbs
@@ -22,52 +22,7 @@
<header>
-
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
-
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
-
- <ul class="navbar-nav">
-
-
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
- </div>
- <a class="login-button" href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search"
- list="container" autocomplete="off" />
- </div>
-
+ {{> common/navbar}}
</header>
<div id="characterList" class="characterLists"></div>
<main class="cont">
diff --git a/views/kids-shoes.hbs b/views/kids-shoes.hbs
index cc59128ced8ffc07234a706b6f1c509b233d7611..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/kids-shoes.hbs
+++ b/views/kids-shoes.hbs
@@ -9,10 +9,11 @@
<title>Your Fashion</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
@@ -21,58 +22,25 @@
<body class="responsive">
-
+
<header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button"href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
-
- </div>
-
+ {{> common/navbar}}
</header>
- <div id="characterList" class="characterLists"></div>
- <div class="container" id="container"></div>
+ <br>
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
+
{{!-- <script src="/product-cards.js"></script> --}}
+ {{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
<script src="/shopping-basket.js"></script>
- <script src="/search.js"></script>
+
</body>
+<footer>
+ <p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
+ 07469241247</a></p>
+</footer>
- </html>
\ No newline at end of file
+</html>
\ No newline at end of file
diff --git a/views/kids.hbs b/views/kids.hbs
index c83196021c626b19ce3299f5403055c7722c0162..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/kids.hbs
+++ b/views/kids.hbs
@@ -9,10 +9,11 @@
<title>Your Fashion</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
@@ -21,198 +22,25 @@
<body class="responsive">
-
+
<header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button"href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
-
- </div>
-
+ {{> common/navbar}}
</header>
- <div id="characterList" class="characterLists"></div>
- <div class="container">
-{{!-- <div class="product">
- <div class="product-card">
- <h2 class="name">Girls dress</h2>
- <span class="price">£ 64.00</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/girls-dress.jpg" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="/images/girls-dress.jpg" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£ 64.00</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- <div class="product">
- <div class="product-card">
- <h2 class="name">Girls dress</h2>
- <span class="price">£ 57.00</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/girls-dress1.webp" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="/images/girls-dress1.webp" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£ 23.99</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- <div class="product">
- <div class="product-card">
- <h2 class="name">Girls dress</h2>
- <span class="price">£89.99</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/girls-dress2.webp" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="img/" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£89.99</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- <div class="product">
- <div class="product-card">
- <h2 class="name">Boys jumper</h2>
- <span class="price">£80.00</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/boys-jumper.avif" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="/images/boys-jumper.avif" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£80.00</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- <div class="product">
- <div class="product-card">
- <h2 class="name">Boys jumper</h2>
- <span class="price">£50.00</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/boys-jumper1.webp" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="/images/boys-jumper1.webp" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£50.00</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div>
- <div class="product">
- <div class="product-card">
- <h2 class="name">Boys jumper</h2>
- <span class="price">£70.00</span>
- <a class="popup-btn">Quick View</a>
- <img src="/images/boys-jumper2.webp" class="product-img" alt="">
- </div>
- <div class="popup-view">
- <div class="popup-card">
- <a><i class="fas fa-times close-btn"></i></a>
- <div class="product-img">
- <img src="/images/boys-jumper2.webp" alt="">
- </div>
- <div class="info">
- <h2>Kids clothes<br><span>Kids' wear</span></h2>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- <span class="price">£70.00</span>
- <a href="#" class="add-cart-btn">Add to Cart</a>
- <a href="#" class="add-wish">Add to Wishlist</a>
- </div>
- </div>
- </div>
- </div> --}}
- </div>
+ <br>
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
- <script src="/product-cards.js"></script>
+
+ {{!-- <script src="/product-cards.js"></script> --}}
{{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
<script src="/shopping-basket.js"></script>
- <script src="/search.js"></script>
+
</body>
+<footer>
+ <p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
+ 07469241247</a></p>
+</footer>
- </html>
\ No newline at end of file
+</html>
\ No newline at end of file
diff --git a/views/men-shoes.hbs b/views/men-shoes.hbs
index 5b8eb32a9b926126d44603bc90420006d0934b7d..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/men-shoes.hbs
+++ b/views/men-shoes.hbs
@@ -9,70 +9,38 @@
<title>Your Fashion</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+
</head>
<body class="responsive">
-
+
<header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-producrs" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button"href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
-
- </div>
-
+ {{> common/navbar}}
</header>
- <div id="characterList" class="characterLists"></div>
- <div class="container" id="container"></div>
+ <br>
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
- <script src="/product-cards.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+ {{!-- <script src="/product-cards.js"></script> --}}
+ {{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
<script src="/shopping-basket.js"></script>
- <script src="/search.js"></script>
+
</body>
+<footer>
+ <p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
+ 07469241247</a></p>
+</footer>
- </html>
\ No newline at end of file
+</html>
\ No newline at end of file
diff --git a/views/men.hbs b/views/men.hbs
index b080519c154f1a5f1614bb6c53e72eef68dc35b0..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/men.hbs
+++ b/views/men.hbs
@@ -1,92 +1,43 @@
<!DOCTYPE html>
-<html>
-
-<head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
- <title>Your Fashion</title>
- <link rel="stylesheet" type="text/css" href="/style.css">
- <link rel="preconnect" href="https://fonts.gstatic.com">
-
- <link rel="stylesheet" type="text/css" href="/style.css">
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
-
-
-
-
-
-</head>
-
-<body class="responsive">
-
-
- <header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button" href="#">login</a>
- <div class="add-cart">
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="search" id="search-input" placeholder="🔍 Start typing to search"
- list="container" autocomplete="off" />
-
- </div>
-
-
- </header>
- <br>
-
- <div id="characterList" class="characterLists"></div>
- <div class="container" id="container"></div>
-
-
-
- {{!--
- <script src="/product-cards.js"></script> --}}
- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js"
- integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ=="
- crossorigin="anonymous" referrerpolicy="no-referrer"></script>
- <script src="/search.js" type="module"></script>
- <script src="/shopping-basket.js"></script>
-
-</body>
+ <html>
+
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+ <title>Your Fashion</title>
+ <link rel="stylesheet" type="text/css" href="/style.css">
+ <link rel="preconnect" href="https://fonts.gstatic.com">
+
+ <link rel="stylesheet" type="text/css" href="/style.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+
+
+
+
+ </head>
+
+ <body class="responsive">
+
+
+ <header>
+ {{> common/navbar}}
+ </header>
+ <br>
+
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
+
+
+ {{!-- <script src="/product-cards.js"></script> --}}
+ {{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
+ <script src="/shopping-basket.js"></script>
+
+ </body>
<footer>
<p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
07469241247</a></p>
diff --git a/views/women-shoes.hbs b/views/women-shoes.hbs
index 7db54d6d15083c12756bd58fc765a80ff12e063c..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/women-shoes.hbs
+++ b/views/women-shoes.hbs
@@ -9,68 +9,38 @@
<title>Your Fashion</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+
</head>
<body class="responsive">
+
<header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button"href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
-
- </div>
-
+ {{> common/navbar}}
</header>
- <div id="characterList" class="characterLists"></div>
- <div class="container" id="container"></div>
+ <br>
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
+
{{!-- <script src="/product-cards.js"></script> --}}
+ {{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
<script src="/shopping-basket.js"></script>
- <script src="/search.js"></script>
+
</body>
+<footer>
+ <p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
+ 07469241247</a></p>
+</footer>
- </html>
\ No newline at end of file
+</html>
\ No newline at end of file
diff --git a/views/women.hbs b/views/women.hbs
index 59324d365fb4de17f4d6add31a25c1646930e391..24b802456093f5e57662b118930aec24f3abc18b 100644
--- a/views/women.hbs
+++ b/views/women.hbs
@@ -9,10 +9,11 @@
<title>Your Fashion</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap" rel="stylesheet">
+
<link rel="stylesheet" type="text/css" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
@@ -21,59 +22,25 @@
<body class="responsive">
+
<header>
- <div class="your-fashion-text-box">
- <a href="/" class="shopname">Your Fashion</a>
- </div>
-
-
- <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
- <div class="container-fluid">
- <a href="/" class="actives"><i class="fa fa-home"></i></a>
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavbar">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="collapsibleNavbar">
- <ul class="navbar-nav">
- <li class="nav-item">
- <a class="nav-link" id="men-products" href="/men">Men</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="women-products" href="/women">Women</a>
- </li>
- <li class="nav-item">
- <a class="nav-link" id="kids-products" href="/kids">Kids</a>
- </li>
- <li class="nav-item dropdown">
- <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Footwear</a>
- <ul class="dropdown-menu" id="submenu">
- <li><a class="dropdown-item" id="men-s-products" href="/men-shoes">Men Shoes</a></li>
- <li><a class="dropdown-item" id="women-s-products" href="/women-shoes">Women Shoes</a></li>
- <li><a class="dropdown-item" id="kids-s-products" href="/kids-shoes">Kids Shoes</a></li>
- </ul>
- </li>
- </ul>
-
- </div>
- <a class="login-button"href="#">login</a>
- <a class="add-cart" href="/cart"><i class="fa fa-shopping-cart" style="font-size:24px"></i><span>0</span></a>
- </div>
- </nav>
- <div class="search-bar">
- <input class="search" type="text" id="search-input" placeholder="🔍 Start typing to search" list="container" autocomplete="off"/>
-
- </div>
-
+ {{> common/navbar}}
</header>
- <div class="container" id="container"></div>
- <div id="characterList" class="characterLists"></div>
-
+ <br>
+ <div id="characterList" class="characterLists"></div>
+ <div class="container" id="container"></div>
- <script src="/product-cards.js"></script>
+
+ {{!-- <script src="/product-cards.js"></script> --}}
{{!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.7/axios.min.js" integrity="sha512-NQfB/bDaB8kaSXF8E77JjhHG5PM6XVRxvHzkZiwl3ddWCEPBa23T76MuWSwAJdMGJnmQqM0VeY9kFszsrBEFrQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> --}}
+ <script src="/search.js" type="module"></script>
<script src="/shopping-basket.js"></script>
- <script src="/search.js"></script>
+
</body>
+<footer>
+ <p>Author: Tim Adams<br><a href="mailto:tim.adams1@hotmail.com">tim.adams1@hotmail.com</a><br><a>☎
+ 07469241247</a></p>
+</footer>
- </html>
\ No newline at end of file
+</html>
\ No newline at end of file