aboutsummaryrefslogtreecommitdiff
path: root/src/web/js/components
diff options
context:
space:
mode:
authorFrançois Schmidts <francois.schmidts@gmail.com>2016-01-31 02:24:10 +0100
committerFrançois Schmidts <francois.schmidts@gmail.com>2016-01-31 02:28:01 +0100
commit9ca6a6989b0c87401f1a3903077723cd9a648a79 (patch)
tree40d36bf9a7b5bff1dcdb397b1208b736ef816b91 /src/web/js/components
parentregistering modifications on feeds / categories (diff)
downloadnewspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.tar.gz
newspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.tar.bz2
newspipe-9ca6a6989b0c87401f1a3903077723cd9a648a79.zip
redoing navbar in react
Diffstat (limited to 'src/web/js/components')
-rw-r--r--src/web/js/components/MainApp.react.js26
-rw-r--r--src/web/js/components/Menu.react.js10
-rw-r--r--src/web/js/components/MiddlePanel.react.js8
-rw-r--r--src/web/js/components/Navbar.react.js91
-rw-r--r--src/web/js/components/RightPanel.react.js13
5 files changed, 121 insertions, 27 deletions
diff --git a/src/web/js/components/MainApp.react.js b/src/web/js/components/MainApp.react.js
index b448f808..cbdc5833 100644
--- a/src/web/js/components/MainApp.react.js
+++ b/src/web/js/components/MainApp.react.js
@@ -1,7 +1,8 @@
var React = require('react');
-var Col = require('react-bootstrap/Col');
-var Grid = require('react-bootstrap/Grid');
+var Col = require('react-bootstrap/lib/Col');
+var Grid = require('react-bootstrap/lib/Grid');
+var JarrNavBar = require('./Navbar.react');
var Menu = require('./Menu.react');
var MiddlePanel = require('./MiddlePanel.react');
var RightPanel = require('./RightPanel.react');
@@ -9,15 +10,18 @@ var RightPanel = require('./RightPanel.react');
var MainApp = React.createClass({
render: function() {
- return (<Grid fluid id="jarr-container">
- <Menu />
- <Col id="middle-panel" mdOffset={3} lgOffset={2}
- xs={2} sm={2} md={4} lg={4}>
- <MiddlePanel.MiddlePanelFilter />
- <MiddlePanel.MiddlePanel />
- </Col>
- <RightPanel />
- </Grid>
+ return (<div>
+ <JarrNavBar />
+ <Grid fluid id="jarr-container">
+ <Menu />
+ <Col id="middle-panel" mdOffset={3} lgOffset={2}
+ xs={4} sm={4} md={4} lg={4}>
+ <MiddlePanel.MiddlePanelFilter />
+ <MiddlePanel.MiddlePanel />
+ </Col>
+ <RightPanel />
+ </Grid>
+ </div>
);
},
});
diff --git a/src/web/js/components/Menu.react.js b/src/web/js/components/Menu.react.js
index 0d739e4e..ad28015c 100644
--- a/src/web/js/components/Menu.react.js
+++ b/src/web/js/components/Menu.react.js
@@ -1,9 +1,9 @@
var React = require('react');
-var Col = require('react-bootstrap/Col');
-var Badge = require('react-bootstrap/Badge');
-var Button = require('react-bootstrap/Button');
-var ButtonGroup = require('react-bootstrap/ButtonGroup');
-var Glyphicon = require('react-bootstrap/Glyphicon');
+var Col = require('react-bootstrap/lib/Col');
+var Badge = require('react-bootstrap/lib/Badge');
+var Button = require('react-bootstrap/lib/Button');
+var ButtonGroup = require('react-bootstrap/lib/ButtonGroup');
+var Glyphicon = require('react-bootstrap/lib/Glyphicon');
var MenuStore = require('../stores/MenuStore');
var MenuActions = require('../actions/MenuActions');
diff --git a/src/web/js/components/MiddlePanel.react.js b/src/web/js/components/MiddlePanel.react.js
index 6bfdaaa9..fd291624 100644
--- a/src/web/js/components/MiddlePanel.react.js
+++ b/src/web/js/components/MiddlePanel.react.js
@@ -1,9 +1,9 @@
var React = require('react');
-var Row = require('react-bootstrap/Row');
-var Button = require('react-bootstrap/Button');
-var ButtonGroup = require('react-bootstrap/ButtonGroup');
-var Glyphicon = require('react-bootstrap/Glyphicon');
+var Row = require('react-bootstrap/lib/Row');
+var Button = require('react-bootstrap/lib/Button');
+var ButtonGroup = require('react-bootstrap/lib/ButtonGroup');
+var Glyphicon = require('react-bootstrap/lib/Glyphicon');
var MiddlePanelStore = require('../stores/MiddlePanelStore');
var MiddlePanelActions = require('../actions/MiddlePanelActions');
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;
diff --git a/src/web/js/components/RightPanel.react.js b/src/web/js/components/RightPanel.react.js
index fda7c976..e9485511 100644
--- a/src/web/js/components/RightPanel.react.js
+++ b/src/web/js/components/RightPanel.react.js
@@ -1,8 +1,8 @@
var React = require('react');
-var Col = require('react-bootstrap/Col');
-var Glyphicon = require('react-bootstrap/Glyphicon');
-var Button = require('react-bootstrap/Button');
-var ButtonGroup = require('react-bootstrap/ButtonGroup');
+var Col = require('react-bootstrap/lib/Col');
+var Glyphicon = require('react-bootstrap/lib/Glyphicon');
+var Button = require('react-bootstrap/lib/Button');
+var ButtonGroup = require('react-bootstrap/lib/ButtonGroup');
var RightPanelActions = require('../actions/RightPanelActions');
var RightPanelStore = require('../stores/RightPanelStore');
@@ -293,7 +293,6 @@ var RightPanel = React.createClass({
return <li>{this.state.article.title}</li>;
},
render: function() {
- var content = null;
var brd_category = null;
var brd_feed = null;
var brd_article = null;
@@ -329,9 +328,9 @@ var RightPanel = React.createClass({
key={this.state.category.id} />);
}
- return (<Col id="right-panel" xsOffset={2} smOffset={2}
+ return (<Col id="right-panel" xsOffset={4} smOffset={4}
mdOffset={7} lgOffset={6}
- xs={10} sm={10} md={5} lg={6}>
+ xs={8} sm={8} md={5} lg={6}>
{breadcrum}
{cntnt}
</Col>
bgstack15