From c78f573b9a93a2ecf088e57871aa4a53f3125c0b Mon Sep 17 00:00:00 2001 From: DevRaushan Date: Sat, 6 Apr 2024 13:24:01 +0530 Subject: [PATCH] feat: added product details page for individual products --- app/controllers/viewControllers.js | 18 +++++- app/public/stylesPro.css | 10 +++ app/routes/route.js | 1 + app/views/productDetails.ejs | 99 ++++++++++++++++++++++++++++++ app/views/products.ejs | 38 ++++++------ 5 files changed, 147 insertions(+), 19 deletions(-) create mode 100644 app/views/productDetails.ejs diff --git a/app/controllers/viewControllers.js b/app/controllers/viewControllers.js index ddd458e..5279602 100644 --- a/app/controllers/viewControllers.js +++ b/app/controllers/viewControllers.js @@ -41,6 +41,22 @@ const productListView = (req,res)=>{ }); } +const productDetailsView=(req,res)=>{ + if(!req.session.isLoggedIn){ + res.redirect('/login'); + return; + } + const { productId } = req.params + db.query(`SELECT * FROM products WHERE id="${productId}"`,(error,results,fields)=>{ + if(error){ + console.log('Error executing query: '+error); + res.send(error); + return; + } + res.render("productDetails",{product:results[0],isLoggedIn:req.session.isLoggedIn}); + }) +} + module.exports = { - loginView,signUpView,forgotPassView,productListView + loginView,signUpView,forgotPassView,productListView,productDetailsView } \ No newline at end of file diff --git a/app/public/stylesPro.css b/app/public/stylesPro.css index 2583f0c..3dd3869 100644 --- a/app/public/stylesPro.css +++ b/app/public/stylesPro.css @@ -24,6 +24,11 @@ header { border-radius: 5px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); margin: 10px; + transition: transform 0.25s ease-in-out; +} + +.card:hover{ + transform: scale(1.03); } .product-image { @@ -89,3 +94,8 @@ header { outline: none; border-color: #007bff; } + +a{ + text-decoration: none; + color:inherit; +} \ No newline at end of file diff --git a/app/routes/route.js b/app/routes/route.js index 983a87a..308c203 100644 --- a/app/routes/route.js +++ b/app/routes/route.js @@ -35,5 +35,6 @@ router.get('/forgotPass', viewController.forgotPassView) router.post('/forgotPass', loginController.forgotPass) router.post('/changePass', loginController.changePass) router.post('/logout', loginController.logout) +router.get('/product/:productId',viewController.productDetailsView) module.exports = router; \ No newline at end of file diff --git a/app/views/productDetails.ejs b/app/views/productDetails.ejs new file mode 100644 index 0000000..6b3498c --- /dev/null +++ b/app/views/productDetails.ejs @@ -0,0 +1,99 @@ + + + + + + <%=product.name%> + + + +
+

InsecureNet

+
+
+
+ /> + +
+
+

<%=product.name%>

+

Category : <%=product.category%>

+

Company : <%=product.company %>

+

Price : <%=product.price %> INR

+
+

Available Colour Variants :

+
+ <% product.colors.forEach(color=>{ %> +
+ <% }) %> +
+
+
+

<%=product.description%>

+
+

Featured: <%=(product.featured==1)?"Yes":"No"%>

+

Shipping: <%=(product.shipping==1)?"Yes":"No"%>

+ Back To Home +
+
+ + \ No newline at end of file diff --git a/app/views/products.ejs b/app/views/products.ejs index 5a52e58..ce4506c 100644 --- a/app/views/products.ejs +++ b/app/views/products.ejs @@ -23,25 +23,27 @@
<% products.forEach(product => { %> -
- <%= product.name %> -
-

<%= product.name %>

-

Company: <%= product.company %>

-

Price: <%= product.price %>

-

Category: <%= product.category %>

- <% if (product.featured) { %> -

Featured: Yes

- <% } else { %> -

Featured: No

- <% } %> - <% if (product.shipping) { %> -

Shipping: Yes

- <% } else { %> -

Shipping: No

- <% } %> + +
+ <%= product.name %> +
+

<%= product.name %>

+

Company: <%= product.company %>

+

Price: <%= product.price %>

+

Category: <%= product.category %>

+ <% if (product.featured) { %> +

Featured: Yes

+ <% } else { %> +

Featured: No

+ <% } %> + <% if (product.shipping) { %> +

Shipping: Yes

+ <% } else { %> +

Shipping: No

+ <% } %> +
-
+ <% }); %>