diff --git a/js/components/global_notification.js b/js/components/global_notification.js index 82646976..93157e9a 100644 --- a/js/components/global_notification.js +++ b/js/components/global_notification.js @@ -7,18 +7,33 @@ import GlobalNotificationStore from '../stores/global_notification_store'; import Row from 'react-bootstrap/lib/Row'; import Col from 'react-bootstrap/lib/Col'; +import { mergeOptions } from '../utils/general_utils'; + let GlobalNotification = React.createClass({ componentDidMount() { GlobalNotificationStore.listen(this.onChange); + + // init container width + this.handleContainerResize(); + + // we're using an event listener on window here, + // as it was not possible to listen to the resize events of a dom node + window.addEventListener('resize', this.handleContainerResize); }, componentWillUnmount() { GlobalNotificationStore.unlisten(this.onChange); + window.removeEventListener('resize', this.handleContainerResize); }, getInititalState() { - return this.extractFirstElem(GlobalNotificationStore.getState().notificationQue); + return mergeOptions( + this.extractFirstElem(GlobalNotificationStore.getState().notificationQue), + { + containerWidth: 0 + } + ); }, extractFirstElem(l) { @@ -35,7 +50,14 @@ let GlobalNotification = React.createClass({ } }, + handleContainerResize() { + this.setState({ + containerWidth: this.refs.containerWrapper.getDOMNode().offsetWidth + }); + }, + render() { + console.log(this.state); let notificationClass = 'ascribe-global-notification '; let message = this.state && this.state.message ? this.state.message : null; diff --git a/js/components/header.js b/js/components/header.js index 6ecfb916..61b25e2e 100644 --- a/js/components/header.js +++ b/js/components/header.js @@ -19,11 +19,12 @@ import MenuItem from 'react-bootstrap/lib/MenuItem'; import MenuItemLink from 'react-router-bootstrap/lib/MenuItemLink'; import NavItemLink from 'react-router-bootstrap/lib/NavItemLink'; +import HeaderNotificationDebug from './header_notification_debug'; + import { mergeOptions } from '../utils/general_utils'; import { getLangText } from '../utils/lang_utils'; -let Link = Router.Link; let Header = React.createClass({ mixins: [Router.Navigation], @@ -43,11 +44,13 @@ let Header = React.createClass({ UserStore.unlisten(this.onChange); WhitelabelStore.unlisten(this.onChange); }, + handleLogout(){ UserActions.logoutCurrentUser(); Alt.flush(); this.transitionTo('login'); }, + getLogo(){ let logo = ( @@ -110,6 +113,7 @@ let Header = React.createClass({