styles settings section, fixed minor bugs in settings json

brain/api/content/settings.js

@@ -0,0 +1,224 @@
+import DateUtils from '../../tools/utilities/DateUtils';
+import StringUtils from '../../tools/utilities/StringUtils';
+import * as DataEvent from '../../tools/events/DataEvent';
+import RightsManager,
+{
+    TASK_CREATE,
+    TASK_UPDATE,
+    TASK_READ,
+    TASK_DELETE,
+    OBJECT_CLIENT_ADMIN,
+    OBJECT_CLIENT_USER,
+    OBJECT_PROJECT_CLIENT,
+    OBJECT_PROJECT_FOLIO,
+    OBJECT_BOOKMARK,
+    OBJECT_POST
+}
+from '../../tools/utilities/RightsManager';
+const express = require('express');
+const router = express.Router();
+const multer = require('multer');
+const fs = require('fs-extra');
+const Models = require('../../models');
+const dateUtils = new DateUtils();
+const rightsManager = new RightsManager();
+const uploadPath = "./content/blog-images/" + dateUtils.getDate('year', new Date()) + "/" + dateUtils.getDate('month', new Date());
+const Sequelize = require('sequelize');
+const Op = Sequelize.Op;
+const _ = require('lodash');
+fs.ensureDir(uploadPath, function(err)
+{
+    //console.log(err) // => null
+    // dir has now been created, including the directory it is to be placed in
+})
+var storage = multer.diskStorage(
+{
+    destination: function(req, file, cb)
+    {
+        cb(null, uploadPath)
+    },
+    filename: function(req, file, cb)
+    {
+        var splice = file.originalname.split(':');
+        cb(null, splice[0]);
+    }
+});
+var avatar_upload = multer(
+{
+    storage: storage
+}).array('avatar');
+var background_upload = multer(
+{
+    storage: storage
+}).array('feature_background');
+//** SYNC POSTS */
+router.post("/sync", (req, res, next) =>
+{
+    let payload = req.body;
+    Models.User.findById(req.session.user.id).then((user) =>
+    {
+        if (rightsManager.check(user.role, OBJECT_POST, TASK_UPDATE))
+        {
+            for (let index = 0; index < payload.length; index++)
+            {
+                const item = payload[index];
+                Models.FreshPost.findOne(
+                {
+                    where:
+                    {
+                        "post":
+                        {
+                            [Op.contains]:
+                            {
+                                uuid: item.post.uuid
+                            }
+                        }
+                    }
+                }).then(found =>
+                {
+                    let buffed = sanitize(item.post.plaintext,
+                    {
+                        allowedTags: ['del', 'a', 'iframe', 'img', ],
+                        allowedAttributes:
+                        {
+                            a: ['href', 'name', 'target'],
+                            img: ['src'],
+                            iframe: ['height', 'width', 'src', 'frameborder', 'allow', 'allowfullscreen']
+                        }
+                    })
+                    buffed = new StringUtils().decodeHTML(buffed);
+                    item.post.plaintext = buffed;
+                    item.post.html = md.render(buffed,
+                    {
+                        html: true,
+                        xhtmlOut: true,
+                    });
+                    if (!_.isEqual(item.post, found.post))
+                    {
+                        found.update(item).then(updated =>
+                        {
+                            console.log("UPDATED", updated);
+                        }).catch(err =>
+                        {
+                            //console.log("***ERROR***", err);
+                        })
+                    }
+                    else
+                    {
+                        //chilld
+                    }
+                }).catch(err =>
+                {
+                    //console.log("***ERRRORZ****", err);
+                    Models.FreshPost.create(item).then(fresh =>
+                    {
+                        //console.log(fresh)
+                    })
+                })
+            }
+            res.json(
+            {
+                message: "postsSynced"
+            });
+        }
+        else
+        {
+            res.json(
+            {
+                message: "Nah. You can't do that. Talk to the admin, sport."
+            });
+        }
+    });
+})
+
+/***
+    UPLOAD AVATAR
+*/
+router.post('/add-avatar', function(req, res, next)
+{
+    //console.log(req.body);
+    if (!req.session.user) return res.json(
+    {
+        message: "You need to be logged in, champ."
+    });
+    Models.User.findById(req.session.user.id).then((user) =>
+    {
+        if (rightsManager.check(user.role, OBJECT_POST, TASK_CREATE))
+        {
+            avatar_upload(req, res, function(err)
+            {
+                if (err)
+                {
+                    //console.log('Error in Saving Entry: ' + err);
+                    res.json(
+                    {
+                        message: err
+                    });
+                    throw err;
+                }
+                else
+                {
+                    var postImage = req.files[0].path;
+                    return res.json(
+                    {
+                        message: DataEvent.POST_IMAGE_ADDED,
+                        url: postImage.substr(7, postImage.length)
+                    });
+                }
+            });
+        }
+        else
+        {
+            res.json(
+            {
+                message: "Nah. You can't do that. Talk to the admin, sport."
+            });
+        }
+    });
+});
+/***
+    UPLOAD FEATURE BACKGROUND
+*/
+router.post('/add-feature-background', function(req, res, next)
+{
+    //console.log(req.body);
+    if (!req.session.user) return res.json(
+    {
+        message: "You need to be logged in, champ."
+    });
+    Models.User.findById(req.session.user.id).then((user) =>
+    {
+        if (rightsManager.check(user.role, OBJECT_POST, TASK_CREATE))
+        {
+            background_upload(req, res, function(err)
+            {
+                if (err)
+                {
+                    //console.log('Error in Saving Entry: ' + err);
+                    res.json(
+                    {
+                        message: err
+                    });
+                    throw err;
+                }
+                else
+                {
+                    var postImage = req.files[0].path;
+                    return res.json(
+                    {
+                        message: DataEvent.FEATURE_IMAGE_ADDED,
+                        url: postImage.substr(7, postImage.length)
+                    });
+                }
+            });
+        }
+        else
+        {
+            res.json(
+            {
+                message: "Nah. You can't do that. Talk to the admin, sport."
+            });
+        }
+    });
+});
+module.exports = router;

brain/routes/back/dash_settings.js

@@ -19,11 +19,20 @@ router.get('/', function(req, res)
     })
     FileHound.create().paths('themes').ext('json').find().then(files =>
     {
+        themes = [];
         for (let index = 0; index < files.length; index++)
         {
             fs.readJson(files[index]).then(theme =>
             {
-                (theme.name == settings.theme) ? themes.push({theme: theme, current:true}) : themes.push({theme: theme, current:false})
+                (theme.name == settings.theme) ? themes.push(
+                {
+                    theme: theme,
+                    current: true
+                }): themes.push(
+                {
+                    theme: theme,
+                    current: false
+                })
             }).catch(err =>
             {
                 //console.error(err)
@@ -33,7 +42,13 @@ router.get('/', function(req, res)
     if (req.session.user)
     {
         let memberInfo = [];
-        memberInfo.push({handle:req.session.user.handle, email:req.session.user.email, avi:req.session.user.avatar});
+        memberInfo.push(
+        {
+            handle: req.session.user.handle,
+            email: req.session.user.email,
+            avi: req.session.user.avatar
+        });
+        console.log("THEMES", themes);
         res.render('dash/settings',
         {
             title: 'Dashboard | Settings',

site-settings.json

@@ -1,5 +1,6 @@
 {
     "url": "http://fipamo.local/",
+    "title": "this is the title",
     "description":"The most chill blog framework ever.",
     "theme": "default",
     "private": false,

themes/dash/assets/css/dash.css

@@ -1573,7 +1573,7 @@ a:hover {
   color: #bad1e8;
 }
 svg.icons {
-  width: 20px;
+  width: 30px;
   fill: #b2cce5;
 }
 #loader {
@@ -1601,7 +1601,7 @@ svg.icons {
 .main-container section header {
   width: 100%;
   height: 100px;
-  background-color: #27323d;
+  background-color: #161d23;
   margin: 0;
   padding: 0;
 }
@@ -1761,15 +1761,15 @@ svg.icons {
 #dash-index-content #dash-index #dash-index-wrapper #dash-menu a {
   display: inline-block;
   vertical-align: top;
-  background: #32414e;
+  background: #161d23;
   width: 30%;
   padding: 5px;
   border-radius: 3px;
-  color: #b2cce5;
+  color: #f2f1ef;
   margin: 0 10px 10px 0;
 }
 #dash-index-content #dash-index #dash-index-wrapper #dash-menu a:hover {
-  background: #2c3a46;
+  background: #1c242c;
 }
 #dash-index-content #dash-index #dash-index-wrapper #dash-menu a svg {
   display: inline-block;
@@ -1778,8 +1778,8 @@ svg.icons {
 }
 #dash-index-content #dash-index #dash-index-wrapper #dash-menu a label {
   display: inline-block;
-  margin-top: -5px;
+  margin-top: 5px;
-  width: 90%;
+  width: 85%;
   text-align: center;
   cursor: pointer;
 }
@@ -1890,20 +1890,59 @@ svg.icons {
 #settings-index #settings-index-wrapper {
   padding: 0.75rem;
 }
-#settings-index #settings-index-wrapper a {
+#settings-index #settings-index-wrapper button {
-  display: inline-block;
+  margin-top: 5px;
-  vertical-align: top;
+  width: 320px;
+  height: 45px;
 }
-#settings-index #settings-index-wrapper a svg {
+#settings-index #settings-index-wrapper #member-avatar-drop img {
-  display: inline-block;
+  width: 200px;
-  vertical-align: top;
+  border: 1px solid #f2f1ef;
+  border-radius: 100px;
+  overflow: hidden;
 }
-#settings-index #settings-index-wrapper a label {
+#settings-index #settings-index-wrapper #member-avatar-drop input {
+  visibility: hidden;
+}
+#settings-index #settings-index-wrapper #member-settings,
+#settings-index #settings-index-wrapper #site-settings,
+#settings-index #settings-index-wrapper #theme-settings {
+  width: 80%;
+  margin-bottom: 40px;
+}
+#settings-index #settings-index-wrapper #member-settings label,
+#settings-index #settings-index-wrapper #site-settings label,
+#settings-index #settings-index-wrapper #theme-settings label {
+  font-family: "Apercu-Mono";
+  color: #f2f1ef;
+}
+#settings-index #settings-index-wrapper #member-settings input,
+#settings-index #settings-index-wrapper #site-settings input,
+#settings-index #settings-index-wrapper #theme-settings input {
+  width: 44%;
+  margin-right: 5px;
+  height: 30px;
+  padding: 10px;
+}
+#settings-index #settings-index-wrapper #member-settings textarea,
+#settings-index #settings-index-wrapper #site-settings textarea,
+#settings-index #settings-index-wrapper #theme-settings textarea {
+  background: #161d23;
+  width: 91.5%;
+  height: 100px;
+  color: #b2cce5;
+  margin-top: 10px;
+  padding: 10px;
+}
+#settings-index #settings-index-wrapper #theme-settings a {
+  width: 310px;
+  margin-right: 5px;
+  height: 25px;
+  padding: 10px;
   display: inline-block;
-  vertical-align: top;
+  background: #161d23;
-  text-align: center;
+  color: #b2cce5;
-  width: 100px;
+  border-radius: 3px;
-  cursor: pointer;
 }
 /**
 -------------------------------
@@ -1921,7 +1960,7 @@ input[type=text] {
   padding: 5px;
   font: 1em 'Apercu-Mono';
   display: inline-block;
-  background-color: #32414e;
+  background-color: #161d23;
   color: #b2cce5;
 }
 textarea {

themes/dash/assets/js/dash.min.js

@@ -8477,7 +8477,7 @@ var parent = module.bundle.parent;
 if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
   var hostname = "" || location.hostname;
   var protocol = location.protocol === 'https:' ? 'wss' : 'ws';
-  var ws = new WebSocket(protocol + '://' + hostname + ':' + "51778" + '/');
+  var ws = new WebSocket(protocol + '://' + hostname + ':' + "62875" + '/');
 
   ws.onmessage = function (event) {
     var data = JSON.parse(event.data);

themes/dash/settings.pug

@@ -3,15 +3,25 @@ block main-content
       #settings-index
         #settings-index-wrapper
             #member-avatar-drop
-              img(src="")
+              img(src=member.avi)
               input(id="avatar-upload" type="file" name="avatar-image-upload")
+            #member-settings
               input(type='text', name='handle' class='settings-handle', placeholder='handle', value=member.handle, autofocus)
               input(type='text', name='email' class='settings-email', placeholder='email', value=member.email, autofocus)
+            #site-settings
+              label OPTIONS
               br
               input(type='text', name='base-url' class='settings-url', placeholder='url', value=settings.url, autofocus)
+              input(type='text', name='base-title' class='settings-title', placeholder='site title', value=settings.title, autofocus)
               textarea(id="settings_desc" type='text', name='settings_desc' class='settings-dec', placeholder='description stuff', autofocus)
                 =settings.description
-
-            br
               button#privacy-toggle SITE IS PUBLIC
+            #theme-settings
+              label THEMES
+              br
+              - var index = 0;			
+                - for ( index; index < themes.length; index++)
+                    a.theme-select(href="#" id=themes[index].theme.name)
+                        = themes[index].theme["display-name"]
+            button#save-toggle SAVE SETTINGS
       

themes/dash/src/styles/main/_forms.styl

@@ -7,7 +7,7 @@ input[type=email], input[type=password], input[type=text]
     padding 5px
     font 1em 'Apercu-Mono'
     display inline-block
-    background-color $primary - 10%
+    background-color $primary - 60%
     color $secondary
 
 textarea

themes/dash/src/styles/main/_index.styl

@@ -36,15 +36,15 @@
         a
           display inline-block
           vertical-align top
-          background $primary - 10%
+          background $primary - 60%
           width 30%
           padding 5px
           border-radius 3px
-          color $secondary
+          color $white
           margin 0 10px 10px 0
 
           &:hover
-            background $primary - 20%
+            background $primary - 50%
 
           svg
             display inline-block
@@ -53,8 +53,8 @@
 
           label
             display inline-block
-            margin-top -5px
+            margin-top 5px
-            width 90%
+            width 85%
             text-align center
             cursor pointer
 

themes/dash/src/styles/main/_settings.styl

@@ -4,17 +4,45 @@
     margin 0 auto
     #settings-index-wrapper
         padding 0.75rem
-        a
+        button 
-            display inline-block
+                margin-top: 5px;
-            vertical-align top
+                width: 320px
-            svg
+                height 45px
-                display inline-block
+        #member-avatar-drop
-                vertical-align top
+            img
-
+                width: 200px
+                border: 1px solid $white
+                border-radius: 100px;
+                overflow hidden
+            input
+                visibility hidden
+        #member-settings, #site-settings, #theme-settings
             label
+                font-family: "Apercu-Mono"
+                color: $white
+            width: 80%
+            margin-bottom: 40px
+            input
+                width: 44%;
+                margin-right: 5px;
+                height 30px
+                padding: 10px
+            textarea
+                background: $primary - 60%
+                width: 91.5%
+                height 100px;
+                color: $secondary
+                margin-top: 10px
+                padding: 10px;
+        #theme-settings
+                a
+                    width: 310px;
+                    margin-right: 5px;
+                    height 25px
+                    padding: 10px
                     display inline-block
-                vertical-align top
+                    background: $primary - 60%
-                text-align center
+                    color $secondary
-                width 100px
+                    border-radius 3px
-                cursor pointer
+        
         

themes/dash/src/styles/main/_structure.styl

@@ -13,7 +13,7 @@ a
     color $secondary + 10%
 
 svg.icons
-  width 20px
+  width 30px
   fill $secondary
 
 #loader
@@ -42,7 +42,7 @@ svg.icons
     header
       width 100%
       height 100px
-      background-color $primary - 30%
+      background-color $primary - 60%
       margin 0
       padding 0