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

Move fetchThemeBundle into /shared/helpers

This might not be the best rework - I was unsure if the *this* that would be available when called would see the appropriate object so I assumed not and pass it as a parameter.
Works, but may be bad form.
This commit is contained in:
David Bolack
2024-07-23 22:17:52 -05:00
parent 8e7baca47d
commit d2afa7adea
5 changed files with 22 additions and 54 deletions

View File

@@ -25,7 +25,7 @@ const LockNotification = require('./lockNotification/lockNotification.jsx');
const Markdown = require('naturalcrit/markdown.js'); const Markdown = require('naturalcrit/markdown.js');
const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js'); const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js');
const { printCurrentBrew } = require('../../../../shared/helpers.js'); const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpers.js');
const googleDriveIcon = require('../../googleDrive.svg'); const googleDriveIcon = require('../../googleDrive.svg');
@@ -88,7 +88,7 @@ const EditPage = createClass({
htmlErrors : Markdown.validate(prevState.brew.text) htmlErrors : Markdown.validate(prevState.brew.text)
})); }));
this.fetchThemeBundle(this.props.brew.renderer, this.props.brew.theme); fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
document.addEventListener('keydown', this.handleControlKeys); document.addEventListener('keydown', this.handleControlKeys);
}, },
@@ -135,7 +135,7 @@ const EditPage = createClass({
handleMetaChange : function(metadata, field=undefined){ handleMetaChange : function(metadata, field=undefined){
if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed
this.fetchThemeBundle(metadata.renderer, metadata.theme); fetchThemeBundle(this, metadata.renderer, metadata.theme);
this.setState((prevState)=>({ this.setState((prevState)=>({
brew : { brew : {
@@ -150,17 +150,6 @@ const EditPage = createClass({
return !_.isEqual(this.state.brew, this.savedBrew); return !_.isEqual(this.state.brew, this.savedBrew);
}, },
// Loads the theme bundle and parses it out. Called when the iFrame is first mounted, and when a new theme is selected
fetchThemeBundle : function(renderer, theme) {
fetch(`${window.location.protocol}//${window.location.host}/theme/${renderer}/${theme}`).then((response)=>response.json()).then((themeBundle)=>{
themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig);
this.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT
...prevState,
themeBundle : themeBundle
}));
});
},
trySave : function(immediate=false){ trySave : function(immediate=false){
if(!this.debounceSave) this.debounceSave = _.debounce(this.save, SAVE_TIMEOUT); if(!this.debounceSave) this.debounceSave = _.debounce(this.save, SAVE_TIMEOUT);
if(this.hasChanges()){ if(this.hasChanges()){

View File

@@ -13,6 +13,7 @@ const HelpNavItem = require('../../navbar/help.navitem.jsx');
const RecentNavItem = require('../../navbar/recent.navitem.jsx').both; const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
const AccountNavItem = require('../../navbar/account.navitem.jsx'); const AccountNavItem = require('../../navbar/account.navitem.jsx');
const ErrorNavItem = require('../../navbar/error-navitem.jsx'); const ErrorNavItem = require('../../navbar/error-navitem.jsx');
const { fetchThemeBundle } = require('../../../../shared/helpers.js');
const SplitPane = require('naturalcrit/splitPane/splitPane.jsx'); const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
@@ -42,18 +43,7 @@ const HomePage = createClass({
editor : React.createRef(null), editor : React.createRef(null),
componentDidMount : function() { componentDidMount : function() {
this.fetchThemeBundle(this.props.brew.renderer, this.props.brew.theme); fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
},
// Loads the theme bundle and parses it out. Called when the iFrame is first mounted, and when a new theme is selected
fetchThemeBundle : function(renderer, theme) {
fetch(`${window.location.protocol}//${window.location.host}/theme/${renderer}/${theme}`).then((response)=>response.json()).then((themeBundle)=>{
themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig);
this.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT
...prevState,
themeBundle : themeBundle
}));
});
}, },
handleSave : function(){ handleSave : function(){

View File

@@ -19,7 +19,7 @@ const Editor = require('../../editor/editor.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx'); const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js'); const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js');
const { printCurrentBrew } = require('../../../../shared/helpers.js'); const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpers.js');
const BREWKEY = 'homebrewery-new'; const BREWKEY = 'homebrewery-new';
const STYLEKEY = 'homebrewery-new-style'; const STYLEKEY = 'homebrewery-new-style';
@@ -78,7 +78,7 @@ const NewPage = createClass({
saveGoogle : (saveStorage == 'GOOGLE-DRIVE' && this.state.saveGoogle) saveGoogle : (saveStorage == 'GOOGLE-DRIVE' && this.state.saveGoogle)
}); });
this.fetchThemeBundle(this.props.brew.renderer, this.props.brew.theme); fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
localStorage.setItem(BREWKEY, brew.text); localStorage.setItem(BREWKEY, brew.text);
if(brew.style) if(brew.style)
@@ -89,17 +89,6 @@ const NewPage = createClass({
document.removeEventListener('keydown', this.handleControlKeys); document.removeEventListener('keydown', this.handleControlKeys);
}, },
// Loads the theme bundle and parses it out. Called when the iFrame is first mounted, and when a new theme is selected
fetchThemeBundle : function(renderer, theme) {
fetch(`${window.location.protocol}//${window.location.host}/theme/${renderer}/${theme}`).then((response)=>response.json()).then((themeBundle)=>{
themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig);
this.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT
...prevState,
themeBundle : themeBundle
}));
});
},
handleControlKeys : function(e){ handleControlKeys : function(e){
if(!(e.ctrlKey || e.metaKey)) return; if(!(e.ctrlKey || e.metaKey)) return;
const S_KEY = 83; const S_KEY = 83;
@@ -138,7 +127,7 @@ const NewPage = createClass({
handleMetaChange : function(metadata, field=undefined){ handleMetaChange : function(metadata, field=undefined){
if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed
this.fetchThemeBundle(metadata.renderer, metadata.theme); fetchThemeBundle(this, metadata.renderer, metadata.theme);
this.setState((prevState)=>({ this.setState((prevState)=>({
brew : { ...prevState.brew, ...metadata }, brew : { ...prevState.brew, ...metadata },

View File

@@ -12,7 +12,7 @@ const Account = require('../../navbar/account.navitem.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx'); const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js'); const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js');
const { printCurrentBrew } = require('../../../../shared/helpers.js'); const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpers.js');
const SharePage = createClass({ const SharePage = createClass({
displayName : 'SharePage', displayName : 'SharePage',
@@ -31,24 +31,13 @@ const SharePage = createClass({
componentDidMount : function() { componentDidMount : function() {
document.addEventListener('keydown', this.handleControlKeys); document.addEventListener('keydown', this.handleControlKeys);
this.fetchThemeBundle(this.props.brew.renderer, this.props.brew.theme); fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
}, },
componentWillUnmount : function() { componentWillUnmount : function() {
document.removeEventListener('keydown', this.handleControlKeys); document.removeEventListener('keydown', this.handleControlKeys);
}, },
// Loads the theme bundle and parses it out. Called when the iFrame is first mounted, and when a new theme is selected
fetchThemeBundle : function(renderer, theme) {
fetch(`${window.location.protocol}//${window.location.host}/theme/${renderer}/${theme}`).then((response)=>response.json()).then((themeBundle)=>{
themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig);
this.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT
...prevState,
themeBundle : themeBundle
}));
});
},
handleControlKeys : function(e){ handleControlKeys : function(e){
if(!(e.ctrlKey || e.metaKey)) return; if(!(e.ctrlKey || e.metaKey)) return;
const P_KEY = 80; const P_KEY = 80;

View File

@@ -33,7 +33,18 @@ const printCurrentBrew = ()=>{
} }
}; };
const fetchThemeBundle = (obj, renderer, theme)=>{
fetch(`${window.location.protocol}//${window.location.host}/theme/${renderer}/${theme}`).then((response)=>response.json()).then((themeBundle)=>{
themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig);
obj.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT
...prevState,
themeBundle : themeBundle
}));
});
};
module.exports = { module.exports = {
splitTextStyleAndMetadata, splitTextStyleAndMetadata,
printCurrentBrew printCurrentBrew,
fetchThemeBundle,
}; };