Categories now have icons and view is updated

reazuliqbal · Jun 12, 2018 · fdfb7da · fdfb7da
1 parent 4245e81
commit fdfb7da
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 19 deletions.
diff --git a/controllers/AdminController.js b/controllers/AdminController.js
@@ -90,6 +90,7 @@ module.exports = {
             if (!err) {
               category.name = value.name;
               category.slug = slugify(value.name, { remove: /[$*_+~.()'"!\-:@]/g, lower: true });
+              category.icon = value.icon;
               category.image = value.image;
               category.description = value.description;
 
@@ -110,6 +111,7 @@ module.exports = {
             name: value.name,
             slug: slugify(value.name, { remove: /[$*_+~.()'"!\-:@]/g, lower: true }),
             image: value.image,
+            icon: value.icon,
             description: value.description,
           });
           category.save((error) => {

diff --git a/models/Category.js b/models/Category.js
@@ -12,6 +12,10 @@ const CategorySchema = new Schema({
     required: true,
     unique: true,
   },
+  icon: {
+    type: String,
+    default: '/images/icons/default.svg',
+  },
   image: {
     type: String,
     default: '/images/category-image.jpg',

diff --git a/modules/joiSchemas.js b/modules/joiSchemas.js
@@ -5,13 +5,15 @@ module.exports = {
     _csrf: Joi.string(),
     name: Joi.string().min(3).max(80).required(),
     image: Joi.string().empty('').default('/images/category-image.jpg'),
+    icon: Joi.string().empty('').default('/images/icons/default.svg'),
     description: Joi.string().empty('').max(500),
   }),
   EditCategory: Joi.object().keys({
     _csrf: Joi.string(),
     id: Joi.string(),
     name: Joi.string().min(3).max(80).required(),
     image: Joi.string().empty('').default('/images/category-image.jpg'),
+    icon: Joi.string().empty('').default('/images/icons/default.svg'),
     description: Joi.string().empty('').max(500),
   }),
   UserSettings: Joi.object().keys({

diff --git a/views/admin/categories.ejs b/views/admin/categories.ejs
@@ -53,6 +53,14 @@
                                 <p class="helper-text">Local path from public directory is supported.</p>
                             </div>
 
+
+
+                            <div class="input-field">
+                                <input type="text" name="icon" id="icon" class="validate" value="<%= category.icon %>">
+                                <label for="icon">Icon URL</label>
+                                <p class="helper-text">Local path from public directory is supported.</p>
+                            </div>
+
                             <div class="input-field">
                                 <textarea name="description" id="description" class="materialize-textarea"><%= category.description %></textarea>
                                 <label for="description">Category Description</label>
@@ -64,4 +72,4 @@
                 </div>
             </div>
         </div>
-<%- include('footer'); %>
+<%- include('footer'); %>
diff --git a/views/category.ejs b/views/category.ejs
@@ -3,25 +3,25 @@
             <h2><%= title %></h2>
         </div>
 
-        <% if(services.length > 0) { %>
-        <div class="row">
-        <% services.forEach((service) => { %>
-            <div class="col s12 m6 l3">
-                <div class="card">
-                    <div class="card-image">
-                        <img src="/images/service-image.jpg">
-                    </div>
-                    <div class="card-content">
-                        <p><%= service.title %> for <%= service.price %></p>Offered by <a href="/@<%= service.seller.username %>"><%= service.seller.username %></a>
-                    </div>
-                    <div class="card-action">
-                        <a class="waves-effect waves-light btn" href="/@<%= service.seller.username %>/<%= service.slug %>">View</a>
+        <div class="container">
+            <% if(services.length > 0) { %>
+            <div class="row">
+            <% services.forEach((service) => { %>
+                <div class="col s12 m6 l3">
+                    <div class="card service-card">
+                        <div class="card-image" style="background-image:url('<%= service.cover_image %>')"></div>
+                        <div class="card-content">
+                            <p><strong><%= service.title %></strong> for <strong><%= service.price %> <%= service.currency %></strong></p>Offered by <a href="/@<%= service.seller.username %>"><%= service.seller.username %></a>
+                        </div>
+                        <div class="card-action">
+                            <a class="waves-effect waves-light btn" href="/@<%= service.seller.username %>/<%= service.slug %>">View</a>
+                        </div>
                     </div>
                 </div>
+            <% })
+            } else { %>
+                <p class="flow-text">There is no services added to this category.</p>
+            <% } %>
             </div>
-        <% }) 
-        } else { %>
-            <p class="flow-text">There is no services added to this category.</p>
-        <% } %>
         </div>
-<%- include('partials/footer'); %>
+<%- include('partials/footer'); %>