// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.
var ChannelStore = require('../stores/channel_store.jsx');
var UserStore = require('../stores/user_store.jsx');
var PostStore = require('../stores/post_store.jsx');
var SocketStore = require('../stores/socket_store.jsx')
var UserProfile = require( './user_profile.jsx' );
var NavbarSearchBox =require('./search_bar.jsx');
var AsyncClient = require('../utils/async_client.jsx');
var Client = require('../utils/client.jsx');
var utils = require('../utils/utils.jsx');
var MessageWrapper = require('./message_wrapper.jsx');
var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
var Constants = require('../utils/constants.jsx');
var ActionTypes = Constants.ActionTypes;
var PopoverListMembers = React.createClass({
componentDidMount: function() {
var originalLeave = $.fn.popover.Constructor.prototype.leave;
$.fn.popover.Constructor.prototype.leave = function(obj) {
var self = obj instanceof this.constructor ? obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type);
originalLeave.call(this, obj);
if (obj.currentTarget && self.$tip) {
self.$tip.one('mouseenter', function() {
clearTimeout(self.timeout);
self.$tip.one('mouseleave', function() {
$.fn.popover.Constructor.prototype.leave.call(self, self);
});
})
}
};
$("#member_popover").popover({placement : 'bottom', trigger: 'click', html: true});
$('body').on('click', function (e) {
if ($(e.target.parentNode.parentNode)[0] !== $("#member_popover")[0] && $(e.target).parents('.popover.in').length === 0) {
$("#member_popover").popover('hide');
}
});
},
render: function() {
var popoverHtml = '';
var members = this.props.members;
var count = (members.length > 20) ? "20+" : (members.length || '-');
if (members) {
members.sort(function(a,b) {
return a.username.localeCompare(b.username);
});
members.forEach(function(m) {
popoverHtml += "
" + m.username + "
";
});
}
return (
);
}
});
function getStateFromStores() {
return {
channel: ChannelStore.getCurrent(),
memberChannel: ChannelStore.getCurrentMember(),
memberTeam: UserStore.getCurrentUser(),
users: ChannelStore.getCurrentExtraInfo().members,
search_visible: PostStore.getSearchResults() != null
};
}
module.exports = React.createClass({
displayName: 'ChannelHeader',
componentDidMount: function() {
ChannelStore.addChangeListener(this._onChange);
ChannelStore.addExtraInfoChangeListener(this._onChange);
PostStore.addSearchChangeListener(this._onChange);
UserStore.addChangeListener(this._onChange);
SocketStore.addChangeListener(this._onSocketChange);
},
componentWillUnmount: function() {
ChannelStore.removeChangeListener(this._onChange);
ChannelStore.removeExtraInfoChangeListener(this._onChange);
PostStore.removeSearchChangeListener(this._onChange);
UserStore.addChangeListener(this._onChange);
},
_onChange: function() {
var newState = getStateFromStores();
if (!utils.areStatesEqual(newState, this.state)) {
this.setState(newState);
}
$(".channel-header__info .description").popover({placement : 'bottom', trigger: 'hover', html: true, delay: {show: 500, hide: 500}});
},
_onSocketChange: function(msg) {
if (msg.action === "new_user") {
AsyncClient.getChannelExtraInfo(true);
}
},
getInitialState: function() {
return getStateFromStores();
},
handleLeave: function(e) {
Client.leaveChannel(this.state.channel.id,
function(data) {
var townsquare = ChannelStore.getByName('town-square');
utils.switchChannel(townsquare);
},
function(err) {
AsyncClient.dispatchError(err, "handleLeave");
}
);
},
searchMentions: function(e) {
e.preventDefault();
var user = UserStore.getCurrentUser();
var terms = "";
if (user.notify_props && user.notify_props.mention_keys) {
terms = UserStore.getCurrentMentionKeys().join(' ');
}
AppDispatcher.handleServerAction({
type: ActionTypes.RECIEVED_SEARCH_TERM,
term: terms,
do_search: true,
is_mention_search: true
});
},
render: function() {
if (this.state.channel == null) {
return null;
}
var description = utils.textToJsx(this.state.channel.description, {"singleline": true, "noMentionHighlight": true});
var popoverContent = React.renderToString();
var channelTitle = this.state.channel.display_name;
var channelName = this.state.channel.name;
var currentId = UserStore.getCurrentId();
var isAdmin = this.state.memberChannel.roles.indexOf("admin") > -1 || this.state.memberTeam.roles.indexOf("admin") > -1;
var isDirect = (this.state.channel.type === 'D');
if (isDirect) {
if (this.state.users.length > 1) {
var contact = this.state.users[((this.state.users[0].id === currentId) ? 1 : 0)];
channelTitle = ;
}
}
return (
);
}
});