From cd49a9c4027fab83abd4387c8479c77fcce9f6e0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Tue, 25 Aug 2015 16:33:26 +0200 Subject: [PATCH] Create generic links in nav using routes --- js/components/header.js | 5 +- js/components/nav_routes_links.js | 65 +++++++++++++++++++ .../ikonotv/ikonotv_register_piece.js | 4 +- .../ikonotv/ikonotv_request_loan.js | 16 +++++ js/components/whitelabel/wallet/wallet_app.js | 9 ++- .../whitelabel/wallet/wallet_routes.js | 2 + js/utils/general_utils.js | 17 +++++ sass/main.scss | 5 +- 8 files changed, 115 insertions(+), 8 deletions(-) create mode 100644 js/components/nav_routes_links.js create mode 100644 js/components/whitelabel/wallet/components/ikonotv/ikonotv_request_loan.js diff --git a/js/components/header.js b/js/components/header.js index 2effa7fe..6c2dfac8 100644 --- a/js/components/header.js +++ b/js/components/header.js @@ -20,6 +20,7 @@ import NavItemLink from 'react-router-bootstrap/lib/NavItemLink'; import HeaderNotificationDebug from './header_notification_debug'; +import NavRoutesLinks from './nav_routes_links'; import { mergeOptions } from '../utils/general_utils'; import { getLangText } from '../utils/lang_utils'; @@ -27,7 +28,8 @@ import { getLangText } from '../utils/lang_utils'; let Header = React.createClass({ propTypes: { - showAddWork: React.PropTypes.bool + showAddWork: React.PropTypes.bool, + routes: React.PropTypes.element }, mixins: [Router.State], @@ -129,6 +131,7 @@ let Header = React.createClass({ {account} {signup} + diff --git a/js/components/nav_routes_links.js b/js/components/nav_routes_links.js new file mode 100644 index 00000000..0e03e0fe --- /dev/null +++ b/js/components/nav_routes_links.js @@ -0,0 +1,65 @@ +'use strict'; + +import React from 'react'; + +import Nav from 'react-bootstrap/lib/Nav'; +import DropdownButton from 'react-bootstrap/lib/DropdownButton'; +import MenuItemLink from 'react-router-bootstrap/lib/MenuItemLink'; +import NavItemLink from 'react-router-bootstrap/lib/NavItemLink'; + +import { sanitizeList } from '../utils/general_utils'; + + +let NavRoutesLinks = React.createClass({ + propTypes: { + routes: React.PropTypes.element + }, + + extractLinksFromRoutes(node, i) { + + node = node.props; + + let links = node.children.map((child, j) => { + + // check if this a candidate for a link generation + if(child.props.headerTitle && typeof child.props.headerTitle === 'string') { + + // also check if it is a candidate for generating a dropdown menu + if(child.props.children && child.props.children.length > 0) { + return ( + + {this.extractLinksFromRoutes(child, i++)} + + ); + } else if(i === 1) { + // if the node's child is actually a node of level one (a child of a node), we're + // returning a DropdownButton matching MenuItemLink + return ( + {child.props.headerTitle} + ); + } else if(i === 0) { + return ( + {child.props.headerTitle} + ); + } else { + return null; + } + } else { + return null; + } + }); + + // remove all nulls from the list of generated links + return sanitizeList(links); + }, + + render() { + return ( + + ); + } +}); + +export default NavRoutesLinks; \ No newline at end of file diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js index 33cc576c..814b0f01 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js @@ -55,14 +55,14 @@ let IkonotvRegisterPiece = React.createClass({ render() { - if (this.state.currentUser && + /* if (this.state.currentUser && this.state.whitelabel && this.state.whitelabel.user && this.state.currentUser.email === this.state.whitelabel.user){ return ( ); - } + } */ return (
+ ); + } +}); + +export default IkonotvRequestLoan; \ No newline at end of file diff --git a/js/components/whitelabel/wallet/wallet_app.js b/js/components/whitelabel/wallet/wallet_app.js index f31ec429..06bac15f 100644 --- a/js/components/whitelabel/wallet/wallet_app.js +++ b/js/components/whitelabel/wallet/wallet_app.js @@ -7,21 +7,26 @@ import Footer from '../../footer'; import GlobalNotification from '../../global_notification'; +import getRoutes from './wallet_routes'; + let RouteHandler = Router.RouteHandler; let WalletApp = React.createClass({ mixins: [Router.State], render() { - let header = null; let subdomain = window.location.host.split('.')[0]; + let ROUTES = getRoutes(null, subdomain); + + let header = null; if ((this.isActive('landing') || this.isActive('login') || this.isActive('signup')) && (['ikonotv', 'cyland']).indexOf(subdomain) > -1) { header = (
); } else { - header =
; + header =
; } + return (
{header} diff --git a/js/components/whitelabel/wallet/wallet_routes.js b/js/components/whitelabel/wallet/wallet_routes.js index 435b1695..941c5a9c 100644 --- a/js/components/whitelabel/wallet/wallet_routes.js +++ b/js/components/whitelabel/wallet/wallet_routes.js @@ -21,6 +21,7 @@ import CylandPieceList from './components/cyland/cyland_piece_list'; import IkonotvPieceList from './components/ikonotv/ikonotv_piece_list'; import IkonotvRegisterPiece from './components/ikonotv/ikonotv_register_piece'; +import IkonotvRequestLoan from './components/ikonotv/ikonotv_request_loan'; import CCRegisterPiece from './components/cc/cc_register_piece'; @@ -69,6 +70,7 @@ let ROUTES = { + diff --git a/js/utils/general_utils.js b/js/utils/general_utils.js index 70c94a97..15b0e85f 100644 --- a/js/utils/general_utils.js +++ b/js/utils/general_utils.js @@ -26,6 +26,23 @@ export function sanitize(obj, filterFn) { return obj; } +/** + * Removes all falsy values (undefined, null, false, ...) from a list/array + * @param {array} l the array to sanitize + * @return {array} the sanitized array + */ +export function sanitizeList(l) { + let sanitizedList = []; + + for(let i = 0; i < l.length; i++) { + if(l[i]) { + sanitizedList.push(l[i]); + } + } + + return sanitizedList; +} + /** * Sums up a list of numbers. Like a Epsilon-math-kinda-sum... */ diff --git a/sass/main.scss b/sass/main.scss index fed435f0..229c04c8 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -100,10 +100,9 @@ hr { } .img-brand { - padding: 0; - height: 45px; - margin: 5px 0 5px 0; + height: 60px; } + .truncate { white-space: nowrap; width: 4em;