From be783e5f6b15fd72c8b47dcb50e4e5ae2c0b107c Mon Sep 17 00:00:00 2001
From: Scott Tolksdorf <scott.tolksdorf@gmail.com>
Date: Sat, 3 Dec 2016 15:47:20 -0500
Subject: [PATCH] Added a table of contents snippet

---
 changelog.md                                  |  2 +
 client/homebrew/editor/editor.jsx             |  6 +-
 .../homebrew/editor/snippetbar/snippetbar.jsx |  9 ++-
 .../editor/snippetbar/snippets/snippets.js    |  7 ++
 .../snippets/tableOfContents.gen.js           | 72 +++++++++++++++++++
 client/homebrew/phbStyle/phb.style.less       | 25 ++++++-
 phb.standalone.css                            | 23 +++++-
 7 files changed, 137 insertions(+), 7 deletions(-)
 create mode 100644 client/homebrew/editor/snippetbar/snippets/tableOfContents.gen.js

diff --git a/changelog.md b/changelog.md
index 84b01df8f..eb5e0512f 100644
--- a/changelog.md
+++ b/changelog.md
@@ -7,6 +7,8 @@
 - Disabled Partial Page Rendering unless your brew hits 75 pages or longer
 - The brew renderer will now try and use your first page to judge the page size of each of your brews. This allows you now to set landscape and other weird sizes and everthing should work fine :)
 - UI on the user page improved slightly
+- Fixed lists not breaking across columns (thanks u/tyson-nw)
+-
 
 
 
diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx
index f25ec8a58..407d9c242 100644
--- a/client/homebrew/editor/editor.jsx
+++ b/client/homebrew/editor/editor.jsx
@@ -82,7 +82,11 @@ const Editor = React.createClass({
 	render : function(){
 		return(
 			<div className='editor' ref='main'>
-				<SnippetBar onInject={this.handleInject} onToggle={this.handgleToggle} showmeta={this.state.showMetadataEditor} />
+				<SnippetBar
+					brew={this.props.value}
+					onInject={this.handleInject}
+					onToggle={this.handgleToggle}
+					showmeta={this.state.showMetadataEditor} />
 				{this.renderMetadataEditor()}
 				<CodeEditor
 					ref='codeEditor'
diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx
index e77c1e9c3..ffccbbf83 100644
--- a/client/homebrew/editor/snippetbar/snippetbar.jsx
+++ b/client/homebrew/editor/snippetbar/snippetbar.jsx
@@ -5,8 +5,8 @@ const cx    = require('classnames');
 
 const Snippets = require('./snippets/snippets.js');
 
-const execute = function(val){
-	if(_.isFunction(val)) return val();
+const execute = function(val, brew){
+	if(_.isFunction(val)) return val(brew);
 	return val;
 }
 
@@ -15,6 +15,7 @@ const execute = function(val){
 const Snippetbar = React.createClass({
 	getDefaultProps: function() {
 		return {
+			brew : '',
 			onInject : ()=>{},
 			onToggle : ()=>{},
 			showmeta : false
@@ -28,6 +29,7 @@ const Snippetbar = React.createClass({
 	renderSnippetGroups : function(){
 		return _.map(Snippets, (snippetGroup)=>{
 			return <SnippetGroup
+				brew={this.props.brew}
 				groupName={snippetGroup.groupName}
 				icon={snippetGroup.icon}
 				snippets={snippetGroup.snippets}
@@ -58,6 +60,7 @@ module.exports = Snippetbar;
 const SnippetGroup = React.createClass({
 	getDefaultProps: function() {
 		return {
+			brew : '',
 			groupName : '',
 			icon : 'fa-rocket',
 			snippets : [],
@@ -65,7 +68,7 @@ const SnippetGroup = React.createClass({
 		};
 	},
 	handleSnippetClick : function(snippet){
-		this.props.onSnippetClick(execute(snippet.gen));
+		this.props.onSnippetClick(execute(snippet.gen, this.props.brew));
 	},
 	renderSnippets : function(){
 		return _.map(this.props.snippets, (snippet)=>{
diff --git a/client/homebrew/editor/snippetbar/snippets/snippets.js b/client/homebrew/editor/snippetbar/snippets/snippets.js
index 60a0f2327..bcb1df96f 100644
--- a/client/homebrew/editor/snippetbar/snippets/snippets.js
+++ b/client/homebrew/editor/snippetbar/snippets/snippets.js
@@ -4,6 +4,7 @@ var MonsterBlockGen = require('./monsterblock.gen.js');
 var ClassFeatureGen = require('./classfeature.gen.js');
 var FullClassGen = require('./fullclass.gen.js');
 var CoverPageGen = require('./coverpage.gen.js');
+var TableOfContentsGen = require('./tableOfContents.gen.js');
 
 
 module.exports = [
@@ -70,6 +71,12 @@ module.exports = [
 				gen : "[Click here](#p3) to go to page 3\n"
 			},
 
+			{
+				name : "Table of Contents",
+				icon : 'fa-book',
+				gen : TableOfContentsGen
+			},
+
 
 		]
 	},
diff --git a/client/homebrew/editor/snippetbar/snippets/tableOfContents.gen.js b/client/homebrew/editor/snippetbar/snippets/tableOfContents.gen.js
new file mode 100644
index 000000000..448b2f4e1
--- /dev/null
+++ b/client/homebrew/editor/snippetbar/snippets/tableOfContents.gen.js
@@ -0,0 +1,72 @@
+const _ = require('lodash');
+
+const getTOC = (pages) => {
+	const add1 = (title, page)=>{
+		res.push({
+			title : title,
+			page : page + 1,
+			children : []
+		});
+	}
+	const add2 = (title, page)=>{
+		if(!_.last(res)) add1('', page);
+		_.last(res).children.push({
+			title : title,
+			page : page + 1,
+			children : []
+		});
+	}
+	const add3 = (title, page)=>{
+		if(!_.last(res)) add1('', page);
+		if(!_.last(_.last(res).children)) add2('', page);
+		_.last(_.last(res).children).children.push({
+			title : title,
+			page : page + 1,
+			children : []
+		});
+	}
+
+	let res = [];
+	_.each(pages, (page, pageNum)=>{
+		const lines = page.split('\n');
+		_.each(lines, (line) => {
+			if(_.startsWith(line, '# ')){
+				const title = line.replace('# ', '');
+				add1(title, pageNum)
+			}
+			if(_.startsWith(line, '## ')){
+				const title = line.replace('## ', '');
+				add2(title, pageNum);
+			}
+			if(_.startsWith(line, '### ')){
+				const title = line.replace('### ', '');
+				add3(title, pageNum);
+			}
+		})
+	});
+	return res;
+}
+
+module.exports = function(brew){
+	const pages = brew.split('\\page');
+	const TOC = getTOC(pages);
+	const markdown = _.reduce(TOC, (r, g1, idx1)=>{
+		r.push(`- **[${idx1 + 1} ${g1.title}](#p${g1.page})**`)
+		if(g1.children.length){
+			_.each(g1.children, (g2, idx2) => {
+				r.push(`  - [${idx1 + 1}.${idx2 + 1} ${g2.title}](#p${g2.page})`);
+				if(g2.children.length){
+					_.each(g2.children, (g3, idx3) => {
+						r.push(`    - [${idx1 + 1}.${idx2 + 1}.${idx3 + 1} ${g3.title}](#p${g3.page})`);
+					});
+				}
+			});
+		}
+		return r;
+	}, []).join('\n');
+
+	return `<div class='toc'>
+##### Table Of Contents
+${markdown}
+</div>\n`;
+}
\ No newline at end of file
diff --git a/client/homebrew/phbStyle/phb.style.less b/client/homebrew/phbStyle/phb.style.less
index fcda2116a..80a9d0933 100644
--- a/client/homebrew/phbStyle/phb.style.less
+++ b/client/homebrew/phbStyle/phb.style.less
@@ -15,7 +15,7 @@ body {
 	counter-reset : phb-page-numbers;
 }
 *{
-	-webkit-print-color-adjust: exact;
+	-webkit-print-color-adjust : exact;
 }
 .useSansSerif(){
 	font-family : ScalySans;
@@ -332,7 +332,7 @@ body {
 		-moz-column-break-after    : always;
 	}
 	//Avoid breaking up
-	p,ul,blockquote,table{
+	p,blockquote,table{
 		z-index                     : 15;
 		-webkit-column-break-inside : avoid;
 		column-break-inside         : avoid;
@@ -449,4 +449,25 @@ body {
 }
 .phb pre+.descriptive{
 	margin-top : 8px;
+}
+//*****************************
+// *      TABLE OF CONTENTS
+// *****************************/
+.phb .toc{
+	-webkit-column-break-inside : avoid;
+	column-break-inside         : avoid;
+	a{
+		color           : black;
+		text-decoration : none;
+		&:hover{
+			text-decoration : underline;
+		}
+	}
+	ul{
+		padding-left    : 0;
+		list-style-type : none;
+	}
+	&>ul>li{
+		margin-bottom : 10px;
+	}
 }
\ No newline at end of file
diff --git a/phb.standalone.css b/phb.standalone.css
index adcf20c11..9133af9de 100644
--- a/phb.standalone.css
+++ b/phb.standalone.css
@@ -518,7 +518,6 @@ body {
   -moz-column-break-after: always;
 }
 .phb p,
-.phb ul,
 .phb blockquote,
 .phb table {
   z-index: 15;
@@ -540,6 +539,10 @@ body {
   margin-bottom: 0px;
   margin-left: 1.5em;
 }
+.phb li {
+  -webkit-column-break-inside: avoid;
+  column-break-inside: avoid;
+}
 .phb .spellList {
   font-family: ScalySans;
   column-count: 4;
@@ -627,3 +630,21 @@ body {
 .phb pre + .descriptive {
   margin-top: 8px;
 }
+.phb .toc {
+  -webkit-column-break-inside: avoid;
+  column-break-inside: avoid;
+}
+.phb .toc a {
+  color: black;
+  text-decoration: none;
+}
+.phb .toc a:hover {
+  text-decoration: underline;
+}
+.phb .toc ul {
+  padding-left: 0;
+  list-style-type: none;
+}
+.phb .toc > ul > li {
+  margin-bottom: 10px;
+}