summaryrefslogtreecommitdiffstats
path: root/web/react/components/error_bar.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components/error_bar.jsx')
-rw-r--r--web/react/components/error_bar.jsx69
1 files changed, 69 insertions, 0 deletions
diff --git a/web/react/components/error_bar.jsx b/web/react/components/error_bar.jsx
new file mode 100644
index 000000000..f23dc060e
--- /dev/null
+++ b/web/react/components/error_bar.jsx
@@ -0,0 +1,69 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var ErrorStore = require('../stores/error_store.jsx');
+var utils = require('../utils/utils.jsx');
+var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
+var Constants = require('../utils/constants.jsx');
+var ActionTypes = Constants.ActionTypes;
+
+function getStateFromStores() {
+ var error = ErrorStore.getLastError();
+ if (error) {
+ return { message: error.message };
+ } else {
+ return { message: null };
+ }
+}
+
+module.exports = React.createClass({
+ componentDidMount: function() {
+ ErrorStore.addChangeListener(this._onChange);
+ $('body').css('padding-top', $('#error_bar').outerHeight());
+ $(window).resize(function(){
+ $('body').css('padding-top', $('#error_bar').outerHeight());
+ });
+ },
+ componentWillUnmount: function() {
+ ErrorStore.removeChangeListener(this._onChange);
+ },
+ _onChange: function() {
+ var newState = getStateFromStores();
+ if (!utils.areStatesEqual(newState, this.state)) {
+ if (newState.message) {
+ var self = this;
+ setTimeout(function(){self.handleClose();}, 10000);
+ }
+ this.setState(newState);
+ }
+ },
+ handleClose: function(e) {
+ if (e) e.preventDefault();
+ AppDispatcher.handleServerAction({
+ type: ActionTypes.RECIEVED_ERROR,
+ err: null
+ });
+ $('body').css('padding-top', '0');
+ },
+ getInitialState: function() {
+ var state = getStateFromStores();
+ if (state.message) {
+ var self = this;
+ setTimeout(function(){self.handleClose();}, 10000);
+ }
+ return state;
+ },
+ render: function() {
+ var message = this.state.message;
+ if (message) {
+ return (
+ <div className="error-bar">
+ <span className="error-text">{message}</span>
+ <a href="#" className="error-close pull-right" onClick={this.handleClose}>×</a>
+ </div>
+ );
+ } else {
+ return <div/>;
+ }
+ }
+});