save ordering pages

package.json

@@ -17,6 +17,7 @@
     "codex.editor.header": "^2.0.5",
     "cookie-parser": "~1.4.3",
     "debug": "~4.1.0",
+    "eslint-plugin-standard": "^4.0.0",
     "express": "~4.16.0",
     "http-errors": "~1.7.1",
     "module-dispatcher": "^1.0.2",
@@ -48,6 +49,8 @@
     "eslint": "^5.3.0",
     "eslint-config-codex": "github:codex-team/eslint-config",
     "eslint-plugin-chai-friendly": "^0.4.1",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-node": "^8.0.1",
     "highlight.js": "^9.13.1",
     "husky": "^1.1.2",
     "mini-css-extract-plugin": "^0.4.3",

src/controllers/pages.js

@@ -106,7 +106,6 @@ class Pages {
     }
 
     page.data = data;
-
     return page.save();
   }
 

src/frontend/js/modules/writing.js

@@ -27,7 +27,8 @@ export default class Writing {
     this.nodes = {
       editorWrapper: null,
       saveButton: null,
-      parentIdSelector: null
+      parentIdSelector: null,
+      putAboveIdSelector: null,
     };
   }
 
@@ -61,6 +62,7 @@ export default class Writing {
       this.saveButtonClicked();
     });
     this.nodes.parentIdSelector = moduleEl.querySelector('[name="parent"]');
+    this.nodes.putAboveIdSelector = moduleEl.querySelector('[name="above"]');
   };
 
   /**
@@ -89,8 +91,15 @@ export default class Writing {
       throw new Error('Entry should start with Header');
     }
 
+    /** get ordering selector value */
+    let putAbovePageId = null;
+    if (this.nodes.putAboveIdSelector) {
+      putAbovePageId = this.nodes.putAboveIdSelector.value;
+    }
+
     return {
       parent: this.nodes.parentIdSelector.value,
+      putAbovePageId: putAbovePageId,
       body: editorData
     };
   }

src/models/page.js

@@ -6,7 +6,7 @@ const {pages: db} = require('../utils/database/index');
  * @property {string} title - page title
  * @property {*} body - page body
  * @property {string} parent - id of parent page
- *
+ * @property {Array} childrenOrder - array with children order
  */
 
 /**
@@ -17,6 +17,7 @@ const {pages: db} = require('../utils/database/index');
  * @property {string} title - page title
  * @property {*} body - page body
  * @property {string} _parent - id of parent page
+ * @property {Array} _childrenOrder - array with children order
  */
 class Page {
   /**
@@ -65,11 +66,12 @@ class Page {
    * @param {PageData} pageData
    */
   set data(pageData) {
-    const {body, parent} = pageData;
+    const {body, parent, childrenOrder} = pageData;
 
     this.body = body || this.body;
     this.title = this.extractTitleFromBody();
     this._parent = parent || this._parent;
+    this._childrenOrder = childrenOrder || this._childrenOrder || [];
   }
 
   /**
@@ -82,7 +84,8 @@ class Page {
       _id: this._id,
       title: this.title,
       body: this.body,
-      parent: this._parent
+      parent: this._parent,
+      childrenOrder: this._childrenOrder
     };
   }
 
@@ -105,6 +108,24 @@ class Page {
     this._parent = parentPage._id;
   }
 
+  /**
+   * Update children order
+   *
+   * @param newOrder
+   */
+  set childrenOrder(newOrder) {
+    this._childrenOrder = newOrder;
+  }
+
+  /**
+   * Children order
+   *
+   * @return {Array<string>}
+   */
+  get childrenOrder() {
+    return this._childrenOrder;
+  }
+
   /**
    * Return parent page model
    *

src/routes/api/pages.js

@@ -55,6 +55,17 @@ router.put('/page', multer.any(), async (req, res) => {
     const {title, body, parent} = req.body;
     const page = await Pages.insert({title, body, parent});
 
+    /**
+     * Each new page push to order at the last
+     */
+    if (parent && parent !== '0') {
+      const parentPage = await Pages.get(page._parent);
+
+      /** Push to parents children order */
+      parentPage.childrenOrder.push(page._id);
+      parentPage.save();
+    }
+
     res.json({
       success: true,
       result: page
@@ -76,9 +87,29 @@ router.post('/page/:id', multer.any(), async (req, res) => {
   const {id} = req.params;
 
   try {
-    const {title, body, parent} = req.body;
+    const {title, body, parent, putAbovePageId} = req.body;
     const page = await Pages.update(id, {title, body, parent});
 
+    /** update child order */
+    if (parent && parent !== '0') {
+      const parentPage = await Pages.get(parent);
+      const found1 = parentPage.childrenOrder.indexOf(putAbovePageId);
+      const found2 = parentPage.childrenOrder.indexOf(id);
+
+      if (found1 < found2) {
+        for(let i = found2; i >= found1; i--) {
+          parentPage.childrenOrder[i] = parentPage.childrenOrder[i - 1];
+        }
+        parentPage.childrenOrder[found1] = id;
+      } else {
+        for(let i = found2; i < found1; i++) {
+          parentPage.childrenOrder[i] = parentPage.childrenOrder[i + 1];
+        }
+        parentPage.childrenOrder[found1 - 1] = id;
+      }
+      parentPage.save();
+    }
+
     res.json({
       success: true,
       result: page

src/routes/middlewares/pages.js

@@ -8,8 +8,17 @@ const asyncMiddleware = require('../../utils/asyncMiddleware');
  */
 function createMenuTree(pages) {
   return pages.filter(page => page._parent === '0').map(page => {
+    const children = pages.filter(child => child._parent === page._id);
+    const orderedChildren = [];
+    page.childrenOrder.forEach(pageId => {
+      children.forEach(_page => {
+        if (_page._id === pageId) {
+          orderedChildren.push(_page);
+        }
+      })
+    });
     return Object.assign({
-      children: pages.filter(child => child._parent === page._id).reverse()
+      children: orderedChildren
     }, page.data);
   });
 }

src/routes/pages.js

@@ -21,12 +21,35 @@ router.get('/page/edit/:id', async (req, res, next) => {
   const pageId = req.params.id;
 
   try {
-    let page = await Pages.get(pageId);
-    let pagesAvailable = await Pages.getAll();
+    const page = await Pages.get(pageId);
+    const pagesAvailable = await Pages.getAll();
+
+    /**
+     * get parent with children
+     */
+    let parentsChildren = [];
+
+    let parentsChildrenOrdered = [];
+
+    if (page._parent && page._parent !== '0') {
+      const parentPage = await Pages.get(page._parent);
+
+      parentsChildren = pagesAvailable.filter(_page => _page._parent === parentPage._id);
+
+      /** Order children */
+      parentPage.childrenOrder.forEach(_pageId => {
+        parentsChildren.forEach(_page => {
+          if (_page._id === _pageId && _pageId !== pageId) {
+            parentsChildrenOrdered.push(_page);
+          }
+        });
+      });
+    }
 
     res.render('pages/form', {
-      pagesAvailable,
-      page
+      page,
+      parentsChildrenOrdered,
+      pagesAvailable
     });
   } catch (error) {
     res.status(404);

src/views/pages/form.twig

@@ -29,6 +29,15 @@
             {% endif %}
           {% endfor %}
         </select>
+
+        {% if parentsChildrenOrdered is not empty %}
+          Put Above
+          <select name="above">
+            {% for _page in parentsChildrenOrdered %}
+              <option value="{{ _page._id }}">{{ _page.title }}</option>
+            {% endfor %}
+          </select>
+        {% endif %}
       </span>
       <span class="writing-header__save" name="js-submit">
         Save

yarn.lock

@@ -2514,6 +2514,18 @@ eslint-plugin-node@^7.0.1:
     resolve "^1.8.1"
     semver "^5.5.0"
 
+eslint-plugin-node@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-node/-/eslint-plugin-node-8.0.1.tgz#55ae3560022863d141fa7a11799532340a685964"
+  integrity sha512-ZjOjbjEi6jd82rIpFSgagv4CHWzG9xsQAVp1ZPlhRnnYxcTgENUVBvhYmkQ7GvT1QFijUSo69RaiOJKhMu6i8w==
+  dependencies:
+    eslint-plugin-es "^1.3.1"
+    eslint-utils "^1.3.1"
+    ignore "^5.0.2"
+    minimatch "^3.0.4"
+    resolve "^1.8.1"
+    semver "^5.5.0"
+
 eslint-plugin-promise@^3.8.0:
   version "3.8.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.8.0.tgz#65ebf27a845e3c1e9d6f6a5622ddd3801694b621"
@@ -2524,6 +2536,11 @@ eslint-plugin-standard@^3.0.1:
   resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-3.1.0.tgz#2a9e21259ba4c47c02d53b2d0c9135d4b1022d47"
   integrity sha512-fVcdyuKRr0EZ4fjWl3c+gp1BANFJD1+RaWa2UPYfMZ6jCtp5RG00kSaXnK/dE5sYzt4kaWJ9qdxqUfc0d9kX0w==
 
+eslint-plugin-standard@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-4.0.0.tgz#f845b45109c99cd90e77796940a344546c8f6b5c"
+  integrity sha512-OwxJkR6TQiYMmt1EsNRMe5qG3GsbjlcOhbGUBY4LtavF9DsLaTcoR+j2Tdjqi23oUwKNUqX7qcn5fPStafMdlA==
+
 eslint-scope@3.7.1:
   version "3.7.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-3.7.1.tgz#3d63c3edfda02e06e01a452ad88caacc7cdcb6e8"
@@ -3358,6 +3375,11 @@ ignore@^4.0.2, ignore@^4.0.6:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
 
+ignore@^5.0.2:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.0.4.tgz#33168af4a21e99b00c5d41cbadb6a6cb49903a45"
+  integrity sha512-WLsTMEhsQuXpCiG173+f3aymI43SXa+fB1rSfbzyP4GkPP+ZFVuO0/3sFUGNBtifisPeDcl/uD/Y2NxZ7xFq4g==
+
 immediate@~3.0.5:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"