Moving admin functions to API calls

lib/auth.js

@@ -15,14 +15,13 @@ const restrictedRoutes = [
     { route: '/admin/settings/update', response: 'json' },
     { route: '/admin/settings/pages/new', response: 'redirect' },
     { route: '/admin/settings/pages/edit/:page', response: 'redirect' },
-    { route: '/admin/settings/pages/update', response: 'json' },
+    { route: '/admin/settings/pages', response: 'json' },
-    { route: '/admin/settings/pages/delete/:page', response: 'redirect' },
+    { route: '/admin/settings/page/delete/:page', response: 'json' },
-    { route: '/admin/settings/menu/new', response: 'redirect' },
+    { route: '/admin/settings/menu/new', response: 'json' },
-    { route: '/admin/settings/menu/update', response: 'redirect' },
+    { route: '/admin/settings/menu/update', response: 'json' },
-    { route: '/admin/settings/menu/delete/:menuid', response: 'redirect' },
+    { route: '/admin/settings/menu/delete', response: 'json' },
     { route: '/admin/settings/menu/save_order', response: 'json' },
-    { route: '/admin/file/upload', response: 'redirect' },
+    { route: '/admin/file/upload', response: 'json' }
-    { route: '/admin/file/delete', response: 'json' }
 ];
 
 const restrict = (req, res, next) => {

locales/en.json

@@ -165,5 +165,6 @@
 	"New user": "New user",
 	"Payment ID": "Payment ID",
 	"Payment Message": "Payment Message",
-	"Password": "Password"
+	"Password": "Password",
+	"Cart Email": "Cart Email"
 }

public/javascripts/admin.js

@@ -284,30 +284,11 @@ $(document).ready(function (){
         customCss.setValue(customCssBeautified);
     }
 
-    // call update settings API
-    $('#settings-menu-new').on('click', function(e){
-        e.preventDefault();
-        $.ajax({
-            method: 'POST',
-            url: '/admin/settings/menu/new',
-            data: {
-                navMenu: $('#navMenu').val(),
-                navLink: $('#navLink').val()
-            }
-        })
-        .done(function(msg){
-            showNotification(msg.message, 'success', true);
-        })
-        .fail(function(msg){
-            showNotification(msg.message, 'danger', true);
-        });
-    });
-
     $(document).on('click', '#btnPageUpdate', function(e){
         e.preventDefault();
         $.ajax({
             method: 'POST',
-            url: '/admin/settings/pages/update',
+            url: '/admin/settings/page',
             data: {
                 page_id: $('#page_id').val(),
                 pageName: $('#pageName').val(),
@@ -323,4 +304,104 @@ $(document).ready(function (){
             showNotification(msg.responseJSON.message, 'danger');
         });
     });
+
+    $(document).on('click', '#btnPageDelete', function(e){
+        e.preventDefault();
+        if(confirm('Are you sure?')){
+            $.ajax({
+                method: 'POST',
+                url: '/admin/settings/page/delete',
+                data: {
+                    pageId: $(this).attr('data-id')
+                }
+            })
+            .done(function(msg){
+                showNotification(msg.message, 'success', true);
+            })
+            .fail(function(msg){
+                showNotification(msg.message, 'danger', true);
+            });
+        }
+    });
+
+    $(document).on('click', '#settings-menu-new', function(e){
+        e.preventDefault();
+        $.ajax({
+            method: 'POST',
+            url: '/admin/settings/menu/new',
+            data: {
+                navMenu: $('#newNavMenu').val(),
+                navLink: $('#newNavLink').val()
+            }
+        })
+        .done(function(msg){
+            showNotification(msg.message, 'success', true);
+        })
+        .fail(function(msg){
+            showNotification(msg.message, 'danger', true);
+        });
+    });
+
+    $(document).on('click', '#settings-menu-update', function(e){
+        e.preventDefault();
+        var id = $(this).attr('data-id');
+        var parentEl = $('#menuId-' + id);
+        $.ajax({
+            method: 'POST',
+            url: '/admin/settings/menu/update',
+            data: {
+                navId: parentEl.find('.navId').val(),
+                navMenu: parentEl.find('.navMenu').val(),
+                navLink: parentEl.find('.navLink').val()
+            }
+        })
+        .done(function(msg){
+            showNotification(msg.message, 'success', true);
+        })
+        .fail(function(msg){
+            showNotification(msg.message, 'danger', true);
+        });
+    });
+
+    $(document).on('click', '.settings-menu-delete', function(e){
+        e.preventDefault();
+
+        if(confirm('Are you sure?')){
+            $.ajax({
+                method: 'POST',
+                url: '/admin/settings/menu/delete',
+                data: {
+                    menuId: $(this).attr('data-id')
+                }
+            })
+            .done(function(msg){
+                showNotification(msg.message, 'success', true);
+            })
+            .fail(function(msg){
+                showNotification(msg.message, 'danger', true);
+            });
+        }
+    });
+
+    $(document).on('click', '#uploadButton', function(e){
+        e.preventDefault();
+        var formData = new FormData($('#uploadForm')[0]);
+        formData.append('productId', $('#productId').val());
+
+        // Upload file
+        $.ajax({
+            method: 'POST',
+            url: '/admin/file/upload',
+            processData: false,
+            contentType: false,
+            cache: false,
+            data: formData
+        })
+        .done(function(msg){
+            showNotification(msg.message, 'success', true);
+        })
+        .fail(function(msg){
+            showNotification(msg.responseJSON.message, 'danger');
+        });
+    });
 });

routes/admin.js

@@ -7,7 +7,6 @@ const bcrypt = require('bcryptjs');
 const fs = require('fs');
 const path = require('path');
 const multer = require('multer');
-const glob = require('glob');
 const mime = require('mime-type/with-db');
 const ObjectId = require('mongodb').ObjectID;
 const router = express.Router();
@@ -132,7 +131,7 @@ router.post('/admin/setup_action', async (req, res) => {
     res.redirect('/admin/login');
 });
 
-// settings update
+// settings
 router.get('/admin/settings', restrict, (req, res) => {
     res.render('settings', {
         title: 'Cart settings',
@@ -148,7 +147,7 @@ router.get('/admin/settings', restrict, (req, res) => {
     });
 });
 
-// settings update
+// create API key
 router.post('/admin/createApiKey', restrict, checkAccess, async (req, res) => {
     const db = req.app.db;
     const result = await db.users.findOneAndUpdate({
@@ -180,7 +179,7 @@ router.post('/admin/settings/update', restrict, checkAccess, (req, res) => {
     res.status(400).json({ message: 'Permission denied' });
 });
 
-// settings update
+// settings menu
 router.get('/admin/settings/menu', restrict, async (req, res) => {
     const db = req.app.db;
     res.render('settings_menu', {
@@ -195,7 +194,7 @@ router.get('/admin/settings/menu', restrict, async (req, res) => {
     });
 });
 
-// settings page list
+// page list
 router.get('/admin/settings/pages', restrict, async (req, res) => {
     const db = req.app.db;
     const pages = await db.pages.find({}).toArray();
@@ -213,11 +212,11 @@ router.get('/admin/settings/pages', restrict, async (req, res) => {
     });
 });
 
-// settings pages new
+// pages new
 router.get('/admin/settings/pages/new', restrict, checkAccess, async (req, res) => {
     const db = req.app.db;
 
-    res.render('settings_page_edit', {
+    res.render('settings_page', {
         title: 'Static pages',
         session: req.session,
         admin: true,
@@ -230,7 +229,7 @@ router.get('/admin/settings/pages/new', restrict, checkAccess, async (req, res)
     });
 });
 
-// settings pages editor
+// pages editor
 router.get('/admin/settings/pages/edit/:page', restrict, checkAccess, async (req, res) => {
     const db = req.app.db;
     const page = await db.pages.findOne({ _id: common.getId(req.params.page) });
@@ -247,7 +246,7 @@ router.get('/admin/settings/pages/edit/:page', restrict, checkAccess, async (req
         return;
     }
 
-    res.render('settings_page_edit', {
+    res.render('settings_page', {
         title: 'Static pages',
         page: page,
         button_text: 'Update',
@@ -261,8 +260,8 @@ router.get('/admin/settings/pages/edit/:page', restrict, checkAccess, async (req
     });
 });
 
-// settings update page
+// insert/update page
-router.post('/admin/settings/pages/update', restrict, checkAccess, async (req, res) => {
+router.post('/admin/settings/page', restrict, checkAccess, async (req, res) => {
     const db = req.app.db;
 
     const doc = {
@@ -297,50 +296,46 @@ router.post('/admin/settings/pages/update', restrict, checkAccess, async (req, r
     }
 });
 
-// settings delete page
+// delete page
-router.get('/admin/settings/pages/delete/:page', restrict, checkAccess, async (req, res) => {
+router.post('/admin/settings/page/delete', restrict, checkAccess, async (req, res) => {
     const db = req.app.db;
     try{
-        await db.pages.deleteOne({ _id: common.getId(req.params.page) }, {});
+        await db.pages.deleteOne({ _id: common.getId(req.body.pageId) }, {});
-        req.session.message = 'Page successfully deleted';
+        res.status(200).json({ message: 'Page successfully deleted' });
-        req.session.messageType = 'success';
-        res.redirect('/admin/settings/pages');
         return;
     }catch(ex){
-        req.session.message = 'Error deleting page. Please try again.';
+        res.status(400).json({ message: 'Error deleting page. Please try again.' });
-        req.session.messageType = 'danger';
-        res.redirect('/admin/settings/pages');
     }
 });
 
 // new menu item
 router.post('/admin/settings/menu/new', restrict, checkAccess, (req, res) => {
-    const result = common.newMenu(req, res);
+    const result = common.newMenu(req);
     if(result === false){
-        req.session.message = 'Failed creating menu.';
+        res.status(400).json({ message: 'Failed creating menu.' });
-        req.session.messageType = 'danger';
+        return;
     }
-    res.redirect('/admin/settings/menu');
+    res.status(200).json({ message: 'Menu created successfully.' });
 });
 
 // update existing menu item
 router.post('/admin/settings/menu/update', restrict, checkAccess, (req, res) => {
-    const result = common.updateMenu(req, res);
+    const result = common.updateMenu(req);
     if(result === false){
-        req.session.message = 'Failed updating menu.';
+        res.status(400).json({ message: 'Failed updating menu.' });
-        req.session.messageType = 'danger';
+        return;
     }
-    res.redirect('/admin/settings/menu');
+    res.status(200).json({ message: 'Menu updated successfully.' });
 });
 
 // delete menu item
-router.get('/admin/settings/menu/delete/:menuid', restrict, checkAccess, (req, res) => {
+router.post('/admin/settings/menu/delete', restrict, checkAccess, (req, res) => {
-    const result = common.deleteMenu(req, res, req.params.menuid);
+    const result = common.deleteMenu(req, req.body.menuId);
     if(result === false){
-        req.session.message = 'Failed deleting menu.';
+        res.status(400).json({ message: 'Failed deleting menu.' });
-        req.session.messageType = 'danger';
+        return;
     }
-    res.redirect('/admin/settings/menu');
+    res.status(200).json({ message: 'Menu deleted successfully.' });
 });
 
 // We call this via a Ajax call to save the order from the sortable list
@@ -376,7 +371,7 @@ router.post('/admin/api/validate_permalink', async (req, res) => {
 
 // upload the file
 const upload = multer({ dest: 'public/uploads/' });
-router.post('/admin/file/upload', restrict, checkAccess, upload.single('upload_file'), async (req, res, next) => {
+router.post('/admin/file/upload', restrict, checkAccess, upload.single('uploadFile'), async (req, res) => {
     const db = req.app.db;
 
     if(req.file){
@@ -390,10 +385,8 @@ router.post('/admin/file/upload', restrict, checkAccess, upload.single('upload_f
             // Remove temp file
             fs.unlinkSync(file.path);
 
-            // Redirect to error
+            // Return error
-            req.session.message = 'File type not allowed or too large. Please try again.';
+            res.status(400).json({ message: 'File type not allowed or too large. Please try again.' });
-            req.session.messageType = 'danger';
-            res.redirect('/admin/product/edit/' + req.body.productId);
             return;
         }
 
@@ -403,10 +396,8 @@ router.post('/admin/file/upload', restrict, checkAccess, upload.single('upload_f
             // delete the temp file.
             fs.unlinkSync(file.path);
 
-            // Redirect to error
+            // Return error
-            req.session.message = 'File upload error. Please try again.';
+            res.status(400).json({ message: 'File upload error. Please try again.' });
-            req.session.messageType = 'danger';
-            res.redirect('/admin/product/edit/' + req.body.productId);
             return;
         }
 
@@ -431,20 +422,13 @@ router.post('/admin/file/upload', restrict, checkAccess, upload.single('upload_f
         // if there isn't a product featured image, set this one
         if(!product.productImage){
             await db.products.updateOne({ _id: common.getId(req.body.productId) }, { $set: { productImage: imagePath } }, { multi: false });
-            req.session.message = 'File uploaded successfully';
+        }
-            req.session.messageType = 'success';
+         // Return success message
-            res.redirect('/admin/product/edit/' + req.body.productId);
+        res.status(200).json({ message: 'File uploaded successfully' });
         return;
     }
-        req.session.message = 'File uploaded successfully';
+    // Return error
-        req.session.messageType = 'success';
+    res.status(400).json({ message: 'File upload error. Please try again.' });
-        res.redirect('/admin/product/edit/' + req.body.productId);
-        return;
-    }
-    // Redirect to error
-    req.session.message = 'File upload error. Please select a file.';
-    req.session.messageType = 'danger';
-    res.redirect('/admin/product/edit/' + req.body.productId);
 });
 
 // delete a file via ajax request
@@ -455,67 +439,4 @@ router.post('/admin/testEmail', restrict, (req, res) => {
     res.status(200).json({ message: 'Test email sent' });
 });
 
-// delete a file via ajax request
-router.post('/admin/file/delete', restrict, checkAccess, async (req, res) => {
-    req.session.message = null;
-    req.session.messageType = null;
-
-    try{
-        await fs.unlinkSync('public/' + req.body.img);
-        res.writeHead(200, { 'Content-Type': 'application/text' });
-        res.end('File deleted successfully');
-    }catch(ex){
-        console.error(colors.red('File delete error: ' + ex));
-        res.writeHead(400, { 'Content-Type': 'application/text' });
-        res.end('Failed to delete file: ' + ex);
-    }
-});
-
-router.get('/admin/files', restrict, async (req, res) => {
-    // loop files in /public/uploads/
-    const files = await glob.sync('public/uploads/**', { nosort: true });
-
-    // sort array
-    files.sort();
-
-    // declare the array of objects
-    const fileList = [];
-    const dirList = [];
-
-    // loop these files
-    for(let i = 0; i < files.length; i++){
-        // only want files
-        if(fs.lstatSync(files[i]).isDirectory() === false){
-            // declare the file object and set its values
-            const file = {
-                id: i,
-                path: files[i].substring(6)
-            };
-
-            // push the file object into the array
-            fileList.push(file);
-        }else{
-            const dir = {
-                id: i,
-                path: files[i].substring(6)
-            };
-
-            // push the dir object into the array
-            dirList.push(dir);
-        }
-    }
-
-    // render the files route
-    res.render('files', {
-        title: 'Files',
-        files: fileList,
-        admin: true,
-        dirs: dirList,
-        session: req.session,
-        config: common.get(),
-        message: common.clearSessionValue(req.session, 'message'),
-        messageType: common.clearSessionValue(req.session, 'messageType')
-    });
-});
-
 module.exports = router;

views/product_edit.hbs

@@ -168,22 +168,21 @@
 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
-            <form method="post" id="upload_form" name="upload_form" action="/admin/file/upload" enctype="multipart/form-data">
+            <form method="post" id="uploadForm" enctype="multipart/form-data"></form>
             <div class="modal-header">
                 <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                 <h4 class="modal-title" id="myModalLabel">{{ @root.__ "Product image upload" }}</h4>
             </div>
             <div class="modal-body">
                 <span class="btn btn-info btn-file">
-                        {{ @root.__ "Select file" }}<input type="file" name="upload_file" id="upload_file">
+                    {{ @root.__ "Select file" }}<input type="file" name="uploadFile" id="uploadFile" form="uploadForm">
                 </span>
                 <input type="hidden" id="productId" name="productId" value="{{result._id}}"/>
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
-                    <button type="submit" id="saveButton" name="saveButton" class="btn btn-primary">{{ @root.__ "Upload" }}</button>
+                <button type="button" id="uploadButton" class="btn btn-primary">{{ @root.__ "Upload" }}</button>
             </div>
-            </form>
         </div>
     </div>
 </div>

views/settings_menu.hbs

@@ -11,42 +11,38 @@
                 <th></th>
                 <tbody id="draggable_list">
                     {{#each menu.items}}
-                        <tr class="drag-row">
+                        <tr class="drag-row" id="menuId-{{@key}}">
-                            <form method="post" action="/admin/settings/menu/update">
+                            <input type="hidden" class="navId" value="{{title}}">
-                            <input type="hidden" class="navId" name="navId" value="{{title}}">
                             <td class="dragable_item col-md-1 td-pad"><i class="fa fa-arrows"></i></td>
                             <td class="dragable_item col-md-2">
-                                <input type="text" class="form-control input-sm test" name="navMenu" value="{{title}}">
+                                <input type="text" class="form-control input-sm navMenu" value="{{title}}">
                             </td>
                             <td class="dragable_item col-md-6">
-                                <input type="text" class="form-control input-sm test" name="navLink" value="{{link}}">
+                                <input type="text" class="form-control input-sm navLink" value="{{link}}">
                             </td>
                             <td class="col-md-2">
-                                <a class="btn btn-danger btn-sm" onclick="return confirm('Are you sure?');" href="/admin/settings/menu/delete/{{@key}}">
+                                <a class="btn btn-danger btn-sm settings-menu-delete" data-id="{{@key}}">
                                     <i class="fa fa-trash-o"></i>
                                 </a>
-                                <button type="submit" class="btn btn-success btn-sm">
+                                <button type="submit" class="btn btn-success btn-sm" id="settings-menu-update" >
                                     <i class="fa fa-floppy-o"></i>
                                 </button>
                             </td>
-                            </form>
                         </tr>
                     {{/each}}
                         <tr>
-                            <form method="post" action="/admin/settings/menu/new">
                             <td class="dragable_item col-md-1"></td>
                             <td class="dragable_item col-md-2">
-                                <input type="text" class="form-control input-sm test" name="navMenu">
+                                <input type="text" class="form-control input-sm" id="newNavMenu">
                             </td>
                             <td class="dragable_item col-md-6">
-                                <input type="text" class="form-control input-sm test" name="navLink">
+                                <input type="text" class="form-control input-sm" id="newNavLink">
                             </td>
                             <td class="col-md-2">
-                                <button type="submit" class="btn btn-success btn-sm">
+                                <button type="submit" id="settings-menu-new" class="btn btn-success btn-sm">
                                     <i class="fa fa-plus"></i>
                                 </button>
                             </td>
-                            </form>
                         </tr>
                 </tbody>
             </table>

views/settings_pages.hbs

@@ -16,7 +16,7 @@
                                 </div>
                                 <div class="col-lg-4 text-right">
                                     <a class="btn btn-sm btn-success" href="/admin/settings/pages/edit/{{_id}}">{{ @root.__ "Edit" }}</a>
-                                    <a class="btn btn-sm btn-danger" href="/admin/settings/pages/delete/{{_id}}">{{ @root.__ "Delete" }}</a>
+                                    <button class="btn btn-sm btn-danger" id="btnPageDelete" data-id="{{_id}}">{{ @root.__ "Delete" }}</button>
                                 </div>
                             </div>
                         </li>