From 07f74dd46ecb18eac2047d4042919f1b092b682d Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Sun, 15 Jul 2018 09:13:10 +0300 Subject: Move App to its own file --- vnext/src/App.js | 232 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 232 insertions(+) create mode 100644 vnext/src/App.js (limited to 'vnext/src/App.js') diff --git a/vnext/src/App.js b/vnext/src/App.js new file mode 100644 index 00000000..14ae7d5e --- /dev/null +++ b/vnext/src/App.js @@ -0,0 +1,232 @@ +import React from 'react'; +import { BrowserRouter as Router, Route, Link, Switch } from 'react-router-dom'; +import * as qs from 'query-string'; + +import Icon from './components/Icon'; +import { Discover, Discussions, Blog, Tag, Home } from './components/Feeds'; +import Settings from './components/Settings'; +import Contacts from './components/Contacts'; +import Chat from './components/Chat'; +import Post from './components/Post'; +import Thread from './components/Thread'; +import LoginButton from './components/LoginButton'; +import Footer from './components/Footer'; +import Avatar from './components/Avatar'; +import Header from './components/Header'; +import SearchBox from './components/SearchBox'; + +import { me } from './api'; + +export default class App extends React.Component { + constructor(props) { + super(props); + let params = qs.parse(window.location.search); + if (params.hash) { + localStorage.visitor = JSON.stringify({ uid: 0, hash: params.hash }); + window.history.replaceState({}, document.title, `${window.location.protocol}//${window.location.host}${window.location.pathname}`); + } + this.state = { + visitor: localStorage.visitor ? JSON.parse(localStorage.visitor) : { + uid: 0, + hash: params.hash || '' + } + }; + this.pm = React.createRef(); + this.thread = React.createRef(); + } + + initWS = () => { + const proto = window.location.protocol === 'https:' ? 'wss:' : 'ws:'; + const params = { hash: this.state.visitor.hash }; + let url = `${proto}//api.juick.com/ws/?${qs.stringify(params)}`; + this.ws = new WebSocket(url); + this.ws.onopen = () => { + console.log('online'); + }; + this.ws.onclose = () => { + console.log('offline'); + this.ws = false; + setTimeout(function () { + this.initWS(); + }, 2000); + }; + this.ws.onmessage = (msg) => { + if (msg.data == ' ') { + this.ws.send(' '); + } else { + try { + var jsonMsg = JSON.parse(msg.data); + console.log('data: ' + msg.data); + // refresh server visitor state (unread counters) + me().then(visitor => { + this.setState({ + visitor: visitor + }); + }); + if (jsonMsg.service) { + return; + } + if (!jsonMsg.mid) { + this.pm.current.onMessage(jsonMsg); + } + if (jsonMsg.rid && this.thread.current) { + this.thread.current.onReply(jsonMsg); + } + } catch (err) { + console.log(err); + } + } + }; + setInterval(this.wsSendKeepAlive, 90000); + } + + wsSendKeepAlive = () => { + if (this.ws) { + this.ws.send(' '); + } + } + + componentDidMount() { + const { hash, uid } = this.state.visitor; + this.initWS(); + if (hash) { + me().then(visitor => this.auth(visitor)); + } + } + search = (searchString) => { + console.log(searchString); + } + render() { + const user = this.state.visitor; + return ( + + +
+
+ {user.uid > 0 ? +
+ {user.uname ? : } +
+ : + + } + + +
+
+
+
+ + } /> + } /> + + + } /> + + + } /> + } /> + } /> + } /> + } /> + } /> + } /> + +
+ +
+