react-native-web port of fmf app

1 files changed, 164 insertions, 0 deletions

diff --git a/client/src/lib/app/index.js b/client/src/lib/app/index.js
new file mode 100644
index 0000000..dc4d9ac
--- /dev/null
+++ b/client/src/lib/app/index.js
@@ -0,0 +1,164 @@
+import React, { Component } from 'react'
+import {
+  AppRegistry,
+  Dimensions,
+  Image,
+  StyleSheet,
+  StatusBar,
+  Text,
+  View
+} from 'react-native'
+import { Route, Link, Redirect, withRouter } from 'react-router-dom'
+
+const window = Dimensions.get('window')
+
+import db from '../db'
+
+import Home from '../views/home'
+import Nav from '../views/nav'
+import Timeline from '../timeline'
+import Drone from '../drone'
+import Livestream from '../views/livestream'
+import Information from '../views/information'
+import Contact from '../views/contact'
+import Credits from '../views/credits'
+import Privacy from '../views/privacy'
+import WebViewModal from '../components/webViewModal'
+import Footer from '../components/footer'
+import Header from '../components/header'
+
+let touchTimeout;
+
+class App extends Component {
+  constructor() {
+    super()
+    this.state = {
+      view: 'home',
+      db: db.backup(),
+      visitedTimeline: false,
+      url: '',
+    }
+
+    // reset to home screen after some period of inactivity
+    this.visitedTimeline = false
+    
+    this.onLinkPress = this.onLinkPress.bind(this)
+    this.onCloseWebViewModal = this.onCloseWebViewModal.bind(this)
+  }
+  onLinkPress(url) {
+    if (url.indexOf('/') === 0) {
+      this.props.history.push(url)
+    }
+    else {
+      global.open(url)
+    }
+  }
+  onCloseWebViewModal() {
+    this.setState({ url: '' })
+  }
+  render() {
+    return (
+      <View style={styles.container}>
+        <Route path='/' render={(props) => {
+          return ( <Header location={props.location} /> )
+        }}/>
+        <View style={styles.inner}>
+          <Route exact path='/' render={(props) => (
+            <Home />
+          )}/>
+          <Route path='/timeline' render={(props) => {
+            if (! this.visitedTimeline) {
+              setTimeout(() => {
+                this.visitedTimeline = true
+              }, 600)
+            }
+            else if (this.timelineView) {
+              setImmediate( () => this.timelineView.onFilter('') )
+            }
+            return (
+              <Timeline
+                ref={(ref) => this.timelineView = ref}
+                firstTime={! this.visitedTimeline}
+                content={this.state.db.page['history-of-surveillance']}
+                events={this.state.db.timeline}
+                onLinkPress={this.onLinkPress}
+                {...props}
+              />
+            )
+          }}/>
+          <Route path='/drones' render={(props) => (
+            <Drone
+              content={this.state.db.drone}
+              onLinkPress={this.onLinkPress}
+              {...props}
+            />
+          )}/>
+          <Route path='/livestream' render={(props) => (
+            <Livestream
+              content={this.state.db.stream}
+              {...props}
+            />
+          )}/>
+          <Route path='/information' render={(props) => (
+            <Information  
+              content={this.state.db.about}
+              onLinkPress={this.onLinkPress}
+              {...props}
+            />
+          )}/>
+          <Route path='/page/credits' render={(props) => (
+            <Credits
+              content={this.state.db.page['credits']}
+              onLinkPress={this.onLinkPress}
+              {...props}
+            />
+          )}/>
+          <Route path='/page/privacy' render={(props) => (
+            <Privacy
+              content={this.state.db.page['privacy-policy']}
+              onLinkPress={this.onLinkPress}
+              {...props}
+            />
+          )}/>
+          <Route path='/contact' render={(props) => (
+            <Contact
+              content={this.state.db.page['contact']}
+              comments={this.state.db.comments}
+              {...props}
+            />
+          )}/>
+
+        </View>
+        <Footer onLinkPress={this.onLinkPress} />
+        <StatusBar hidden />
+      </View>
+    )
+  }
+}
+
+
+
+
+//         <Redirect to="/" />
+
+export default App
+
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    height: '100%',
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#000000',
+  },
+  inner: {
+    flexDirection: 'row',
+    height: window.height - 50 - 50,
+  },
+  logo: {
+    marginTop: 0,
+    height: 50,
+    marginBottom: 10,
+  }
+})
+