0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-11 09:02:44 +00:00

Always render currently-edited page first, so variables update across pages properly

This commit is contained in:
Trevor Buckner
2024-02-20 22:56:37 -05:00
parent 6870fd6d76
commit 7bb1f16946
4 changed files with 40 additions and 21 deletions

View File

@@ -89,15 +89,16 @@ const BrewRenderer = (props)=>{
})); }));
}; };
const shouldRender = (index)=>{ const isInView = (index)=>{
if(!state.isMounted) return false; if(!state.isMounted)
return false;
if(index == props.currentEditorPage) //Already rendered before this step
return false;
if(Math.abs(index - state.viewablePageNumber) <= 3) if(Math.abs(index - state.viewablePageNumber) <= 3)
return true; return true;
if(index + 1 == props.currentEditorPage)
return true;
return false; return false;
}; };
@@ -150,10 +151,11 @@ const BrewRenderer = (props)=>{
if(rawPages.length != renderedPages.length) // Re-render all pages when page count changes if(rawPages.length != renderedPages.length) // Re-render all pages when page count changes
renderedPages.length = 0; renderedPages.length = 0;
//TODO ALWAYS RENDER CURRENT EDITOR PAGE FIRST SO CHANGES CAN POPOGATE OUT. MOVE OUT OF "SHOULDRENDER" // 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)=>{ _.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 renderedPages[index] = renderPage(page, index); // Render any page not yet rendered, but only re-render those in PPR range
} }
}); });

View File

@@ -113,7 +113,7 @@ const EditPage = createClass({
brew : { ...prevState.brew, text: text }, brew : { ...prevState.brew, text: text },
isPending : true, isPending : true,
htmlErrors : htmlErrors, 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();}); }), ()=>{if(this.state.autoSave) this.trySave();});
}, },

View File

@@ -31,9 +31,10 @@ const HomePage = createClass({
}, },
getInitialState : function() { getInitialState : function() {
return { return {
brew : this.props.brew, brew : this.props.brew,
welcomeText : this.props.brew.text, welcomeText : this.props.brew.text,
error : undefined error : undefined,
currentEditorPage : 0
}; };
}, },
handleSave : function(){ handleSave : function(){
@@ -53,7 +54,8 @@ const HomePage = createClass({
}, },
handleTextChange : function(text){ handleTextChange : function(text){
this.setState((prevState)=>({ 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(){ renderNavbar : function(){
@@ -85,7 +87,12 @@ const HomePage = createClass({
renderer={this.state.brew.renderer} renderer={this.state.brew.renderer}
showEditButtons={false} 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> </SplitPane>
</div> </div>

View File

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