From 6f7f35317fb8a5668c82d26c3f7f3e16908dc3b8 Mon Sep 17 00:00:00 2001
From: crusader <crusader@loafle.com>
Date: Mon, 18 Dec 2017 20:00:59 +0900
Subject: [PATCH] ing

---
 package.json                             |   2 +-
 src/ts/@overflow/webapp/index.tsx        | 135 +++++++++++++++++++++++
 src/ts/@overflow/webapp/pages/webapp.tsx |  22 ++++
 3 files changed, 158 insertions(+), 1 deletion(-)
 create mode 100644 src/ts/@overflow/webapp/pages/webapp.tsx

diff --git a/package.json b/package.json
index b690852..e477efc 100644
--- a/package.json
+++ b/package.json
@@ -85,7 +85,7 @@
     "react-redux": "^5.0.6",
     "react-router": "^4.2.0",
     "react-router-dom": "^4.2.2",
-    "react-router-redux": "^4.0.8",
+    "react-router-redux": "next",
     "react-tap-event-plugin": "^3.0.2",
     "recharts": "^1.0.0-beta.6",
     "redux": "^3.7.2",
diff --git a/src/ts/@overflow/webapp/index.tsx b/src/ts/@overflow/webapp/index.tsx
index 2558030..8d6c25e 100644
--- a/src/ts/@overflow/webapp/index.tsx
+++ b/src/ts/@overflow/webapp/index.tsx
@@ -1,4 +1,139 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+
+import {
+  applyMiddleware,
+  compose,
+  createStore,
+  GenericStoreEnhancer,
+  Middleware,
+  Store,
+} from 'redux';
+
+import {
+  Provider,
+} from 'react-redux';
+
+import {
+  ConnectedRouter,
+  routerMiddleware,
+} from 'react-router-redux';
+
+import {
+  AppContainer,
+} from 'react-hot-loader';
+
+declare let module: { hot: any };
+
+declare global {
+  interface Window {
+    devToolsExtension: () => any;
+  }
+}
 
 class WebAppApplication {
+  private static isProduction:boolean = process.env.NODE_ENV === 'production' ? true : false;
+  private static useReduxDevTools:boolean = window.devToolsExtension && !WebAppApplication.isProduction ? true : false;
 
+  private container: HTMLElement;
+  private store: Store<any>;
+  private history: History;
+
+  public constructor() {
+    this.container = document.getElementById('appContainer');
+  }
+
+  public async run(): Promise<void> {
+    try {
+      this.renderLoading();
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
+  private renderLoading(): void {
+    ReactDOM.render(
+        <div style={{
+          width: '100vw',
+          height: '100vh',
+          backgroundColor: 'white',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          }}>
+            <h1>Loading...</h1>
+        </div>,
+        this.container,
+    );
+  }
+
+  private renderError(e: Error): void {
+    ReactDOM.render(
+        <div style={{
+          width: '100vw',
+          height: '100vh',
+          backgroundColor: 'white',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          }}>
+            <h1>{e.message}</h1>
+        </div>,
+        this.container,
+    );
+  }
+
+  private renderApp(): void {
+    WebAppApplication.isProduction ? this.renderProduction() : this.rederDevelopment();
+  }
+  private renderProduction(): void {
+    ReactDOM.render(
+      <Provider store={this.store}>
+        <ConnectedRouter history={this.history}>
+
+        </ConnectedRouter>
+      </Provider>,
+      this.container,
+    );
+  }
+
+  private rederDevelopment(): void {
+    if (module.hot) {
+      module.hot.accept('./pages/webapp', async () => {
+        const NextApp = (await import('./pages/webapp')).default;
+        ReactDOM.render(
+          <AppContainer>
+            <Provider store={this.store}>
+              <ConnectedRouter history={this.history}>
+                <NextApp />
+              </ConnectedRouter>
+            </Provider>
+          </AppContainer>
+          ,
+          this.container,
+        );
+      });
+    }
+
+    ReactDOM.render(
+      <AppContainer>
+        <Provider store={this.store}>
+          <ConnectedRouter history={this.history}>
+
+          </ConnectedRouter>
+        </Provider>
+      </AppContainer>
+      ,
+      this.container,
+    );
+  }
+
+
+
+  public static main(): void {
+    let webapp = new WebAppApplication();
+    webapp.run();
+  }
 }
+
+WebAppApplication.main();
diff --git a/src/ts/@overflow/webapp/pages/webapp.tsx b/src/ts/@overflow/webapp/pages/webapp.tsx
new file mode 100644
index 0000000..9913361
--- /dev/null
+++ b/src/ts/@overflow/webapp/pages/webapp.tsx
@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { Route, Switch } from 'react-router-dom';
+
+export interface Props {
+}
+export interface State {
+}
+
+class WebApp extends React.Component<Props, State> {
+
+  constructor(props: Props, context: State) {
+    super(props, context);
+  }
+
+  public render(): JSX.Element {
+    return (
+      <b>Hello</b>
+    );
+  }
+}
+
+export default WebApp;