Added alerts functionality + modal UI

assets/css/app.css

@@ -1 +1 @@
-.card,.highlight,.highlight pre,.textarea,embed,img,object{max-width:100%}a,hr{padding:0}a,button,input[type=button],input[type=file],input[type=submit],label{cursor:pointer}a,button,input,select,textarea{margin:0}a,input[type=radio],input[type=checkbox]{vertical-align:baseline}a:hover,strong,table th{color:#222324}body,pre,pre code{color:#69707a}.container,sub,sup{position:relative}.is-block,article,aside,details,figure,footer,header,hgroup,hr,nav,pre code,section,summary{display:block}.button,.delete,.input,.modal-close,.progress,.select select,.textarea{-moz-appearance:none;-webkit-appearance:none}.heading,.menu-label{letter-spacing:1px;text-transform:uppercase}abbr,address,article,aside,audio,b,blockquote,body,body div,caption,cite,code,dd,del,details,dfn,dl,dt,em,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font-weight:400;vertical-align:baseline;background:0 0}td,td img{vertical-align:top}code,html,pre,pre code{background-color:#f5f7fa}*,:after,:before{box-sizing:inherit}ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}.is-clearfix:after,.notification:after,.select:after{content:" "}a{font-size:100%;background:0 0;color:#1fc8db;text-decoration:none;transition:none 86ms ease-out}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}th{font-weight:700;vertical-align:bottom}td{font-weight:400}hr{height:1px;border:0;border-top:1px solid #ccc;border-top-color:#d3d6db;margin:40px 0}input,select{vertical-align:middle}input,select,textarea{font:99% sans-serif}table{border-collapse:collapse;border-spacing:0;font:100%;width:100%}sub,sup{font-size:75%;line-height:0}sup{top:-.5em}sub{bottom:-.25em}code,kbd,pre,samp{font-family:monospace,sans-serif}button,input[type=button]{width:auto;overflow:visible}@keyframes spin-around{from{transform:rotate(0)}to{transform:rotate(359deg)}}html{box-sizing:border-box;font-size:14px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;min-width:300px;overflow-x:hidden;overflow-y:scroll;text-rendering:optimizeLegibility}body,button,input,select,textarea{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"}code,pre{-moz-osx-font-smoothing:auto;-webkit-font-smoothing:auto;font-family:"Source Code Pro",Monaco,Inconsolata,monospace;line-height:1.25}body{font-size:1rem;font-weight:400;line-height:1.428571428571429}code{font-size:12px;padding:1px 2px 2px}.button,.fa,.input,.textarea,table td,table th{vertical-align:top}small{font-size:11px}span{font-style:inherit;font-weight:inherit}.label,strong{font-weight:700}pre{white-space:pre;word-wrap:normal}.button,.nav-left,.table td.is-icon,.table th.is-icon,.tabs,.tag{white-space:nowrap}pre code{overflow-x:auto;padding:16px 20px}.box,.button{background-color:#fff}table td,table th{text-align:left}.fa,.has-text-centered{text-align:center}.block:not(:last-child),.box:not(:last-child),.content:not(:last-child),.highlight:not(:last-child),.level:not(:last-child),.message:not(:last-child),.notification:not(:last-child),.progress:not(:last-child),.subtitle:not(:last-child),.tabs:not(:last-child),.title:not(:last-child){margin-bottom:20px}@media screen and (min-width:980px){.container{margin:0 auto;max-width:960px}.container.is-fluid{margin:0 20px;max-width:none}.is-block-desktop{display:block!important}}.fa{font-size:21px}@media screen and (max-width:768px){.is-block-mobile{display:block!important}}@media screen and (min-width:769px){.is-block-tablet{display:block!important}}@media screen and (min-width:769px) and (max-width:979px){.is-block-tablet-only{display:block!important}}@media screen and (max-width:979px){.is-block-touch{display:block!important}}@media screen and (min-width:980px) and (max-width:1179px){.is-block-desktop-only{display:block!important}}@media screen and (min-width:1180px){.container{max-width:1200px}.is-block-widescreen{display:block!important}}.is-flex{display:flex}@media screen and (max-width:768px){.is-flex-mobile{display:flex!important}}@media screen and (min-width:769px){.is-flex-tablet{display:flex!important}}@media screen and (min-width:769px) and (max-width:979px){.is-flex-tablet-only{display:flex!important}}@media screen and (max-width:979px){.is-flex-touch{display:flex!important}}@media screen and (min-width:980px){.is-flex-desktop{display:flex!important}}@media screen and (min-width:980px) and (max-width:1179px){.is-flex-desktop-only{display:flex!important}}@media screen and (min-width:1180px){.is-flex-widescreen{display:flex!important}}.is-inline{display:inline}@media screen and (max-width:768px){.is-inline-mobile{display:inline!important}}@media screen and (min-width:769px)Line truncated
+@charset "UTF-8";.card,.highlight,.highlight pre,.textarea,embed,img,object{max-width:100%}a,hr{padding:0}a,button,input[type=button],input[type=file],input[type=submit],label{cursor:pointer}a,button,input,select,textarea{margin:0}a,input[type=radio],input[type=checkbox]{vertical-align:baseline}a:hover,strong,table th{color:#222324}body,pre,pre code{color:#69707a}.container,sub,sup{position:relative}.is-block,article,aside,details,figure,footer,header,hgroup,hr,nav,pre code,section,summary{display:block}.button,.delete,.input,.modal-close,.progress,.select select,.textarea{-moz-appearance:none;-webkit-appearance:none}.heading,.menu-label{letter-spacing:1px;text-transform:uppercase}.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%,to{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}@keyframes pulse{0%,to{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%,to{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}}@keyframes rubberBand{0%,to{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:tLine truncated

assets/js/app.js

@@ -1 +1 @@
-"use strict";jQuery(document).ready(function(e){e("a").smoothScroll({speed:400,offset:-20});new Sticky(".stickyscroll")});
+"use strict";function _classCallCheck(e,s){if(!(e instanceof s))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,s){for(var t=0;t<s.length;t++){var n=s[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(s,t,n){return t&&e(s.prototype,t),n&&e(s,n),s}}(),Alerts=function(){function e(){_classCallCheck(this,e);var s=this;s.mdl=new Vue({el:"#alerts",data:{children:[]},methods:{acknowledge:function(e){s.close(e)}}}),s.uidNext=1}return _createClass(e,[{key:"push",value:function(e){var s=this,t=_.defaults(e,{_uid:s.uidNext,class:"is-info",message:"---",sticky:!1,title:"---"});s.mdl.children.push(t),t.sticky||_.delay(function(){s.close(t._uid)},5e3),s.uidNext++}},{key:"pushError",value:function(e,s){this.push({class:"is-danger",message:s,sticky:!1,title:e})}},{key:"pushSuccess",value:function(e,s){this.push({class:"is-success",message:s,sticky:!1,title:e})}},{key:"close",value:function(e){var s=this,t=_.findIndex(s.mdl.children,["_uid",e]),n=_.nth(s.mdl.children,t);t>=0&&n&&(n.class+=" exit",s.mdl.children.$set(t,n),_.delay(function(){s.mdl.children.$remove(n)},500))}}]),e}();jQuery(document).ready(function(e){e("a").smoothScroll({speed:400,offset:-20});var s=(new Sticky(".stickyscroll"),new Alerts);alertsData&&_.forEach(alertsData,function(e){s.push(e)})});

client/js/app.js

@@ -9,4 +9,11 @@ jQuery( document ).ready(function( $ ) {
 
 	var sticky = new Sticky('.stickyscroll');
 
+	var alerts = new Alerts();
+	if(alertsData) {
+		_.forEach(alertsData, (alertRow) => {
+			alerts.push(alertRow);
+		});
+	}
+
 });

client/js/components/alerts.js

@@ -0,0 +1,115 @@
+"use strict";
+
+/**
+ * Alerts
+ */
+class Alerts {
+
+	/**
+	 * Constructor
+	 *
+	 * @class
+	 */
+	constructor() {
+
+		let self = this;
+
+		self.mdl = new Vue({
+			el: '#alerts',
+			data: {
+				children: []
+			},
+			methods: {
+				acknowledge: (uid) => {
+					self.close(uid);
+				}
+			}
+		});
+
+		self.uidNext = 1;
+
+	}
+
+	/**
+	 * Show a new Alert
+	 *
+	 * @param      {Object}  options  Alert properties
+	 * @return     {null}  Void
+	 */
+	push(options) {
+
+		let self = this;
+
+		let nAlert = _.defaults(options, {
+			_uid: self.uidNext,
+			class: 'is-info',
+			message: '---',
+			sticky: false,
+			title: '---'
+		});
+
+		self.mdl.children.push(nAlert);
+
+		if(!nAlert.sticky) {
+			_.delay(() => {
+				self.close(nAlert._uid);
+			}, 5000);
+		}
+
+		self.uidNext++;
+
+	}
+
+	/**
+	 * Shorthand method for pushing errors
+	 *
+	 * @param      {String}  title    The title
+	 * @param      {String}  message  The message
+	 */
+	pushError(title, message) {
+		this.push({
+			class: 'is-danger',
+			message,
+			sticky: false,
+			title
+		});
+	}
+
+	/**
+	 * Shorthand method for pushing success messages
+	 *
+	 * @param      {String}  title    The title
+	 * @param      {String}  message  The message
+	 */
+	pushSuccess(title, message) {
+		this.push({
+			class: 'is-success',
+			message,
+			sticky: false,
+			title
+		});
+	}
+
+	/**
+	 * Close an alert
+	 *
+	 * @param      {Integer}  uid     The unique ID of the alert
+	 */
+	close(uid) {
+
+		let self = this;
+
+		let nAlertIdx = _.findIndex(self.mdl.children, ['_uid', uid]);
+		let nAlert = _.nth(self.mdl.children, nAlertIdx);
+
+		if(nAlertIdx >= 0 && nAlert) {
+			nAlert.class += ' exit';
+			self.mdl.children.$set(nAlertIdx, nAlert);
+			_.delay(() => {
+				self.mdl.children.$remove(nAlert);
+			}, 500);
+		}
+
+	}
+
+}

client/scss/app.scss

@@ -5,6 +5,9 @@
 
 @import 'bulma';
 @import './libs/twemoji-awesome';
+@import './libs/animate.min.css';
+
+@import './components/_alerts';
 
 @import './layout/_header';
 @import './layout/_footer';

client/scss/components/_alerts.scss

@@ -0,0 +1,24 @@
+#alerts {
+	position: fixed;
+	top: 60px;
+	right: 10px;
+	width: 350px;
+	z-index: 2;
+	text-shadow: 1px 1px 0 rgba(0,0,0,0.1);
+
+	.notification {
+		animation: 0.5s ease slideInRight;
+		margin-top: 5px;
+
+		&.exit {
+			animation: 0.5s ease fadeOutRight;
+		}
+
+	}
+
+	h3 {
+		font-size: 16px;
+		font-size: 500;
+	}
+
+}

client/scss/layout/_content.scss

@@ -71,6 +71,16 @@ p code {
 	border-radius: 4px;
 }
 
+.modal {
+	align-items: flex-start;
+}
+.modal-background {
+	animation: 0.4s ease fadeIn;
+}
+.modal-content {
+	animation: 0.4s ease slideInDown;	
+}
+
 .card-header {
 	background-color: $turquoise;
 }
@@ -80,4 +90,8 @@ .card-header-title {
 	font-weight: 400;
 	font-size: 16px;
 	padding: 10px 20px;
+}
+
+.modal-content .card-footer-item {
+	font-weight: 500;
 }

client/scss/libs/animate.min.css

@@ -0,0 +1,11 @@
+@charset "UTF-8";
+
+/*!
+ * animate.css -http://daneden.me/animate
+ * Version - 3.5.1
+ * Licensed under the MIT license - http://opensource.org/licenses/MIT
+ *
+ * Copyright (c) 2016 Daniel Eden
+ */
+
+.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deLine truncated

controllers/pages.js

@@ -15,7 +15,7 @@ router.get('/', (req, res) => {
 		let pageData = mark.parse(contents);
 		if(!pageData.title) {
 			pageData.title = 'Redis';
-			pageData.subtitle = 'An open source, in-memory data structure store, used as database, cache and message broker.'
+			pageData.subtitle = 'An open source, in-memory data structure store, used as database, cache and message broker.';
 		}
 		res.render('pages/view', { pageData });
  	});

gulpfile.js

@@ -103,7 +103,7 @@ gulp.task("scripts-app", function () {
 	.pipe(babel())
 	.pipe(uglify())
 	.pipe(plumber.stop())
-	.pipe(gulp.dest("./assets/js"))
+	.pipe(gulp.dest("./assets/js"));
 
 });
 

models/markdown.js

@@ -21,11 +21,13 @@ var mkdown = md({
 		html: true,
 		linkify: true,
 		typography: true,
-		highlight: function (str, lang) {
+		highlight(str, lang) {
 			if (lang && hljs.getLanguage(lang)) {
 				try {
 					return '<pre class="hljs"><code>' + hljs.highlight(lang, str, true).value + '</code></pre>';
-				} catch (__) {}
+				} catch (err) {
+					return '<pre><code>' + str + '</code></pre>';
+				}
 			}
 			return '<pre class="hljs"><code>' + hljs.highlightAuto(str).value + '</code></pre>';
 		}
@@ -72,17 +74,17 @@ const parseTree = (content) => {
 
 	for (let i = 0; i < tokens.length; i++) {
 		if (tokens[i].type !== "heading_close") {
-		  continue
+		  continue;
 		}
 
-		const heading = tokens[i - 1]
+		const heading = tokens[i - 1];
-		const heading_close = tokens[i]
+		const heading_close = tokens[i];
 
 		if (heading.type === "inline") {
 		  let content = "";
 		  let anchor = "";
 		  if (heading.children && heading.children[0].type === "link_open") {
-			 content = heading.children[1].content
+			 content = heading.children[1].content;
 			 anchor = slug(content, {lower: true});
 		  } else {
 			 content = heading.content
@@ -93,7 +95,7 @@ const parseTree = (content) => {
 			 content,
 			 anchor,
 			 level: +heading_close.tag.substr(1, 1)
-		  })
+		  });
 		}
 	 }
 

package.json

@@ -35,14 +35,14 @@
     "bluebird": "^3.4.1",
     "body-parser": "^1.15.2",
     "bulma": "^0.1.2",
-    "cheerio": "^0.20.0",
+    "cheerio": "^0.22.0",
     "compression": "^1.6.2",
     "connect-flash": "^0.1.1",
-    "connect-loki": "^1.0.5",
+    "connect-loki": "^1.0.6",
     "connect-redis": "^3.1.0",
     "cookie-parser": "^1.4.3",
     "express": "^4.14.0",
-    "express-brute": "^0.7.0-beta.0",
+    "express-brute": "^1.0.0",
     "express-session": "^1.14.0",
     "express-validator": "^2.20.8",
     "highlight.js": "^9.6.0",

views/common/alerts.pug

@@ -0,0 +1,16 @@
+#alerts
+	ul
+		template(v-for="aItem in children", track-by='_uid')
+			.notification(v-bind:class='aItem.class')
+				button.delete(v-on:click='acknowledge(aItem._uid)')
+				h3 {{ aItem.title }}
+				span {{ aItem.message }}
+
+if appflash.length > 0
+	script(type='text/javascript')
+		| var alertsData = 
+		!= JSON.stringify(appflash)
+		| ;
+else
+	script(type='text/javascript')
+		| var alertsData = [];