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:
@@ -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>;
|
||||
|
||||
Reference in New Issue
Block a user