// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. var Modal = ReactBootstrap.Modal; var SettingItemMin = require('./setting_item_min.jsx'); var SettingItemMax = require('./setting_item_max.jsx'); var Client = require('../utils/client.jsx'); var UserStore = require('../stores/user_store.jsx'); var ChannelStore = require('../stores/channel_store.jsx'); export default class ChannelNotificationsModal extends React.Component { constructor(props) { super(props); this.onListenerChange = this.onListenerChange.bind(this); this.updateSection = this.updateSection.bind(this); this.handleSubmitNotifyLevel = this.handleSubmitNotifyLevel.bind(this); this.handleUpdateNotifyLevel = this.handleUpdateNotifyLevel.bind(this); this.createNotifyLevelSection = this.createNotifyLevelSection.bind(this); this.handleSubmitMarkUnreadLevel = this.handleSubmitMarkUnreadLevel.bind(this); this.handleUpdateMarkUnreadLevel = this.handleUpdateMarkUnreadLevel.bind(this); this.createMarkUnreadLevelSection = this.createMarkUnreadLevelSection.bind(this); const member = ChannelStore.getMember(props.channel.id); this.state = { notifyLevel: member.notify_props.desktop, markUnreadLevel: member.notify_props.mark_unread, channelId: '', activeSection: '' }; } componentDidMount() { ChannelStore.addChangeListener(this.onListenerChange); } componentWillUnmount() { ChannelStore.removeChangeListener(this.onListenerChange); } onListenerChange() { if (!this.state.channelId) { return; } const member = ChannelStore.getMember(this.state.channelId); if (member.notify_props.desktop !== this.state.notifyLevel || member.notify_props.mark_unread !== this.state.mark_unread) { this.setState({ notifyLevel: member.notify_props.desktop, markUnreadLevel: member.notify_props.mark_unread }); } } updateSection(section) { this.setState({activeSection: section}); } handleSubmitNotifyLevel() { var channelId = this.state.channelId; var notifyLevel = this.state.notifyLevel; if (ChannelStore.getMember(channelId).notify_props.desktop === notifyLevel) { this.updateSection(''); return; } var data = {}; data.channel_id = channelId; data.user_id = UserStore.getCurrentId(); data.desktop = notifyLevel; Client.updateNotifyProps(data, () => { var member = ChannelStore.getMember(channelId); member.notify_props.desktop = notifyLevel; ChannelStore.setChannelMember(member); this.updateSection(''); }, (err) => { this.setState({serverError: err.message}); } ); } handleUpdateNotifyLevel(notifyLevel) { this.setState({notifyLevel}); } createNotifyLevelSection(serverError) { var handleUpdateSection; const user = UserStore.getCurrentUser(); const globalNotifyLevel = user.notify_props.desktop; let globalNotifyLevelName; if (globalNotifyLevel === 'all') { globalNotifyLevelName = 'For all activity'; } else if (globalNotifyLevel === 'mention') { globalNotifyLevelName = 'Only for mentions'; } else { globalNotifyLevelName = 'Never'; } if (this.state.activeSection === 'desktop') { var notifyActive = [false, false, false, false]; if (this.state.notifyLevel === 'default') { notifyActive[0] = true; } else if (this.state.notifyLevel === 'all') { notifyActive[1] = true; } else if (this.state.notifyLevel === 'mention') { notifyActive[2] = true; } else { notifyActive[3] = true; } var inputs = []; inputs.push(



); handleUpdateSection = function updateSection(e) { this.updateSection(''); this.onListenerChange(); e.preventDefault(); }.bind(this); const extraInfo = ( {'Selecting an option other than "Default" will override the global notification settings. Desktop notifications are available on Firefox, Safari, and Chrome.'} ); return ( ); } var describe; if (this.state.notifyLevel === 'default') { describe = `Global default (${globalNotifyLevelName})`; } else if (this.state.notifyLevel === 'mention') { describe = 'Only for mentions'; } else if (this.state.notifyLevel === 'all') { describe = 'For all activity'; } else { describe = 'Never'; } handleUpdateSection = function updateSection(e) { this.updateSection('desktop'); e.preventDefault(); }.bind(this); return ( ); } handleSubmitMarkUnreadLevel() { const channelId = this.state.channelId; const markUnreadLevel = this.state.markUnreadLevel; if (ChannelStore.getMember(channelId).notify_props.mark_unread === markUnreadLevel) { this.updateSection(''); return; } const data = { channel_id: channelId, user_id: UserStore.getCurrentId(), mark_unread: markUnreadLevel }; Client.updateNotifyProps(data, () => { var member = ChannelStore.getMember(channelId); member.notify_props.mark_unread = markUnreadLevel; ChannelStore.setChannelMember(member); this.updateSection(''); }, (err) => { this.setState({serverError: err.message}); } ); } handleUpdateMarkUnreadLevel(markUnreadLevel) { this.setState({markUnreadLevel}); } createMarkUnreadLevelSection(serverError) { let content; if (this.state.activeSection === 'markUnreadLevel') { const inputs = [(


)]; const handleUpdateSection = function handleUpdateSection(e) { this.updateSection(''); this.onListenerChange(); e.preventDefault(); }.bind(this); const extraInfo = {'The channel name is bolded in the sidebar when there are unread messages. Selecting "Only for mentions" will bold the channel only when you are mentioned.'}; content = ( ); } else { let describe; if (!this.state.markUnreadLevel || this.state.markUnreadLevel === 'all') { describe = 'For all unread messages'; } else { describe = 'Only for mentions'; } const handleUpdateSection = function handleUpdateSection(e) { this.updateSection('markUnreadLevel'); e.preventDefault(); }.bind(this); content = ( ); } return content; } render() { var serverError = null; if (this.state.serverError) { serverError =
; } return ( {'Notification Preferences for '}{this.props.channel.display_name}

{this.createNotifyLevelSection(serverError)}
{this.createMarkUnreadLevelSection(serverError)}
{serverError} ); } } ChannelNotificationsModal.propTypes = { show: React.PropTypes.bool.isRequired, onHide: React.PropTypes.func.isRequired, channel: React.PropTypes.object.isRequired };