Improve mute/unmute process

pull/1/head
yflory 5 years ago
parent aa8dd95310
commit e8c1eb9f11

@ -78,6 +78,9 @@
.cp-app-contacts-name {
white-space: nowrap;
}
.cp-app-contacts-icons {
text-align: right;
}
}
&:hover {
background-color: rgba(0,0,0,0.3);

@ -126,6 +126,9 @@
background-color: @button-bg;
border-color: darken(@button-bg, 10%);
color: white;
.fa {
margin-right: 0.2em;
}
&:hover {
background-color: darken(@button-bg, 10%);
}

@ -3803,20 +3803,10 @@ define([
});
};
var modal;
var mute = UIElements.createMuteButton(common, msg.content, function () {
// Mute = auto-reject friend request
var $modal = modal && $(modal) && $(modal).closest('div.alertify');
if ($modal && $modal.length && $modal[0].closeModal) {
$modal[0].closeModal(function () {});
}
return void todo(false); // XXX false is reject. We can also "dismiss"...
});
var content = h('div.cp-share-modal', [
setHTML(h('p'), text),
h('p', mute)
]);
modal = UI.proposal(content, todo);
UI.proposal(content, todo);
};
UIElements.displayAddOwnerModal = function (common, data) {
@ -4158,27 +4148,5 @@ define([
UI.proposal(div, todo);
};
UIElements.createMuteButton = function (common, data, cb) {
cb = cb || function () {};
var button = h('i.fa.fa-bell-slash-o', {
title: Messages.notifications_muteUserTitle
});
var module = common.makeUniversal('messenger');
$(button).click(function () {
UI.confirm(Messages.notifications_muteUserConfirm, function (yes) {
if (!yes) { return; }
module.execCommand('MUTE_USER', {
curvePublic: data.curvePublic,
name: data.displayName || data.name,
avatar: data.avatar
}, function (e) {
cb(e);
if (e) { return void UI.warn(Messages.error); }
});
});
});
return button;
};
return UIElements;
});

@ -70,7 +70,7 @@ define([
h('div.cp-app-contacts-friends.cp-app-contacts-category', [
h('div.cp-app-contacts-category-content.cp-contacts-friends'),
h('h2.cp-app-contacts-category-title', Messages.contacts_friends),
h('button.cp-app-contacts-muted-button', Messages.contacts_manageMuted || 'MANAGE MUTED') // XXX
h('button.btn.btn-secondary.cp-app-contacts-muted-button', Messages.contacts_manageMuted || 'MANAGE MUTED') // XXX
]),
h('div.cp-app-contacts-rooms.cp-app-contacts-category', [
h('div.cp-app-contacts-category-content'),
@ -510,6 +510,9 @@ define([
title: room.name
});
var mute = h('span.cp-app-contacts-remove.fa.fa-bell-slash-o.cp-mute-icon', {
title: Messages.contacts_mute || 'mute'
});
var remove = h('span.cp-app-contacts-remove.fa.fa-user-times', {
title: Messages.contacts_remove
});
@ -522,8 +525,11 @@ define([
});
var rightCol = h('span.cp-app-contacts-right-col', [
h('span.cp-app-contacts-name', [room.name]),
h('span.cp-app-contacts-icons', [
room.isFriendChat ? mute : undefined,
room.isFriendChat ? remove :
(room.isPadChat || room.isTeamChat) ? undefined : leaveRoom,
])
]);
var friendData = room.isFriendChat ? userlist[0] : {};
@ -534,21 +540,27 @@ define([
if (friendData.profile) { window.open(origin + '/profile/#' + friendData.profile); }
});
$(mute).click(function (e) {
e.stopPropagation();
var channel = state.channels[id];
if (!channel.isFriendChat) { return; }
var curvePublic = channel.curvePublic;
var friend = contactsData[curvePublic] || friendData;
$(mute).hide();
muteUser(friend);
});
$(remove).click(function (e) {
e.stopPropagation();
var channel = state.channels[id];
if (!channel.isFriendChat) { return; }
var curvePublic = channel.curvePublic;
var friend = contactsData[curvePublic] || friendData;
var muteBox = UI.createCheckbox('cp-contacts-mute', Messages.contacts_mute, false);
var content = h('div', [
UI.setHTML(h('p'), Messages._getKey('contacts_confirmRemove', [Util.fixHTML(friend.name)])),
muteBox
]);
UI.confirm(content, function (yes) {
if (!yes) { return; }
var mute = Util.isChecked($(content).find('#cp-contacts-mute'));
if (mute) { muteUser(friend); }
removeFriend(curvePublic);
// TODO remove friend from userlist ui
// FIXME seems to trigger EJOINED from netflux-websocket (from server);
@ -819,25 +831,30 @@ define([
var rows = Object.keys(muted).map(function (curve) {
var data = muted[curve];
var avatar = h('div.cp-avatar');
var button = h('td', h('i.fa.fa-times', {title: Messages.contacts_unmute}));
var avatar = h('span.cp-avatar');
var button = h('button.btn.btn-secondary', [
h('i.fa.fa-ban'),
Messages.contacts_unmute || 'unmute'
]);
UIElements.displayAvatar(common, $(avatar), data.avatar, data.name);
$(button).click(function () {
execCommand('UNMUTE_USER', curve, function (e, data) {
if (e) { return void console.error(e); }
$(button).closest('tr').remove();
$(button).closest('div').remove();
if (!data) { $button.hide(); }
$('.cp-app-contacts-friend[data-user="'+curve+'"]')
.find('.cp-mute-icon').show();
});
});
return h('tr', [
h('td', avatar),
h('td', data.name),
return h('div.cp-contacts-muted-user', [
h('span', avatar),
h('span', data.name),
button
]);
});
var content = h('div', [
h('p', Messages.contacts_mutedUsers),
h('table', rows)
h('h4', Messages.contacts_mutedUsers || 'Muted users...'),
h('div.cp-contacts-muted-table', rows)
]);
$button.off('click');
$button.click(function () {

@ -1253,10 +1253,6 @@ define([
if (friend) { return void cb({error: 'ALREADY_FRIEND'}); }
if (!data.notifications || !data.curvePublic) { return void cb({error: 'INVALID_USER'}); }
// Unmute this user when we send them a friend request
var muted = store.proxy.mutedUsers || {};
delete muted[data.curvePublic];
store.proxy.friends_pending = store.proxy.friends_pending || {};
var twoDaysAgo = +new Date() - (2 * 24 * 3600 * 1000);

@ -1,5 +1,6 @@
@import (reference) '../../customize/src/less2/include/framework.less';
@import (reference) '../../customize/src/less2/include/messenger.less';
@import (reference) '../../customize/src/less2/include/avatar.less';
// body
&.cp-app-contacts {
@ -17,6 +18,17 @@
display: flex; // We need this to remove a 3px border at the bottom of the toolbar
}
.cp-contacts-muted-table {
.avatar_main(50px);
.cp-contacts-muted-user {
display: flex;
align-items: center;
span:nth-child(2) {
flex: 1;
}
}
}
.messenger_main();
}

@ -10,6 +10,8 @@
);
.sidebar-layout_main();
@cp-profile-is-your-friend: #777;
display: flex;
flex-flow: column;
#cp-app-profile-header {
@ -112,6 +114,14 @@
}
}
.cp-app-profile-friend {
display: flex;
align-items: center;
color: @cp-profile-is-your-friend;
.fa {
margin-right: 0.2em;
}
}
.cp-app-profile-friend-request {
flex: 0;
width: 400px;

@ -199,49 +199,40 @@ define([
// This is a friend: display the "friend" message and an "unfriend" button
if (friends[data.curvePublic]) {
// Add friend message
APP.$friend.append(h('p.cp-app-profile-friend', Messages._getKey('profile_friend', [name])));
APP.$friend.append(h('p.cp-app-profile-friend', [
h('i.fa.fa-address-book'),
Messages._getKey('profile_friend', [name])
]));
if (!friends[data.curvePublic].notifications) { return; }
// Add unfriend button
var $unfriendButton = $('<button>', {
'class': 'btn btn-danger cp-app-profile-friend-request',
}).text(Messages.contacts_remove).appendTo(APP.$friend);
$unfriendButton.click(function () {
// Unfriend confirm + mute checkbox
var muteBox = UI.createCheckbox('cp-contacts-mute', Messages.contacts_mute, false);
var unfriendButton = h('button.btn.btn-primary.cp-app-profile-friend-request', [
h('i.fa.fa-user-times'),
Messages.contacts_remove
]);
$(unfriendButton).click(function () {
// Unfriend confirm
var content = h('div', [
UI.setHTML(h('p'), Messages._getKey('contacts_confirmRemove', [name])),
muteBox
UI.setHTML(h('p'), Messages._getKey('contacts_confirmRemove', [name]))
]);
UI.confirm(content, function (yes) {
if (!yes) { return; }
// Mute if necessary
var mute = Util.isChecked($(content).find('#cp-contacts-mute'));
if (mute) {
module.execCommand('MUTE_USER', {
curvePublic: data.curvePublic,
name: name,
avatar: data.avatar
}, function (e /*, removed */) {
if (e) { return void console.error(e); }
});
}
// And unfriend
module.execCommand('REMOVE_FRIEND', data.curvePublic, function (e) {
if (e) { return void console.error(e); }
});
});
});
}).appendTo(APP.$friend);
return;
}
var $button = $('<button>', {
'class': 'btn btn-success cp-app-profile-friend-request',
}).appendTo(APP.$friend);
var button = h('button.btn.btn-success.cp-app-profile-friend-request', [
h('i.fa.fa-user-plus'),
]);
var $button = $(button).appendTo(APP.$friend);
// If this curve has sent us a friend request, we should not be able to sent it to them
var friendRequests = common.getFriendRequests();
if (friendRequests[data.curvePublic]) {
$button.html(Messages._getKey('friendRequest_received', [data.name || Messages.anonymous]))
$button.append(Messages._getKey('friendRequest_received', [data.name || Messages.anonymous]))
.click(function () {
UIElements.displayFriendRequestModal(common, friendRequests[data.curvePublic]);
});
@ -251,41 +242,70 @@ define([
// Pending friend (we've sent a friend request)
var pendingFriends = APP.common.getPendingFriends(); // Friend requests sent
if (pendingFriends[data.curvePublic]) {
$button.attr('disabled', 'disabled').text(Messages.profile_friendRequestSent);
$button.attr('disabled', 'disabled').append(Messages.profile_friendRequestSent);
return;
}
// This is not a friend yet: we can send a friend request or mute them
// This is not a friend yet: we can send a friend request
$button.text(Messages._getKey('userlist_addAsFriendTitle', [data.name || Messages.anonymous]))
.click(function () {
APP.common.sendFriendRequest({
curvePublic: data.curvePublic,
notifications: data.notifications
}, function () {
$button.attr('disabled', 'disabled').text(Messages.profile_friendRequestSent);
$button.attr('disabled', 'disabled').append(Messages.profile_friendRequestSent);
});
});
};
var addMuteButton = function ($container) {
if (!APP.readOnly || !APP.common.isLoggedIn()) { return; }
APP.$mute = $(h('div.cp-app-profile-mute-container'));
$container.append(APP.$mute);
};
var refreshMute = function (data) {
if (!APP.$mute) { return; }
var me = common.getMetadataMgr().getUserData().curvePublic;
if (data.curvePublic === me) {
APP.$mute.remove();
return;
}
// Add mute/unmute buttons
var $mute = $(h('div')).appendTo(APP.$friend);
var $mute = APP.$mute;
var module = common.makeUniversal('messenger');
module.execCommand('GET_MUTED_USERS', null, function (muted) {
if (!muted || typeof(muted) !== "object") { return; }
$mute.html('');
var isMuted = muted[data.curvePublic];
if (isMuted) {
var $unmuteButton = $('<button>', {
'class': 'btn btn-danger cp-app-profile-friend-request',
}).text(Messages.contacts_unmute || 'UNMUTE').appendTo($mute);
$unmuteButton.click(function () {
var unmuteButton = h('button.btn.btn-secondary.cp-app-profile-friend-request', [
h('i.fa.fa-ban'),
Messages.contacts_unmute || 'unmute'
]);
$(unmuteButton).click(function () {
module.execCommand('UNMUTE_USER', data.curvePublic, function (e) {
if (e) { return void console.error(e); }
refreshFriendRequest(data);
});
if (e) { return void UI.warn(Messages.error); }
refreshMute(data);
});
}).appendTo($mute);
return;
}
var button = UIElements.createMuteButton(common, data, function () {
refreshFriendRequest(data);
var muteButton = h('button.btn.btn-danger.cp-app-profile-friend-request', [
h('i.fa.fa-ban'),
Messages.contacts_mute || 'mute'
]);
$(muteButton).click(function () {
module.execCommand('MUTE_USER', {
curvePublic: data.curvePublic,
name: data.displayName || data.name,
avatar: data.avatar
}, function (e) {
if (e) { return void UI.warn(Messages.error); }
refreshMute(data);
});
$mute.append(button);
}).appendTo($mute);
});
};
@ -443,6 +463,7 @@ define([
addDisplayName($rightside);
addLink($rightside);
addFriendRequest($rightside);
addMuteButton($rightside);
addDescription(APP.$rightside);
addViewButton(APP.$rightside);
APP.initialized = true;
@ -456,6 +477,7 @@ define([
refreshLink(data);
refreshDescription(data);
refreshFriendRequest(data);
refreshMute(data);
};
var createToolbar = function () {

Loading…
Cancel
Save