Merge branch 'accounts'

changelog.md

@@ -1,5 +1,21 @@
 # changelog
 
+### Wednesday, 23/11/2016 - v2.5.0
+- Metadata can now be added to brews
+- Added a metadata editor onto the edit and new pages
+- Moved deleting a brew into the metadata editor
+- Added in account middleware
+- Can now search for brews by a specific author
+- Editing a brew in anyway while logged in will now add you to the list of authors
+- Added a new user page to see others published brews, as well as all of your own brews.
+- Added a new nav item for accessing your profile and logging in
+
+
+### Monday, 14/11/2016
+- Updated snippet bar style
+- You can now print from a new page without saving
+- Added the ability to use ctrl+p and ctrl+s to print and save respectively.
+
 ### Monday, 07/11/2016
 - Added final touches to the html validator and updating the rest of the branch
 - If anyone finds issues with the new HTML validator, please let me know. I hope this will bring a more consistent feel to Homebrewery rendering.

client/homebrew/editor/editor.jsx

@@ -1,25 +1,31 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
-var cx = require('classnames');
+const cx = require('classnames');
 
-var CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
+const CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
-var Snippets = require('./snippets/snippets.js');
+const SnippetBar = require('./snippetbar/snippetbar.jsx');
+const MetadataEditor = require('./MetadataEditor/MetadataEditor.jsx');
 
 
-var splice = function(str, index, inject){
+const splice = function(str, index, inject){
 	return str.slice(0, index) + inject + str.slice(index);
 };
-var execute = function(val){
-	if(_.isFunction(val)) return val();
-	return val;
-}
 
+const SNIPPETBAR_HEIGHT = 25;
 
-var Editor = React.createClass({
+const Editor = React.createClass({
 	getDefaultProps: function() {
 		return {
-			value : "",
+			value : '',
-			onChange : function(){}
+			onChange : ()=>{},
+
+			metadata : {},
+			onMetadataChange : ()=>{},
+		};
+	},
+	getInitialState: function() {
+		return {
+			showMetadataEditor: false
 		};
 	},
 	cursorPosition : {
@@ -27,7 +33,6 @@ var Editor = React.createClass({
 		ch : 0
 	},
 
-
 	componentDidMount: function() {
 		this.updateEditorSize();
 		window.addEventListener("resize", this.updateEditorSize);
@@ -37,8 +42,8 @@ var Editor = React.createClass({
 	},
 
 	updateEditorSize : function() {
-		var paneHeight = this.refs.main.parentNode.clientHeight;
+		let paneHeight = this.refs.main.parentNode.clientHeight;
-		paneHeight -= this.refs.snippetBar.clientHeight + 1;
+		paneHeight -= SNIPPETBAR_HEIGHT + 1;
 		this.refs.codeEditor.codeMirror.setSize(null, paneHeight);
 	},
 
@@ -48,38 +53,37 @@ var Editor = React.createClass({
 	handleCursorActivty : function(curpos){
 		this.cursorPosition = curpos;
 	},
-
+	handleInject : function(injectText){
-	handleSnippetClick : function(injectText){
+		const lines = this.props.value.split('\n');
-		var lines = this.props.value.split('\n');
 		lines[this.cursorPosition.line] = splice(lines[this.cursorPosition.line], this.cursorPosition.ch, injectText);
 
 		this.handleTextChange(lines.join('\n'));
 		this.refs.codeEditor.setCursorPosition(this.cursorPosition.line, this.cursorPosition.ch  + injectText.length);
 	},
+	handgleToggle : function(){
+		this.setState({
+			showMetadataEditor : !this.state.showMetadataEditor
+		})
+	},
 
 	//Called when there are changes to the editor's dimensions
 	update : function(){
 		this.refs.codeEditor.updateSize();
 	},
 
-	renderSnippetGroups : function(){
+	renderMetadataEditor : function(){
-		return _.map(Snippets, (snippetGroup)=>{
+		if(!this.state.showMetadataEditor) return;
-			return <SnippetGroup
+		return <MetadataEditor
-				groupName={snippetGroup.groupName}
+			metadata={this.props.metadata}
-				icon={snippetGroup.icon}
+			onChange={this.props.onMetadataChange}
-				snippets={snippetGroup.snippets}
+		/>
-				key={snippetGroup.groupName}
-				onSnippetClick={this.handleSnippetClick}
-			/>
-		})
 	},
 
 	render : function(){
 		return(
 			<div className='editor' ref='main'>
-				<div className='snippetBar' ref='snippetBar'>
+				<SnippetBar onInject={this.handleInject} onToggle={this.handgleToggle} showmeta={this.state.showMetadataEditor} />
-					{this.renderSnippetGroups()}
+				{this.renderMetadataEditor()}
-				</div>
 				<CodeEditor
 					ref='codeEditor'
 					wrap={true}
@@ -99,40 +103,3 @@ module.exports = Editor;
 
 
 
-
-
-
-var SnippetGroup = React.createClass({
-	getDefaultProps: function() {
-		return {
-			groupName : '',
-			icon : 'fa-rocket',
-			snippets : [],
-			onSnippetClick : function(){},
-		};
-	},
-	handleSnippetClick : function(snippet){
-		this.props.onSnippetClick(execute(snippet.gen));
-	},
-	renderSnippets : function(){
-		return _.map(this.props.snippets, (snippet)=>{
-			return <div className='snippet' key={snippet.name} onClick={this.handleSnippetClick.bind(this, snippet)}>
-				<i className={'fa fa-fw ' + snippet.icon} />
-				{snippet.name}
-			</div>
-		})
-	},
-
-	render : function(){
-		return <div className='snippetGroup'>
-			<div className='text'>
-				<i className={'fa fa-fw ' + this.props.icon} />
-				<span className='groupName'>{this.props.groupName}</span>
-			</div>
-			<div className='dropdown'>
-				{this.renderSnippets()}
-			</div>
-		</div>
-	},
-
-});

client/homebrew/editor/editor.less

@@ -2,55 +2,10 @@
 .editor{
 	position : relative;
 	width    : 100%;
-	.snippetBar{
+
-		display          : flex;
-		padding          : 5px;
-		background-color : #ddd;
-		align-items      : center;
-		.snippetGroup{
-			.animate(background-color);
-			margin        : 0px 8px;
-			padding       : 3px;
-			font-size     : 13px;
-			border-radius : 5px;
-			&:hover, &.selected{
-				background-color : #999;
-			}
-			.text{
-				line-height : 20px;
-				.groupName{
-					margin-left : 6px;
-					font-size   : 10px;
-				}
-			}
-			&:hover{
-				.dropdown{
-					visibility : visible;
-				}
-			}
-			.dropdown{
-				position         : absolute;
-				visibility       : hidden;
-				z-index          : 1000;
-				padding          : 5px;
-				background-color : #ddd;
-				.snippet{
-					.animate(background-color);
-					padding   : 10px;
-					cursor    : pointer;
-					font-size : 10px;
-					i{
-						margin-right: 8px;
-						font-size : 13px;
-					}
-					&:hover{
-						background-color : #999;
-					}
-				}
-			}
-		}
-	}
 	.codeEditor{
 		height : 100%;
 	}
+
+
 }

client/homebrew/editor/metadataEditor/metadataEditor.jsx

@@ -0,0 +1,148 @@
+const React = require('react');
+const _     = require('lodash');
+const cx    = require('classnames');
+const request = require("superagent");
+
+const SYSTEMS = ['5e', '4e', '3.5e', 'Pathfinder']
+
+const MetadataEditor = React.createClass({
+	getDefaultProps: function() {
+		return {
+			metadata: {
+				editId : null,
+				title : '',
+				description : '',
+				tags : '',
+				published : false,
+				authors : [],
+				systems : []
+			},
+			onChange : ()=>{}
+		};
+	},
+
+	handleFieldChange : function(name, e){
+		this.props.onChange(_.merge({}, this.props.metadata, {
+			[name] : e.target.value
+		}))
+	},
+	handleSystem : function(system, e){
+		if(e.target.checked){
+			this.props.metadata.systems.push(system);
+		}else{
+			this.props.metadata.systems = _.without(this.props.metadata.systems, system);
+		}
+		this.props.onChange(this.props.metadata);
+	},
+	handlePublish : function(val){
+		this.props.onChange(_.merge({}, this.props.metadata, {
+			published : val
+		}));
+	},
+
+	handleDelete : function(){
+		if(!confirm("are you sure you want to delete this brew?")) return;
+		if(!confirm("are you REALLY sure? You will not be able to recover it")) return;
+
+		request.get('/api/remove/' + this.props.metadata.editId)
+			.send()
+			.end(function(err, res){
+				window.location.href = '/';
+			});
+	},
+
+	renderSystems : function(){
+		return _.map(SYSTEMS, (val)=>{
+			return <label key={val}>
+				<input
+					type='checkbox'
+					checked={_.includes(this.props.metadata.systems, val)}
+					onChange={this.handleSystem.bind(null, val)} />
+				{val}
+			</label>
+		});
+	},
+
+	renderPublish : function(){
+		if(this.props.metadata.published){
+			return <button className='unpublish' onClick={this.handlePublish.bind(null, false)}>
+				<i className='fa fa-ban' /> unpublish
+			</button>
+		}else{
+			return <button className='publish' onClick={this.handlePublish.bind(null, true)}>
+				<i className='fa fa-globe' /> publish
+			</button>
+		}
+	},
+
+	renderDelete : function(){
+		if(!this.props.metadata.editId) return;
+
+		return <div className='field delete'>
+			<label>delete</label>
+			<div className='value'>
+				<button className='publish' onClick={this.handleDelete}>
+					<i className='fa fa-trash' /> delete brew
+				</button>
+			</div>
+		</div>
+	},
+
+	renderAuthors : function(){
+		let text = 'None.';
+		if(this.props.metadata.authors.length){
+			text = this.props.metadata.authors.join(', ');
+		}
+		return <div className='field authors'>
+			<label>authors</label>
+			<div className='value'>
+				{text}
+			</div>
+		</div>
+	},
+
+	render : function(){
+		return <div className='metadataEditor'>
+			<div className='field title'>
+				<label>title</label>
+				<input type='text' className='value'
+					value={this.props.metadata.title}
+					onChange={this.handleFieldChange.bind(null, 'title')} />
+			</div>
+			<div className='field description'>
+				<label>description</label>
+				<textarea value={this.props.metadata.description} className='value'
+					onChange={this.handleFieldChange.bind(null, 'description')} />
+			</div>
+			{/*}
+			<div className='field tags'>
+				<label>tags</label>
+				<textarea value={this.props.metadata.tags}
+					onChange={this.handleFieldChange.bind(null, 'tags')} />
+			</div>
+			*/}
+
+			<div className='field systems'>
+				<label>systems</label>
+				<div className='value'>
+					{this.renderSystems()}
+				</div>
+			</div>
+
+			{this.renderAuthors()}
+
+			<div className='field publish'>
+				<label>publish</label>
+				<div className='value'>
+					{this.renderPublish()}
+					<small>Published homebrews will be publicly viewable and searchable (eventually...)</small>
+				</div>
+			</div>
+
+			{this.renderDelete()}
+
+		</div>
+	}
+});
+
+module.exports = MetadataEditor;

client/homebrew/editor/metadataEditor/metadataEditor.less

@@ -0,0 +1,74 @@
+
+.metadataEditor{
+	position         : absolute;
+	z-index          : 10000;
+	box-sizing       : border-box;
+	width            : 100%;
+	padding          : 25px;
+	background-color : #999;
+	.field{
+		display       : flex;
+		width         : 100%;
+		margin-bottom : 10px;
+		&>label{
+			display        : inline-block;
+			vertical-align : top;
+			width          : 80px;
+			font-size      : 0.7em;
+			font-weight    : 800;
+			line-height    : 1.8em;
+			text-transform : uppercase;
+			flex-grow      : 0;
+		}
+		&>.value{
+			flex-grow : 1;
+		}
+	}
+	.description.field textarea.value{
+		resize      : none;
+		height      : 5em;
+		font-family : 'Open Sans', sans-serif;
+		font-size   : 0.8em;
+	}
+	.systems.field .value{
+		label{
+			vertical-align : middle;
+			margin-right   : 15px;
+			cursor         : pointer;
+			font-size      : 0.7em;
+			font-weight    : 800;
+			user-select    : none;
+		}
+		input{
+			vertical-align : middle;
+			cursor         : pointer;
+		}
+	}
+	.publish.field .value{
+		position : relative;
+		margin-bottom: 15px;
+		button.publish{
+			.button(@blueLight);
+		}
+		button.unpublish{
+			.button(@silver);
+		}
+		small{
+			position   : absolute;
+			bottom     : -15px;
+			left       : 0px;
+			font-size  : 0.6em;
+			font-style : italic;
+		}
+	}
+
+	.delete.field .value{
+		button{
+			.button(@red);
+		}
+	}
+	.authors.field .value{
+		font-size: 0.8em;
+		line-height    : 1.5em;
+	}
+}

client/homebrew/editor/snippetbar/snippetbar.jsx

@@ -0,0 +1,91 @@
+const React = require('react');
+const _     = require('lodash');
+const cx    = require('classnames');
+
+
+const Snippets = require('./snippets/snippets.js');
+
+const execute = function(val){
+	if(_.isFunction(val)) return val();
+	return val;
+}
+
+
+
+const Snippetbar = React.createClass({
+	getDefaultProps: function() {
+		return {
+			onInject : ()=>{},
+			onToggle : ()=>{},
+			showmeta : false
+		};
+	},
+
+	handleSnippetClick : function(injectedText){
+		this.props.onInject(injectedText)
+	},
+
+	renderSnippetGroups : function(){
+		return _.map(Snippets, (snippetGroup)=>{
+			return <SnippetGroup
+				groupName={snippetGroup.groupName}
+				icon={snippetGroup.icon}
+				snippets={snippetGroup.snippets}
+				key={snippetGroup.groupName}
+				onSnippetClick={this.handleSnippetClick}
+			/>
+		})
+	},
+
+	render : function(){
+		return <div className='snippetBar'>
+			{this.renderSnippetGroups()}
+			<div className={cx('toggleMeta', {selected: this.props.showmeta})}
+				onClick={this.props.onToggle}>
+				<i className='fa fa-database' />
+			</div>
+		</div>
+	}
+});
+
+module.exports = Snippetbar;
+
+
+
+
+
+
+const SnippetGroup = React.createClass({
+	getDefaultProps: function() {
+		return {
+			groupName : '',
+			icon : 'fa-rocket',
+			snippets : [],
+			onSnippetClick : function(){},
+		};
+	},
+	handleSnippetClick : function(snippet){
+		this.props.onSnippetClick(execute(snippet.gen));
+	},
+	renderSnippets : function(){
+		return _.map(this.props.snippets, (snippet)=>{
+			return <div className='snippet' key={snippet.name} onClick={this.handleSnippetClick.bind(this, snippet)}>
+				<i className={'fa fa-fw ' + snippet.icon} />
+				{snippet.name}
+			</div>
+		})
+	},
+
+	render : function(){
+		return <div className='snippetGroup'>
+			<div className='text'>
+				<i className={'fa fa-fw ' + this.props.icon} />
+				<span className='groupName'>{this.props.groupName}</span>
+			</div>
+			<div className='dropdown'>
+				{this.renderSnippets()}
+			</div>
+		</div>
+	},
+
+});

client/homebrew/editor/snippetbar/snippetbar.less

@@ -0,0 +1,72 @@
+
+.snippetBar{
+	@height          : 25px;
+	position         : relative;
+	height           : @height;
+	background-color : #ddd;
+	.toggleMeta{
+		position    : absolute;
+		top         : 0px;
+		right       : 0px;
+		height      : @height;
+		width       : @height;
+		cursor      : pointer;
+		line-height : @height;
+		text-align  : center;
+		&:hover, &.selected{
+			background-color : #999;
+		}
+	}
+	.snippetGroup{
+		display        : inline-block;
+		height         : @height;
+		padding        : 0px 5px;
+		cursor         : pointer;
+		font-size      : 0.6em;
+		font-weight    : 800;
+		line-height    : @height;
+		text-transform : uppercase;
+		border-right   : 1px solid black;
+		i{
+			vertical-align : middle;
+			margin-right   : 3px;
+			font-size      : 1.2em;
+		}
+		&:hover, &.selected{
+			background-color : #999;
+		}
+		.text{
+			line-height : @height;
+			.groupName{
+				font-size : 10px;
+			}
+		}
+		&:hover{
+			.dropdown{
+				visibility : visible;
+			}
+		}
+		.dropdown{
+			position         : absolute;
+			top              : 100%;
+			visibility       : hidden;
+			z-index          : 1000;
+			margin-left      : -5px;
+			padding          : 0px;
+			background-color : #ddd;
+			.snippet{
+				.animate(background-color);
+				padding   : 5px;
+				cursor    : pointer;
+				font-size : 10px;
+				i{
+					margin-right : 8px;
+					font-size    : 13px;
+				}
+				&:hover{
+					background-color : #999;
+				}
+			}
+		}
+	}
+}

client/homebrew/homebrew.jsx

@@ -1,17 +1,19 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
-var cx = require('classnames');
+const cx = require('classnames');
 
-var CreateRouter = require('pico-router').createRouter;
+const CreateRouter = require('pico-router').createRouter;
 
-var HomePage = require('./pages/homePage/homePage.jsx');
+const HomePage = require('./pages/homePage/homePage.jsx');
-var EditPage = require('./pages/editPage/editPage.jsx');
+const EditPage = require('./pages/editPage/editPage.jsx');
-var SharePage = require('./pages/sharePage/sharePage.jsx');
+const UserPage = require('./pages/userPage/userPage.jsx');
-var NewPage = require('./pages/newPage/newPage.jsx');
+const SharePage = require('./pages/sharePage/sharePage.jsx');
-var ErrorPage = require('./pages/errorPage/errorPage.jsx');
+const NewPage = require('./pages/newPage/newPage.jsx');
+const ErrorPage = require('./pages/errorPage/errorPage.jsx');
+const PrintPage = require('./pages/printPage/printPage.jsx');
 
-var Router;
+let Router;
-var Homebrew = React.createClass({
+const Homebrew = React.createClass({
 	getDefaultProps: function() {
 		return {
 			url : '',
@@ -29,38 +31,49 @@ var Homebrew = React.createClass({
 		};
 	},
 	componentWillMount: function() {
+		global.account = this.props.account;
+
+
 		Router = CreateRouter({
 			'/edit/:id' : (args) => {
 				if(!this.props.brew.editId){
-					return <ErrorPage ver={this.props.version} errorId={args.id}/>
+					return <ErrorPage errorId={args.id}/>
 				}
 
 				return <EditPage
-					ver={this.props.version}
 					id={args.id}
 					brew={this.props.brew} />
 			},
 
 			'/share/:id' : (args) => {
 				if(!this.props.brew.shareId){
-					return <ErrorPage ver={this.props.version} errorId={args.id}/>
+					return <ErrorPage errorId={args.id}/>
 				}
 
 				return <SharePage
-					ver={this.props.version}
 					id={args.id}
 					brew={this.props.brew} />
 			},
-			'/changelog' : (args) => {
+			'/user/:username' : (args) => {
-				return <SharePage
+				return <UserPage
-					ver={this.props.version}
+					username={args.username}
-					brew={{title : 'Changelog', text : this.props.changelog}} />
+					brews={this.props.brews}
+				/>
+			},
+			'/print/:id' : (args, query) => {
+				return <PrintPage brew={this.props.brew} query={query}/>;
+			},
+			'/print' : (args, query) => {
+				return <PrintPage query={query}/>;
 			},
 			'/new' : (args) => {
-				return <NewPage ver={this.props.version} />
+				return <NewPage />
+			},
+			'/changelog' : (args) => {
+				return <SharePage
+					brew={{title : 'Changelog', text : this.props.changelog}} />
 			},
 			'*' : <HomePage
-					ver={this.props.version}
 					welcomeText={this.props.welcomeText} />,
 		});
 	},

client/homebrew/homebrew.less

@@ -2,11 +2,10 @@
 .homebrew{
 	height           : 100%;
 
-	//TODO: Consider making backgroudn color lighter
-	background-color : @steel;
 	.page{
 		display        : flex;
 		height         : 100%;
+		background-color : @steel;
 		flex-direction : column;
 		.content{
 			position : relative;
@@ -14,4 +13,7 @@
 			flex     : auto;
 		}
 	}
+
+
+
 }

client/homebrew/navbar/account.navitem.jsx

@@ -0,0 +1,17 @@
+const React = require('react');
+const Nav = require('naturalcrit/nav/nav.jsx');
+
+module.exports = function(props){
+	if(global.account){
+		return <Nav.item href={`/user/${global.account.username}`} color='yellow' icon='fa-user'>
+			profile
+		</Nav.item>
+	}
+	let url = '';
+	if(typeof window !== 'undefined'){
+		url = window.location.href
+	}
+	return <Nav.item href={`http://naturalcrit.com/login?redirect=${url}`} color='teal' icon='fa-sign-in'>
+		login
+	</Nav.item>
+};

client/homebrew/navbar/navbar.jsx

@@ -1,25 +1,21 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
 
-var Nav = require('naturalcrit/nav/nav.jsx');
+const Nav = require('naturalcrit/nav/nav.jsx');
 
-var Navbar = React.createClass({
+const Navbar = React.createClass({
-	getDefaultProps: function() {
+	getInitialState: function() {
 		return {
+			showNonChromeWarning : false,
 			ver : '0.0.0'
 		};
 	},
 
-	getInitialState: function() {
-		return {
-			showNonChromeWarning : false
-		};
-	},
-
 	componentDidMount: function() {
-		var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
+		const isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
 		this.setState({
-			showNonChromeWarning : !isChrome
+			showNonChromeWarning : !isChrome,
+			ver : window.version
 		})
 	},
 
@@ -40,7 +36,7 @@ var Navbar = React.createClass({
 				<Nav.item href='/' className='homebrewLogo'>
 					<div>The Homebrewery</div>
 				</Nav.item>
-				<Nav.item>{`v${this.props.ver}`}</Nav.item>
+				<Nav.item>{`v${this.state.ver}`}</Nav.item>
 
 				{this.renderChromeWarning()}
 			</Nav.section>

client/homebrew/pages/editPage/editPage.jsx

@@ -1,49 +1,53 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
-var cx = require('classnames');
+const cx = require('classnames');
-var request = require("superagent");
+const request = require("superagent");
 
-var Nav = require('naturalcrit/nav/nav.jsx');
+const Nav = require('naturalcrit/nav/nav.jsx');
-var Navbar = require('../../navbar/navbar.jsx');
+const Navbar = require('../../navbar/navbar.jsx');
 
-var EditTitle = require('../../navbar/editTitle.navitem.jsx');
+const ReportIssue = require('../../navbar/issue.navitem.jsx');
-var ReportIssue = require('../../navbar/issue.navitem.jsx');
+const PrintLink = require('../../navbar/print.navitem.jsx');
-var PrintLink = require('../../navbar/print.navitem.jsx');
+const Account = require('../../navbar/account.navitem.jsx');
-var RecentlyEdited = require('../../navbar/recent.navitem.jsx').edited;
+//const RecentlyEdited = require('../../navbar/recent.navitem.jsx').edited;
 
 
-var SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
+const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
-var Editor = require('../../editor/editor.jsx');
+const Editor = require('../../editor/editor.jsx');
-var BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
+const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
-var HijackPrint = require('../hijackPrint.js');
+const Markdown = require('naturalcrit/markdown.js');
-var Markdown = require('naturalcrit/markdown.js');
 
 
 const SAVE_TIMEOUT = 3000;
 
 
 
-var EditPage = React.createClass({
+const EditPage = React.createClass({
 	getDefaultProps: function() {
 		return {
-			ver : '0.0.0',
-			id : null,
 			brew : {
-				title : '',
 				text : '',
 				shareId : null,
 				editId : null,
 				createdAt : null,
 				updatedAt : null,
+
+				title : '',
+				description : '',
+				tags : '',
+				published : false,
+				authors : [],
+				systems : []
 			}
 		};
 	},
 
 	getInitialState: function() {
 		return {
-			title : this.props.brew.title,
+			brew : this.props.brew,
-			text: this.props.brew.text,
+
+
 			isSaving : false,
 			isPending : false,
 			errors : null,
@@ -62,27 +66,42 @@ var EditPage = React.createClass({
 		};
 
 		this.setState({
-			htmlErrors : Markdown.validate(this.state.text)
+			htmlErrors : Markdown.validate(this.state.brew.text)
 		})
 
-		document.onkeydown = HijackPrint(this.props.brew.shareId);
+		document.addEventListener('keydown', this.handleControlKeys);
 	},
 	componentWillUnmount: function() {
 		window.onbeforeunload = function(){};
-		document.onkeydown = function(){};
+		document.removeEventListener('keydown', this.handleControlKeys);
+	},
+
+
+	handleControlKeys : function(e){
+		if(!(e.ctrlKey || e.metaKey)) return;
+		const S_KEY = 83;
+		const P_KEY = 80;
+		if(e.keyCode == S_KEY) this.save();
+		if(e.keyCode == P_KEY) window.open(`/print/${this.props.brew.shareId}?dialog=true`, '_blank').focus();
+		if(e.keyCode == P_KEY || e.keyCode == S_KEY){
+			e.stopPropagation();
+			e.preventDefault();
+		}
 	},
 
 	handleSplitMove : function(){
 		this.refs.editor.update();
 	},
 
-	handleTitleChange : function(title){
+	handleMetadataChange : function(metadata){
 		this.setState({
-			title : title,
+			brew : _.merge({}, this.state.brew, metadata),
-			isPending : true
+			isPending : true,
+		}, ()=>{
+			console.log(this.hasChanges());
+			(this.hasChanges() ? this.debounceSave() : this.debounceSave.cancel());
 		});
 
-		(this.hasChanges() ? this.debounceSave() : this.debounceSave.cancel());
 	},
 
 	handleTextChange : function(text){
@@ -92,7 +111,7 @@ var EditPage = React.createClass({
 		if(htmlErrors.length) htmlErrors = Markdown.validate(text);
 
 		this.setState({
-			text : text,
+			brew : _.merge({}, this.state.brew, {text : text}),
 			isPending : true,
 			htmlErrors : htmlErrors
 		});
@@ -100,24 +119,11 @@ var EditPage = React.createClass({
 		(this.hasChanges() ? this.debounceSave() : this.debounceSave.cancel());
 	},
 
-	handleDelete : function(){
-		if(!confirm("are you sure you want to delete this brew?")) return;
-		if(!confirm("are you REALLY sure? You will not be able to recover it")) return;
-
-		request.get('/api/remove/' + this.props.brew.editId)
-			.send()
-			.end(function(err, res){
-				window.location.href = '/';
-			});
-	},
-
 	hasChanges : function(){
 		if(this.savedBrew){
-			if(this.state.text !== this.savedBrew.text) return true;
+			return !_.isEqual(this.state.brew, this.savedBrew)
-			if(this.state.title !== this.savedBrew.title) return true;
 		}else{
-			if(this.state.text !== this.props.brew.text) return true;
+			return !_.isEqual(this.state.brew, this.props.brew)
-			if(this.state.title !== this.props.brew.title) return true;
 		}
 		return false;
 	},
@@ -127,15 +133,12 @@ var EditPage = React.createClass({
 		this.setState({
 			isSaving : true,
 			errors : null,
-			htmlErrors : Markdown.validate(this.state.text)
+			htmlErrors : Markdown.validate(this.state.brew.text)
 		});
 
 		request
 			.put('/api/update/' + this.props.brew.editId)
-			.send({
+			.send(this.state.brew)
-				text : this.state.text,
-				title : this.state.title
-			})
 			.end((err, res) => {
 				if(err){
 					this.setState({
@@ -175,28 +178,26 @@ var EditPage = React.createClass({
 		if(this.state.isSaving){
 			return <Nav.item className='save' icon="fa-spinner fa-spin">saving...</Nav.item>
 		}
-		if(!this.state.isPending && !this.state.isSaving){
-			return <Nav.item className='save saved'>saved.</Nav.item>
-		}
 		if(this.state.isPending && this.hasChanges()){
 			return <Nav.item className='save' onClick={this.save} color='blue' icon='fa-save'>Save Now</Nav.item>
 		}
+		if(!this.state.isPending && !this.state.isSaving){
+			return <Nav.item className='save saved'>saved.</Nav.item>
+		}
 	},
 	renderNavbar : function(){
-		return <Navbar ver={this.props.ver}>
+		return <Navbar>
 			<Nav.section>
-				<EditTitle title={this.state.title} onChange={this.handleTitleChange} />
+				<Nav.item className='brewTitle'>{this.state.brew.title}</Nav.item>
 			</Nav.section>
 			<Nav.section>
 				{this.renderSaveButton()}
-				<RecentlyEdited brew={this.props.brew} />
+				{/*<RecentlyEdited brew={this.props.brew} />*/}
 				<Nav.item newTab={true} href={'/share/' + this.props.brew.shareId} color='teal' icon='fa-share-alt'>
 					Share
 				</Nav.item>
 				<PrintLink shareId={this.props.brew.shareId} />
-				<Nav.item color='red' icon='fa-trash' onClick={this.handleDelete}>
+				<Account />
-					Delete
-				</Nav.item>
 			</Nav.section>
 		</Navbar>
 	},
@@ -207,8 +208,14 @@ var EditPage = React.createClass({
 
 			<div className='content'>
 				<SplitPane onDragFinish={this.handleSplitMove} ref='pane'>
-					<Editor value={this.state.text} onChange={this.handleTextChange} ref='editor'/>
+					<Editor
-					<BrewRenderer text={this.state.text} errors={this.state.htmlErrors} />
+						ref='editor'
+						value={this.state.brew.text}
+						onChange={this.handleTextChange}
+						metadata={this.state.brew}
+						onMetadataChange={this.handleMetadataChange}
+					/>
+					<BrewRenderer text={this.state.brew.text} errors={this.state.htmlErrors} />
 				</SplitPane>
 			</div>
 		</div>

client/homebrew/pages/editPage/editPage.less

@@ -1,7 +1,7 @@
 
 .editPage{
 	.navItem.save{
-		width      : 75px;
+		width      : 105px;
 		text-align : center;
 		&.saved{
 			cursor : initial;

client/homebrew/pages/hijackPrint.js

@@ -1,3 +1,5 @@
+//TODO: Depricate
+
 module.exports = function(shareId){
 	return function(event){
 		event = event || window.event;

client/homebrew/pages/homePage/homePage.jsx

@@ -1,22 +1,23 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
-var cx = require('classnames');
+const cx = require('classnames');
-var request = require("superagent");
+const request = require("superagent");
 
-var Nav = require('naturalcrit/nav/nav.jsx');
+const Nav = require('naturalcrit/nav/nav.jsx');
-var Navbar = require('../../navbar/navbar.jsx');
+const Navbar = require('../../navbar/navbar.jsx');
-var PatreonNavItem = require('../../navbar/patreon.navitem.jsx');
+const PatreonNavItem = require('../../navbar/patreon.navitem.jsx');
-var IssueNavItem = require('../../navbar/issue.navitem.jsx');
+const IssueNavItem = require('../../navbar/issue.navitem.jsx');
-var RecentNavItem = require('../../navbar/recent.navitem.jsx');
+const RecentNavItem = require('../../navbar/recent.navitem.jsx');
+const AccountNavItem = require('../../navbar/account.navitem.jsx');
 
 
-var SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
+const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
-var Editor = require('../../editor/editor.jsx');
+const Editor = require('../../editor/editor.jsx');
-var BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
+const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
 
 
-var HomePage = React.createClass({
+const HomePage = React.createClass({
 	getDefaultProps: function() {
 		return {
 			welcomeText : '',
@@ -56,9 +57,12 @@ var HomePage = React.createClass({
 					Changelog
 				</Nav.item>
 				<RecentNavItem.both />
+				<AccountNavItem />
+				{/*}
 				<Nav.item href='/new' color='green' icon='fa-external-link'>
 					New Brew
 				</Nav.item>
+				*/}
 			</Nav.section>
 		</Navbar>
 	},

client/homebrew/pages/homePage/homePage.less

@@ -40,4 +40,8 @@
 			right : 350px;
 		}
 	}
+
+	.toggleMeta{
+		display: none;
+	}
 }

client/homebrew/pages/newPage/newPage.jsx

@@ -20,14 +20,20 @@ const KEY = 'homebrewery-new';
 const NewPage = React.createClass({
 	getInitialState: function() {
 		return {
-			title : '',
+			metadata : {
+				title : '',
+				description : '',
+				tags : '',
+				published : false,
+				authors : [],
+				systems : []
+			},
+
 			text: '',
 			isSaving : false,
 			errors : []
 		};
 	},
-
-
 	componentDidMount: function() {
 		const storage = localStorage.getItem(KEY);
 		if(storage){
@@ -35,14 +41,31 @@ const NewPage = React.createClass({
 				text : storage
 			})
 		}
+		document.addEventListener('keydown', this.handleControlKeys);
 	},
+	componentWillUnmount: function() {
+		document.removeEventListener('keydown', this.handleControlKeys);
+	},
+
+	handleControlKeys : function(e){
+		if(!(e.ctrlKey || e.metaKey)) return;
+		const S_KEY = 83;
+		const P_KEY = 80;
+		if(e.keyCode == S_KEY) this.save();
+		if(e.keyCode == P_KEY) this.print();
+		if(e.keyCode == P_KEY || e.keyCode == S_KEY){
+			e.stopPropagation();
+			e.preventDefault();
+		}
+	},
+
 	handleSplitMove : function(){
 		this.refs.editor.update();
 	},
 
-	handleTitleChange : function(title){
+	handleMetadataChange : function(metadata){
 		this.setState({
-			title : title
+			metadata : _.merge({}, this.state.metadata, metadata)
 		});
 	},
 
@@ -54,18 +77,16 @@ const NewPage = React.createClass({
 		localStorage.setItem(KEY, text);
 	},
 
-	handleSave : function(){
+	save : function(){
 		this.setState({
 			isSaving : true
 		});
 
 		request.post('/api')
-			.send({
+			.send(_.merge({}, this.state.metadata, {
-				title : this.state.title,
 				text : this.state.text
-			})
+			}))
 			.end((err, res)=>{
-
 				if(err){
 					this.setState({
 						isSaving : false
@@ -85,20 +106,32 @@ const NewPage = React.createClass({
 				save...
 			</Nav.item>
 		}else{
-			return <Nav.item icon='fa-save' className='saveButton' onClick={this.handleSave}>
+			return <Nav.item icon='fa-save' className='saveButton' onClick={this.save}>
 				save
 			</Nav.item>
 		}
 	},
 
+	print : function(){
+		localStorage.setItem('print', this.state.text);
+		window.open('/print?dialog=true&local=print','_blank');
+	},
+
+	renderLocalPrintButton : function(){
+		return <Nav.item color='purple' icon='fa-file-pdf-o' onClick={this.print}>
+			get PDF
+		</Nav.item>
+	},
+
 	renderNavbar : function(){
-		return <Navbar ver={this.props.ver}>
+		return <Navbar>
 			<Nav.section>
-				<EditTitle title={this.state.title} onChange={this.handleTitleChange} />
+				<Nav.item className='brewTitle'>{this.state.metadata.title}</Nav.item>
 			</Nav.section>
 
 			<Nav.section>
 				{this.renderSaveButton()}
+				{this.renderLocalPrintButton()}
 				<IssueNavItem />
 			</Nav.section>
 		</Navbar>
@@ -109,7 +142,13 @@ const NewPage = React.createClass({
 			{this.renderNavbar()}
 			<div className='content'>
 				<SplitPane onDragFinish={this.handleSplitMove} ref='pane'>
-					<Editor value={this.state.text} onChange={this.handleTextChange} ref='editor'/>
+					<Editor
+						ref='editor'
+						value={this.state.text}
+						onChange={this.handleTextChange}
+						metadata={this.state.metadata}
+						onMetadataChange={this.handleMetadataChange}
+					/>
 					<BrewRenderer text={this.state.text} errors={this.state.errors} />
 				</SplitPane>
 			</div>

client/homebrew/pages/printPage/printPage.jsx

@@ -0,0 +1,47 @@
+const React = require('react');
+const _     = require('lodash');
+const cx    = require('classnames');
+const Markdown = require('naturalcrit/markdown.js');
+
+const PrintPage = React.createClass({
+	getDefaultProps: function() {
+		return {
+			query : {},
+			brew : {
+				text : '',
+			}
+		};
+	},
+
+	getInitialState: function() {
+		return {
+			brewText: this.props.brew.text
+		};
+	},
+
+	componentDidMount: function() {
+		if(this.props.query.local){
+			this.setState({ brewText : localStorage.getItem(this.props.query.local)});
+		}
+
+		if(this.props.query.dialog) window.print();
+	},
+
+	renderPages : function(){
+		return _.map(this.state.brewText.split('\\page'), (page, index) => {
+			return <div
+				className='phb'
+				id={`p${index + 1}`}
+				dangerouslySetInnerHTML={{__html:Markdown.render(page)}}
+				key={index} />;
+		});
+	},
+
+	render : function(){
+		return <div>
+			{this.renderPages()}
+		</div>
+	}
+});
+
+module.exports = PrintPage;

client/homebrew/pages/printPage/printPage.less

@@ -0,0 +1,3 @@
+.printPage{
+
+}

client/homebrew/pages/sharePage/sharePage.jsx

@@ -1,20 +1,20 @@
-var React = require('react');
+const React = require('react');
-var _ = require('lodash');
+const _ = require('lodash');
-var cx = require('classnames');
+const cx = require('classnames');
 
-var Nav = require('naturalcrit/nav/nav.jsx');
+const Nav = require('naturalcrit/nav/nav.jsx');
-var Navbar = require('../../navbar/navbar.jsx');
+const Navbar = require('../../navbar/navbar.jsx');
-var PrintLink = require('../../navbar/print.navitem.jsx');
+const PrintLink = require('../../navbar/print.navitem.jsx');
-var RecentlyViewed = require('../../navbar/recent.navitem.jsx').viewed;
+//const RecentlyViewed = require('../../navbar/recent.navitem.jsx').viewed;
+const Account = require('../../navbar/account.navitem.jsx');
 
-var BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
-var HijackPrint = require('../hijackPrint.js');
+const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
-var SharePage = React.createClass({
+
+const SharePage = React.createClass({
 	getDefaultProps: function() {
 		return {
-			ver : '0.0.0',
 			brew : {
 				title : '',
 				text : '',
@@ -27,25 +27,33 @@ var SharePage = React.createClass({
 	},
 
 	componentDidMount: function() {
-		document.onkeydown = HijackPrint(this.props.brew.shareId);
+		document.addEventListener('keydown', this.handleControlKeys);
 	},
 	componentWillUnmount: function() {
-		document.onkeydown = function(){};
+		document.removeEventListener('keydown', this.handleControlKeys);
+	},
+	handleControlKeys : function(e){
+		if(!(e.ctrlKey || e.metaKey)) return;
+		e.stopPropagation();
+		e.preventDefault();
+		const P_KEY = 80;
+		if(e.keyCode == P_KEY) window.open(`/print/${this.props.brew.shareId}?dialog=true`, '_blank').focus();
 	},
 
 	render : function(){
 		return <div className='sharePage page'>
-			<Navbar ver={this.props.ver}>
+			<Navbar>
 				<Nav.section>
 					<Nav.item className='brewTitle'>{this.props.brew.title}</Nav.item>
 				</Nav.section>
 
 				<Nav.section>
-					<RecentlyViewed brew={this.props.brew} />
+					{/*<RecentlyViewed brew={this.props.brew} />*/}
 					<PrintLink shareId={this.props.brew.shareId} />
 					<Nav.item href={'/source/' + this.props.brew.shareId} color='teal' icon='fa-code'>
 						source
 					</Nav.item>
+					<Account />
 				</Nav.section>
 			</Navbar>
 

client/homebrew/pages/userPage/brewItem/brewItem.jsx

@@ -0,0 +1,39 @@
+const React = require('react');
+const _     = require('lodash');
+const cx    = require('classnames');
+const moment = require('moment');
+
+const BrewItem = React.createClass({
+	getDefaultProps: function() {
+		return {
+			brew : {
+				title : '',
+				description : '',
+
+				authors : []
+			}
+		};
+	},
+
+	render : function(){
+		const brew = this.props.brew;
+		return <div className='brewItem'>
+			<h4>{brew.title}</h4>
+			<p className='description'><em>{brew.description}</em></p>
+			<hr />
+			<ul>
+				<li><strong>Authors: </strong> {brew.authors.join(', ')}</li>
+				<li>
+					<strong>Last updated: </strong>
+					{moment(brew.updatedAt).fromNow()}
+				</li>
+				<li><strong>Views: </strong> {brew.views} </li>
+			</ul>
+
+			<a href={`/share/${brew.shareId}`} target='_blank'>Share link</a>
+			{(!!brew.editId ? <a href={`/edit/${brew.editId}`} target='_blank'>Edit link</a> : null)}
+		</div>
+	}
+});
+
+module.exports = BrewItem;

client/homebrew/pages/userPage/brewItem/brewItem.less

@@ -0,0 +1,19 @@
+
+.brewItem{
+	display                     : inline-block;
+	vertical-align              : top;
+	width                       : 33%;
+	margin-bottom               : 15px;
+	-webkit-column-break-inside : avoid;
+	page-break-inside           : avoid;
+	break-inside                : avoid;
+	p.description{
+		overflow      : hidden;
+		width         : 90%;
+		text-overflow : ellipsis;
+		white-space   : nowrap;
+	}
+	a{
+		margin-right : 10px;
+	}
+}

client/homebrew/pages/userPage/userPage.jsx

@@ -0,0 +1,56 @@
+const React = require('react');
+const _     = require('lodash');
+const cx    = require('classnames');
+
+const Nav = require('naturalcrit/nav/nav.jsx');
+const Navbar = require('../../navbar/navbar.jsx');
+
+const RecentNavItem = require('../../navbar/recent.navitem.jsx');
+const Account = require('../../navbar/account.navitem.jsx');
+const BrewItem = require('./brewItem/brewItem.jsx');
+
+const UserPage = React.createClass({
+	getDefaultProps: function() {
+		return {
+			username : '',
+			brews : []
+		};
+	},
+
+	renderBrews : function(brews){
+		return _.map(brews, (brew, idx) => {
+			return <BrewItem brew={brew} key={idx}/>
+		});
+	},
+
+	getSortedBrews : function(){
+		return _.groupBy(this.props.brews, (brew)=>{
+			return (brew.published ? 'published' : 'private')
+		});
+	},
+
+	render : function(){
+		const brews = this.getSortedBrews();
+
+
+		return <div className='userPage page'>
+			<Navbar>
+				<Nav.section>
+					<RecentNavItem.both />
+					<Account />
+				</Nav.section>
+			</Navbar>
+
+			<div className='content'>
+				<div className='phb'>
+					<h1>{this.props.username}'s brews</h1>
+					{this.renderBrews(brews.published)}
+					{brews.private ? <h1>{this.props.username}'s unpublished brews</h1> : null}
+					{this.renderBrews(brews.private)}
+				</div>
+			</div>
+		</div>
+	}
+});
+
+module.exports = UserPage;

client/homebrew/pages/userPage/userPage.less

@@ -0,0 +1,12 @@
+
+.userPage{
+	.content .phb{
+		height       : 80%;
+		min-height   : 350px;
+		margin       : 20px auto;
+		column-count : 1;
+		&::after{
+			display : none;
+		}
+	}
+}

config/default.json

@@ -0,0 +1,5 @@
+{
+	"host" : "homebrewery.local.naturalcrit.com:8000",
+	"naturalcrit_url" : "local.naturalcrit.com:8010",
+	"secret" : "secret"
+}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "homebrewery",
   "description": "Create authentic looking D&D homebrews using only markdown",
-  "version": "2.4.1",
+  "version": "2.5.0",
   "scripts": {
     "build": "node_modules/.bin/gulp prod",
     "watch": "node_modules/.bin/gulp",
@@ -16,14 +16,17 @@
     "basic-auth": "^1.0.3",
     "body-parser": "^1.14.2",
     "classnames": "^2.2.0",
+    "cookie-parser": "^1.4.3",
     "express": "^4.13.3",
     "gulp": "^3.9.0",
     "gulp-less": "^3.1.0",
     "gulp-rename": "^1.2.2",
+    "jwt-simple": "^0.5.1",
     "lodash": "^4.11.2",
     "marked": "^0.3.5",
     "moment": "^2.11.0",
     "mongoose": "^4.3.3",
+    "nconf": "^0.8.4",
     "pico-flux": "^1.1.0",
     "pico-router": "^1.1.0",
     "react": "^15.0.2",
@@ -33,4 +36,4 @@
     "superagent": "^1.6.1",
     "vitreum": "^3.2.1"
   }
-}
+}

server.js

@@ -1,173 +1,136 @@
-'use strict';
-var _ = require('lodash');
 require('app-module-path').addPath('./shared');
-var vitreumRender = require('vitreum/render');
+
-var bodyParser = require('body-parser')
+const _ = require('lodash');
-var express = require("express");
+const jwt = require('jwt-simple');
-var app = express();
+const vitreumRender = require('vitreum/render');
+const express = require("express");
+const app = express();
 app.use(express.static(__dirname + '/build'));
-app.use(bodyParser.json({limit: '25mb'}));
+app.use(require('body-parser').json({limit: '25mb'}));
+app.use(require('cookie-parser')());
 
-//Mongoose
+const config = require('nconf')
-var mongoose = require('mongoose');
+	.argv()
-var mongoUri = process.env.MONGODB_URI || process.env.MONGOLAB_URI || 'mongodb://localhost/naturalcrit';
+	.env({ lowerCase: true })
-mongoose.connect(mongoUri);
+	.file('environment', { file: `config/${process.env.NODE_ENV}.json` })
-mongoose.connection.on('error', function(){
+	.file('defaults', { file: 'config/default.json' });
-	console.log(">>>ERROR: Run Mongodb.exe ya goof!");
-});
 
-//Admin route
+//DB
-process.env.ADMIN_USER = process.env.ADMIN_USER || 'admin';
+require('mongoose')
-process.env.ADMIN_PASS = process.env.ADMIN_PASS || 'password';
+	.connect(process.env.MONGODB_URI || process.env.MONGOLAB_URI || 'mongodb://localhost/naturalcrit')
-process.env.ADMIN_KEY  = process.env.ADMIN_KEY  || 'admin_key';
+	.connection.on('error', () => { console.log(">>>ERROR: Run Mongodb.exe ya goof!") });
-var auth = require('basic-auth');
+
-app.get('/admin', function(req, res){
+
-	var credentials = auth(req)
+//Account MIddleware
-	if (!credentials || credentials.name !== process.env.ADMIN_USER || credentials.pass !== process.env.ADMIN_PASS) {
+app.use((req, res, next) => {
-		res.setHeader('WWW-Authenticate', 'Basic realm="example"')
+	if(req.cookies && req.cookies.nc_session){
-		return res.status(401).send('Access denied')
+		try{
+			req.account = jwt.decode(req.cookies.nc_session, config.get('secret'));
+		}catch(e){}
 	}
-	vitreumRender({
+	return next();
-		page: './build/admin/bundle.dot',
-		prerenderWith : './client/admin/admin.jsx',
-		clearRequireCache : !process.env.PRODUCTION,
-		initialProps: {
-			url: req.originalUrl,
-			admin_key : process.env.ADMIN_KEY,
-		},
-	}, function (err, page) {
-		return res.send(page)
-	});
 });
 
 
-//Populate homebrew routes
+app.use(require('./server/homebrew.api.js'));
-app = require('./server/homebrew.api.js')(app);
+app.use(require('./server/admin.api.js'));
 
 
-var HomebrewModel = require('./server/homebrew.model.js').model;
+const HomebrewModel = require('./server/homebrew.model.js').model;
-
+const welcomeText = require('fs').readFileSync('./client/homebrew/pages/homePage/welcome_msg.md', 'utf8');
-var sanitizeBrew = function(brew){
+const changelogText = require('fs').readFileSync('./changelog.md', 'utf8');
-	var cleanBrew = _.assign({}, brew);
-	delete cleanBrew.editId;
-	return cleanBrew;
-};
-
-//Load project version
-var projectVersion = require('./package.json').version;
 
 
-//Edit Page
-app.get('/edit/:id', function(req, res){
-	HomebrewModel.find({editId : req.params.id}, function(err, objs){
-		var resObj = null;
-		if(objs.length){
-			resObj = objs[0].toJSON();
-		}
-
-		vitreumRender({
-			page: './build/homebrew/bundle.dot',
-			globals:{},
-			prerenderWith : './client/homebrew/homebrew.jsx',
-			initialProps: {
-				url: req.originalUrl,
-				brew : resObj || {},
-				version : projectVersion
-			},
-			clearRequireCache : !process.env.PRODUCTION,
-		}, function (err, page) {
-			return res.send(page)
-		});
-	})
-});
-
-
-//Share Page
-app.get('/share/:id', function(req, res){
-	HomebrewModel.find({shareId : req.params.id}, function(err, objs){
-		var brew = {};
-
-		if(objs.length){
-			var resObj = objs[0];
-			resObj.lastViewed = new Date();
-			resObj.views = resObj.views + 1;
-			resObj.save();
-
-			brew = resObj.toJSON();
-		}
-
-		vitreumRender({
-			page: './build/homebrew/bundle.dot',
-			globals:{},
-			prerenderWith : './client/homebrew/homebrew.jsx',
-			initialProps: {
-				url: req.originalUrl,
-				brew : sanitizeBrew(brew || {}),
-				version : projectVersion
-			},
-			clearRequireCache : !process.env.PRODUCTION,
-		}, function (err, page) {
-			return res.send(page)
-		});
-	})
-});
-
-//Print Page
-var Markdown = require('naturalcrit/markdown.js');
-var PHBStyle = '<style>' + require('fs').readFileSync('./phb.standalone.css', 'utf8') + '</style>'
-app.get('/print/:id', function(req, res){
-	HomebrewModel.find({shareId : req.params.id}, function(err, objs){
-		var brew = {};
-		if(objs.length){
-			brew = objs[0];
-		}
-
-		if(err || !objs.length){
-			brew.text = '# Oops \n We could not find a brew with that id. **Sorry!**';
-		}
-
-		var content = _.map(brew.text.split('\\page'), function(pageText, index){
-			return `<div class="phb print" id="p${index+1}">` + Markdown.render(pageText) + '</div>';
-		}).join('\n');
-
-		var dialog = '';
-		if(req.query && req.query.dialog) dialog = 'onload="window.print()"';
-
-		var title = '<title>' + brew.title + '</title>';
-		var page = `<html><head>${title} ${PHBStyle}</head><body ${dialog}>${content}</body></html>`
-
-		return res.send(page)
-	});
-});
 
 //Source page
 String.prototype.replaceAll = function(s,r){return this.split(s).join(r)}
-app.get('/source/:id', function(req, res){
+app.get('/source/:id', (req, res)=>{
-	HomebrewModel.find({shareId : req.params.id}, function(err, objs){
+	HomebrewModel.get({shareId : req.params.id})
-		if(err || !objs.length) return res.status(404).send('Could not find Homebrew with that id');
+		.then((brew)=>{
-		var brew = null;
+			const text = brew.text.replaceAll('<', '&lt;').replaceAll('>', '&gt;');
-		if(objs.length) brew = objs[0];
+			return res.send(`<code><pre>${text}</pre></code>`);
-		var text = brew.text.replaceAll('<', '&lt;').replaceAll('>', '&gt;');
+		})
-		return res.send(`<code><pre>${text}</pre></code>`);
+		.catch((err)=>{
-	});
+			console.log(err);
+			return res.status(404).send('Could not find Homebrew with that id');
+		})
 });
 
-//Home and 404, etc.
+
-var welcomeText = require('fs').readFileSync('./client/homebrew/pages/homePage/welcome_msg.md', 'utf8');
+app.get('/user/:username', (req, res, next) => {
-var changelogText = require('fs').readFileSync('./changelog.md', 'utf8');
+	const fullAccess = req.account && (req.account.username == req.params.username);
-app.get('*', function (req, res) {
+	HomebrewModel.getByUser(req.params.username, fullAccess)
+		.then((brews) => {
+			req.brews = brews;
+			return next();
+			//return res.json(brews)
+		})
+		.catch((err) => {
+			console.log(err);
+		})
+})
+
+
+app.get('/edit/:id', (req, res, next)=>{
+	HomebrewModel.get({editId : req.params.id})
+		.then((brew)=>{
+			req.brew = brew.sanatize();
+			return next();
+		})
+		.catch((err)=>{
+			console.log(err);
+			return res.status(400).send(`Can't get that`);
+		});
+});
+
+//Share Page
+app.get('/share/:id', (req, res, next)=>{
+	HomebrewModel.get({shareId : req.params.id})
+		.then((brew)=>{
+			return brew.increaseView();
+		})
+		.then((brew)=>{
+			req.brew = brew.sanatize(true);
+			return next();
+		})
+		.catch((err)=>{
+			console.log(err);
+			return res.status(400).send(`Can't get that`);
+		});
+});
+
+//Print Page
+app.get('/print/:id', (req, res, next)=>{
+	HomebrewModel.get({shareId : req.params.id})
+		.then((brew)=>{
+			req.brew = brew.sanatize(true);
+			return next();
+		})
+		.catch((err)=>{
+			console.log(err);
+			return res.status(400).send(`Can't get that`);
+		});
+});
+
+
+//Render Page
+app.use((req, res) => {
 	vitreumRender({
 		page: './build/homebrew/bundle.dot',
-		globals:{},
+		globals:{
+			version : require('./package.json').version
+		},
 		prerenderWith : './client/homebrew/homebrew.jsx',
 		initialProps: {
 			url: req.originalUrl,
 			welcomeText : welcomeText,
 			changelog : changelogText,
-			version : projectVersion
+			brew : req.brew,
+			brews : req.brews,
+			account : req.account
 		},
 		clearRequireCache : !process.env.PRODUCTION,
-	}, function (err, page) {
+	}, (err, page) => {
 		return res.send(page)
 	});
 });
@@ -175,6 +138,7 @@ app.get('*', function (req, res) {
 
 
 
+
 var port = process.env.PORT || 8000;
 app.listen(port);
 console.log('Listening on localhost:' + port);

server/admin.api.js

@@ -0,0 +1,72 @@
+const _ = require('lodash');
+const auth = require('basic-auth');
+const HomebrewModel = require('./homebrew.model.js').model;
+const router = require('express').Router();
+const vitreumRender = require('vitreum/render');
+
+
+const mw = {
+	adminOnly : (req, res, next)=>{
+		if(req.query && req.query.admin_key == process.env.ADMIN_KEY) return next();
+		return res.status(401).send('Access denied');
+	}
+};
+
+process.env.ADMIN_USER = process.env.ADMIN_USER || 'admin';
+process.env.ADMIN_PASS = process.env.ADMIN_PASS || 'password';
+process.env.ADMIN_KEY  = process.env.ADMIN_KEY  || 'admin_key';
+
+
+
+//Removes all empty brews that are older than 3 days and that are shorter than a tweet
+router.get('/api/invalid', mw.adminOnly, (req, res)=>{
+	const invalidBrewQuery = HomebrewModel.find({
+		'$where' : "this.text.length < 140",
+		createdAt: {
+			$lt: Moment().subtract(3, 'days').toDate()
+		}
+	});
+
+	if(req.query.do_it){
+		invalidBrewQuery.remove().exec((err, objs)=>{
+			refreshCount();
+			return res.send(200);
+		})
+	}else{
+		invalidBrewQuery.exec((err, objs)=>{
+			if(err) console.log(err);
+			return res.json({
+				count : objs.length
+			})
+		})
+	}
+});
+
+
+
+//Admin route
+
+
+router.get('/admin', function(req, res){
+	const credentials = auth(req)
+	if (!credentials || credentials.name !== process.env.ADMIN_USER || credentials.pass !== process.env.ADMIN_PASS) {
+		res.setHeader('WWW-Authenticate', 'Basic realm="example"')
+		return res.status(401).send('Access denied')
+	}
+	vitreumRender({
+		page: './build/admin/bundle.dot',
+		prerenderWith : './client/admin/admin.jsx',
+		clearRequireCache : !process.env.PRODUCTION,
+		initialProps: {
+			url: req.originalUrl,
+			admin_key : process.env.ADMIN_KEY,
+		},
+	}, function (err, page) {
+		return res.send(page)
+	});
+});
+
+
+
+
+module.exports = router;

server/homebrew.api.js

@@ -1,36 +1,31 @@
-var _ = require('lodash');
+const _ = require('lodash');
-var Moment = require('moment');
+const Moment = require('moment');
-var HomebrewModel = require('./homebrew.model.js').model;
+const HomebrewModel = require('./homebrew.model.js').model;
+const router = require('express').Router();
 
-var homebrewTotal = 0;
+
-var refreshCount = function(){
+
-	HomebrewModel.count({}, function(err, total){
+//TODO: Possiblity remove
+let homebrewTotal = 0;
+const refreshCount = ()=>{
+	HomebrewModel.count({}, (err, total)=>{
 		homebrewTotal = total;
 	});
 };
-refreshCount()
+refreshCount();
-
-var mw = {
-	adminOnly : function(req, res, next){
-		if(req.query && req.query.admin_key == process.env.ADMIN_KEY){
-			next();
-		}else{
-			return res.status(401).send('Access denied');
-		}
-	}
-};
 
 
-var getTopBrews = function(cb){
+
+const getTopBrews = (cb)=>{
 	HomebrewModel.find().sort({views: -1}).limit(5).exec(function(err, brews) {
 		cb(brews);
 	});
 }
 
-var getGoodBrewTitle = (text) => {
+const getGoodBrewTitle = (text) => {
-	var titlePos = text.indexOf('# ');
+	const titlePos = text.indexOf('# ');
 	if(titlePos !== -1){
-		var ending = text.indexOf('\n', titlePos);
+		const ending = text.indexOf('\n', titlePos);
 		return text.substring(titlePos + 2, ending);
 	}else{
 		return _.find(text.split('\n'), (line)=>{
@@ -40,70 +35,64 @@ var getGoodBrewTitle = (text) => {
 };
 
 
-module.exports = function(app){
 
-	app.post('/api', function(req, res){
+router.post('/api', (req, res)=>{
-		var newHomebrew = new HomebrewModel(req.body);
+	const newHomebrew = new HomebrewModel(_.merge({},
-		if(!newHomebrew.title){
+		req.body,
-			newHomebrew.title = getGoodBrewTitle(newHomebrew.text);
+		{authors : [req.account.username]}
+	));
+	if(!newHomebrew.title){
+		newHomebrew.title = getGoodBrewTitle(newHomebrew.text);
+	}
+	newHomebrew.save((err, obj)=>{
+		if(err){
+			console.error(err, err.toString(), err.stack);
+			return res.status(500).send(`Error while creating new brew, ${err.toString()}`);
 		}
-		newHomebrew.save(function(err, obj){
+		return res.json(obj);
-			if(err){
+	})
-				console.error(err, err.toString(), err.stack);
+});
-				return res.status(500).send(`Error while creating new brew, ${err.toString()}`);
-			}
-			return res.json(obj);
-		})
-	});
 
-	app.put('/api/update/:id', function(req, res){
+router.put('/api/update/:id', (req, res)=>{
-		HomebrewModel.find({editId : req.params.id}, function(err, objs){
+	HomebrewModel.get({editId : req.params.id})
-			if(!objs.length || err) return res.status(404).send("Can not find homebrew with that id");
+		.then((brew)=>{
-			var resEntry = objs[0];
+			brew = _.merge(brew, req.body);
-			resEntry.text = req.body.text;
+			brew.updatedAt = new Date();
-			resEntry.title = req.body.title;
+			brew.authors = _.uniq(_.concat(brew.authors, req.account.username));
-			resEntry.updatedAt = new Date();
+			brew.save((err, obj)=>{
-			resEntry.save(function(err, obj){
+				if(err) throw err;
-				if(err) return res.status(500).send("Error while saving");
 				return res.status(200).send(obj);
 			})
+		})
+		.catch((err)=>{
+			console.log(err);
+			return res.status(500).send("Error while saving");
 		});
-	});
+});
 
-	app.get('/api/remove/:id', function(req, res){
+router.get('/api/remove/:id', (req, res)=>{
-		HomebrewModel.find({editId : req.params.id}, function(err, objs){
+	HomebrewModel.find({editId : req.params.id}, (err, objs)=>{
-			if(!objs.length || err) return res.status(404).send("Can not find homebrew with that id");
+		if(!objs.length || err) return res.status(404).send("Can not find homebrew with that id");
-			var resEntry = objs[0];
+		var resEntry = objs[0];
-			resEntry.remove(function(err){
+		resEntry.remove((err)=>{
-				if(err) return res.status(500).send("Error while removing");
+			if(err) return res.status(500).send("Error while removing");
-				return res.status(200).send();
+			return res.status(200).send();
-			})
+		})
-		});
 	});
+});
+
+
+module.exports = router;
+
+/*
+
+
+
+module.exports = function(app){
+
+	app;
 
-	//Removes all empty brews that are older than 3 days and that are shorter than a tweet
-	app.get('/api/invalid', mw.adminOnly, function(req, res){
-		var invalidBrewQuery = HomebrewModel.find({
-			'$where' : "this.text.length < 140",
-			createdAt: {
-				$lt: Moment().subtract(3, 'days').toDate()
-			}
-		});
 
-		if(req.query.do_it){
-			invalidBrewQuery.remove().exec((err, objs)=>{
-				refreshCount();
-				return res.send(200);
-			})
-		}else{
-			invalidBrewQuery.exec((err, objs)=>{
-				if(err) console.log(err);
-				return res.json({
-					count : objs.length
-				})
-			})
-		}
-	});
 
 
 	app.get('/api/search', mw.adminOnly, function(req, res){
@@ -143,4 +132,5 @@ module.exports = function(app){
 
 
 	return app;
-}
+}
+*/

server/homebrew.model.js

@@ -8,11 +8,67 @@ var HomebrewSchema = mongoose.Schema({
 	title : {type : String, default : ""},
 	text : {type : String, default : ""},
 
+	description : {type : String, default : ""},
+	tags : {type : String, default : ""},
+	systems : [String],
+	authors : [String],
+	published : {type : Boolean, default : false},
+
 	createdAt     : { type: Date, default: Date.now },
 	updatedAt   : { type: Date, default: Date.now},
 	lastViewed  : { type: Date, default: Date.now},
 	views : {type:Number, default:0}
-});
+}, { versionKey: false });
+
+
+
+HomebrewSchema.methods.sanatize = function(full=false){
+	const brew = this.toJSON();
+	delete brew._id;
+	delete brew.__v;
+	if(full){
+		delete brew.editId;
+	}
+	return brew;
+};
+
+
+HomebrewSchema.methods.increaseView = function(){
+	return new Promise((resolve, reject) => {
+		this.lastViewed = new Date();
+		this.views = this.views + 1;
+		this.save((err) => {
+			if(err) return reject(err);
+			return resolve(this);
+		});
+	});
+};
+
+
+
+HomebrewSchema.statics.get = function(query){
+	return new Promise((resolve, reject) => {
+		Homebrew.find(query, (err, brews)=>{
+			if(err || !brews.length) return reject('Can not find brew');
+			return resolve(brews[0]);
+		});
+	});
+};
+
+HomebrewSchema.statics.getByUser = function(username, allowAccess=false){
+	return new Promise((resolve, reject) => {
+		let query = {authors : username, published : true};
+		if(allowAccess){
+			delete query.published;
+		}
+		Homebrew.find(query, (err, brews)=>{
+			if(err) return reject('Can not find brew');
+			return resolve(_.map(brews, (brew)=>{
+				return brew.sanatize(!allowAccess);
+			}));
+		});
+	});
+};
 
 
 

shared/naturalcrit/styles/core.less

@@ -1,9 +1,9 @@
+
 @import 'naturalcrit/styles/reset.less';
 //@import 'naturalcrit/styles/elements.less';
 @import 'naturalcrit/styles/animations.less';
 @import 'naturalcrit/styles/colors.less';
 @import 'naturalcrit/styles/tooltip.less';
-
 @font-face {
 	font-family : CodeLight;
 	src         : url('/assets/naturalcrit/styles/CODE Light.otf');
@@ -13,8 +13,38 @@
 	src         : url('/assets/naturalcrit/styles/CODE Bold.otf');
 }
 html,body, #reactContainer{
-	min-height: 100vh;
+	height      : 100vh;
-	height: 100vh;
+	min-height  : 100vh;
-	margin: 0;
+	margin      : 0;
+	font-family : 'Open Sans', sans-serif;
+}
+*{
+	box-sizing : border-box;
+}
+button{
+	.button();
+}
+.button(@backgroundColor : @green){
+	.animate(background-color);
+	display          : inline-block;
+	padding          : 0.6em 1.2em;
+	cursor           : pointer;
+	background-color : @backgroundColor;
 	font-family      : 'Open Sans', sans-serif;
+	font-size        : 0.8em;
+	font-weight      : 800;
+	color            : white;
+	text-decoration  : none;
+	text-transform   : uppercase;
+	border           : none;
+	outline          : none;
+	&:hover{
+		background-color : darken(@backgroundColor, 5%);
+	}
+	&:active{
+		background-color : darken(@backgroundColor, 10%);
+	}
+	&:disabled{
+		background-color : @silver !important;
+	}
 }