IF YOU WOULD LIKE TO GET AN ACCOUNT, please write an email to s dot adaszewski at gmail dot com. User accounts are meant only to report issues and/or generate pull requests. This is a purpose-specific Git hosting for ADARED projects. Thank you for your understanding!
Explorar el Código

Adapted WBNavbar to handle URLs in addition to onclick callbacks.

pull/1/head
Stanislaw Adaszewski hace 4 años
padre
commit
d104d57027
Se han modificado 3 ficheros con 47 adiciones y 26 borrados
  1. +13
    -9
      frontend/src/js/component/wb-navbar-common.js
  2. +5
    -9
      frontend/src/js/page/wb-app.js
  3. +29
    -8
      frontend/src/js/widget/wb-navbar.js

+ 13
- 9
frontend/src/js/component/wb-navbar-common.js Ver fichero

@@ -5,15 +5,19 @@ import WBInlineSearch from 'wb-inline-search';
class WBNavbarCommon extends Component {
render({ app, items, activeItem }) {
return (
<WBNavbar items={ [
{ 'name': 'Home', 'id': 'home' },
{ 'name': 'All Projects', 'id': 'all-projects' },
{ 'name': 'All Users', 'id': 'all-users' },
{ 'name': 'Current User', 'dropdown': [ { 'id': 'sign-out', 'name': 'Sign Out' } ]}
].concat(items) } rhs={ (
<WBInlineSearch />
) } onItemClicked={ item => app.navbarItemClicked(item) }
activeItem={ activeItem } />
<WBNavbar
items={ [
{ 'name': 'Home', 'id': 'home' },
{ 'name': 'All Projects', 'id': 'all-projects' },
{ 'name': 'All Users', 'id': 'all-users' },
{ 'name': 'Current User', 'dropdown': [ { 'id': 'sign-out', 'name': 'Sign Out' } ]}
].concat(items) }
rhs={ (
<WBInlineSearch />
) }
titleUrl = { '/browse/' + app.state.currentUser.uuid }
getItemUrl={ item => app.navbarItemUrl(item) }
activeItem={ activeItem } />
);
}
}


+ 5
- 9
frontend/src/js/page/wb-app.js Ver fichero

@@ -26,22 +26,18 @@ class WBApp extends Component {
};
}
navbarItemClicked(item) {
navbarItemUrl(item) {
if (item['id'] === 'sign-out') {
delete window.localStorage['arvHost'];
delete window.localStorage['arvToken'];
delete window.localStorage['currentUser'];
route('/sign-in');
return ('/sign-in');
} else if (item['id'] === 'home') {
route('/browse/' + this.appState.currentUser.uuid);
return ('/browse/' + this.appState.currentUser.uuid);
} else if (item['id'] === 'all-projects') {
route('/browse');
return ('/browse');
} else if (item['id'] === 'all-users') {
route('/users');
return ('/users');
}
}


+ 29
- 8
frontend/src/js/widget/wb-navbar.js Ver fichero

@@ -1,10 +1,12 @@
import { h, Component } from 'preact';
class WBNavbar extends Component {
render({ title, items, rhs, onItemClicked, onTitleClicked, activeItem }) {
render({ title, items, rhs, onItemClicked, onTitleClicked,
activeItem, titleUrl, getItemUrl }) {
return (
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#" onclick={ e => { e.preventDefault(); onTitleClicked(); } }>{ title }</a>
<a class="navbar-brand" href={ titleUrl } onclick={ e => this.titleClicked(e) }>{ title }</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
@@ -45,7 +47,8 @@ class WBNavbar extends Component {
{ i['dropdown'].map(d => {
if (typeof(d) === 'string')
return (
<a class="dropdown-item" href="#" onclick={ e => { e.preventDefault(); onItemClicked(d); } }>{ d }</a>
<a class="dropdown-item" href={ getItemUrl(d) }
onclick={ e => this.itemClicked(e, d) }>{ d }</a>
);
else if (typeof(d) === 'object' && d['divider'])
@@ -55,7 +58,8 @@ class WBNavbar extends Component {
else if (typeof(d) === 'object' && d['name'])
return (
<a class="dropdown-item" href="#" onclick={ e => { e.preventDefault(); onItemClicked(d); } }>{ d['name'] }</a>
<a class="dropdown-item" href={ getItemUrl(d) }
onclick={ e => this.itemClicked(e, d) }>{ d['name'] }</a>
);
}) }
</div>
@@ -67,7 +71,8 @@ class WBNavbar extends Component {
return (
<li class={ li_cls }>
<a class={ a_cls } href="#" onclick={ e => { e.preventDefault(); onItemClicked(i); } }>{ i['name'] }</a>
<a class={ a_cls } href={ getItemUrl(i) }
onclick={ e => this.itemClicked(e, i) }>{ i['name'] }</a>
</li>
);
}
@@ -80,15 +85,31 @@ class WBNavbar extends Component {
</nav>
);
}
titleClicked(e) {
let { onTitleClicked } = this.props;
if (!onTitleClicked)
return;
e.preventDefault();
onTitleClicked();
}
itemClicked(e, i) {
let { onItemClicked } = this.props;
if (!onItemClicked)
return;
e.preventDefault();
onItemClicked(i);
}
}
WBNavbar.defaultProps = {
'title': 'Workbench Advanced',
'items': [],
'form': null,
'onItemClicked': () => {},
'onTitleClicked': () => {},
'activeItem': null
'activeItem': null,
'titleUrl': '#',
'getItemUrl': () => ('#')
}
export default WBNavbar;

Cargando…
Cancelar
Guardar