From e5ccfa3a50a6f0a92316b3574f963db7a32b5e0d Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Mon, 8 Feb 2021 13:58:24 -0500 Subject: [PATCH] Fix /page not working in legacy mode. (#1233) * Fix brew styles overwriting each other. * Word wrapping, start fixing spacing on Title letter * Fix \page in legacy brews when not at line start --- client/homebrew/brewRenderer/brewRenderer.jsx | 34 ++++++++++++------- client/homebrew/editor/editor.jsx | 16 ++++++--- client/homebrew/phbStyle/phb.style.less | 24 +++++++++---- shared/naturalcrit/codeEditor/codeEditor.jsx | 6 ++-- 4 files changed, 53 insertions(+), 27 deletions(-) diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx index ab389ab2f..5b337301a 100644 --- a/client/homebrew/brewRenderer/brewRenderer.jsx +++ b/client/homebrew/brewRenderer/brewRenderer.jsx @@ -20,15 +20,17 @@ const BrewRenderer = createClass({ getDefaultProps : function() { return { text : '', - renderer : '', + renderer : 'legacy', errors : [] }; }, getInitialState : function() { - const pages = this.props.text.split(/^\\page/gm); - let renderer = 'legacy'; - if(this.props.renderer) - renderer = this.props.renderer; + let pages; + if(this.props.renderer == 'legacy') { + pages = this.props.text.split('\\page'); + } else { + pages = this.props.text.split(/^\\page/gm); + } return { viewablePageNumber : 0, @@ -38,7 +40,6 @@ const BrewRenderer = createClass({ pages : pages, usePPR : pages.length >= PPR_THRESHOLD, visibility : 'hidden', - renderer : renderer, initialContent : ` @@ -54,12 +55,19 @@ const BrewRenderer = createClass({ window.removeEventListener('resize', this.updateSize); }, - componentWillReceiveProps : function(nextProps) { - const pages = nextProps.text.split(/^\\page/gm); - this.setState({ - pages : pages, - usePPR : pages.length >= PPR_THRESHOLD - }); + componentDidUpdate : function(prevProps) { + if(prevProps.text !== this.props.text) { + let pages; + if(this.props.renderer == 'legacy') { + pages = this.props.text.split('\\page'); + } else { + pages = this.props.text.split(/^\\page/gm); + } + this.setState({ + pages : pages, + usePPR : pages.length >= PPR_THRESHOLD + }); + } }, updateSize : function() { @@ -114,7 +122,7 @@ const BrewRenderer = createClass({ }, renderPage : function(pageText, index){ - if(this.state.renderer == 'legacy') + if(this.props.renderer == 'legacy') return
; else return
; diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index 811608315..dd93b8aaa 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -24,7 +24,7 @@ const Editor = createClass({ metadata : {}, onMetadataChange : ()=>{}, showMetaButton : true, - renderer : '' + renderer : 'legacy' }; }, getInitialState : function() { @@ -93,13 +93,21 @@ const Editor = createClass({ codeMirror.removeLineClass(lineNumber, 'background'); codeMirror.removeLineClass(lineNumber, 'text'); - if(line.startsWith('\\page')){ - codeMirror.addLineClass(lineNumber, 'background', 'pageLine'); - r.push(lineNumber); + // Legacy Codemirror styling + if(this.props.renderer == 'legacy') { + if(line.includes('\\page')){ + codeMirror.addLineClass(lineNumber, 'background', 'pageLine'); + r.push(lineNumber); + } } // New Codemirror styling for V3 renderer if(this.props.renderer == 'V3') { + if(line.startsWith('\\page')){ + codeMirror.addLineClass(lineNumber, 'background', 'pageLine'); + r.push(lineNumber); + } + if(line.startsWith('\\column')){ codeMirror.addLineClass(lineNumber, 'text', 'columnSplit'); r.push(lineNumber); diff --git a/client/homebrew/phbStyle/phb.style.less b/client/homebrew/phbStyle/phb.style.less index e2761c8cd..e4eed24e5 100644 --- a/client/homebrew/phbStyle/phb.style.less +++ b/client/homebrew/phbStyle/phb.style.less @@ -1,6 +1,6 @@ @import (less) './client/homebrew/phbStyle/phb.fonts.css'; @import (less) './client/homebrew/phbStyle/phb.assets.less'; -@import (less) './client/homebrew/phbStyle/phb.depricated.less'; + //Colors @background : #EEE5CE; @noteGreen : #e0e5c1; @@ -17,12 +17,11 @@ body { } .useSansSerif(){ font-family : ScalySans; + font-size : 10pt; em{ - font-family : ScalySans; font-style : italic; } strong{ - font-family : ScalySans; font-weight : 800; letter-spacing : -0.02em; } @@ -48,8 +47,7 @@ body { overflow : hidden; height : 279.4mm; width : 215.9mm; - padding : 1.0cm 1.7cm; - padding-bottom : 1.5cm; + padding : 1.0cm 1.7cm, 1.5cm; background-color : @background; background-image : @backgroundImage; font-family : BookSanity; @@ -61,6 +59,7 @@ body { // * BASE // *****************************/ p{ + overflow-wrap : break-word; padding-bottom : 0.8em; line-height : 1.3em; &+p{ @@ -123,9 +122,20 @@ body { &+p::first-letter{ float : left; font-family : Solberry; - font-size : 10em; - color : #222; line-height : 0.8em; + font-size: 3.1cm; + padding-top: 4px; + padding-bottom: 4px; + margin-top: -6px; + margin-left: -6px; + background-image: linear-gradient(-45deg, #322814, #998250, #322814); + background-clip: text; + -webkit-background-clip: text; + color: rgba(0, 0, 0, 0); + } + &+p::first-line{ + font-size : .385cm; + font-variant : small-caps; } } h2{ diff --git a/shared/naturalcrit/codeEditor/codeEditor.jsx b/shared/naturalcrit/codeEditor/codeEditor.jsx index e8d9cb69f..e5e570116 100644 --- a/shared/naturalcrit/codeEditor/codeEditor.jsx +++ b/shared/naturalcrit/codeEditor/codeEditor.jsx @@ -61,9 +61,9 @@ const CodeEditor = createClass({ } }, - componentWillReceiveProps : function(nextProps){ - if(this.codeMirror && nextProps.value !== undefined && this.codeMirror.getValue() != nextProps.value) { - this.codeMirror.setValue(nextProps.value); + componentDidUpdate : function(prevProps) { + if(this.codeMirror && this.props.value !== undefined && this.codeMirror.getValue() != this.props.value) { + this.codeMirror.setValue(this.props.value); } },