Merge pull request #206 from thisandagain/bugfix/199

Bind server environment to `window`

README.md

@@ -35,10 +35,10 @@ npm stop
 
 | Variable      | Default                               | Description                                    |
 | ------------- | ------------------------------------- | ---------------------------------------------- |
-| `API_HOST`    | `https://api-staging.scratch.mit.edu` | Hostname for API requests                      |
+| `API_HOST`    | `https://api.scratch.mit.edu`         | Hostname for API requests                      |
 | `NODE_ENV`    | `null`                                | If not `production`, app acts like development |
 | `PORT`        | `8333`                                | Port for devserver (http://localhost:XXXX)     |
-| `PROXY_HOST`  | `https://staging.scratch.mit.edu`     | Pass-through location for scratchr2            |
+| `PROXY_HOST`  | `https://scratch.mit.edu`             | Pass-through location for scratchr2            |
 
 ### To Test
 ```bash

server/config.js

@@ -1,4 +1,7 @@
 module.exports = {
+    // Bind environment
+    api_host: process.env.API_HOST || 'https://api.scratch.mit.edu',
+
     // Search and metadata
     title: 'Imagine, Program, Share',
     description:

server/index.js

@@ -67,7 +67,7 @@ if (typeof process.env.SENTRY_DSN === 'string') {
 
 // Bind proxies in development
 if (process.env.NODE_ENV !== 'production') {
-    var proxyHost = process.env.PROXY_HOST || 'https://staging.scratch.mit.edu';
+    var proxyHost = process.env.PROXY_HOST || 'https://scratch.mit.edu';
 
     app.use('/', proxy(proxyHost, {
         filter: function (req) {

server/template.html

@@ -28,10 +28,15 @@
         <link rel="shortcut icon" href="/favicon.ico" />
         <link rel="stylesheet" href="/css/lib/normalize.min.css" />
 
-        <!-- Polyfill -->
+        <!-- Environment -->
-        <script src="/js/lib/polyfill.min.js"></script>
+        <script>
+            window.env = {
+                API_HOST: "{{&api_host}}"
+            };
+        </script>
 
-        <!-- Initialize (Session & Localization) -->
+        <!-- Polyfill & Initialize (Session & Localization)-->
+        <script src="/js/lib/polyfill.min.js"></script>
         <script src="/js/init.bundle.js"></script>
     </head>
 

src/environment.js

@@ -1,6 +0,0 @@
-var Environment = {
-    NODE_ENV: JSON.stringify(process.env.NODE_ENV || 'development'),
-    API_HOST: JSON.stringify(process.env.API_HOST || 'https://api-staging.scratch.mit.edu')
-};
-
-module.exports = Environment;

src/lib/render.jsx

@@ -15,11 +15,9 @@ var render = function (jsx, element) {
         element
     );
 
-    // If in production, provide list of rendered components
+    // Provide list of rendered components
-    if (process.env.NODE_ENV != 'production') {
+    window._renderedComponents = window._renderedComponents || [];
-        window._renderedComponents = window._renderedComponents || [];
+    window._renderedComponents.push(component);
-        window._renderedComponents.push(component);
-    }
 };
 
 module.exports = render;

src/mixins/api.jsx

@@ -13,7 +13,7 @@ var Api = {
     ],
     api: function (opts, callback) {
         defaults(opts, {
-            host: process.env.API_HOST,
+            host: window.env.API_HOST,
             headers: {},
             json: {},
             useCsrf: false

webpack.config.js

@@ -1,7 +1,6 @@
 var path = require('path');
 var webpack = require('webpack');
 
-var environment = require('./src/environment.js');
 var routes = require('./server/routes.json');
 
 // Prepare all entry points
@@ -53,9 +52,6 @@ module.exports = {
         fs: 'empty'
     },
     plugins: [
-        new webpack.DefinePlugin({
-            'process.env': environment
-        }),
         new webpack.optimize.UglifyJsPlugin({
             compress: {
                 warnings: false