diff options
author | François Schmidts <francois.schmidts@gmail.com> | 2016-01-31 02:24:10 +0100 |
---|---|---|
committer | François Schmidts <francois.schmidts@gmail.com> | 2016-01-31 02:28:01 +0100 |
commit | 9ca6a6989b0c87401f1a3903077723cd9a648a79 (patch) | |
tree | 40d36bf9a7b5bff1dcdb397b1208b736ef816b91 /src/web/js/components/Navbar.react.js | |
parent | registering modifications on feeds / categories (diff) | |
download | newspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.tar.gz newspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.tar.bz2 newspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.zip |
redoing navbar in react
Diffstat (limited to 'src/web/js/components/Navbar.react.js')
-rw-r--r-- | src/web/js/components/Navbar.react.js | 91 |
1 files changed, 91 insertions, 0 deletions
diff --git a/src/web/js/components/Navbar.react.js b/src/web/js/components/Navbar.react.js new file mode 100644 index 00000000..56de178e --- /dev/null +++ b/src/web/js/components/Navbar.react.js @@ -0,0 +1,91 @@ +var React = require('react'); +var Glyphicon = require('react-bootstrap/lib/Glyphicon'); +var Nav = require('react-bootstrap/lib/Nav'); +var NavItem = require('react-bootstrap/lib/NavItem'); +var Navbar = require('react-bootstrap/lib/Navbar'); +var NavDropdown = require('react-bootstrap/lib/NavDropdown'); +var MenuItem = require('react-bootstrap/lib/MenuItem'); +var Button = require('react-bootstrap/lib/Button'); +var Input = require('react-bootstrap/lib/Input'); + +var MenuStore = require('../stores/MenuStore'); + +JarrNavBar = React.createClass({ + getInitialState: function() { + return {is_admin: MenuStore._datas.is_admin, + crawling_method: MenuStore._datas.crawling_method}; + }, + buttonFetch: function() { + if(this.state.is_admin && this.state.crawling_method != 'http') { + return <NavItem eventKey={2} href="/fetch"><Glyphicon glyph="import" />Fetch</NavItem>; + } + }, + buttonAdmin: function() { + if(this.state.is_admin) { + return (<NavDropdown title={<Glyphicon glyph='cog' />} + id='admin-dropdown'> + <MenuItem href="/admin/dashboard"> + <Glyphicon glyph="dashboard" />Dashboard + </MenuItem> + </NavDropdown>); + } + }, + render: function() { + var gl_title = (<span> + <Glyphicon glyph="plus-sign" />Add a new feed + </span>); + return (<Navbar fixedTop inverse className="navbar-custom"> + <Navbar.Header> + <Navbar.Brand> + <a href="/">JARR</a> + </Navbar.Brand> + <Navbar.Toggle /> + </Navbar.Header> + <Nav pullRight> + <Navbar.Form pullLeft> + <form action="/feed/bookmarklet" method="GET"> + <Input name="url" type="text" + placeholder="Add a new feed" /> + <Button type="submit">Submit</Button> + </form> + </Navbar.Form> + {this.buttonFetch()} + <NavDropdown title="Feed" id="feed-mgmt-dropdown"> + <MenuItem href="/feeds/inactives">Inactive</MenuItem> + <MenuItem href="/articles/history">History</MenuItem> + <MenuItem href="/feeds/">All</MenuItem> + </NavDropdown> + {this.buttonAdmin()} + <NavDropdown title={<Glyphicon glyph='user' />} + id="user-dropdown"> + <MenuItem href="/user/profile"> + <Glyphicon glyph="user" />Profile + </MenuItem> + <MenuItem href="/user/management"> + <Glyphicon glyph="cog" />Your data + </MenuItem> + <MenuItem href="/about"> + <Glyphicon glyph="question-sign" />About + </MenuItem> + <MenuItem href="/logout"> + <Glyphicon glyph="log-out" />Logout + </MenuItem> + </NavDropdown> + </Nav> + </Navbar> + ); + }, + componentDidMount: function() { + MenuStore.addChangeListener(this._onChange); + }, + componentWillUnmount: function() { + MenuStore.removeChangeListener(this._onChange); + }, + _onChange: function() { + var datas = MenuStore.getAll(); + this.setState({is_admin: datas.is_admin, + crawling_method: datas.crawling_method}); + }, +}); + +module.exports = JarrNavBar; |