Move "printPage()" to helpers.js for reuse in multiple pages

client/homebrew/brewRenderer/brewRenderer.jsx

@@ -13,6 +13,7 @@ const RenderWarnings = require('homebrewery/renderWarnings/renderWarnings.jsx');
 const NotificationPopup = require('./notificationPopup/notificationPopup.jsx');
 const Frame = require('react-frame-component').default;
 const dedent = require('dedent-tabs').default;
+const { printPage } = require('../../../shared/helpers.js');
 
 const DOMPurify = require('dompurify');
 const purifyConfig = { FORCE_BODY: true, SANITIZE_DOM: false };
@@ -169,17 +170,6 @@ const BrewRenderer = (props)=>{
 		}
 	};
 
-	const printPage = ()=>{
-		if (window.typeof !== 'undefined') {
-			window.frames['BrewRenderer'].contentWindow.print();
-			//Force DOM reflow; Print dialog causes a repaint, and @media print CSS somehow makes out-of-view pages disappear
-			let node = window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer').item(0);
-			node.style.display='none';
-			node.offsetHeight; // accessing this is enough to trigger a reflow
-			node.style.display='';
-		}
-	};
-
 	const frameDidMount = ()=>{	//This triggers when iFrame finishes internal "componentDidMount"
 		setTimeout(()=>{	//We still see a flicker where the style isn't applied yet, so wait 100ms before showing iFrame
 			updateSize();

client/homebrew/navbar/print.navitem.jsx

@@ -1,8 +1,9 @@
 const React = require('react');
 const Nav = require('naturalcrit/nav/nav.jsx');
+const { printPage } = require('../../../shared/helpers.js');
 
-module.exports = function({printFunction}){
-	return <Nav.item onClick={printFunction} color='purple' icon='far fa-file-pdf'>
+module.exports = function(){
+	return <Nav.item onClick={printPage} color='purple' icon='far fa-file-pdf'>
 		get PDF
 	</Nav.item>;
 };

client/homebrew/pages/editPage/editPage.jsx

@@ -23,6 +23,7 @@ const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 const Markdown = require('naturalcrit/markdown.js');
 
 const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js');
+const { printPage } = require('../../../../shared/helpers.js');
 
 const googleDriveIcon = require('../../googleDrive.svg');
 
@@ -95,24 +96,13 @@ const EditPage = createClass({
 		const S_KEY = 83;
 		const P_KEY = 80;
 		if(e.keyCode == S_KEY) this.trySave(true);
-		if(e.keyCode == P_KEY) this.printPage();
+		if(e.keyCode == P_KEY) printPage();
 		if(e.keyCode == P_KEY || e.keyCode == S_KEY){
 			e.stopPropagation();
 			e.preventDefault();
 		}
 	},
 
-	printPage : function(){
-		if (window.typeof !== 'undefined') {
-			window.frames['BrewRenderer'].contentWindow.print();
-			//Force DOM reflow; Print dialog causes a repaint, and @media print CSS somehow makes out-of-view pages disappear
-			let node = window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer').item(0);
-			node.style.display='none';
-			node.offsetHeight; // accessing this is enough to trigger a reflow
-			node.style.display='';
-		}
-	},
-
 	handleSplitMove : function(){
 		this.editor.current.update();
 	},
@@ -389,7 +379,7 @@ const EditPage = createClass({
 						post to reddit
 					</Nav.item>
 				</Nav.dropdown>
-				<PrintNavItem printFunction={this.printPage}/>
+				<PrintNavItem />
 				<RecentNavItem brew={this.state.brew} storageKey='edit' />
 				<Account />
 			</Nav.section>

client/homebrew/pages/newPage/newPage.jsx

@@ -19,6 +19,7 @@ const Editor = require('../../editor/editor.jsx');
 const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
 const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js');
+const { printPage } = require('../../../../shared/helpers.js');
 
 const BREWKEY  = 'homebrewery-new';
 const STYLEKEY = 'homebrewery-new-style';
@@ -90,24 +91,13 @@ const NewPage = createClass({
 		const S_KEY = 83;
 		const P_KEY = 80;
 		if(e.keyCode == S_KEY) this.save();
-		if(e.keyCode == P_KEY) this.printPage();
+		if(e.keyCode == P_KEY) printPage();
 		if(e.keyCode == P_KEY || e.keyCode == S_KEY){
 			e.stopPropagation();
 			e.preventDefault();
 		}
 	},
 
-	printPage : function(){
-		if (window.typeof !== 'undefined') {
-			window.frames['BrewRenderer'].contentWindow.print();
-			//Force DOM reflow; Print dialog causes a repaint, and @media print CSS somehow makes out-of-view pages disappear
-			let node = window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer').item(0);
-			node.style.display='none';
-			node.offsetHeight; // accessing this is enough to trigger a reflow
-			node.style.display='';
-		}
-	},
-
 	handleSplitMove : function(){
 		this.editor.current.update();
 	},
@@ -204,7 +194,7 @@ const NewPage = createClass({
 					<ErrorNavItem error={this.state.error} parent={this}></ErrorNavItem> :
 					this.renderSaveButton()
 				}
-				<PrintNavItem printFunction={this.printPage}/>
+				<PrintNavItem />
 				<HelpNavItem />
 				<RecentNavItem />
 				<AccountNavItem />

client/homebrew/pages/sharePage/sharePage.jsx

@@ -9,11 +9,10 @@ const MetadataNav = require('../../navbar/metadata.navitem.jsx');
 const PrintNavItem = require('../../navbar/print.navitem.jsx');
 const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
 const Account = require('../../navbar/account.navitem.jsx');
-
-
 const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
 const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js');
+const { printPage } = require('../../../../shared/helpers.js');
 
 const SharePage = createClass({
 	displayName     : 'SharePage',
@@ -35,23 +34,12 @@ const SharePage = createClass({
 		if(!(e.ctrlKey || e.metaKey)) return;
 		const P_KEY = 80;
 		if(e.keyCode == P_KEY){
-			if(e.keyCode == P_KEY) this.printPage();
+			if(e.keyCode == P_KEY) printPage();
 			e.stopPropagation();
 			e.preventDefault();
 		}
 	},
 
-	printPage : function(){
-		if (window.typeof !== 'undefined') {
-			window.frames['BrewRenderer'].contentWindow.print();
-			//Force DOM reflow; Print dialog causes a repaint, and @media print CSS somehow makes out-of-view pages disappear
-			let node = window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer').item(0);
-			node.style.display='none';
-			node.offsetHeight; // accessing this is enough to trigger a reflow
-			node.style.display='';
-		}
-	},
-
 	processShareId : function() {
 		return this.props.brew.googleId && !this.props.brew.stubbed ?
 					 this.props.brew.googleId + this.props.brew.shareId :
@@ -83,7 +71,7 @@ const SharePage = createClass({
 
 				<Nav.section>
 					{this.props.brew.shareId && <>
-						<PrintNavItem printFunction={this.printPage}/>
+						<PrintNavItem/>
 						<Nav.dropdown>
 							<Nav.item color='red' icon='fas fa-code'>
 								source

shared/helpers.js

@@ -17,6 +17,18 @@ const splitTextStyleAndMetadata = (brew)=>{
 	}
 };
 
-module.exports = {
-	splitTextStyleAndMetadata
+const printPage = ()=>{
+	if (window.typeof !== 'undefined') {
+		window.frames['BrewRenderer'].contentWindow.print();
+		//Force DOM reflow; Print dialog causes a repaint, and @media print CSS somehow makes out-of-view pages disappear
+		let node = window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer').item(0);
+		node.style.display='none';
+		node.offsetHeight; // accessing this is enough to trigger a reflow
+		node.style.display='';
+	}
+};
+
+module.exports = {
+	splitTextStyleAndMetadata,
+	printPage
 };