1 files changed, 49 insertions, 0 deletions
diff --git a/animism-align/frontend/app/views/viewer/forms/subscription.form.js b/animism-align/frontend/app/views/viewer/forms/subscription.form.js
new file mode 100644
index 0000000..3d863cb
--- /dev/null
+++ b/animism-align/frontend/app/views/viewer/forms/subscription.form.js
@@ -0,0 +1,49 @@
+import React, { Component } from 'react'
+
+import { Arrow } from '../nav/viewer.icons'
+
+export default class SubscriptionForm extends Component {
+  state = {
+    email: "",
+  }
+  constructor(props) {
+    super(props)
+    this.handleChange = this.handleChange.bind(this)
+    this.handleKeyDown = this.handleKeyDown.bind(this)
+    this.handleSubmit = this.handleSubmit.bind(this)
+  }
+  handleChange(e) {
+    this.setState({ email: e.target.value })
+  }
+  handleKeyDown(e) {
+    // disable tab
+    if (e.keyCode === 9) {
+      e.preventDefault()
+    }
+  }
+  handleSubmit(e) {
+    e.preventDefault()
+  }
+  render() {
+    return (
+      <form className="subscription-form" onSubmit={this.handleSubmit}>
+        <div className="subscription-callout">
+          Stay up to date and get notified when the next episode is available
+        </div>
+        <input
+          required
+          type="email"
+          name="email"
+          value={this.state.email}
+          placeholder="Email address here"
+          autoCorrect="off"
+          autoCapitalize="off"
+          spellCheck="false"
+          onKeyDown={this.handleKeyDown}
+          onChange={this.handleChange}
+        />
+        <Arrow type='right' />
+      </form>
+    )
+  }
+}
+\ No newline at end of file