mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

Merge branch 'master' of https://github.com/mattermost/platform

Просмотр исходного кода 
Conflicts:
	web/react/components/channel_header.jsx
Этот коммит содержится в:
Asaad Mahmood
2015-08-04 23:03:55 +05:00
родитель ca7eb5d53c cef628c1d1
Коммит 25a584ab2c
2 изменённых файлов: 223 добавлений и 190 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

180
web/react/components/channel_header.jsx
Просмотреть файл

@@ -1,13 +1,11 @@
// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information. // See License.txt for license information.
var ChannelStore = require('../stores/channel_store.jsx'); var ChannelStore = require('../stores/channel_store.jsx');
var UserStore = require('../stores/user_store.jsx'); var UserStore = require('../stores/user_store.jsx');
var PostStore = require('../stores/post_store.jsx'); var PostStore = require('../stores/post_store.jsx');
var SocketStore = require('../stores/socket_store.jsx') var SocketStore = require('../stores/socket_store.jsx');
var UserProfile = require( './user_profile.jsx' ); var NavbarSearchBox = require('./search_bar.jsx');
var NavbarSearchBox =require('./search_bar.jsx');
var AsyncClient = require('../utils/async_client.jsx'); var AsyncClient = require('../utils/async_client.jsx');
var Client = require('../utils/client.jsx'); var Client = require('../utils/client.jsx');
var utils = require('../utils/utils.jsx'); var utils = require('../utils/utils.jsx');
@@ -21,23 +19,28 @@ var PopoverListMembers = React.createClass({
componentDidMount: function() { componentDidMount: function() {
var originalLeave = $.fn.popover.Constructor.prototype.leave; var originalLeave = $.fn.popover.Constructor.prototype.leave;
$.fn.popover.Constructor.prototype.leave = function(obj) { $.fn.popover.Constructor.prototype.leave = function(obj) {
var self = obj instanceof this.constructor ? obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type); var selfObj;
if (obj instanceof this.constructor) {
selfObj = obj;
} else {
selfObj = $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type);
}
originalLeave.call(this, obj); originalLeave.call(this, obj);
if (obj.currentTarget && self.$tip) { if (obj.currentTarget && selfObj.$tip) {
self.$tip.one('mouseenter', function() { selfObj.$tip.one('mouseenter', function() {
clearTimeout(self.timeout); clearTimeout(selfObj.timeout);
self.$tip.one('mouseleave', function() { selfObj.$tip.one('mouseleave', function() {
$.fn.popover.Constructor.prototype.leave.call(self, self); $.fn.popover.Constructor.prototype.leave.call(selfObj, selfObj);
}); });
}) });
} }
}; };
$("#member_popover").popover({placement : 'bottom', trigger: 'click', html: true}); $('#member_popover').popover({placement: 'bottom', trigger: 'click', html: true});
$('body').on('click', function (e) { $('body').on('click', function(e) {
if ($(e.target.parentNode.parentNode)[0] !== $("#member_popover")[0] && $(e.target).parents('.popover.in').length === 0) { if ($(e.target.parentNode.parentNode)[0] !== $('#member_popover')[0] && $(e.target).parents('.popover.in').length === 0) {
$("#member_popover").popover('hide'); $('#member_popover').popover('hide');
} }
}); });
}, },
@@ -45,22 +48,27 @@ var PopoverListMembers = React.createClass({
render: function() { render: function() {
var popoverHtml = ''; var popoverHtml = '';
var members = this.props.members; var members = this.props.members;
var count = (members.length > 20) ? "20+" : (members.length || '-'); var count;
if (members.length > 20) {
count = '20+';
} else {
count = members.length || '-';
}
if (members) { if (members) {
members.sort(function(a,b) { members.sort(function(a, b) {
return a.username.localeCompare(b.username); return a.username.localeCompare(b.username);
}); });
members.forEach(function(m) { members.forEach(function(m) {
popoverHtml += "<div class='text--nowrap'>" + m.username + "</div>"; popoverHtml += "<div class='text--nowrap'>" + m.username + '</div>';
}); });
} }
return ( return (
<div id="member_popover" data-toggle="popover" data-content={popoverHtml} data-original-title="Members" > <div id='member_popover' data-toggle='popover' data-content={popoverHtml} data-original-title='Members' >
<div id="member_tooltip" data-toggle="tooltip" data-placement="left" title="View Channel Members"> <div id='member_tooltip' data-toggle='tooltip' title='View Channel Members'>
{count} <span className="glyphicon glyphicon-user" aria-hidden="true"></span> {count} <span className='glyphicon glyphicon-user' aria-hidden='true'></span>
</div> </div>
</div> </div>
); );
@@ -68,53 +76,53 @@ var PopoverListMembers = React.createClass({
}); });
function getStateFromStores() { function getStateFromStores() {
return { return {
channel: ChannelStore.getCurrent(), channel: ChannelStore.getCurrent(),
memberChannel: ChannelStore.getCurrentMember(), memberChannel: ChannelStore.getCurrentMember(),
memberTeam: UserStore.getCurrentUser(), memberTeam: UserStore.getCurrentUser(),
users: ChannelStore.getCurrentExtraInfo().members, users: ChannelStore.getCurrentExtraInfo().members,
search_visible: PostStore.getSearchResults() != null searchVisible: PostStore.getSearchResults() != null
}; };
} }
module.exports = React.createClass({ module.exports = React.createClass({
displayName: 'ChannelHeader', displayName: 'ChannelHeader',
componentDidMount: function() { componentDidMount: function() {
ChannelStore.addChangeListener(this._onChange); ChannelStore.addChangeListener(this.onListenerChange);
ChannelStore.addExtraInfoChangeListener(this._onChange); ChannelStore.addExtraInfoChangeListener(this.onListenerChange);
PostStore.addSearchChangeListener(this._onChange); PostStore.addSearchChangeListener(this.onListenerChange);
UserStore.addChangeListener(this._onChange); UserStore.addChangeListener(this.onListenerChange);
SocketStore.addChangeListener(this._onSocketChange); SocketStore.addChangeListener(this.onSocketChange);
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
ChannelStore.removeChangeListener(this._onChange); ChannelStore.removeChangeListener(this.onListenerChange);
ChannelStore.removeExtraInfoChangeListener(this._onChange); ChannelStore.removeExtraInfoChangeListener(this.onListenerChange);
PostStore.removeSearchChangeListener(this._onChange); PostStore.removeSearchChangeListener(this.onListenerChange);
UserStore.addChangeListener(this._onChange); UserStore.addChangeListener(this.onListenerChange);
}, },
_onChange: function() { onListenerChange: function() {
var newState = getStateFromStores(); var newState = getStateFromStores();
if (!utils.areStatesEqual(newState, this.state)) { if (!utils.areStatesEqual(newState, this.state)) {
this.setState(newState); this.setState(newState);
} }
$(".channel-header__info .description").popover({placement : 'bottom', trigger: 'hover', html: true, delay: {show: 500, hide: 500}}); $('.channel-header__info .description').popover({placement: 'bottom', trigger: 'hover', html: true, delay: {show: 500, hide: 500}});
}, },
_onSocketChange: function(msg) { onSocketChange: function(msg) {
if (msg.action === "new_user") { if (msg.action === 'new_user') {
AsyncClient.getChannelExtraInfo(true); AsyncClient.getChannelExtraInfo(true);
} }
}, },
getInitialState: function() { getInitialState: function() {
return getStateFromStores(); return getStateFromStores();
}, },
handleLeave: function(e) { handleLeave: function() {
Client.leaveChannel(this.state.channel.id, Client.leaveChannel(this.state.channel.id,
function(data) { function() {
var townsquare = ChannelStore.getByName('town-square'); var townsquare = ChannelStore.getByName('town-square');
utils.switchChannel(townsquare); utils.switchChannel(townsquare);
}, },
function(err) { function(err) {
AsyncClient.dispatchError(err, "handleLeave"); AsyncClient.dispatchError(err, 'handleLeave');
} }
); );
}, },
@@ -123,9 +131,16 @@ module.exports = React.createClass({
var user = UserStore.getCurrentUser(); var user = UserStore.getCurrentUser();
var terms = ""; var terms = '';
if (user.notify_props && user.notify_props.mention_keys) { if (user.notify_props && user.notify_props.mention_keys) {
terms = UserStore.getCurrentMentionKeys().join(' '); var termKeys = UserStore.getCurrentMentionKeys();
if (user.notify_props.all === 'true' && termKeys.indexOf('@all') !== -1) {
termKeys.splice(termKeys.indexOf('@all'), 1);
}
if (user.notify_props.channel === 'true' && termKeys.indexOf('@channel') !== -1) {
termKeys.splice(termKeys.indexOf('@channel'), 1);
}
terms = termKeys.join(' ');
} }
AppDispatcher.handleServerAction({ AppDispatcher.handleServerAction({
@@ -135,81 +150,84 @@ module.exports = React.createClass({
is_mention_search: true is_mention_search: true
}); });
}, },
render: function() { render: function() {
if (this.state.channel == null) { if (this.state.channel == null) {
return null; return null;
} }
var channel = this.state.channel; var channel = this.state.channel;
var description = utils.textToJsx(channel.description, {"singleline": true, "noMentionHighlight": true}); var description = utils.textToJsx(channel.description, {singleline: true, noMentionHighlight: true});
var popoverContent = React.renderToString(<MessageWrapper message={channel.description}/>); var popoverContent = React.renderToString(<MessageWrapper message={channel.description}/>);
var channelTitle = channel.display_name; var channelTitle = channel.display_name;
var currentId = UserStore.getCurrentId(); var currentId = UserStore.getCurrentId();
var isAdmin = this.state.memberChannel.roles.indexOf("admin") > -1 || this.state.memberTeam.roles.indexOf("admin") > -1; var isAdmin = this.state.memberChannel.roles.indexOf('admin') > -1 || this.state.memberTeam.roles.indexOf('admin') > -1;
var isDirect = (this.state.channel.type === 'D'); var isDirect = (this.state.channel.type === 'D');
if (isDirect) { if (isDirect) {
if (this.state.users.length > 1) { if (this.state.users.length > 1) {
var contact = this.state.users[((this.state.users[0].id === currentId) ? 1 : 0)]; var contact;
if (this.state.users[0].id === currentId) {
contact = this.state.users[1];
} else {
contact = this.state.users[0];
}
channelTitle = contact.nickname || contact.username; channelTitle = contact.nickname || contact.username;
} }
} }
return ( return (
<table className="channel-header alt"> <table className='channel-header alt'>
<tr> <tr>
<th> <th>
<div className="channel-header__info"> <div className='channel-header__info'>
<div className="dropdown"> <div className='dropdown'>
<a href="#" className="dropdown-toggle theme" type="button" id="channel_header_dropdown" data-toggle="dropdown" aria-expanded="true"> <a href='#' className='dropdown-toggle theme' type='button' id='channel_header_dropdown' data-toggle='dropdown' aria-expanded='true'>
<strong className="heading">{channelTitle} </strong> <strong className='heading'>{channelTitle} </strong>
<span className="glyphicon glyphicon-chevron-down header-dropdown__icon"></span> <span className='glyphicon glyphicon-chevron-down header-dropdown__icon'></span>
</a> </a>
{ !isDirect ? {!isDirect ?
<ul className="dropdown-menu" role="menu" aria-labelledby="channel_header_dropdown"> <ul className='dropdown-menu' role='menu' aria-labelledby='channel_header_dropdown'>
<li role="presentation"><a role="menuitem" data-toggle="modal" data-target="#channel_info" data-channelid={channel.id} href="#">View Info</a></li> <li role='presentation'><a role='menuitem' data-toggle='modal' data-target='#channel_info' data-channelid={channel.id} href='#'>View Info</a></li>
{ !ChannelStore.isDefault(channel) ? {!ChannelStore.isDefault(channel) ?
<li role="presentation"><a role="menuitem" data-toggle="modal" data-target="#channel_invite" href="#">Add Members</a></li> <li role='presentation'><a role='menuitem' data-toggle='modal' data-target='#channel_invite' href='#'>Add Members</a></li>
: null : null
} }
{ isAdmin && !ChannelStore.isDefault(channel) ? {isAdmin && !ChannelStore.isDefault(channel) ?
<li role="presentation"><a role="menuitem" data-toggle="modal" data-target="#channel_members" href="#">Manage Members</a></li> <li role='presentation'><a role='menuitem' data-toggle='modal' data-target='#channel_members' href='#'>Manage Members</a></li>
: null : null
} }
<li role="presentation"><a role="menuitem" href="#" data-toggle="modal" data-target="#edit_channel" data-desc={channel.description} data-title={channel.display_name} data-channelid={channel.id}>Set Channel Description...</a></li> <li role='presentation'><a role='menuitem' href='#' data-toggle='modal' data-target='#edit_channel' data-desc={channel.description} data-title={channel.display_name} data-channelid={channel.id}>Set Channel Description...</a></li>
<li role="presentation"><a role="menuitem" href="#" data-toggle="modal" data-target="#channel_notifications" data-title={channel.display_name} data-channelid={channel.id}>Notification Preferences</a></li> <li role='presentation'><a role='menuitem' href='#' data-toggle='modal' data-target='#channel_notifications' data-title={channel.display_name} data-channelid={channel.id}>Notification Preferences</a></li>
{ isAdmin && !ChannelStore.isDefault(channel) ? {isAdmin && !ChannelStore.isDefault(channel) ?
<li role="presentation"><a role="menuitem" href="#" data-toggle="modal" data-target="#rename_channel" data-display={channel.display_name} data-name={channel.name} data-channelid={channel.id}>Rename Channel...</a></li> <li role='presentation'><a role='menuitem' href='#' data-toggle='modal' data-target='#rename_channel' data-display={channel.display_name} data-name={channel.name} data-channelid={channel.id}>Rename Channel...</a></li>
: null : null
} }
{ isAdmin && !ChannelStore.isDefault(channel) ? {isAdmin && !ChannelStore.isDefault(channel) ?
<li role="presentation"><a role="menuitem" href="#" data-toggle="modal" data-target="#delete_channel" data-title={channel.display_name} data-channelid={channel.id}>Delete Channel...</a></li> <li role='presentation'><a role='menuitem' href='#' data-toggle='modal' data-target='#delete_channel' data-title={channel.display_name} data-channelid={channel.id}>Delete Channel...</a></li>
: null : null
} }
{ !ChannelStore.isDefault(channel) ? {!ChannelStore.isDefault(channel) ?
<li role="presentation"><a role="menuitem" href="#" onClick={this.handleLeave}>Leave Channel</a></li> <li role='presentation'><a role='menuitem' href='#' onClick={this.handleLeave}>Leave Channel</a></li>
: null : null
} }
</ul> </ul>
: :
<ul className="dropdown-menu" role="menu" aria-labelledby="channel_header_dropdown"> <ul className='dropdown-menu' role='menu' aria-labelledby='channel_header_dropdown'>
<li role="presentation"><a role="menuitem" href="#" data-toggle="modal" data-target="#edit_channel" data-desc={channel.description} data-title={channel.display_name} data-channelid={channel.id}>Set Channel Description...</a></li> <li role='presentation'><a role='menuitem' href='#' data-toggle='modal' data-target='#edit_channel' data-desc={channel.description} data-title={channel.display_name} data-channelid={channel.id}>Set Channel Description...</a></li>
</ul> </ul>
} }
</div> </div>
<div data-toggle="popover" data-content={popoverContent} className="description">{description}</div> <div data-toggle='popover' data-content={popoverContent} className='description'>{description}</div>
</div> </div>
</th> </th>
<th><PopoverListMembers members={this.state.users} channelId={channel.id} /></th> <th><PopoverListMembers members={this.state.users} channelId={channel.id} /></th>
<th className="search-bar__container"><NavbarSearchBox /></th> <th className='search-bar__container'><NavbarSearchBox /></th>
<th> <th>
<div className="dropdown channel-header__links"> <div className='dropdown channel-header__links'>
<a href="#" className="dropdown-toggle theme" type="button" id="channel_header_right_dropdown" data-toggle="dropdown" aria-expanded="true"> <a href='#' className='dropdown-toggle theme' type='button' id='channel_header_right_dropdown' data-toggle='dropdown' aria-expanded='true'>
<span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON }} /> </a> <span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} /> </a>
<ul className="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="channel_header_right_dropdown"> <ul className='dropdown-menu dropdown-menu-right' role='menu' aria-labelledby='channel_header_right_dropdown'>
<li role="presentation"><a role="menuitem" href="#" onClick={this.searchMentions}>Recent Mentions</a></li> <li role='presentation'><a role='menuitem' href='#' onClick={this.searchMentions}>Recent Mentions</a></li>
</ul> </ul>
</div> </div>
</th> </th>

233
web/react/components/sidebar.jsx
Просмотреть файл

@@ -7,7 +7,7 @@ var AsyncClient = require('../utils/async_client.jsx');
var SocketStore = require('../stores/socket_store.jsx'); var SocketStore = require('../stores/socket_store.jsx');
var UserStore = require('../stores/user_store.jsx'); var UserStore = require('../stores/user_store.jsx');
var TeamStore = require('../stores/team_store.jsx'); var TeamStore = require('../stores/team_store.jsx');
var BrowserStore = require('../stores/browser_store.jsx') var BrowserStore = require('../stores/browser_store.jsx');
var utils = require('../utils/utils.jsx'); var utils = require('../utils/utils.jsx');
var SidebarHeader = require('./sidebar_header.jsx'); var SidebarHeader = require('./sidebar_header.jsx');
var SearchBox = require('./search_bar.jsx'); var SearchBox = require('./search_bar.jsx');
@@ -17,13 +17,15 @@ var ActionTypes = Constants.ActionTypes;
function getStateFromStores() { function getStateFromStores() {
var members = ChannelStore.getAllMembers(); var members = ChannelStore.getAllMembers();
var team_member_map = UserStore.getActiveOnlyProfiles(); var teamMemberMap = UserStore.getActiveOnlyProfiles();
var current_id = ChannelStore.getCurrentId(); var currentId = ChannelStore.getCurrentId();
var teammates = []; var teammates = [];
for (var id in team_member_map) { for (var id in teamMemberMap) {
if (id === UserStore.getCurrentId()) continue; if (id === UserStore.getCurrentId()) {
teammates.push(team_member_map[id]); continue;
}
teammates.push(teamMemberMap[id]);
} }
// Create lists of all read and unread direct channels // Create lists of all read and unread direct channels
@@ -32,11 +34,11 @@ function getStateFromStores() {
for (var i = 0; i < teammates.length; i++) { for (var i = 0; i < teammates.length; i++) {
var teammate = teammates[i]; var teammate = teammates[i];
if (teammate.id == UserStore.getCurrentId()) { if (teammate.id === UserStore.getCurrentId()) {
continue; continue;
} }
var channelName = ""; var channelName = '';
if (teammate.id > UserStore.getCurrentId()) { if (teammate.id > UserStore.getCurrentId()) {
channelName = UserStore.getCurrentId() + '__' + teammate.id; channelName = UserStore.getCurrentId() + '__' + teammate.id;
} else { } else {
@@ -46,17 +48,17 @@ function getStateFromStores() {
var channel = ChannelStore.getByName(channelName); var channel = ChannelStore.getByName(channelName);
if (channel != null) { if (channel != null) {
channel.display_name = utils.getDisplayName(teammate); channel.display_name = teammate.username;
channel.teammate_username = teammate.username; channel.teammate_username = teammate.username;
channel.status = UserStore.getStatus(teammate.id); channel.status = UserStore.getStatus(teammate.id);
var channelMember = members[channel.id]; var channelMember = members[channel.id];
var msg_count = channel.total_msg_count - channelMember.msg_count; var msgCount = channel.total_msg_count - channelMember.msg_count;
if (msg_count > 0) { if (msgCount > 0) {
channel.unread = msg_count; channel.unread = msgCount;
showDirectChannels.push(channel); showDirectChannels.push(channel);
} else if (current_id === channel.id) { } else if (currentId === channel.id) {
showDirectChannels.push(channel); showDirectChannels.push(channel);
} else { } else {
readDirectChannels.push(channel); readDirectChannels.push(channel);
@@ -74,13 +76,22 @@ function getStateFromStores() {
// If we don't have MAX_DMS unread channels, sort the read list by last_post_at // If we don't have MAX_DMS unread channels, sort the read list by last_post_at
if (showDirectChannels.length < Constants.MAX_DMS) { if (showDirectChannels.length < Constants.MAX_DMS) {
readDirectChannels.sort(function(a,b) { readDirectChannels.sort(function(a, b) {
// sort by last_post_at first // sort by last_post_at first
if (a.last_post_at > b.last_post_at) return -1; if (a.last_post_at > b.last_post_at) {
if (a.last_post_at < b.last_post_at) return 1; return -1;
}
if (a.last_post_at < b.last_post_at) {
return 1;
}
// if last_post_at is equal, sort by name // if last_post_at is equal, sort by name
if (a.display_name < b.display_name) return -1; if (a.display_name < b.display_name) {
if (a.display_name > b.display_name) return 1; return -1;
}
if (a.display_name > b.display_name) {
return 1;
}
return 0; return 0;
}); });
@@ -91,15 +102,19 @@ function getStateFromStores() {
} }
readDirectChannels = readDirectChannels.slice(index); readDirectChannels = readDirectChannels.slice(index);
showDirectChannels.sort(function(a,b) { showDirectChannels.sort(function(a, b) {
if (a.display_name < b.display_name) return -1; if (a.display_name < b.display_name) {
if (a.display_name > b.display_name) return 1; return -1;
}
if (a.display_name > b.display_name) {
return 1;
}
return 0; return 0;
}); });
} }
return { return {
active_id: current_id, active_id: currentId,
channels: ChannelStore.getAll(), channels: ChannelStore.getAll(),
members: members, members: members,
showDirectChannels: showDirectChannels, showDirectChannels: showDirectChannels,
@@ -108,12 +123,13 @@ function getStateFromStores() {
} }
module.exports = React.createClass({ module.exports = React.createClass({
displayName: 'Sidebar',
componentDidMount: function() { componentDidMount: function() {
ChannelStore.addChangeListener(this._onChange); ChannelStore.addChangeListener(this.onChange);
UserStore.addChangeListener(this._onChange); UserStore.addChangeListener(this.onChange);
UserStore.addStatusesChangeListener(this._onChange); UserStore.addStatusesChangeListener(this.onChange);
SocketStore.addChangeListener(this._onSocketChange); SocketStore.addChangeListener(this.onSocketChange);
$(".nav-pills__container").perfectScrollbar(); $('.nav-pills__container').perfectScrollbar();
this.updateTitle(); this.updateTitle();
}, },
@@ -121,93 +137,88 @@ module.exports = React.createClass({
this.updateTitle(); this.updateTitle();
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
ChannelStore.removeChangeListener(this._onChange); ChannelStore.removeChangeListener(this.onChange);
UserStore.removeChangeListener(this._onChange); UserStore.removeChangeListener(this.onChange);
UserStore.removeStatusesChangeListener(this._onChange); UserStore.removeStatusesChangeListener(this.onChange);
SocketStore.removeChangeListener(this._onSocketChange); SocketStore.removeChangeListener(this.onSocketChange);
}, },
_onChange: function() { onChange: function() {
var newState = getStateFromStores(); var newState = getStateFromStores();
if (!utils.areStatesEqual(newState, this.state)) { if (!utils.areStatesEqual(newState, this.state)) {
this.setState(newState); this.setState(newState);
} }
}, },
_onSocketChange: function(msg) { onSocketChange: function(msg) {
if (msg.action == "posted") { if (msg.action === 'posted') {
if (ChannelStore.getCurrentId() === msg.channel_id) { if (ChannelStore.getCurrentId() === msg.channel_id) {
AsyncClient.getChannels(true, window.isActive); AsyncClient.getChannels(true, window.isActive);
} else { } else {
AsyncClient.getChannels(true); AsyncClient.getChannels(true);
} }
if (UserStore.getCurrentId() != msg.user_id) { if (UserStore.getCurrentId() !== msg.user_id) {
var mentions = msg.props.mentions ? JSON.parse(msg.props.mentions) : []; var mentions = msg.props.mentions ? JSON.parse(msg.props.mentions) : [];
var channel = ChannelStore.get(msg.channel_id); var channel = ChannelStore.get(msg.channel_id);
var user = UserStore.getCurrentUser(); var user = UserStore.getCurrentUser();
if (user.notify_props && ((user.notify_props.desktop === "mention" && mentions.indexOf(user.id) === -1 && channel.type !== 'D') || user.notify_props.desktop === "none")) { if (user.notify_props && ((user.notify_props.desktop === 'mention' && mentions.indexOf(user.id) === -1 && channel.type !== 'D') || user.notify_props.desktop === 'none')) {
return; return;
} }
var member = ChannelStore.getMember(msg.channel_id); var member = ChannelStore.getMember(msg.channel_id);
if ((member.notify_level === "mention" && mentions.indexOf(user.id) === -1) || member.notify_level === "none" || member.notify_level === "quiet") { if ((member.notify_level === 'mention' && mentions.indexOf(user.id) === -1) || member.notify_level === 'none' || member.notify_level === 'quiet') {
return; return;
} }
var username = "Someone"; var username = 'Someone';
if (UserStore.hasProfile(msg.user_id)) { if (UserStore.hasProfile(msg.user_id)) {
username = UserStore.getProfile(msg.user_id).username; username = UserStore.getProfile(msg.user_id).username;
} }
var title = channel ? channel.display_name : "Posted"; var title = channel ? channel.display_name : 'Posted';
var repRegex = new RegExp("<br>", "g"); var repRegex = new RegExp('<br>', 'g');
var post = JSON.parse(msg.props.post); var post = JSON.parse(msg.props.post);
var msgProps = msg.props; var msgProps = msg.props;
var msg = post.message.replace(repRegex, "\n").replace(/\n+/g, " ").replace("<mention>", "").replace("</mention>", ""); var notifyText = post.message.replace(repRegex, '\n').replace(/\n+/g, ' ').replace('<mention>', '').replace('</mention>', '');
if (msg.length > 50) { if (notifyText.length > 50) {
msg = msg.substring(0,49) + "..."; notifyText = notifyText.substring(0, 49) + '...';
} }
if (msg.length === 0) { if (notifyText.length === 0) {
if (msgProps.image) { if (msgProps.image) {
utils.notifyMe(title, username + " uploaded an image", channel); utils.notifyMe(title, username + ' uploaded an image', channel);
} } else if (msgProps.otherFile) {
else if (msgProps.otherFile) { utils.notifyMe(title, username + ' uploaded a file', channel);
utils.notifyMe(title, username + " uploaded a file", channel); } else {
} utils.notifyMe(title, username + ' did something new', channel);
else {
utils.notifyMe(title, username + " did something new", channel);
} }
} else {
utils.notifyMe(title, username + ' wrote: ' + notifyText, channel);
} }
else { if (!user.notify_props || user.notify_props.desktop_sound === 'true') {
utils.notifyMe(title, username + " wrote: " + msg, channel);
}
if (!user.notify_props || user.notify_props.desktop_sound === "true") {
utils.ding(); utils.ding();
} }
} }
} else if (msg.action === 'viewed') {
} else if (msg.action == "viewed") {
if (ChannelStore.getCurrentId() != msg.channel_id) { if (ChannelStore.getCurrentId() != msg.channel_id) {
AsyncClient.getChannels(true); AsyncClient.getChannels(true);
} }
} else if (msg.action == "user_added") { } else if (msg.action === 'user_added') {
if (UserStore.getCurrentId() === msg.user_id) { if (UserStore.getCurrentId() === msg.user_id) {
AsyncClient.getChannels(true); AsyncClient.getChannels(true);
} }
} else if(msg.action === "user_removed") { } else if (msg.action === 'user_removed') {
if(msg.user_id === UserStore.getCurrentId()) { if (msg.user_id === UserStore.getCurrentId()) {
AsyncClient.getChannels(true); AsyncClient.getChannels(true);
if(msg.props.channel_id === ChannelStore.getCurrentId() && $('#removed_from_channel').length > 0) { if (msg.props.channel_id === ChannelStore.getCurrentId() && $('#removed_from_channel').length > 0) {
var sentState = {}; var sentState = {};
sentState.channelName = ChannelStore.getCurrent().display_name; sentState.channelName = ChannelStore.getCurrent().display_name;
sentState.remover = UserStore.getProfile(msg.props.remover).username; sentState.remover = UserStore.getProfile(msg.props.remover).username;
BrowserStore.setItem('channel-removed-state',sentState); BrowserStore.setItem('channel-removed-state', sentState);
$('#removed_from_channel').modal('show'); $('#removed_from_channel').modal('show');
} }
} }
@@ -217,10 +228,10 @@ module.exports = React.createClass({
var channel = ChannelStore.getCurrent(); var channel = ChannelStore.getCurrent();
if (channel) { if (channel) {
if (channel.type === 'D') { if (channel.type === 'D') {
var teammate_username = utils.getDirectTeammate(channel.id).username var teammate_username = utils.getDirectTeammate(channel.id).username;
document.title = teammate_username + " " + document.title.substring(document.title.lastIndexOf("-")); document.title = teammate_username + ' ' + document.title.substring(document.title.lastIndexOf('-'));
} else { } else {
document.title = channel.display_name + " " + document.title.substring(document.title.lastIndexOf("-")) document.title = channel.display_name + ' ' + document.title.substring(document.title.lastIndexOf('-'));
} }
} }
}, },
@@ -229,92 +240,96 @@ module.exports = React.createClass({
}, },
render: function() { render: function() {
var members = this.state.members; var members = this.state.members;
var newsActive = window.location.pathname === "/" ? "active" : ""; var newsActive = window.location.pathname === '/' ? 'active' : '';
var badgesActive = false; var badgesActive = false;
var self = this; var self = this;
var channelItems = this.state.channels.map(function(channel) { var channelItems = this.state.channels.map(function(channel) {
if (channel.type != 'O') { if (channel.type != 'O') {
return ""; return '';
} }
var channelMember = members[channel.id]; var channelMember = members[channel.id];
var active = channel.id === self.state.active_id ? "active" : ""; var active = channel.id === self.state.active_id ? 'active' : '';
var msg_count = channel.total_msg_count - channelMember.msg_count; var msgCount = channel.total_msg_count - channelMember.msg_count;
var titleClass = "" var titleClass = '';
if (msg_count > 0 && channelMember.notify_level !== "quiet") { if (msgCount > 0 && channelMember.notify_level !== 'quiet') {
titleClass = "unread-title" titleClass = 'unread-title';
} }
var badge = ""; var badge = '';
if (channelMember.mention_count > 0) { if (channelMember.mention_count > 0) {
badge = <span className="badge pull-right small">{channelMember.mention_count}</span>; badge = <span className='badge pull-right small'>{channelMember.mention_count}</span>;
badgesActive = true; badgesActive = true;
titleClass = "unread-title" titleClass = 'unread-title';
} }
return ( return (
<li key={channel.id} className={active}><a className={"sidebar-channel " + titleClass} href="#" onClick={function(e){e.preventDefault(); utils.switchChannel(channel);}}>{badge}{channel.display_name}</a></li> <li key={channel.id} className={active}><a className={'sidebar-channel ' + titleClass} href='#' onClick={function(e){e.preventDefault(); utils.switchChannel(channel);}}>{badge}{channel.display_name}</a></li>
); );
}); });
var privateChannelItems = this.state.channels.map(function(channel) { var privateChannelItems = this.state.channels.map(function(channel) {
if (channel.type != 'P') { if (channel.type !== 'P') {
return ""; return '';
} }
var channelMember = members[channel.id]; var channelMember = members[channel.id];
var active = channel.id === self.state.active_id ? "active" : ""; var active = channel.id === self.state.active_id ? 'active' : '';
var msg_count = channel.total_msg_count - channelMember.msg_count; var msgCount = channel.total_msg_count - channelMember.msg_count;
var titleClass = "" var titleClass = ''
if (msg_count > 0 && channelMember.notify_level !== "quiet") { if (msgCount > 0 && channelMember.notify_level !== 'quiet') {
titleClass = "unread-title" titleClass = 'unread-title'
} }
var badge = ""; var badge = '';
if (channelMember.mention_count > 0) { if (channelMember.mention_count > 0) {
badge = <span className="badge pull-right small">{channelMember.mention_count}</span>; badge = <span className='badge pull-right small'>{channelMember.mention_count}</span>;
badgesActive = true; badgesActive = true;
titleClass = "unread-title" titleClass = 'unread-title';
} }
return ( return (
<li key={channel.id} className={active}><a className={"sidebar-channel " + titleClass} href="#" onClick={function(e){e.preventDefault(); utils.switchChannel(channel);}}>{badge}{channel.display_name}</a></li> <li key={channel.id} className={active}><a className={'sidebar-channel ' + titleClass} href='#' onClick={function(e){e.preventDefault(); utils.switchChannel(channel);}}>{badge}{channel.display_name}</a></li>
); );
}); });
var directMessageItems = this.state.showDirectChannels.map(function(channel) { var directMessageItems = this.state.showDirectChannels.map(function(channel) {
var badge = ""; var badge = '';
var titleClass = ""; var titleClass = '';
var statusIcon = ""; var statusIcon = '';
if (channel.status === "online") { if (channel.status === 'online') {
statusIcon = Constants.ONLINE_ICON_SVG; statusIcon = Constants.ONLINE_ICON_SVG;
} else if (channel.status === "away") { } else if (channel.status === 'away') {
statusIcon = Constants.ONLINE_ICON_SVG; statusIcon = Constants.ONLINE_ICON_SVG;
} else { } else {
statusIcon = Constants.OFFLINE_ICON_SVG; statusIcon = Constants.OFFLINE_ICON_SVG;
} }
if (!channel.fake) { if (!channel.fake) {
var active = channel.id === self.state.active_id ? "active" : ""; var active = channel.id === self.state.active_id ? 'active' : '';
if (channel.unread) { if (channel.unread) {
badge = <span className="badge pull-right small">{channel.unread}</span>; badge = <span className='badge pull-right small'>{channel.unread}</span>;
badgesActive = true; badgesActive = true;
titleClass = "unread-title" titleClass = 'unread-title';
}
function handleClick(e) {
e.preventDefault();
utils.switchChannel(channel, channel.teammate_username);
} }
return ( return (
<li key={channel.name} className={active}><a className={"sidebar-channel " + titleClass} href="#" onClick={function(e){e.preventDefault(); utils.switchChannel(channel, channel.teammate_username);}}><span className="status" dangerouslySetInnerHTML={{__html: statusIcon}} /> {badge}{channel.display_name}</a></li> <li key={channel.name} className={active}><a className={'sidebar-channel ' + titleClass} href='#' onClick={handleClick}><span className='status' dangerouslySetInnerHTML={{__html: statusIcon}} /> {badge}{channel.display_name}</a></li>
); );
} else { } else {
return ( return (
<li key={channel.name} className={active}><a className={"sidebar-channel " + titleClass} href={TeamStore.getCurrentTeamUrl() + "/channels/"+channel.name}><span className="status" dangerouslySetInnerHTML={{__html: statusIcon}} /> {badge}{channel.display_name}</a></li> <li key={channel.name} className={active}><a className={'sidebar-channel ' + titleClass} href={TeamStore.getCurrentTeamUrl() + '/channels/' + channel.name}><span className='status' dangerouslySetInnerHTML={{__html: statusIcon}} /> {badge}{channel.display_name}</a></li>
); );
} }
}); });
var link = document.createElement('link'); var link = document.createElement('link');
@@ -345,23 +360,23 @@ module.exports = React.createClass({
<SidebarHeader teamDisplayName={this.props.teamDisplayName} teamType={this.props.teamType} /> <SidebarHeader teamDisplayName={this.props.teamDisplayName} teamType={this.props.teamType} />
<SearchBox /> <SearchBox />
<div className="nav-pills__container"> <div className='nav-pills__container'>
<ul className="nav nav-pills nav-stacked"> <ul className='nav nav-pills nav-stacked'>
<li><h4>Channels<a className="add-channel-btn" href="#" data-toggle="modal" data-target="#new_channel" data-channeltype="O">+</a></h4></li> <li><h4>Channels<a className='add-channel-btn' href='#' data-toggle='modal' data-target='#new_channel' data-channeltype='O'>+</a></h4></li>
{channelItems} {channelItems}
<li><a href="#" data-toggle="modal" className="nav-more" data-target="#more_channels" data-channeltype="O">More...</a></li> <li><a href='#' data-toggle='modal' className='nav-more' data-target='#more_channels' data-channeltype='O'>More...</a></li>
</ul> </ul>
<ul className="nav nav-pills nav-stacked"> <ul className='nav nav-pills nav-stacked'>
<li><h4>Private Groups<a className="add-channel-btn" href="#" data-toggle="modal" data-target="#new_channel" data-channeltype="P">+</a></h4></li> <li><h4>Private Groups<a className='add-channel-btn' href='#' data-toggle='modal' data-target='#new_channel' data-channeltype='P'>+</a></h4></li>
{privateChannelItems} {privateChannelItems}
</ul> </ul>
<ul className="nav nav-pills nav-stacked"> <ul className='nav nav-pills nav-stacked'>
<li><h4>Private Messages</h4></li> <li><h4>Private Messages</h4></li>
{directMessageItems} {directMessageItems}
{ this.state.hideDirectChannels.length > 0 ? { this.state.hideDirectChannels.length > 0 ?
<li><a href="#" data-toggle="modal" className="nav-more" data-target="#more_direct_channels" data-channels={JSON.stringify(this.state.hideDirectChannels)}>{"More ("+this.state.hideDirectChannels.length+")"}</a></li> <li><a href='#' data-toggle='modal' className='nav-more' data-target='#more_direct_channels' data-channels={JSON.stringify(this.state.hideDirectChannels)}>{'More ('+this.state.hideDirectChannels.length+')'}</a></li>
: "" } : '' }
</ul> </ul>
</div> </div>
</div> </div>