// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import SettingItemMin from 'components/setting_item_min.jsx';
import SettingItemMax from 'components/setting_item_max.jsx';
import $ from 'jquery';
import React from 'react';
import {Modal} from 'react-bootstrap';
import {FormattedMessage} from 'react-intl';
import {updateChannelNotifyProps} from 'actions/channel_actions.jsx';
export default class ChannelNotificationsModal extends React.Component {
constructor(props) {
super(props);
this.updateSection = this.updateSection.bind(this);
this.onHide = this.onHide.bind(this);
this.handleSubmitDesktopNotifyLevel = this.handleSubmitDesktopNotifyLevel.bind(this);
this.handleUpdateDesktopNotifyLevel = this.handleUpdateDesktopNotifyLevel.bind(this);
this.createDesktopNotifyLevelSection = this.createDesktopNotifyLevelSection.bind(this);
this.handleSubmitMarkUnreadLevel = this.handleSubmitMarkUnreadLevel.bind(this);
this.handleUpdateMarkUnreadLevel = this.handleUpdateMarkUnreadLevel.bind(this);
this.createMarkUnreadLevelSection = this.createMarkUnreadLevelSection.bind(this);
this.handleSubmitPushNotificationLevel = this.handleSubmitPushNotificationLevel.bind(this);
this.handleUpdatePushNotificationLevel = this.handleUpdatePushNotificationLevel.bind(this);
this.createPushNotificationLevelSection = this.createPushNotificationLevelSection.bind(this);
this.state = {
activeSection: '',
show: true,
notifyLevel: props.channelMember.notify_props.desktop,
unreadLevel: props.channelMember.notify_props.mark_unread,
pushLevel: props.channelMember.notify_props.push || 'default'
};
}
updateSection(section) {
if ($('.section-max').length) {
$('.settings-modal .modal-body').scrollTop(0).perfectScrollbar('update');
}
this.setState({activeSection: section});
}
onHide() {
this.setState({show: false});
}
handleSubmitDesktopNotifyLevel() {
const channelId = this.props.channel.id;
const notifyLevel = this.state.notifyLevel;
const currentUserId = this.props.currentUser.id;
if (this.props.channelMember.notify_props.desktop === notifyLevel) {
this.updateSection('');
return;
}
const options = {desktop: notifyLevel};
const data = {
channel_id: channelId,
user_id: currentUserId
};
updateChannelNotifyProps(data, options,
() => {
this.updateSection('');
},
(err) => {
this.setState({serverError: err.message});
}
);
}
handleUpdateDesktopNotifyLevel(notifyLevel) {
this.setState({notifyLevel});
}
createDesktopNotifyLevelSection(serverError) {
// Get glabal user setting for notifications
const globalNotifyLevel = this.props.currentUser.notify_props ? this.props.currentUser.notify_props.desktop : 'all';
let globalNotifyLevelName;
if (globalNotifyLevel === 'all') {
globalNotifyLevelName = (
);
} else if (globalNotifyLevel === 'mention') {
globalNotifyLevelName = (
);
} else {
globalNotifyLevelName = (
);
}
const sendDesktop = (
);
const notificationLevel = this.state.notifyLevel;
if (this.state.activeSection === 'desktop') {
const notifyActive = [false, false, false, false];
if (notificationLevel === 'default') {
notifyActive[0] = true;
} else if (notificationLevel === 'all') {
notifyActive[1] = true;
} else if (notificationLevel === 'mention') {
notifyActive[2] = true;
} else {
notifyActive[3] = true;
}
var inputs = [];
inputs.push(
);
const handleUpdateSection = function updateSection(e) {
this.updateSection('');
e.preventDefault();
}.bind(this);
const extraInfo = (
);
return (
);
}
var describe;
if (notificationLevel === 'default') {
describe = (
);
} else if (notificationLevel === 'mention') {
describe = ();
} else if (notificationLevel === 'all') {
describe = ();
} else {
describe = ();
}
return (
{
this.updateSection('desktop');
}}
/>
);
}
handleSubmitMarkUnreadLevel() {
const channelId = this.props.channel.id;
const markUnreadLevel = this.state.unreadLevel;
if (this.props.channelMember.notify_props.mark_unread === markUnreadLevel) {
this.updateSection('');
return;
}
const options = {mark_unread: markUnreadLevel};
const data = {
channel_id: channelId,
user_id: this.props.currentUser.id
};
updateChannelNotifyProps(data, options,
() => {
this.updateSection('');
},
(err) => {
this.setState({serverError: err.message});
}
);
}
handleUpdateMarkUnreadLevel(unreadLevel) {
this.setState({unreadLevel});
}
createMarkUnreadLevelSection(serverError) {
let content;
const markUnread = (
);
if (this.state.activeSection === 'markUnreadLevel') {
const inputs = [(
)];
const handleUpdateSection = function handleUpdateSection(e) {
this.updateSection('');
e.preventDefault();
}.bind(this);
const extraInfo = (
);
content = (
);
} else {
let describe;
if (!this.state.unreadLevel || this.state.unreadLevel === 'all') {
describe = (
);
} else {
describe = ();
}
const handleUpdateSection = function handleUpdateSection(e) {
this.updateSection('markUnreadLevel');
e.preventDefault();
}.bind(this);
content = (
);
}
return content;
}
handleSubmitPushNotificationLevel() {
const channelId = this.props.channel.id;
const notifyLevel = this.state.pushLevel;
const currentUserId = this.props.currentUser.id;
if (this.props.channelMember.notify_props.push === notifyLevel) {
this.updateSection('');
return;
}
const options = {push: notifyLevel};
const data = {
channel_id: channelId,
user_id: currentUserId
};
updateChannelNotifyProps(data, options,
() => {
this.updateSection('');
},
(err) => {
this.setState({serverError: err.message});
}
);
}
handleUpdatePushNotificationLevel(pushLevel) {
this.setState({pushLevel});
}
createPushNotificationLevelSection(serverError) {
if (global.mm_config.SendPushNotifications === 'false') {
return null;
}
// Get glabal user setting for notifications
const globalNotifyLevel = this.props.currentUser.notify_props ? this.props.currentUser.notify_props.push : 'all';
let globalNotifyLevelName;
if (globalNotifyLevel === 'all') {
globalNotifyLevelName = (
);
} else if (globalNotifyLevel === 'mention') {
globalNotifyLevelName = (
);
} else {
globalNotifyLevelName = (
);
}
const sendPushNotifications = (
);
const notificationLevel = this.state.pushLevel;
let content;
if (this.state.activeSection === 'push') {
const notifyActive = [false, false, false, false];
if (notificationLevel === 'default') {
notifyActive[0] = true;
} else if (notificationLevel === 'all') {
notifyActive[1] = true;
} else if (notificationLevel === 'mention') {
notifyActive[2] = true;
} else {
notifyActive[3] = true;
}
const inputs = [];
inputs.push(
);
const handleUpdateSection = function updateSection(e) {
this.updateSection('');
e.preventDefault();
}.bind(this);
const extraInfo = (
);
content = (
);
} else {
let describe;
if (notificationLevel === 'default') {
describe = (
);
} else if (notificationLevel === 'mention') {
describe = ();
} else if (notificationLevel === 'all') {
describe = ();
} else {
describe = ();
}
content = (
{
this.updateSection('push');
}}
/>
);
}
return (
);
}
render() {
let serverError = null;
if (this.state.serverError) {
serverError = ;
}
return (
{this.props.channel.display_name}
{this.createDesktopNotifyLevelSection(serverError)}
{this.createPushNotificationLevelSection(serverError)}
{this.createMarkUnreadLevelSection(serverError)}
{serverError}
);
}
}
ChannelNotificationsModal.propTypes = {
onHide: React.PropTypes.func.isRequired,
channel: React.PropTypes.object.isRequired,
channelMember: React.PropTypes.object.isRequired,
currentUser: React.PropTypes.object.isRequired
};