Admin panel

There is now an admin panel that can be reached at the `/#/admin` route.
The panel shows a list of episodes that Shortcut knows about, as well as
their state as enabled or disabled (disabled by default). This state is
stored in `server/adminData.json` on the server.

This closes #81, because we no longer need a specific user-defined GUID
to say "episode 3098281ABD23 is enabled" -- now we use the `guid` tag
defined in the rss spec.

client/src/components/Admin.js

@@ -0,0 +1,99 @@
+import React from 'react';
+import { Paper } from 'material-ui';
+import Switch from 'material-ui/Switch';
+import { FormControlLabel, FormGroup } from 'material-ui/Form';
+
+const parentSiteName = require('config').default.parentSiteName;
+const logo = require('../images/logo.png');
+const jQuery = require('jquery');
+
+require('styles/Admin.scss');
+
+class AdminComponent extends React.PureComponent {
+  constructor(props) {
+    super(props);
+    this.state = {
+      eps: props.eps,
+      switches: []
+    };
+    this.apiEndpoint = props.apiEndpoint;
+  }
+
+  componentDidMount() {
+    jQuery.ajax({
+      url: `${this.apiEndpoint}/admin/getEpisodes`,
+      xhrFields: { withCredentials: true },
+      success: function(data) {
+        let tempSwitches = this.state.eps.map(episode => {
+          let foundElement = data.find(el => el.value === episode.guid);
+          episode.checked = foundElement ? foundElement.enabled : false;
+          episode.value = episode.guid;
+          return episode;
+        });
+        this.setState({
+          switches: tempSwitches
+        });
+      }.bind(this)
+    });
+  }
+
+  renderSwitches() {
+    return this.state.switches
+      .map((el, index) =>
+          <FormControlLabel
+            control={
+              <Switch
+                checked={el.checked}
+                value={el.value}
+                onChange={this.handleClick.bind(this,index)}
+              />
+            }
+            key={el.value}
+            label={el.value}
+          />
+      );
+  }
+
+  handleClick(index) {
+    let switches = this.state.switches;
+    switches[index].checked = !switches[index].checked;
+    this.setState({
+      switches,
+      foo: 'bazzz'
+    }, () => {
+      jQuery.ajax({
+        type: 'POST',
+        url: `${this.apiEndpoint}/admin/setEpisode`,
+        xhrFields: { withCredentials: true },
+        data: {
+          guid: switches[index].guid,
+          enabled: switches[index].checked
+        }
+      });
+      this.forceUpdate()
+    });
+  }
+
+  render() {
+    return(
+    <div>
+      <Paper>
+        <div className="hero-space">
+          <div className="hero-content">
+            <img src={logo} className="logo" alt={parentSiteName}/>
+            <h2 className="tagline">Admin Panel</h2>
+          </div>
+        </div>
+        <div className="content episodes">
+          <h3 className="recent-episodes">Enable/Disable Episodes</h3>
+            <FormGroup>
+            {this.renderSwitches.call(this)}
+            </FormGroup>
+        </div>
+      </Paper>
+    </div>
+    );
+  }
+}
+
+export default AdminComponent;

client/src/components/Main.js

@@ -42,6 +42,7 @@ import NavBar from 'components/NavBarComponent';
 import Loader from 'components/LoadingAnimationComponent';
 import ShareContainer from 'components/ShareContainerComponent';
 import Landing from 'components/Landing';
+import Admin from 'components/Admin';
 import Helpers from '../helpers';
 
 /** The root React component */
@@ -126,7 +127,7 @@ class AppComponent extends React.Component {
           });
           window.console.error(this.props.url, status, err.toString());
         }.bind(this)
-      })
+      });
     }
 
     this.state.episodesWithProblems = window.__inactiveEpisodes || require('config').default.episodesWithProblems;
@@ -835,6 +836,13 @@ class AppComponent extends React.Component {
     let content;
 
     switch(this.state.view) {
+      case 'admin':
+        content =
+          <Admin
+            eps={this.state.eps}
+            apiEndpoint={apiEndpoint_default}
+          />;
+        break;
       case 'about':
         content =
           <div className="content">

server/.gitignore

@@ -40,3 +40,4 @@ node_modules
 _notes
 
 public/
+adminData.json