add pdf-js viewer

webapp/views/pages/Home.js

@@ -1,11 +1,63 @@
-import { h } from 'preact';
+import { Component, h } from 'preact';
+import PDF from 'react-pdf';
 
-export default function (props) {
-    return (
-        <div>
-            <h1>Home</h1>
-            <p>This is the home page.</p>
-            <p>Anything is insane</p>
-        </div>
-    );
+import Input from '../components/Input';
+import Button from '../components/Button';
+import Preview from '../components/Preview';
+
+function arrayBufferToBase64(arrayBuffer) {
+    return btoa(String.fromCharCode(...new Uint8Array(arrayBuffer)));
 }
+
+class Home extends Component {
+    render(props) {
+        return (
+            <div>
+                <Input
+                    name="subject"
+                    text="Betreff"
+                    onChange={this._onChange.bind(this)}
+                    value={props.subject}
+                />
+                <Button onClick={this._onGenerate.bind(this)} text="Generiere"/>
+                <Preview pdf={this.state.pdf} />
+            </div>
+        );
+    }
+
+    _onChange(name, event) {
+        if (!name) {
+            return;
+        }
+        const value = event && event.target && event.target.value;
+        this.setState({[name]: value || null})
+    }
+
+    _onGenerate(name, event){
+        var component = this;
+
+        fetch('http://localhost:5000/generate/pdf/brief', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(this.state)
+        }).then(function(res) {
+            if (res.status !== 200) {
+                console.log('request failed');
+                return;
+            }
+            return res.arrayBuffer();
+        }).then(function(arrayBuffer) {
+            component.setState({
+                pdf: arrayBufferToBase64(arrayBuffer)
+            });
+        }).catch(function(error) {
+            component.setState({
+                pdf: null
+            })
+        });
+    }
+}
+
+export default Home;