From 4139a8ee122aaf669f0022099718ebbca55c1cfc Mon Sep 17 00:00:00 2001
From: Scott Tolksdorf <scott.tolksdorf@gmail.com>
Date: Thu, 5 May 2016 08:36:33 -0400
Subject: [PATCH] UPdating the homebrew editor with new snippet bar

---
 client/homebrew/editor/editor.jsx             | 33 ++++-----
 client/homebrew/editor/editor.less            | 10 +++
 client/homebrew/editor/snippets/snippets.js   | 71 ++++++++++++++++++-
 client/homebrew/homePage/homePage.jsx         | 53 ++++++++------
 client/homebrew/navbar/navbar.jsx             |  6 +-
 .../homebrew/navbar/redditShare.navitem.jsx   |  6 +-
 shared/naturalCrit/nav/nav.less               |  2 +-
 todo.md                                       |  2 +-
 8 files changed, 137 insertions(+), 46 deletions(-)

diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx
index 6857a215a..60bf7f1d6 100644
--- a/client/homebrew/editor/editor.jsx
+++ b/client/homebrew/editor/editor.jsx
@@ -1,23 +1,22 @@
 var React = require('react');
 var _ = require('lodash');
 var cx = require('classnames');
-var SnippetIcons = require('./snippets/snippets.js');
 
+var CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
+
+var Snippets = require('./snippets/snippets.js');
 
 var Editor = React.createClass({
 	getDefaultProps: function() {
 		return {
-			text : "",
+			value : "",
 			onChange : function(){}
 		};
 	},
 
-	componentDidMount: function() {
-		this.refs.textarea.focus();
-	},
 
-	handleTextChange : function(e){
-		this.props.onChange(e.target.value);
+	handleTextChange : function(text){
+		this.props.onChange(text);
 	},
 
 	iconClick : function(snippetFn){
@@ -28,7 +27,7 @@ var Editor = React.createClass({
 	},
 
 	renderTemplateIcons : function(){
-		return _.map(SnippetIcons, (t) => {
+		return _.map(Snippets, (t) => {
 			return <div className='icon' key={t.icon}
 				onClick={this.iconClick.bind(this, t.snippet)}
 				data-tooltip={t.tooltip}>
@@ -36,18 +35,20 @@ var Editor = React.createClass({
 			</div>;
 		})
 	},
+	renderSnippetBar : function(){
+		return <div className='snippetBar'>
+			Snippet bar yo
+
+		</div>
+	},
 
 	render : function(){
-		var self = this;
 		return(
 			<div className='editor'>
-				<div className='textIcons'>
-					{this.renderTemplateIcons()}
-				</div>
-				<textarea
-					ref='textarea'
-					value={this.props.text}
-					onChange={this.handleTextChange} />
+				{this.renderTemplateIcons()}
+				{this.renderSnippetBar()}
+				<CodeEditor wrap={true} language='gfm' value={this.props.value} onChange={this.handleTextChange} />
+
 			</div>
 		);
 	}
diff --git a/client/homebrew/editor/editor.less b/client/homebrew/editor/editor.less
index ce4f0ba21..fa64b8a61 100644
--- a/client/homebrew/editor/editor.less
+++ b/client/homebrew/editor/editor.less
@@ -6,6 +6,7 @@
 	width      : 100%;
 	//display: flex;
 	//flex-direction: column;
+	/*
 	.textIcons{
 		display        : inline-block;
 		vertical-align : top;
@@ -36,5 +37,14 @@
 		padding    : 10px;
 		border     : none;
 		outline: none;
+	}
+	*/
+
+
+	.snippetBar{
+		background-color: #bbb;
+
+
+
 	}
 }
\ No newline at end of file
diff --git a/client/homebrew/editor/snippets/snippets.js b/client/homebrew/editor/snippets/snippets.js
index 3c65ff601..931edef95 100644
--- a/client/homebrew/editor/snippets/snippets.js
+++ b/client/homebrew/editor/snippets/snippets.js
@@ -4,6 +4,32 @@ var MonsterBlockGen = require('./monsterblock.gen.js');
 var ClassFeatureGen = require('./classfeature.gen.js');
 var FullClassGen = require('./fullclass.gen.js');
 
+
+/* Snippet Categories
+
+	- editor
+	- Tables
+	- PHB
+	- document
+	- print
+
+*/
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 module.exports = [
 	/*
 	{
@@ -123,4 +149,47 @@ module.exports = [
 		}
 	}
 
-]
\ No newline at end of file
+]
+
+
+
+
+
+module.exports = [
+	{
+		groupName : 'Editor',
+		icon : 'fa-pencil',
+		snippets : [
+			{
+				name : 'Spell',
+				icon : 'fa-magic',
+				snippet : SpellGen
+			}
+		]
+	},
+	{
+		groupName : 'Tables',
+		icon : 'fa-table',
+		snippets : [
+			{
+				name : 'Spell',
+				icon : 'fa-magic',
+				snippet : SpellGen
+			}
+		]
+	},
+	{
+		groupName : 'PHB',
+		icon : 'fa-book',
+		snippets : [
+			{
+				name : 'Spell',
+				icon : 'fa-magic',
+				snippet : SpellGen
+			}
+		]
+	},
+
+]
+
+
diff --git a/client/homebrew/homePage/homePage.jsx b/client/homebrew/homePage/homePage.jsx
index 5983c3b2b..9c0c9ce7b 100644
--- a/client/homebrew/homePage/homePage.jsx
+++ b/client/homebrew/homePage/homePage.jsx
@@ -17,7 +17,9 @@ var SplitPane = require('../splitPane/splitPane.jsx');
 
 
 
-var CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
+//var CodeEditor = require('naturalcrit/codeEditor/codeEditor.jsx');
+
+var Editor = require('../editor/editor.jsx');
 
 
 
@@ -61,32 +63,39 @@ var HomePage = React.createClass({
 		return(
 			<div className='homePage page'>
 				<Navbar>
-					<RedditShare brew={{text : this.state.text}}/>
 
-					<Nav.item
-						newTab={true}
-						href='https://github.com/stolksdorf/naturalcrit/issues'
-						color='red'
-						icon='fa-bug'>
-						issue?
-					</Nav.item>
-					<Nav.item
-						href='/homebrew/changelog'
-						color='purple'
-						icon='fa-file-text-o'>
-						Changelog
-					</Nav.item>
-					<Nav.item
-						href='/homebrew/new'
-						color='green'
-						icon='fa-external-link'>
-						New Brew
-					</Nav.item>
+					<Nav.section>
+						<Nav.item>Bad Ass Brew</Nav.item>
+					</Nav.section>
+
+
+					<Nav.section>
+						<RedditShare brew={{text : this.state.text}}/>
+						<Nav.item
+							newTab={true}
+							href='https://github.com/stolksdorf/naturalcrit/issues'
+							color='red'
+							icon='fa-bug'>
+							report issue
+						</Nav.item>
+						<Nav.item
+							href='/homebrew/changelog'
+							color='purple'
+							icon='fa-file-text-o'>
+							Changelog
+						</Nav.item>
+						<Nav.item
+							href='/homebrew/new'
+							color='green'
+							icon='fa-external-link'>
+							New Brew
+						</Nav.item>
+					</Nav.section>
 				</Navbar>
 
 				<div className='content'>
 					<SplitPane>
-						<CodeEditor wrap={true} language='gfm' value={this.state.text} onChange={this.handleTextChange} />
+						<Editor value={this.state.text} onChange={this.handleTextChange} />
 						<div>{this.state.text}</div>
 					</SplitPane>
 
diff --git a/client/homebrew/navbar/navbar.jsx b/client/homebrew/navbar/navbar.jsx
index aa539328c..191373345 100644
--- a/client/homebrew/navbar/navbar.jsx
+++ b/client/homebrew/navbar/navbar.jsx
@@ -19,9 +19,11 @@ var Navbar = React.createClass({
 				<Nav.item>v1.5.0</Nav.item>
 			</Nav.section>
 
-			<Nav.section>
+
+
+
+
 				{this.props.children}
-			</Nav.section>
 		</Nav.base>
 	}
 });
diff --git a/client/homebrew/navbar/redditShare.navitem.jsx b/client/homebrew/navbar/redditShare.navitem.jsx
index 93593bc05..b6e5888e9 100644
--- a/client/homebrew/navbar/redditShare.navitem.jsx
+++ b/client/homebrew/navbar/redditShare.navitem.jsx
@@ -15,7 +15,7 @@ var RedditShare = React.createClass({
 	getDefaultProps: function() {
 		return {
 			brew : {
-				desc : '',
+				title : '',
 				sharedId : '',
 				text : ''
 			}
@@ -30,7 +30,7 @@ var RedditShare = React.createClass({
 	handleClick : function(){
 		var url = [
 			MAIN_URL,
-			'title=' + encodeURIComponent(this.props.brew.desc ? this.props.brew.desc : 'Check out my brew!'),
+			'title=' + encodeURIComponent(this.props.brew.title ? this.props.brew.title : 'Check out my brew!'),
 
 			'text=' + encodeURIComponent(this.props.brew.text)
 
@@ -42,7 +42,7 @@ var RedditShare = React.createClass({
 
 
 	render : function(){
-		return <Nav.item icon='fa-reddit' color='red' onClick={this.handleClick}>
+		return <Nav.item icon='fa-reddit-alien' color='red' onClick={this.handleClick}>
 			share on reddit
 		</Nav.item>
 	},
diff --git a/shared/naturalCrit/nav/nav.less b/shared/naturalCrit/nav/nav.less
index 9ae0158f6..f8ce8ae48 100644
--- a/shared/naturalCrit/nav/nav.less
+++ b/shared/naturalCrit/nav/nav.less
@@ -83,7 +83,7 @@ nav{
 		&.greyLight:hover{ background-color : @greyLight };
 		&.grey:hover{ background-color : @grey };
 	}
-	.navSection + .navSection .navItem{
+	.navSection:last-child .navItem{
 		border-left : 1px solid #666;
 	}
 }
\ No newline at end of file
diff --git a/todo.md b/todo.md
index 9df6f972d..3f07db232 100644
--- a/todo.md
+++ b/todo.md
@@ -8,7 +8,6 @@ X Simplify the panel css to remove the current issues
 - remove old status bar
 X remove jsoneditor (if we don't need it)
 X Add in markdown editor
-- Add bleed snippet (bump)
 - Add the '/new' page and force save to reduce database size
 X Add pagniation and query to the homebrew api
 X Update the admin page with pagnition and a query box
@@ -18,6 +17,7 @@ X Test the old/small brew filtering for deleteion
 - Add in brew title, use for metadata?
 - Add in specific entry point rendering in server.js
 - Add in a tutorial page?
+- Add in a localstorage fallback on the `/new` page, clear it when they save
 
 ## v1.6
 - Add error handling to the saving wdiget in the status bar