var UserStore = require('../stores/user_store.jsx'); var SettingItemMin = require('./setting_item_min.jsx'); var SettingItemMax = require('./setting_item_max.jsx'); var client = require('../utils/client.jsx'); var AsyncClient = require('../utils/async_client.jsx'); var utils = require('../utils/utils.jsx'); var assign = require('object-assign'); function getNotificationsStateFromStores() { var user = UserStore.getCurrentUser(); var soundNeeded = !utils.isBrowserFirefox(); var sound = (!user.notify_props || user.notify_props.desktop_sound == undefined) ? "true" : user.notify_props.desktop_sound; var desktop = (!user.notify_props || user.notify_props.desktop == undefined) ? "all" : user.notify_props.desktop; var email = (!user.notify_props || user.notify_props.email == undefined) ? "true" : user.notify_props.email; var username_key = false; var mention_key = false; var custom_keys = ""; var first_name_key = false; var all_key = false; var channel_key = false; if (user.notify_props) { if (user.notify_props.mention_keys !== undefined) { var keys = user.notify_props.mention_keys.split(','); if (keys.indexOf(user.username) !== -1) { username_key = true; keys.splice(keys.indexOf(user.username), 1); } else { username_key = false; } if (keys.indexOf('@'+user.username) !== -1) { mention_key = true; keys.splice(keys.indexOf('@'+user.username), 1); } else { mention_key = false; } custom_keys = keys.join(','); } if (user.notify_props.first_name !== undefined) { first_name_key = user.notify_props.first_name === "true"; } if (user.notify_props.all !== undefined) { all_key = user.notify_props.all === "true"; } if (user.notify_props.channel !== undefined) { channel_key = user.notify_props.channel === "true"; } } return { notify_level: desktop, enable_email: email, soundNeeded: soundNeeded, enable_sound: sound, username_key: username_key, mention_key: mention_key, custom_keys: custom_keys, custom_keys_checked: custom_keys.length > 0, first_name_key: first_name_key, all_key: all_key, channel_key: channel_key }; } module.exports = React.createClass({ displayName: 'NotificationsTab', handleSubmit: function() { data = {} data["user_id"] = this.props.user.id; data["email"] = this.state.enable_email; data["desktop_sound"] = this.state.enable_sound; data["desktop"] = this.state.notify_level; var mention_keys = []; if (this.state.username_key) mention_keys.push(this.props.user.username); if (this.state.mention_key) mention_keys.push('@'+this.props.user.username); var string_keys = mention_keys.join(','); if (this.state.custom_keys.length > 0 && this.state.custom_keys_checked) { string_keys += ',' + this.state.custom_keys; } data["mention_keys"] = string_keys; data["first_name"] = this.state.first_name_key ? "true" : "false"; data["all"] = this.state.all_key ? "true" : "false"; data["channel"] = this.state.channel_key ? "true" : "false"; client.updateUserNotifyProps(data, function(data) { this.props.updateSection(""); AsyncClient.getMe(); }.bind(this), function(err) { this.setState({ server_error: err.message }); }.bind(this) ); }, handleClose: function() { $(this.getDOMNode()).find(".form-control").each(function() { this.value = ""; }); this.setState(assign({},getNotificationsStateFromStores(),{server_error: null})); this.props.updateTab('general'); }, componentDidMount: function() { UserStore.addChangeListener(this._onChange); $('#user_settings').on('hidden.bs.modal', this.handleClose); }, componentWillUnmount: function() { UserStore.removeChangeListener(this._onChange); $('#user_settings').off('hidden.bs.modal', this.handleClose); this.props.updateSection(''); }, _onChange: function() { var newState = getNotificationsStateFromStores(); if (!utils.areStatesEqual(newState, this.state)) { this.setState(newState); } }, getInitialState: function() { return getNotificationsStateFromStores(); }, handleNotifyRadio: function(notifyLevel) { this.setState({ notify_level: notifyLevel }); this.refs.wrapper.getDOMNode().focus(); }, handleEmailRadio: function(enableEmail) { this.setState({ enable_email: enableEmail }); this.refs.wrapper.getDOMNode().focus(); }, handleSoundRadio: function(enableSound) { this.setState({ enable_sound: enableSound }); this.refs.wrapper.getDOMNode().focus(); }, updateUsernameKey: function(val) { this.setState({ username_key: val }); }, updateMentionKey: function(val) { this.setState({ mention_key: val }); }, updateFirstNameKey: function(val) { this.setState({ first_name_key: val }); }, updateAllKey: function(val) { this.setState({ all_key: val }); }, updateChannelKey: function(val) { this.setState({ channel_key: val }); }, updateCustomMentionKeys: function() { var checked = this.refs.customcheck.getDOMNode().checked; if (checked) { var text = this.refs.custommentions.getDOMNode().value; // remove all spaces and split string into individual keys this.setState({ custom_keys: text.replace(/ /g, ''), custom_keys_checked: true }); } else { this.setState({ custom_keys: "", custom_keys_checked: false }); } }, onCustomChange: function() { this.refs.customcheck.getDOMNode().checked = true; this.updateCustomMentionKeys(); }, render: function() { var server_error = this.state.server_error ? this.state.server_error : null; var self = this; var user = this.props.user; var desktopSection; if (this.props.activeSection === 'desktop') { var notifyActive = [false, false, false]; if (this.state.notify_level === "mention") { notifyActive[1] = true; } else if (this.state.notify_level === "none") { notifyActive[2] = true; } else { notifyActive[0] = true; } var inputs = []; inputs.push(