diff options
Diffstat (limited to 'vnext/src')
-rw-r--r-- | vnext/src/app.js | 21 | ||||
-rw-r--r-- | vnext/src/components/Discover.js | 13 | ||||
-rw-r--r-- | vnext/src/components/LoginButton.js | 5 | ||||
-rw-r--r-- | vnext/src/components/Thread.js | 23 | ||||
-rw-r--r-- | vnext/src/views/index.html | 2 |
5 files changed, 50 insertions, 14 deletions
diff --git a/vnext/src/app.js b/vnext/src/app.js index 82209e45..1f323b51 100644 --- a/vnext/src/app.js +++ b/vnext/src/app.js @@ -4,6 +4,8 @@ import { BrowserRouter as Router, Route, Link } from "react-router-dom" import Discover from "./components/Discover" import Post from "./components/Post" +import Thread from "./components/Thread" +import LoginButton from "./components/LoginButton" class App extends React.Component { constructor(props) { @@ -22,12 +24,17 @@ class App extends React.Component { <nav id="global"> <ul> {this.state.visitor.uid ? - <li><Link to="/?show=discuss"><i data-icon="ei-comment" data-size="s"></i>Discuss</Link></li> + <li><Link to={{ pathname: "/", search: "?show=discuss"}}><i data-icon="ei-comment" data-size="s"></i>Discuss</Link></li> : - <li><Link to="/?show=photos" rel="nofollow"><i data-icon="ei-camera" data-size="s"></i>Photos</Link></li> + <li><Link to={{ pathname: "/", search: "?media=1"}} rel="nofollow"><i data-icon="ei-camera" data-size="s"></i>Photos</Link></li> } - <li><Link to="/?show=all" rel="nofollow"><i data-icon="ei-search" data-size="s"></i>Discover</Link></li> - <li><Link to="post" href="/post"><i data-icon="ei-pencil" data-size="s"></i>Post</Link> + <li><Link to="/" rel="nofollow"><i data-icon="ei-search" data-size="s"></i>Discover</Link></li> + <li> + {this.state.visitor.uid ? + <Link to="post" href="/post"><i data-icon="ei-pencil" data-size="s"></i>Post</Link> + : + <LoginButton title="Login" onAuth={this.auth.bind(this)} /> + } </li> </ul> </nav> @@ -40,11 +47,15 @@ class App extends React.Component { </div> </header> <Route exact path="/" component={Discover} /> - <Route path="/post" component={Post} /> + <Route path="/:user/:mid" component={Thread} /> + <Route path="/post" component={Post} /> </div> </Router> ) } + auth(data) { + console.log(data) + } } diff --git a/vnext/src/components/Discover.js b/vnext/src/components/Discover.js index 2d962bda..7fde3d88 100644 --- a/vnext/src/components/Discover.js +++ b/vnext/src/components/Discover.js @@ -1,6 +1,7 @@ import "whatwg-fetch" import React from "react" import PropTypes from "prop-types" +import queryString from "query-string" import Message from "./Message" @@ -9,7 +10,8 @@ export default class Discover extends React.Component { super(props) this.state = { msgs: [], - loading: false + loading: false, + search: this.props.location.search } this.loadMessages = this.loadMessages.bind(this); } @@ -22,8 +24,7 @@ export default class Discover extends React.Component { } } loadMessages() { - const search = new URLSearchParams(this.props.params); - const url = "https://api.juick.com/messages"; + const url = "https://api.juick.com/messages" + this.state.search; fetch(url) .then(response => { return response.json() @@ -38,13 +39,13 @@ export default class Discover extends React.Component { render() { var nodes = this.state.msgs.map(msg => { return (<Message key={msg.mid} data={msg}/>) - }); + }); return ( - <div className="msgs" id="content">{nodes}</div> + <div className="msgs" id="content">{nodes}</div> ) } }; Discover.propTypes = { - msgs: PropTypes.array + msgs: PropTypes.array } diff --git a/vnext/src/components/LoginButton.js b/vnext/src/components/LoginButton.js index cdb62e1a..8d298fa2 100644 --- a/vnext/src/components/LoginButton.js +++ b/vnext/src/components/LoginButton.js @@ -8,14 +8,15 @@ export default class LoginButton extends React.Component { this.props.onAuth(event.data); }, false); } - login() { + login(event) { + event.preventDefault(); let loginWindow = window.open("https://juick.com/login?redirect=false", "Login to Juick", "width=400,height=300,resizeable=no,menubar=no,toolbar=no,scrollbars=no"); loginWindow.window.focus(); } render() { return ( - <div onClick={this.login}>{this.props.title}</div> + <a href="/login" onClick={this.login}>{this.props.title}</a> ) } }; diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js new file mode 100644 index 00000000..49d9ea4d --- /dev/null +++ b/vnext/src/components/Thread.js @@ -0,0 +1,23 @@ +import "whatwg-fetch" +import React from "react" + +export default class Thread extends React.Component { + constructor(props) { + super(props); + this.state = { + replies: [], + loading: false + } + } + componentDidMount() { + } + render() { + const { user, mid } = this.props.match.params; + return ( + <div> + <h1>{user}</h1> + <p>{mid}</p> + </div> + ) + } +}
\ No newline at end of file diff --git a/vnext/src/views/index.html b/vnext/src/views/index.html index 9f8feae9..661634d6 100644 --- a/vnext/src/views/index.html +++ b/vnext/src/views/index.html @@ -40,6 +40,6 @@ </head> <body id="body"> <div id="wrapper"></div> -<script type="text/javascript" src="app.js"></script> +<script type="text/javascript" src="/App.js"></script> </body> </html> |