diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx index ad767ad9f..77aac16e6 100644 --- a/client/homebrew/brewRenderer/brewRenderer.jsx +++ b/client/homebrew/brewRenderer/brewRenderer.jsx @@ -199,7 +199,7 @@ const BrewRenderer = createClass({ - + {/* Apply CSS from Style tab and render pages from Markdown tab */} {this.state.isMounted && diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx index a294bbb26..67547c01e 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.jsx +++ b/client/homebrew/editor/snippetbar/snippetbar.jsx @@ -4,9 +4,11 @@ const createClass = require('create-react-class'); const _ = require('lodash'); const cx = require('classnames'); +//Import all themes -const SnippetsLegacy = require('./snippetsLegacy/snippets.js'); -const SnippetsV3 = require('./snippets/snippets.js'); +const Themes = {}; +Themes['Legacy_5ePHB'] = require('themes/Legacy/5ePHB/snippets.js'); +Themes['V3_5ePHB'] = require('themes/V3/5ePHB/snippets.js'); const execute = function(val, brew){ if(_.isFunction(val)) return val(brew); @@ -31,10 +33,33 @@ const Snippetbar = createClass({ getInitialState : function() { return { - renderer : this.props.renderer + renderer : this.props.renderer, + snippets : [] }; }, + componentDidMount : async function() { + const rendererPath = this.props.renderer == 'V3' ? 'V3' : "Legacy"; + const themePath = this.props.theme ?? '5ePHB'; + console.log(Themes); + console.log(Themes[`${rendererPath}_${themePath}`]); + const snippets = Themes[`${rendererPath}_${themePath}`]; + this.setState({ + snippets : snippets + }); + }, + + componentDidUpdate : async function(prevProps) { + if(prevProps.renderer != this.props.renderer) { + const rendererPath = this.props.renderer == 'V3' ? 'V3' : "Legacy"; + const themePath = this.props.theme ?? '5ePHB'; + const snippets = Themes[`${rendererPath}_${themePath}`]; + this.setState({ + snippets : snippets + }); + } + }, + handleSnippetClick : function(injectedText){ this.props.onInject(injectedText); }, @@ -42,10 +67,7 @@ const Snippetbar = createClass({ renderSnippetGroups : function(){ let snippets = []; - if(this.props.renderer === 'V3') - snippets = SnippetsV3.filter((snippetGroup)=>snippetGroup.view === this.props.view); - else - snippets = SnippetsLegacy.filter((snippetGroup)=>snippetGroup.view === this.props.view); + snippets = this.state.snippets.filter((snippetGroup)=>snippetGroup.view === this.props.view); return _.map(snippets, (snippetGroup)=>{ return (await babel.transformAsync(code, { presets: ['@babel/preset-env', '@babel/preset-react'], plugins: ['@babel/plugin-transform-runtime'] })).code; +const babelify = async (code)=>(await babel.transformAsync(code, { presets: [["@babel/preset-env", { "exclude": ["proposal-dynamic-import"] }], '@babel/preset-react'], plugins: ['@babel/plugin-transform-runtime'] })).code; const transforms = { '.js' : (code, filename, opts)=>babelify(code), @@ -25,18 +25,18 @@ const build = async ({ bundle, render, ssr })=>{ await fs.outputFile('./build/homebrew/bundle.js', bundle); await fs.outputFile('./build/homebrew/ssr.js', ssr); await fs.copy('./themes/fonts', './build/fonts'); - let src = './themes/5ePhbLegacy.style.less'; + let src = './themes/Legacy/5ePHB/style.less'; //Parse brew theme files less.render(fs.readFileSync(src).toString(), { compress : !isDev }, function(e, output) { - fs.outputFile('./build/themes/5ePhbLegacy.style.css', output.css); + fs.outputFile('./build/themes/Legacy/5ePHB/style.css', output.css); }); - src = './themes/5ePhb.style.less'; + src = './themes/V3/5ePHB/style.less'; less.render(fs.readFileSync(src).toString(), { compress : !isDev }, function(e, output) { - fs.outputFile('./build/themes/5ePhb.style.css', output.css); + fs.outputFile('./build/themes/V3/5ePHB/style.css', output.css); }); // await less.render(lessCode, { // compress : !dev, @@ -59,16 +59,43 @@ const build = async ({ bundle, render, ssr })=>{ }; fs.emptyDirSync('./build'); -pack('./client/homebrew/homebrew.jsx', { - paths : ['./shared'], - libs : Proj.libs, - dev : isDev && build, - transforms -}) - .then(build) - .catch(console.error); +(async () => { + let bundles = await pack('./client/homebrew/homebrew.jsx', { + paths : ['./shared','./'], + libs : Proj.libs, + dev : isDev && build, + transforms + }); + build(bundles); + + // Possible method for generating separate bundles for snippets: factor-bundle first sending all common files to bundle.js, then again using default settings, keeping only snippet bundles + // await fs.outputFile('./build/junk.js', ''); + // await fs.outputFile('./build/themes/Legacy/5ePHB/snippets.js', ''); + // + // const files = ['./client/homebrew/homebrew.jsx','./themes/Legacy/5ePHB/snippets.js']; + // + // bundles = await pack(files, { + // dedupe: false, + // plugin : [['factor-bundle', { outputs: [ './build/junk.js','./build/themes/Legacy/5ePHB/snippets.js'], threshold : function(row, groups) { + // console.log(groups); + // if (groups.some(group => /.*homebrew.jsx$/.test(group))) { + // console.log("found homebrewery") + // return true; + // } + // return this._defaultThreshold(row, groups); + // }}]], + // paths : ['./shared','./','./build'], + // libs : Proj.libs, + // dev : isDev && build, + // transforms + // }); + // build(bundles); + // + +})().catch(console.error); + //In development set up a watch server and livereload if(isDev){ livereload('./build'); diff --git a/server.js b/server.js index 4c4cb6f63..26d94fdd7 100644 --- a/server.js +++ b/server.js @@ -52,7 +52,7 @@ const splitTextStyleAndMetadata = (brew)=>{ const index = brew.text.indexOf('```\n\n'); const metadataSection = brew.text.slice(12, index - 1); const metadata = yaml.load(metadataSection); - Object.assign(brew, _.pick(metadata, ['title', 'description', 'tags', 'systems', 'renderer'])); + Object.assign(brew, _.pick(metadata, ['title', 'description', 'tags', 'systems', 'renderer', 'theme'])); brew.text = brew.text.slice(index + 5); } if(brew.text.startsWith('```css')) { @@ -60,6 +60,7 @@ const splitTextStyleAndMetadata = (brew)=>{ brew.style = brew.text.slice(7, index - 1); brew.text = brew.text.slice(index + 5); } + _.defaults(brew, {'renderer' : 'legacy', 'theme' : '5ePHB'}); }; app.use('/', serveCompressedStaticAssets(`${__dirname}/build`)); diff --git a/server/homebrew.api.js b/server/homebrew.api.js index e0da74dca..94e295d30 100644 --- a/server/homebrew.api.js +++ b/server/homebrew.api.js @@ -20,7 +20,7 @@ const mergeBrewText = (brew)=>{ `\`\`\`\n\n` + `${text}`; } - const metadata = _.pick(brew, ['title', 'description', 'tags', 'systems', 'renderer']); + const metadata = _.pick(brew, ['title', 'description', 'tags', 'systems', 'renderer', 'theme']); text = `\`\`\`metadata\n` + `${yaml.dump(metadata)}\n` + `\`\`\`\n\n` + diff --git a/themes/fonts/5e legacy/fonts.less b/themes/fonts/5e legacy/fonts.less index a3527130b..d4c10c456 100644 --- a/themes/fonts/5e legacy/fonts.less +++ b/themes/fonts/5e legacy/fonts.less @@ -1,25 +1,25 @@ /* Main Font, serif */ @font-face { font-family: BookSanity; - src: url('../fonts/5e legacy/Bookinsanity.woff2'); + src: url('../../../fonts/5e legacy/Bookinsanity.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: BookSanity; - src: url('../fonts/5e legacy/Bookinsanity Bold.woff2'); + src: url('../../../fonts/5e legacy/Bookinsanity Bold.woff2'); font-weight: bold; font-style: normal; } @font-face { font-family: BookSanity; - src: url('../fonts/5e legacy/Bookinsanity Italic.woff2'); + src: url('../../../fonts/5e legacy/Bookinsanity Italic.woff2'); font-weight: normal; font-style: italic; } @font-face { font-family: BookSanity; - src: url('../fonts/5e legacy/Bookinsanity Bold Italic.woff2'); + src: url('../../../fonts/5e legacy/Bookinsanity Bold Italic.woff2'); font-weight: bold; font-style: italic; } @@ -27,19 +27,19 @@ /* Notes and Tables, sans-serif */ @font-face { font-family: ScalySans; - src: url('../fonts/5e legacy/Scaly Sans.woff2'); + src: url('../../../fonts/5e legacy/Scaly Sans.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: ScalySansSmallCaps; - src: url('../fonts/5e legacy/Scaly Sans Caps.woff2'); + src: url('../../../fonts/5e legacy/Scaly Sans Caps.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: WalterTurncoat; - src: url('../fonts/5e legacy/WalterTurncoat-Regular.woff2'); + src: url('../../../fonts/5e legacy/WalterTurncoat-Regular.woff2'); font-weight: normal; font-style: normal; } @@ -47,7 +47,7 @@ /* Headers */ @font-face { font-family: MrJeeves; - src: url('../fonts/5e legacy/Mr Eaves Small Caps.woff2'); + src: url('../../../fonts/5e legacy/Mr Eaves Small Caps.woff2'); font-weight: normal; font-style: normal; } @@ -55,7 +55,7 @@ /* Fancy Drop Cap */ @font-face { font-family: Solberry; - src: url('../fonts/5e legacy/Solbera Imitation.woff2'); + src: url('../../../fonts/5e legacy/Solbera Imitation.woff2'); font-weight: normal; font-style: normal; } diff --git a/themes/fonts/5e/fonts.less b/themes/fonts/5e/fonts.less index df4f169d2..0235596a1 100644 --- a/themes/fonts/5e/fonts.less +++ b/themes/fonts/5e/fonts.less @@ -1,25 +1,25 @@ /* Main Font, serif */ @font-face { font-family: BookInsanityRemake; - src: url('../fonts/5e/Bookinsanity.woff2'); + src: url('../../../fonts/5e/Bookinsanity.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: BookInsanityRemake; - src: url('../fonts/5e/Bookinsanity Bold.woff2'); + src: url('../../../fonts/5e/Bookinsanity Bold.woff2'); font-weight: bold; font-style: normal; } @font-face { font-family: BookInsanityRemake; - src: url('../fonts/5e/Bookinsanity Italic.woff2'); + src: url('../../../fonts/5e/Bookinsanity Italic.woff2'); font-weight: normal; font-style: italic; } @font-face { font-family: BookInsanityRemake; - src: url('../fonts/5e/Bookinsanity Bold Italic.woff2'); + src: url('../../../fonts/5e/Bookinsanity Bold Italic.woff2'); font-weight: bold; font-style: italic; } @@ -27,37 +27,37 @@ /* Notes and Tables, sans-serif */ @font-face { font-family: ScalySansRemake; - src: url('../fonts/5e/Scaly Sans.woff2'); + src: url('../../../fonts/5e/Scaly Sans.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: ScalySansRemake; - src: url('../fonts/5e/Scaly Sans Bold.woff2'); + src: url('../../../fonts/5e/Scaly Sans Bold.woff2'); font-weight: bold; font-style: normal; } @font-face { font-family: ScalySansRemake; - src: url('../fonts/5e/Scaly Sans Italic.woff2'); + src: url('../../../fonts/5e/Scaly Sans Italic.woff2'); font-weight: normal; font-style: italic; } @font-face { font-family: ScalySansRemake; - src: url('../fonts/5e/Scaly Sans Bold Italic.woff2'); + src: url('../../../fonts/5e/Scaly Sans Bold Italic.woff2'); font-weight: bold; font-style: italic; } @font-face { font-family: ScalySansSmallCapsRemake; - src: url('../fonts/5e/Scaly Sans Caps.woff2'); + src: url('../../../fonts/5e/Scaly Sans Caps.woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: WalterTurncoat; - src: url('../fonts/5e/WalterTurncoat-Regular.woff2'); + src: url('../../../fonts/5e/WalterTurncoat-Regular.woff2'); font-weight: normal; font-style: normal; } @@ -65,7 +65,7 @@ /* Headers */ @font-face { font-family: MrEavesRemake; - src: url('../fonts/5e/Mr Eaves Small Caps.woff2'); + src: url('../../../fonts/5e/Mr Eaves Small Caps.woff2'); font-weight: normal; font-style: normal; } @@ -73,7 +73,7 @@ /* Fancy Drop Cap */ @font-face { font-family: SolberaImitationRemake; //Tweaked 5e version - src: url('../fonts/5e/Solbera Imitation Tweak.woff2'); + src: url('../../../fonts/5e/Solbera Imitation Tweak.woff2'); font-weight: normal; font-style: normal; }