diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx index 1aa816df2..0609d5b8b 100644 --- a/client/homebrew/pages/homePage/homePage.jsx +++ b/client/homebrew/pages/homePage/homePage.jsx @@ -34,12 +34,28 @@ const HomePage = createClass({ brew : this.props.brew, welcomeText : this.props.brew.text, error : undefined, - currentEditorPage : 0 + currentEditorPage : 0, + themeBundle : {} }; }, editor : React.createRef(null), + componentDidMount : function() { + this.fetchThemeBundle(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)=>``).join('\n\n'); //DOMPurify.sanitize(joinedStyles, purifyConfig); + this.setState((prevState)=>({ // MOVE TO MOUNT STEP OF SHARE / NEW / EDIT + ...prevState, + themeBundle : themeBundle + })); + }); + }, + handleSave : function(){ request.post('/api') .send(this.state.brew) @@ -95,6 +111,7 @@ const HomePage = createClass({ style={this.state.brew.style} renderer={this.state.brew.renderer} currentEditorPage={this.state.currentEditorPage} + themeBundle={this.state.themeBundle} /> diff --git a/server/app.js b/server/app.js index 5d3e74925..0de404c1e 100644 --- a/server/app.js +++ b/server/app.js @@ -84,7 +84,8 @@ app.get('/theme/:renderer/:id', asyncHandler(getThemeBundle)); app.get('/', (req, res, next)=>{ req.brew = { text : welcomeText, - renderer : 'V3' + renderer : 'V3', + theme : '5ePHB' }, req.ogMeta = { ...defaultMetaTags,