From f751ccacc5561270470a9daa22ea4081ba005242 Mon Sep 17 00:00:00 2001 From: Matteo Pagliazzi Date: Wed, 21 Sep 2016 13:43:39 +0200 Subject: [PATCH] expose new client at /new-app, can be enabled in prod setting a flag --- .gitignore | 1 + webpack/config/index.js | 6 +++--- website/README.md | 2 +- website/client/router.js | 2 +- website/server/controllers/top-level/pages.js | 17 +++++++++++++++++ website/server/middlewares/static.js | 9 ++++++--- website/static/README.md | 3 --- website/static/test.txt | 1 - 8 files changed, 29 insertions(+), 12 deletions(-) delete mode 100644 website/static/README.md delete mode 100644 website/static/test.txt diff --git a/.gitignore b/.gitignore index a2fcecd9fd..6aba9a7ba7 100644 --- a/.gitignore +++ b/.gitignore @@ -33,6 +33,7 @@ coverage coverage.html common/dist/scripts/* dist +dist-client test/client/unit/coverage test/client/e2e/reports test/client-old/spec/mocks/translations.js diff --git a/webpack/config/index.js b/webpack/config/index.js index 7431a8c2b0..6f7123be57 100644 --- a/webpack/config/index.js +++ b/webpack/config/index.js @@ -5,10 +5,10 @@ var staticAssetsDirectory = './website/static/.'; // The folder where static fil module.exports = { build: { env: require('./prod.env'), - index: path.resolve(__dirname, '../../dist/index.html'), - assetsRoot: path.resolve(__dirname, '../../dist'), + index: path.resolve(__dirname, '../../dist-client/index.html'), + assetsRoot: path.resolve(__dirname, '../../dist-client'), assetsSubDirectory: 'static', - assetsPublicPath: '/', + assetsPublicPath: '/new-app', staticAssetsDirectory: staticAssetsDirectory, productionSourceMap: true, // Gzip off by default as many popular static hosts such as diff --git a/website/README.md b/website/README.md index daf1b47aef..6ffcbb4764 100644 --- a/website/README.md +++ b/website/README.md @@ -1,3 +1,3 @@ -`/website/client` contains the source files for the new client side that is being developed as part of the Habitica.com redesign. +`/website/client` contains the source files for the new client side that is being developed as part of the Habitica.com redesign. Static assets for the new client can be found in `website/static`. The old client side files can be found in `/website/client-old`, they are still used on Habitica.com while the redesign is in progress. \ No newline at end of file diff --git a/website/client/router.js b/website/client/router.js index 7ea6b34532..036dd97840 100644 --- a/website/client/router.js +++ b/website/client/router.js @@ -7,7 +7,7 @@ Vue.use(VueRouter); export default new VueRouter({ mode: 'history', - base: __dirname, + base: process.env.NODE_ENV === 'production' ? '/new-app' : __dirname, // eslint-disable-line no-process-env routes: [ { path: '/', component: Home }, { path: '/page', component: Page }, diff --git a/website/server/controllers/top-level/pages.js b/website/server/controllers/top-level/pages.js index 09b44d8419..6fc10226c2 100644 --- a/website/server/controllers/top-level/pages.js +++ b/website/server/controllers/top-level/pages.js @@ -1,11 +1,14 @@ import locals from '../../middlewares/locals'; import _ from 'lodash'; import md from 'habitica-markdown'; +import nconf from 'nconf'; let api = {}; +const IS_PROD = nconf.get('IS_PROD'); const TOTAL_USER_COUNT = '1,500,000'; const LOADING_SCREEN_TIPS = 32; +const IS_NEW_CLIENT_ENABLED = nconf.get('NEW_CLIENT_ENABLED') === 'true'; api.getFrontPage = { method: 'GET', @@ -82,5 +85,19 @@ api.redirectExtensionsPage = { }, }; +// All requests to /new_app (expect /new_app/static) should serve the new client in development +if (IS_PROD && IS_NEW_CLIENT_ENABLED) { + api.getNewClient = { + method: 'GET', + url: /^\/new-app($|\/(?!(static\/.?|static$)))/, + async handler (req, res) { + if (!(req.session && req.session.userId)) { + return res.redirect('/static/front'); + } + + return res.sendFile('./dist-client/index.html', {root: `${__dirname}/../../../../`}); + }, + }; +} module.exports = api; diff --git a/website/server/middlewares/static.js b/website/server/middlewares/static.js index c21bca00c5..5392303485 100644 --- a/website/server/middlewares/static.js +++ b/website/server/middlewares/static.js @@ -3,19 +3,22 @@ import nconf from 'nconf'; import path from 'path'; const IS_PROD = nconf.get('IS_PROD'); +const IS_NEW_CLIENT_ENABLED = nconf.get('NEW_CLIENT_ENABLED') === 'true'; const MAX_AGE = IS_PROD ? 31536000000 : 0; const ASSETS_DIR = path.join(__dirname, '/../../assets'); const PUBLIC_DIR = path.join(__dirname, '/../../client-old'); const BUILD_DIR = path.join(__dirname, '/../../build'); module.exports = function staticMiddleware (expressApp) { + // Expose static files for new client + if (IS_PROD && IS_NEW_CLIENT_ENABLED) { + expressApp.use('/new-app/static', express.static(`${PUBLIC_DIR}/../../dist-client/static`)); + } + // TODO move all static files to a single location (one for public and one for build) expressApp.use(express.static(BUILD_DIR, { maxAge: MAX_AGE })); expressApp.use('/assets/audio', express.static(`${ASSETS_DIR}/audio`, { maxAge: MAX_AGE })); expressApp.use('/assets/sprites', express.static(`${ASSETS_DIR}/sprites/dist`, { maxAge: MAX_AGE })); expressApp.use('/assets/img', express.static(`${PUBLIC_DIR}/../../website/assets/img`, { maxAge: MAX_AGE })); expressApp.use(express.static(PUBLIC_DIR)); - - // Expose new client when not in production - if (!IS_PROD) expressApp.use('/new-app', express.static(`${PUBLIC_DIR}/../client`)); }; diff --git a/website/static/README.md b/website/static/README.md deleted file mode 100644 index 004694566b..0000000000 --- a/website/static/README.md +++ /dev/null @@ -1,3 +0,0 @@ -This folder contains the source files for static assets used in the new client side that is being developed. - -These files are served without passing through any preprocessor. \ No newline at end of file diff --git a/website/static/test.txt b/website/static/test.txt deleted file mode 100644 index c57eff55eb..0000000000 --- a/website/static/test.txt +++ /dev/null @@ -1 +0,0 @@ -Hello World! \ No newline at end of file