Merge branch 'master' into pr/1592

client/homebrew/pages/editPage/editPage.jsx

@@ -197,7 +197,7 @@ const EditPage = createClass({
 		const transfer = this.state.saveGoogle == _.isNil(this.state.brew.googleId);
 
 		const brew = this.state.brew;
-		brew.pageCount = ((brew.renderer=='legacy' ? brew.text.match(/\\page/g) : brew.text.match(/^\\page/gm)) || []).length + 1;
+		brew.pageCount = ((brew.renderer=='legacy' ? brew.text.match(/\\page/g) : brew.text.match(/^\\page$/gm)) || []).length + 1;
 
 		if(this.state.saveGoogle) {
 			if(transfer) {

client/homebrew/pages/homePage/welcome_msg.md

@@ -4,7 +4,7 @@ Welcome traveler from an antique land. Please sit and tell us of what you have s
 ### Homebrew D&D made easy
 The Homebrewery makes the creation and sharing of authentic looking Fifth-Edition homebrews easy. It uses [Markdown](https://help.github.com/articles/markdown-basics/) with a little CSS magic to make your brews come to life.
 
-**Try it! **Simply edit the text on the left and watch it *update live* on the right.
+**Try it!** Simply edit the text on the left and watch it *update live* on the right.
 
 
 
@@ -36,8 +36,10 @@ This tool will **always** be free, never have ads, and I will never offer any "p
 ```
 ```
 
-## Big things coming in v3.0.0
-With the next major release of Homebrewery, v3.0.0, this tool *will no longer support raw HTML input for brew code*. All brews made previous to the release of v3.0.0 will still render normally.
+## V3.0.0 Released!
+With the latest major update to *The Homebrewery* we've implemented an extended Markdown-like syntax for block and span elements, plus a few other changes, eliminating the need for HTML tags like **div** and **span** in most cases. No raw HTML tags should be needed in a brew, and going forward, raw HTML will no longer receive debugging support (*but can still be used if you insist*).
+
+**You can enable V3 via the <span class="fa fa-info-circle" style="text-indent:0"></span> Properties button!**
 
 ## New Things All The Time!
 What's new in the latest update? Check out the full changelog [here](/changelog)
@@ -46,9 +48,9 @@ What's new in the latest update? Check out the full changelog [here](/changelog)
 Have an idea of how to make The Homebrewery better? Or did you find something that wasn't quite right? Head [here](https://www.reddit.com/r/homebrewery/submit?selftext=true&title=%5BIssue%5D%20Describe%20Your%20Issue%20Here) and let me know!.
 
 ### Legal Junk
-The Homebrewery is licensed using the [MIT License](https://github.com/naturalcrit/homebrewery/blob/master/license). Which means you are free to use The Homebrewery is any way that you want, except for claiming that you made it yourself.
+The Homebrewery is licensed using the [MIT License](https://github.com/naturalcrit/homebrewery/blob/master/license). This means you are free to use The Homebrewery codebase any way that you want, except for claiming that you made it yourself.
 
-If you wish to sell or in some way gain profit for what's created on this site, it's your responsibility to ensure you have the proper licenses/rights for any images or resources used.
+If you wish to sell or in some way gain profit for what you make on this site, it's your responsibility to ensure you have the proper licenses/rights for any images or resources used.
 
 ### More Resources
 If you are looking for more 5e Homebrew resources check out [r/UnearthedArcana](https://www.reddit.com/r/UnearthedArcana/) and their list of useful resources [here](https://www.reddit.com/r/UnearthedArcana/comments/3uwxx9/resources_open_to_the_community/).

client/homebrew/pages/homePage/welcome_msg_v3.md

@@ -4,10 +4,8 @@
 }
 
 .page {
-	padding-bottom : 1.6cm;
+	padding-bottom : 1.1cm;
 }
-
-
 ```
 
 # The Homebrewery *V3*
@@ -25,26 +23,31 @@ Any changes you make while on the *edit url* will be automatically saved to the
 
 Anyone with the *share url* will be able to access a read-only version of your homebrew.
 
-### PDF Creation
+{{note
+##### PDF Creation
 PDF Printing works best in Google Chrome. If you are having quality/consistency issues, try using Chrome to print instead.
 
 After clicking the "Print" item in the navbar a new page will open and a print dialog will pop-up.
 * Set the **Destination** to "Save as PDF"
 * Set **Paper Size** to "Letter"
-* If you are printing on A4 paper, make sure to have the {{far,fa-file}} **A4 Pagesize** snippet in your brew
+* If you are printing on A4 paper, make sure to have the **PRINT → {{far,fa-file}} A4 Pagesize** snippet in your brew
 * In **Options** make sure "Background Images" is selected.
 * Hit print and enjoy! You're done!
 
-If you want to save ink or have a monochrome printer, add the {{fas,fa-tint}} **Ink Friendly** snippet to your brew before you print
+If you want to save ink or have a monochrome printer, add the **PRINT → {{fas,fa-tint}} Ink Friendly** snippet to your brew before you print
+}}
 
+<img src='https://i.imgur.com/hMna6G0.png' style='position:absolute;bottom:50px;left:120px;width:180px' />
 
+<div class='pageNumber'>1</div>
+<div class='footnote'>PART 1 | FANCINESS</div>
 
 \column
 
 ## New in V3.0.0
 With the latest major update to *The Homebrewery* we've implemented an extended Markdown-like syntax for block and span elements, plus a few other changes, eliminating the need for HTML tags like `div` and `span` in most cases. No raw HTML tags should be needed in a brew, and going forward, raw HTML will no longer receive debugging support (*but can still be used if you insist*).
 
-All brews made prior to the release of v3.0.0 will still render normally, and you may switch between the "legacy" brew renderer and the newer "V3" renderer via the {{fa,fa-info-circle}} **Properties** button  on your brew. Much of the syntax and styling has changed in V3, so code in one version may be broken in the other.
+Much of the syntax and styling has changed in V3. Code in one version may be broken in the other, and updating an older brew to V3 will require more than just a copy and paste. *However*, all brews made prior to the release of v3.0.0 will still render normally, and you may switch between the "Legacy" brew renderer and the newer "V3" renderer via the {{fa,fa-info-circle}} **Properties** button on your brew at any time.
 
 Scroll down to the next page for a brief summary of the changes and new features available in V3!
 
@@ -61,29 +64,18 @@ Need help getting started or just the right look for your brew? Head to [r/Homeb
 
 Have an idea to make The Homebrewery better? Or did you find something that wasn't quite right? Check out the [GitHub Repo](https://github.com/naturalcrit/homebrewery/) to report technical issues.
 
-
-
 ### Legal Junk
 The Homebrewery is licensed using the [MIT License](https://github.com/naturalcrit/homebrewery/blob/master/license). Which means you are free to use The Homebrewery codebase any way that you want, except for claiming that you made it yourself.
 
 If you wish to sell or in some way gain profit for what's created on this site, it's your responsibility to ensure you have the proper licenses/rights for any images or resources used.
 
 #### Crediting Me
-If you'd like to credit The Homebrewery in your brew, I'd be flattered! Just reference that you made it with The Homebrewery.
+If you'd like to credit me in your brew, I'd be flattered! Just reference that you made it with The Homebrewery.
 
 ### More Resources
 If you are looking for more 5e Homebrew resources check out [r/UnearthedArcana](https://www.reddit.com/r/UnearthedArcana/) and their list of useful resources [here](https://www.reddit.com/r/UnearthedArcana/comments/3uwxx9/resources_open_to_the_community/).
 
 
-
-<img src='https://i.imgur.com/hMna6G0.png' style='position:absolute;bottom:50px;left:120px;width:180px' />
-
-<div class='pageNumber'>1</div>
-<div class='footnote'>PART 1 | FANCINESS</div>
-
-
-
-
 \page
 
 ## Markdown+
@@ -145,9 +137,9 @@ Row spanning is achieved by adding a `^` at the end of a cell just before the `|
 These can be combined to span a cell across both columns and rows. Cells must have the same colspan if they are to be rowspan'd.
 
 ##### Example
-|        | Spanned Header ||
-| Head A | Head B | Head C |
-|:-------|:-------|:-------|
+| Head A | Spanned Header ||
+| Head B | Head C | Head D |
+|:-------|:------:|:------:|
 | 1A     |    1B  |    1C  |
 | 2A    ^|    2B  |    2C  |
 | 3A    ^|    3B       3C ||
@@ -155,7 +147,6 @@ These can be combined to span a cell across both columns and rows. Cells must ha
 | 5A    ^|    5B  |    5C  |
 | 6A     |    6B ^|    6C  |
 
-
 ## Images
 Images must be hosted online somewhere, like [Imgur](https://www.imgur.com). You use the address to that image to reference it in your brew\*. Images can be included using Markdown-style images.
 

client/homebrew/pages/newPage/newPage.jsx

@@ -161,7 +161,7 @@ const NewPage = createClass({
 			brew.text = brew.text.slice(index + 5);
 		};
 
-		brew.pageCount=((brew.renderer=='legacy' ? brew.text.match(/\\page/g) : brew.text.match(/^\\page/gm)) || []).length + 1;
+		brew.pageCount=((brew.renderer=='legacy' ? brew.text.match(/\\page/g) : brew.text.match(/^\\page$/gm)) || []).length + 1;
 
 		if(this.state.saveGoogle) {
 			const res = await request

client/homebrew/pages/printPage/printPage.jsx

@@ -35,22 +35,28 @@ const PrintPage = createClass({
 		if(this.props.query.dialog) window.print();
 	},
 
+	renderStyle : function() {
+		if(!this.props.brew.style) return;
+		return <div style={{ display: 'none' }} dangerouslySetInnerHTML={{ __html: `<style> ${this.props.brew.style} </style>` }} />;
+	},
+
 	renderPages : function(){
 		if(this.props.brew.renderer == 'legacy') {
-			return _.map(this.state.brewText.split('\\page'), (page, index)=>{
+			return _.map(this.state.brewText.split('\\page'), (pageText, index)=>{
 				return <div
 					className='phb page'
 					id={`p${index + 1}`}
-					dangerouslySetInnerHTML={{ __html: MarkdownLegacy.render(page) }}
+					dangerouslySetInnerHTML={{ __html: MarkdownLegacy.render(pageText) }}
 					key={index} />;
 			});
 		} else {
-			return _.map(this.state.brewText.split(/^\\page/gm), (page, index)=>{
-				return <div
-					className='phb3 page'
-					id={`p${index + 1}`}
-					dangerouslySetInnerHTML={{ __html: Markdown.render(page) }}
-					key={index} />;
+			return _.map(this.state.brewText.split(/^\\page$/gm), (pageText, index)=>{
+				pageText += `\n\n&nbsp;\n\\column\n&nbsp;`; //Artificial column break at page end to emulate column-fill:auto (until `wide` is used, when column-fill:balance will reappear)
+				return (
+					<div className='page' id={`p${index + 1}`} key={index} >
+						<div className='columnWrapper' dangerouslySetInnerHTML={{ __html: Markdown.render(pageText) }} />
+					</div>
+				);
 			});
 		}
 
@@ -61,8 +67,10 @@ const PrintPage = createClass({
 			<Meta name='robots' content='noindex, nofollow' />
 			<link href={`${this.props.brew.renderer == 'legacy' ? '/themes/5ePhbLegacy.style.css' : '/themes/5ePhb.style.css'}`} rel='stylesheet'/>
 			{/* Apply CSS from Style tab */}
-			<div style={{ display: 'none' }} dangerouslySetInnerHTML={{ __html: `<style> ${this.props.brew.style} </style>` }} />
-			{this.renderPages()}
+			{this.renderStyle()}
+			<div className='pages' ref='pages'>
+				{this.renderPages()}
+			</div>
 		</div>;
 	}
 });

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

@@ -7,6 +7,7 @@ const moment = require('moment');
 const request = require('superagent');
 
 const googleDriveIcon = require('../../../googleDrive.png');
+const dedent = require('dedent-tabs').default;
 
 const BrewItem = createClass({
 	getDefaultProps : function() {
@@ -110,6 +111,10 @@ const BrewItem = createClass({
 			</div>
 			<hr />
 			<div className='info'>
+				<span title={`Authors:\n${brew.authors.join('\n')}`}>
+					<i className='fas fa-user'/> {brew.authors.join(', ')}
+				</span>
+				<br />
 				<span title={`Last viewed: ${moment(brew.lastViewed).local().format(dateFormatString)}`}>
 					<i className='fas fa-eye'/> {brew.views}
 				</span>
@@ -118,14 +123,12 @@ const BrewItem = createClass({
 						<i className='far fa-file' /> {brew.pageCount}
 					</span>
 				}
-				<span>
+				<span title={dedent`
+					Created: ${moment(brew.createdAt).local().format(dateFormatString)}
+					Last updated: ${moment(brew.updatedAt).local().format(dateFormatString)}`}>
 					<i className='fas fa-sync-alt' /> {moment(brew.updatedAt).fromNow()}
 				</span>
 				{this.renderGoogleDriveIcon()}
-				<br />
-				<span title={`Authors:\n${brew.authors.join('\n')}`}>
-					<i className='fas fa-user'/> {brew.authors.join(', ')}
-				</span>
 			</div>
 
 			<div className='links'>

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

@@ -27,12 +27,11 @@
 	.info{
 		position: initial;
 		bottom: 2px;
-		margin-bottom: 4px;
 		font-family : ScalySans;
 		font-size   : 1.2em;
 		&>span{
-			display      : float;
 			margin-right : 12px;
+			line-height  : 1.5em;
 		}
 	}
 	&:hover{

client/homebrew/pages/userPage/userPage.jsx

@@ -31,8 +31,9 @@ const UserPage = createClass({
 	},
 	getInitialState : function() {
 		return {
-			sortType : 'alpha',
-			sortDir  : 'asc'
+			sortType     : 'alpha',
+			sortDir      : 'asc',
+			filterString : ''
 		};
 	},
 	getUsernameWithS : function() {
@@ -52,7 +53,7 @@ const UserPage = createClass({
 	},
 
 	sortBrewOrder : function(brew){
-		if(!brew.title){brew.title = 'No Title';};
+		if(!brew.title){brew.title = 'No Title';}
 		const mapping = {
 			'alpha'   : _.deburr(brew.title.toLowerCase()),
 			'created' : moment(brew.createdAt).format(),
@@ -91,6 +92,26 @@ const UserPage = createClass({
 		  </td>;
 	},
 
+	handleFilterTextChange : function(e){
+		this.setState({
+			filterString : e.target.value
+		});
+		return;
+	},
+
+	renderFilterOption : function(){
+		return <td>
+			<label>
+				<i className='fas fa-search'></i>
+				<input
+					type='search'
+					placeholder='search title/description'
+					onChange={this.handleFilterTextChange}
+				/>
+			</label>
+		</td>;
+	},
+
 	renderSortOptions : function(){
 		return <div className='sort-container'>
 			<table>
@@ -115,6 +136,7 @@ const UserPage = createClass({
 								{`${(this.state.sortDir == 'asc' ? '\u25B2 ASC' : '\u25BC DESC')}`}
 							</button>
 						</td>
+						{this.renderFilterOption()}
 					</tr>
 				</tbody>
 			</table>
@@ -122,7 +144,12 @@ const UserPage = createClass({
 	},
 
 	getSortedBrews : function(){
-		return _.groupBy(this.props.brews, (brew)=>{
+		const testString = _.deburr(this.state.filterString).toLowerCase();
+		const brewCollection = this.state.filterString ? _.filter(this.props.brews, (brew)=>{
+			return (_.deburr(brew.title).toLowerCase().includes(testString)) ||
+			(_.deburr(brew.description).toLowerCase().includes(testString));
+		}) : this.props.brews;
+		return _.groupBy(brewCollection, (brew)=>{
 			return (brew.published ? 'published' : 'private');
 		});
 	},

client/homebrew/pages/userPage/userPage.less

@@ -34,8 +34,9 @@
 		font-family        : 'Open Sans', sans-serif;
 		position           : fixed;
 		top                : 35px;
+		left               : calc(50vw - 408px);
 		border             : 2px solid #58180D;
-		width              : 675px;
+		width              : 800px;
 		background-color   : #EEE5CE;
 		padding            : 2px;
 		text-align         : center;
@@ -52,6 +53,9 @@
 			vertical-align : middle;
 			tbody tr{
 				background-color: transparent !important;
+				i{
+					padding-right : 5px
+				}
 			button{
 					background-color : transparent;
 					color            : #58180D;