diff options
| -rw-r--r-- | frontend/site/projects/museum/app.js | 27 | ||||
| -rw-r--r-- | frontend/site/projects/museum/views/home.css | 55 | ||||
| -rw-r--r-- | frontend/site/projects/museum/views/home.js | 32 | ||||
| -rw-r--r-- | webpack.config.site.dev.js | 81 |
4 files changed, 195 insertions, 0 deletions
diff --git a/frontend/site/projects/museum/app.js b/frontend/site/projects/museum/app.js new file mode 100644 index 0000000..caa8c3c --- /dev/null +++ b/frontend/site/projects/museum/app.js @@ -0,0 +1,27 @@ +import React, { Component } from 'react' +import { ConnectedRouter } from 'connected-react-router' +import { Route } from 'react-router' + +import ViewerContainer from 'site/viewer/viewer.container' +import Home from './views/home' +import actions from 'site/actions' + +export default class App extends Component { + componentDidMount() { + const path_partz = window.location.pathname.split('/') + const graph_name = path_partz[1] + actions.site.loadSite(graph_name) + } + + render() { + return ( + <ConnectedRouter history={this.props.history}> + <div className='app'> + <Route path={'/last-museum/:page_name'} component={ViewerContainer} exact /> + <Route path={'/last-museum/'} component={ViewerContainer} exact /> + <Route path={'/last-museum/'} component={Home} exact /> + </div> + </ConnectedRouter> + ) + } +} diff --git a/frontend/site/projects/museum/views/home.css b/frontend/site/projects/museum/views/home.css new file mode 100644 index 0000000..aab5d0c --- /dev/null +++ b/frontend/site/projects/museum/views/home.css @@ -0,0 +1,55 @@ +.roadblock { + /*display: none !important;*/ +} + + +.home { +} + +.home-byline { + font-family: "Druk Wide"; + color: #FF790D; + text-shadow: 0px 0px 5px #FF790D; + opacity: 1; + transition: opacity 0.5s; +} +.home-title { + font-family: "Druk"; + font-weight: 900; + font-style: italic; + color: #FF790D; + text-shadow: 0px 0px 10px #FF790D; +} +.home-artists { + font-family: "Druk Wide"; + color: #FF790D; + text-shadow: 0px 0px 5px #FF790D; + opacity: 1; + transition: opacity 0.5s; +} + +.home-title.title-1 { +} +.home-title.title-2 { +} +.home.open .home-title.title-1 { +} +.home.open .home-title.title-2 { +} + +.home.open .home-artists { + opacity: 0; + transition: opacity 0.5s; +} +.artists-left { +} +.artists-right { +} + +.byline-top { +} +.byline-bottom { +} +.home.open .home-byline { + opacity: 0; +} diff --git a/frontend/site/projects/museum/views/home.js b/frontend/site/projects/museum/views/home.js new file mode 100644 index 0000000..cfd0d40 --- /dev/null +++ b/frontend/site/projects/museum/views/home.js @@ -0,0 +1,32 @@ +import React, { Component } from 'react' + +// import actions from 'site/actions' + +import "./home.css" + +export default class Home extends Component { + state = { + open: false, + } + + render() { + return ( + <div className={this.state.open ? "home open" : "home"}> + <div className="home-byline byline-top">KW PRESENTS</div> + <div className="home-title title-1">THE LAST</div> + <div className="home-title title-2">MUSEUM</div> + <div className="home-artists artists-left"> + NICOLE FORESHEW<br /> + JULIANA CERQUEIRA LEITE<br /> + NORA AL-BADRI + </div> + <div className="home-artists artists-right"> + CHARLES STANKIEVECH<br /> + JAKRAWAL NILTHAMRONG<br /> + ZOHRA OPOKO + </div> + <div className="home-byline byline-bottom">CURATED BY NADIM SAMMAN</div> + </div> + ) + } +} diff --git a/webpack.config.site.dev.js b/webpack.config.site.dev.js new file mode 100644 index 0000000..a3e06fd --- /dev/null +++ b/webpack.config.site.dev.js @@ -0,0 +1,81 @@ +require("dotenv").config(); + +const webpack = require("webpack"); +const path = require("path"); +// const TerserPlugin = require("terser-webpack-plugin"); + +module.exports = function (env) { + console.log("Building live site (development)"); + console.log(env); + const appTarget = (env && env.APP_TARGET) || "app"; + return { + mode: "production", + entry: { + main: "./frontend/site/index.js", + }, + output: { + path: path.resolve(__dirname, "static/js/dist"), + filename: "bundle.js", + }, + plugins: [ + new webpack.NormalModuleReplacementPlugin( + /(.*)APP_TARGET(\.*)/, + function (resource) { + resource.request = resource.request.replace( + /APP_TARGET/, + `${appTarget}` + ); + } + ), + new webpack.DefinePlugin({ + "process.env.NODE_ENV": JSON.stringify("production"), + // 'process.env.S3_HOST': JSON.stringify(process.env.S3_HOST || ""), + // 'process.env.API_HOST': JSON.stringify(process.env.API_HOST || ""), + __REACT_DEVTOOLS_GLOBAL_HOOK__: "({ isDisabled: true })", + }), + // new TerserPlugin(), + // new webpack.optimize.AggressiveMergingPlugin(), + // new Visualizer({ + // filename: './statistics.html' + // }) + ], + // optimization: { + // minimize: true, + // minimizer: [ + // new TerserPlugin({ + // terserOptions: { + // compress: { + // // drop_console: true, + // }, + // }, + // }), + // ], + // }, + resolve: { + alias: { + // "react": "preact/compat", + // "react-dom/test-utils": "preact/test-utils", + // "react-dom": "preact/compat", + }, + }, + devtool: "cheap-module-source-map", + module: { + rules: [ + { + test: /\.css$/, + use: ["style-loader", "css-loader"], + }, + { + test: /\.js$/, + // include: path.resolve(__dirname, 'client'), + exclude: /(node_modules|bower_components|build)/, + loader: "babel-loader", + options: { + presets: ["@babel/preset-react"], + plugins: ["@babel/plugin-transform-runtime"], + }, + }, + ], + }, + }; +}; |