0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-04 21:12:41 +00:00

Legacy renderer (#1184)

* Include two versions of Marked.js

* Include two versions of Marked.js

* Working two different render pipelines

Adds stylesheet "styleLegacy.less"
Adds markdownHandler "markdownLegacy.js"
The BrewRenderer will switch between these and the new pipeline dependent on the "version" prop passed in.

* Mustache-style div blocks

* Legacy snippets & columnbreak

* Codemirror styling for Div Blocks

* Lint

* Codemirror highlights for inline Divs as well

These will turn red `{{class Content}}`

Multi-line divs will turn purple

```
{{class,class2
content
}}
```

No real need for these to be different colors. Just for testing.

* More lint

* Update dependencies.

* Adding Button to switch render pipelines

* Update Marked.js

* Popup alert to refresh page when renderer changed

* Don't compress files in Development (very slow)

* Block DIV or inline Span depending on {{ placement

* \column emits a Div instead of Span

* Allow share page to use new renderer

* {{ divs no longer need empty lines. Spans work in lists.

* Typo

* Typo

* Enforce \page must be at start of line. Code cleanup.

* Inject newlines after/before {{/}} to avoid needing blank lines

* Fixes issues with tables.

* Remove console.log

* Fix spacing issue for Spans

* Move things from Brewrenderer to Markdown

Try to keep all custom text fiddling in one spot.

* Rename variables

* Update Font-Awesome to v5.15. Fix style issues on popups.

* Update {{ Divs/Spans, Fix nested hilighting

* Fixed Spans/divs with no tags or just commas

* Use blacklist for {{ to allow more characters

* Update package-lock.json

* Update all icons to Font-awesome 5

* V3 hidden behind config variable

Add "globalThis.enable_v3 = true" in the console to enable.

* lint
This commit is contained in:
Trevor Buckner
2021-02-02 20:38:25 -05:00
committed by GitHub
parent 6a2e39355c
commit e2cd7d9f07
50 changed files with 2127 additions and 154 deletions

View File

@@ -41,17 +41,18 @@ const EditPage = createClass({
tags : '',
published : false,
authors : [],
systems : []
systems : [],
renderer : ''
}
};
},
getInitialState : function() {
return {
brew : this.props.brew,
brew : this.props.brew,
isSaving : false,
isPending : false,
alertRenderChange : false,
saveGoogle : this.props.brew.googleId ? true : false,
confirmGoogleTransfer : false,
errors : null,
@@ -66,6 +67,8 @@ const EditPage = createClass({
url : window.location.href
});
this.savedBrew = JSON.parse(JSON.stringify(this.props.brew)); //Deep copy
this.trySave();
window.onbeforeunload = ()=>{
if(this.state.isSaving || this.state.isPending){
@@ -101,6 +104,12 @@ const EditPage = createClass({
},
handleMetadataChange : function(metadata){
if(metadata.renderer != this.savedBrew.renderer){
console.log('renderer changed!');
this.setState({
alertRenderChange : true
});
}
this.setState((prevState)=>({
brew : _.merge({}, prevState.brew, metadata),
isPending : true,
@@ -122,8 +131,7 @@ const EditPage = createClass({
},
hasChanges : function(){
const savedBrew = this.savedBrew ? this.savedBrew : this.props.brew;
return !_.isEqual(this.state.brew, savedBrew);
return !_.isEqual(this.state.brew, this.savedBrew);
},
trySave : function(){
@@ -142,6 +150,12 @@ const EditPage = createClass({
this.clearErrors();
},
closeAlerts : function(){
this.setState({
alertRenderChange : false
});
},
toggleGoogleStorage : function(){
this.setState((prevState)=>({
saveGoogle : !prevState.saveGoogle,
@@ -294,7 +308,7 @@ const EditPage = createClass({
} catch (e){}
if(this.state.errors.status == '401'){
return <Nav.item className='save error' icon='fa-warning'>
return <Nav.item className='save error' icon='fas fa-exclamation-triangle'>
Oops!
<div className='errorContainer' onClick={this.clearErrors}>
You must be signed in to a Google account
@@ -312,7 +326,7 @@ const EditPage = createClass({
</Nav.item>;
}
return <Nav.item className='save error' icon='fa-warning'>
return <Nav.item className='save error' icon='fas fa-exclamation-triangle'>
Oops!
<div className='errorContainer'>
Looks like there was a problem saving. <br />
@@ -325,13 +339,22 @@ const EditPage = createClass({
}
if(this.state.isSaving){
return <Nav.item className='save' icon='fa-spinner fa-spin'>saving...</Nav.item>;
return <Nav.item className='save' icon='fas fa-spinner fa-spin'>saving...</Nav.item>;
}
if(this.state.isPending && this.hasChanges()){
return <Nav.item className='save' onClick={this.save} color='blue' icon='fa-save'>Save Now</Nav.item>;
return <Nav.item className='save' onClick={this.save} color='blue' icon='fas fa-save'>Save Now</Nav.item>;
}
if(!this.state.isPending && !this.state.isSaving){
return <Nav.item className='save saved'>saved.</Nav.item>;
return <Nav.item className='save saved'>saved.
{this.state.alertRenderChange &&
<div className='errorContainer' onClick={this.closeAlerts}>
Rendering mode for this brew has been changed! Refresh the page to load the new renderer.<br />
<div className='confirm'>
OK
</div>
</div>
}
</Nav.item>;
}
},
@@ -351,7 +374,7 @@ const EditPage = createClass({
{this.renderGoogleDriveIcon()}
{this.renderSaveButton()}
<ReportIssue />
<Nav.item newTab={true} href={`/share/${this.processShareId()}`} color='teal' icon='fa-share-alt'>
<Nav.item newTab={true} href={`/share/${this.processShareId()}`} color='teal' icon='fas fa-share-alt'>
Share
</Nav.item>
<PrintLink shareId={this.processShareId()} />
@@ -374,8 +397,9 @@ const EditPage = createClass({
onChange={this.handleTextChange}
metadata={this.state.brew}
onMetadataChange={this.handleMetadataChange}
renderer={this.state.brew.renderer}
/>
<BrewRenderer text={this.state.brew.text} errors={this.state.htmlErrors} />
<BrewRenderer text={this.state.brew.text} errors={this.state.htmlErrors} renderer={this.state.brew.renderer} />
</SplitPane>
</div>
</div>;