Merge branch 'master' into Combine-Nav-Styling

client/homebrew/brewRenderer/brewRenderer.jsx

@@ -89,22 +89,24 @@ const BrewRenderer = (props)=>{
 		}));
 	};
 
-	const shouldRender = (index)=>{
-		if(!state.isMounted) return false;
+	const isInView = (index)=>{
+		if(!state.isMounted)
+			return false;
+
+		if(index == props.currentEditorPage)	//Already rendered before this step
+			return false;
 
 		if(Math.abs(index - state.viewablePageNumber) <= 3)
 			return true;
 
-		if(index + 1 == props.currentEditorPage)
-			return true;
-
 		return false;
 	};
 
 	const sanitizeScriptTags = (content)=>{
 		return content
-			.replace(/<script/ig, '&lt;script')
-			.replace(/<\/script>/ig, '&lt;/script&gt;');
+			?.replace(/<script/ig, '&lt;script')
+			.replace(/<\/script>/ig, '&lt;/script&gt;')
+			|| '';
 	};
 
 	const renderPageInfo = ()=>{
@@ -138,7 +140,7 @@ const BrewRenderer = (props)=>{
 			return <BrewPage className='page phb' index={index} key={index} contents={html} />;
 		} else {
 			cleanPageText += `\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)
-			const html = Markdown.render(cleanPageText);
+			const html = Markdown.render(cleanPageText, index);
 			return <BrewPage className='page' index={index} key={index} contents={html} />;
 		}
 	};
@@ -150,8 +152,11 @@ const BrewRenderer = (props)=>{
 		if(rawPages.length != renderedPages.length) // Re-render all pages when page count changes
 			renderedPages.length = 0;
 
+		// Render currently-edited page first so cross-page effects (variables, links) can propagate out first
+		renderedPages[props.currentEditorPage] = renderPage(rawPages[props.currentEditorPage], props.currentEditorPage);
+
 		_.forEach(rawPages, (page, index)=>{
-			if((shouldRender(index) || !renderedPages[index]) && typeof window !== 'undefined'){
+			if((isInView(index) || !renderedPages[index]) && typeof window !== 'undefined'){
 				renderedPages[index] = renderPage(page, index); // Render any page not yet rendered, but only re-render those in PPR range
 			}
 		});

client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx

@@ -25,13 +25,10 @@ const NotificationPopup = createClass({
 			return (
 				<>
 					<li key='psa'>
-						<em>Broken default logo on <b>CoverPage</b> </em> <br />
-						If you have used the Cover Page snippet and notice the Naturalcrit
-						logo is showing as a broken image, this is due to some small tweaks
-						of this BETA feature. To fix the logo in your cover page, rename
-						the image link <b>"/assets/naturalCritLogoRed.svg"</b>. Remember
-						that any snippet marked "BETA" may have a similar change in the
-						future as we encounter any bugs or reworks.
+						<em>Don't store IMAGES in Google Drive</em><br />
+						Google Drive is not an image service, and will block images from being used 
+						in brews if they get more views than expected. Google has confirmed they won't fix 
+						this, so we recommend you look for another image hosting service such as imgur, ImgBB or Google Photos.
 					</li>
 
 					<li key='googleDriveFolder'>

client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx

@@ -135,7 +135,11 @@ const BrewItem = createClass({
 				</> : <></>
 				}
 				<span title={`Authors:\n${brew.authors?.join('\n')}`}>
-					<i className='fas fa-user'/> {brew.authors.map((item) => <a href={`/user/${item}`}>{item}</a>)}
+					<i className='fas fa-user'/> {brew.authors?.map((author, index)=>(
+  					<>
+    					<a key={index} href={`/user/${author}`}>{author}</a>
+    					{index < brew.authors.length - 1 && ', '}
+  					</>))}
 				</span>
 				<br />
 				<span title={`Last viewed: ${moment(brew.lastViewed).local().format(dateFormatString)}`}>

client/homebrew/pages/editPage/editPage.jsx

@@ -113,7 +113,7 @@ const EditPage = createClass({
 			brew              : { ...prevState.brew, text: text },
 			isPending         : true,
 			htmlErrors        : htmlErrors,
-			currentEditorPage : this.refs.editor.getCurrentPage()
+			currentEditorPage : this.refs.editor.getCurrentPage() - 1 //Offset index since Marked starts pages at 0
 		}), ()=>{if(this.state.autoSave) this.trySave();});
 	},
 

client/homebrew/pages/homePage/homePage.jsx

@@ -31,9 +31,10 @@ const HomePage = createClass({
 	},
 	getInitialState : function() {
 		return {
-			brew        : this.props.brew,
-			welcomeText : this.props.brew.text,
-			error       : undefined
+			brew              : this.props.brew,
+			welcomeText       : this.props.brew.text,
+			error             : undefined,
+			currentEditorPage : 0
 		};
 	},
 	handleSave : function(){
@@ -53,7 +54,8 @@ const HomePage = createClass({
 	},
 	handleTextChange : function(text){
 		this.setState((prevState)=>({
-			brew : { ...prevState.brew, text: text }
+			brew              : { ...prevState.brew, text: text },
+			currentEditorPage : this.refs.editor.getCurrentPage() - 1 //Offset index since Marked starts pages at 0
 		}));
 	},
 	renderNavbar : function(){
@@ -85,7 +87,12 @@ const HomePage = createClass({
 						renderer={this.state.brew.renderer}
 						showEditButtons={false}
 					/>
-					<BrewRenderer text={this.state.brew.text} style={this.state.brew.style} renderer={this.state.brew.renderer}/>
+					<BrewRenderer
+						text={this.state.brew.text}
+						style={this.state.brew.style}
+						renderer={this.state.brew.renderer}
+						currentEditorPage={this.state.currentEditorPage}
+					/>
 				</SplitPane>
 			</div>
 

client/homebrew/pages/newPage/newPage.jsx

@@ -38,11 +38,12 @@ const NewPage = createClass({
 		const brew = this.props.brew;
 
 		return {
-			brew       : brew,
-			isSaving   : false,
-			saveGoogle : (global.account && global.account.googleId ? true : false),
-			error      : null,
-			htmlErrors : Markdown.validate(brew.text)
+			brew              : brew,
+			isSaving          : false,
+			saveGoogle        : (global.account && global.account.googleId ? true : false),
+			error             : null,
+			htmlErrors        : Markdown.validate(brew.text),
+			currentEditorPage : 0
 		};
 	},
 
@@ -104,8 +105,9 @@ const NewPage = createClass({
 		if(htmlErrors.length) htmlErrors = Markdown.validate(text);
 
 		this.setState((prevState)=>({
-			brew       : { ...prevState.brew, text: text },
-			htmlErrors : htmlErrors
+			brew              : { ...prevState.brew, text: text },
+			htmlErrors        : htmlErrors,
+			currentEditorPage : this.refs.editor.getCurrentPage() - 1 //Offset index since Marked starts pages at 0
 		}));
 		localStorage.setItem(BREWKEY, text);
 	},
@@ -220,7 +222,15 @@ const NewPage = createClass({
 						onMetaChange={this.handleMetaChange}
 						renderer={this.state.brew.renderer}
 					/>
-					<BrewRenderer text={this.state.brew.text} style={this.state.brew.style} renderer={this.state.brew.renderer} theme={this.state.brew.theme} lang={this.state.brew.lang} errors={this.state.htmlErrors}/>
+					<BrewRenderer
+						text={this.state.brew.text}
+						style={this.state.brew.style}
+						renderer={this.state.brew.renderer}
+						theme={this.state.brew.theme}
+						errors={this.state.htmlErrors}
+						lang={this.state.brew.lang}
+						currentEditorPage={this.state.currentEditorPage}
+					/>
 				</SplitPane>
 			</div>
 		</div>;

client/homebrew/pages/printPage/printPage.jsx

@@ -21,7 +21,8 @@ const PrintPage = createClass({
 			brew  : {
 				text     : '',
 				style    : '',
-				renderer : 'legacy'
+				renderer : 'legacy',
+				lang     : ''
 			}
 		};
 	},
@@ -32,7 +33,8 @@ const PrintPage = createClass({
 				text     : this.props.brew.text     || '',
 				style    : this.props.brew.style    || undefined,
 				renderer : this.props.brew.renderer || 'legacy',
-				theme    : this.props.brew.theme    || '5ePHB'
+				theme    : this.props.brew.theme    || '5ePHB',
+				lang	 : this.props.brew.lang     || 'en'
 			}
 		};
 	},
@@ -49,7 +51,8 @@ const PrintPage = createClass({
 						text     : brewStorage,
 						style    : styleStorage,
 						renderer : metaStorage?.renderer || 'legacy',
-						theme    : metaStorage?.theme    || '5ePHB'
+						theme    : metaStorage?.theme    || '5ePHB',
+						lang	 : metaStorage?.lang	 || 'en'
 					}
 				};
 			});
@@ -100,7 +103,7 @@ const PrintPage = createClass({
 			<link href={`/themes/${rendererPath}/${themePath}/style.css`} rel='stylesheet'/>
 			{/* Apply CSS from Style tab */}
 			{this.renderStyle()}
-			<div className='pages' ref='pages'>
+			<div className='pages' ref='pages' lang={this.state.brew.lang}>
 				{this.renderPages()}
 			</div>
 		</div>;