zulip/static/js/server_events.js

486 lines
17 KiB
JavaScript
Raw Normal View History

var server_events = (function () {
var exports = {};
var waiting_on_homeview_load = true;
var events_stored_during_tutorial = [];
var events_stored_while_loading = [];
var get_events_xhr;
var get_events_timeout;
var get_events_failures = 0;
var get_events_params = {};
function dispatch_normal_event(event) {
switch (event.type) {
case 'alert_words':
alert_words.words = event.alert_words;
break;
case 'default_streams':
page_params.realm_default_streams = event.default_streams;
admin.update_default_streams_table();
break;
case 'muted_topics':
muting_ui.handle_updates(event.muted_topics);
break;
case 'presence':
var users = {};
users[event.email] = event.presence;
activity.set_user_statuses(users, event.server_timestamp);
break;
case 'restart':
var reload_options = {save_pointer: true,
save_narrow: true,
save_compose: true,
message: "The application has been updated; reloading!"
};
if (event.immediate) {
reload_options.immediate = true;
}
reload.initiate(reload_options);
break;
Add frontend support for emoji reactions. This commit replaces the placeholder "clipboard" button with a reaction button. This is done on any message that can't be edited. Also, on messages sent by the user the actions popover (toggled by the down chevron icon) contains an option to add a reaction. When clicked, a popover with a search bar and a list of emojis is displayed. If the right sidebar is collapsed (the viewport is small), the popover is placed to the left of the button. Focus is set to the search bar. Typing in the search bar filters emojis. Emojis with which the user has reacted to this message are highlighted. Clicking them sends an API request to remove that reaction. Clicking on non-highlighted emojis sends an API request to add a reaction. When the popover loses focus it is closed. The frontend listens for reaction events. When an add-reaction event is received, the emoji is displayed at the bottom of the message with a count initialized to 1. If there was an existing reaction to the message with the same emoji, the count is incremented. Old messages fetched from the server contain reactions. They are displayed (along with title and count) at the bottom of each message. When clicking the emoji reaction at the bottom of the message, if the user has already reacted with that emoji to this message, the reaction is removed and the count is decremented. Otherwise, a reaction is added and the count is incremented. Hovering over the emoji reaction at the bottom of the message displays a list of users who have reacted with this emoji along with the emoji name. Hovering over the emoji reactions at the bottom of the message displays a button to add a reaction. Fixes #541.
2016-12-02 13:23:23 +01:00
case 'reaction':
if (event.op === 'add') {
reactions.add_reaction(event);
} else if (event.op === 'remove') {
reactions.remove_reaction(event);
}
break;
case 'realm':
if (event.op === 'update' && event.property === 'name') {
page_params.realm_name = event.value;
notifications.redraw_title();
} else if (event.op === 'update' && event.property === 'invite_required') {
page_params.realm_invite_required = event.value;
} else if (event.op === 'update' && event.property === 'invite_by_admins_only') {
page_params.realm_invite_by_admins_only = event.value;
} else if (event.op === 'update' && event.property === 'create_stream_by_admins_only') {
page_params.realm_create_stream_by_admins_only = event.value;
if (!page_params.is_admin) {
page_params.can_create_streams = !page_params.realm_create_stream_by_admins_only;
}
} else if (event.op === 'update' && event.property === 'add_emoji_by_admins_only') {
page_params.add_emoji_by_admins_only = event.value;
} else if (event.op === 'update' && event.property === 'restricted_to_domain') {
page_params.realm_restricted_to_domain = event.value;
} else if (event.op === 'update_dict' && event.property === 'default') {
$.each(event.data, function (key, value) {
page_params['realm_' + key] = value;
});
if (event.data.authentication_methods !== undefined) {
admin.populate_auth_methods(event.data.authentication_methods);
}
} else if (event.op === 'update' && event.property === 'default_language') {
page_params.realm_default_language = event.value;
admin.reset_realm_default_language();
} else if (event.op === 'update' && event.property === 'waiting_period_threshold') {
page_params.realm_waiting_period_threshold = event.value;
}
break;
case 'realm_bot':
if (event.op === 'add') {
bot_data.add(event.bot);
} else if (event.op === 'remove') {
bot_data.remove(event.bot.email);
} else if (event.op === 'update') {
bot_data.update(event.bot.email, event.bot);
admin.update_user_full_name(event.bot.email, event.bot.full_name);
}
break;
case 'realm_emoji':
emoji.update_emojis(event.realm_emoji);
admin.populate_emoji(event.realm_emoji);
break;
case 'realm_filters':
page_params.realm_filters = event.realm_filters;
echo.set_realm_filters(page_params.realm_filters);
admin.populate_filters(page_params.realm_filters);
break;
case 'realm_user':
if (event.op === 'add') {
people.add_in_realm(event.person);
} else if (event.op === 'remove') {
people.deactivate(event.person);
} else if (event.op === 'update') {
people.update(event.person);
admin.update_user_full_name(event.person.email, event.person.full_name);
}
break;
case 'referral':
referral.update_state(event.referrals.granted, event.referrals.used);
break;
case 'stream':
if (event.op === 'update') {
// Legacy: Stream properties are still managed by subs.js on the client side.
subs.update_subscription_properties(event.name, event.property, event.value);
admin.update_default_streams_table();
2016-10-15 21:10:10 +02:00
} else if (event.op === 'create') {
stream_data.create_streams(event.streams);
}
break;
case 'subscription':
var person;
var email;
if (event.op === 'add') {
_.each(event.subscriptions, function (sub) {
subs.mark_subscribed(sub.name, sub);
});
} else if (event.op === 'peer_add') {
// TODO: remove email shim here and fix called functions
// to use user_ids
person = people.get_person_from_user_id(event.user_id);
email = person.email;
_.each(event.subscriptions, function (sub) {
stream_data.add_subscriber(sub, event.user_id);
$(document).trigger('peer_subscribe.zulip',
{stream_name: sub, user_email: email});
});
} else if (event.op === 'peer_remove') {
// TODO: remove email shim here and fix called functions
// to use user_ids
person = people.get_person_from_user_id(event.user_id);
email = person.email;
_.each(event.subscriptions, function (sub) {
stream_data.remove_subscriber(sub, event.user_id);
$(document).trigger('peer_unsubscribe.zulip',
{stream_name: sub, user_email: email});
});
} else if (event.op === 'remove') {
_.each(event.subscriptions, function (rec) {
var sub = stream_data.get_sub_by_id(rec.stream_id);
subs.mark_sub_unsubscribed(sub);
});
} else if (event.op === 'update') {
subs.update_subscription_properties(event.name, event.property, event.value);
}
break;
case 'update_display_settings':
if (event.setting_name === 'twenty_four_hour_time') {
page_params.twenty_four_hour_time = event.setting;
// TODO: Make this rerender the existing elements to not require a reload.
}
if (event.setting_name === 'left_side_userlist') {
// TODO: Make this change the view immediately rather
// than requiring a reload or page resize.
page_params.left_side_userlist = event.setting;
}
if (event.setting_name === 'default_language') {
// TODO: Make this change the view immediately rather
// than requiring a reload or page resize.
page_params.default_language = event.setting;
}
if ($("#settings.tab-pane.active").length) {
settings.update_page();
}
break;
case 'update_global_notifications':
notifications.handle_global_notification_updates(event.notification_name,
event.setting);
if ($("#settings.tab-pane.active").length) {
settings.update_page();
}
break;
case 'update_message_flags':
var new_value = event.operation === "add";
switch (event.flag) {
case 'starred':
_.each(event.messages, function (message_id) {
ui.update_starred(message_id, new_value);
});
break;
case 'read':
var msgs_to_update = _.map(event.messages, function (message_id) {
return message_store.get(message_id);
});
unread.mark_messages_as_read(msgs_to_update, {from: "server"});
break;
}
break;
}
}
function get_events_success(events) {
var messages = [];
var messages_to_update = [];
var new_pointer;
var clean_event = function clean_event(event) {
// Only log a whitelist of the event to remove private data
return _.pick(event, 'id', 'type', 'op');
};
_.each(events, function (event) {
try {
get_events_params.last_event_id = Math.max(get_events_params.last_event_id,
event.id);
} catch (ex) {
blueslip.error('Failed to update last_event_id',
{event: clean_event(event)},
ex.stack);
}
});
if (tutorial.is_running()) {
events_stored_during_tutorial = events_stored_during_tutorial.concat(events);
return;
}
if (events_stored_during_tutorial.length > 0) {
events = events_stored_during_tutorial.concat(events);
events_stored_during_tutorial = [];
}
if (waiting_on_homeview_load) {
events_stored_while_loading = events_stored_while_loading.concat(events);
return;
}
if (events_stored_while_loading.length > 0) {
events = events_stored_while_loading.concat(events);
events_stored_while_loading = [];
}
var dispatch_event = function dispatch_event(event) {
switch (event.type) {
case 'message':
var msg = event.message;
msg.flags = event.flags;
if (event.local_message_id !== undefined) {
msg.local_id = event.local_message_id;
}
messages.push(msg);
break;
case 'pointer':
new_pointer = event.pointer;
break;
case 'update_message':
messages_to_update.push(event);
break;
default:
return dispatch_normal_event(event);
}
};
_.each(events, function (event) {
try {
dispatch_event(event);
} catch (ex1) {
blueslip.error('Failed to process an event\n' +
blueslip.exception_msg(ex1),
{event: clean_event(event)},
ex1.stack);
}
});
if (messages.length !== 0) {
try {
messages = echo.process_from_server(messages);
message_store.insert_new_messages(messages);
} catch (ex2) {
blueslip.error('Failed to insert new messages\n' +
blueslip.exception_msg(ex2),
undefined,
ex2.stack);
}
}
if (new_pointer !== undefined
&& new_pointer > pointer.furthest_read) {
pointer.furthest_read = new_pointer;
pointer.server_furthest_read = new_pointer;
home_msg_list.select_id(new_pointer, {then_scroll: true, use_closest: true});
}
if ((home_msg_list.selected_id() === -1) && !home_msg_list.empty()) {
home_msg_list.select_id(home_msg_list.first().id, {then_scroll: false});
}
if (messages_to_update.length !== 0) {
try {
message_store.update_messages(messages_to_update);
} catch (ex3) {
blueslip.error('Failed to update messages\n' +
blueslip.exception_msg(ex3),
undefined,
ex3.stack);
}
}
}
function get_events(options) {
options = _.extend({dont_block: false}, options);
if (reload.is_in_progress()) {
return;
}
get_events_params.dont_block = options.dont_block || get_events_failures > 0;
if (get_events_params.queue_id === undefined) {
get_events_params.queue_id = page_params.event_queue_id;
get_events_params.last_event_id = page_params.last_event_id;
}
if (get_events_xhr !== undefined) {
get_events_xhr.abort();
}
if (get_events_timeout !== undefined) {
clearTimeout(get_events_timeout);
}
get_events_timeout = undefined;
get_events_xhr = channel.get({
url: '/json/events',
data: get_events_params,
idempotent: true,
timeout: page_params.poll_timeout,
success: function (data) {
try {
get_events_xhr = undefined;
get_events_failures = 0;
$('#connection-error').hide();
get_events_success(data.events);
} catch (ex) {
blueslip.error('Failed to handle get_events success\n' +
blueslip.exception_msg(ex),
undefined,
ex.stack);
}
get_events_timeout = setTimeout(get_events, 0);
},
error: function (xhr, error_type) {
try {
get_events_xhr = undefined;
// If we are old enough to have messages outside of the
// Tornado cache or if we're old enough that our message
// queue has been garbage collected, immediately reload.
if ((xhr.status === 400) &&
(JSON.parse(xhr.responseText).msg.indexOf("too old") !== -1 ||
JSON.parse(xhr.responseText).msg.indexOf("Bad event queue id") !== -1)) {
page_params.event_queue_expired = true;
reload.initiate({immediate: true,
save_pointer: false,
save_narrow: false,
save_compose: true});
}
if (error_type === 'abort') {
// Don't restart if we explicitly aborted
return;
} else if (error_type === 'timeout') {
// Retry indefinitely on timeout.
get_events_failures = 0;
$('#connection-error').hide();
} else {
get_events_failures += 1;
}
if (get_events_failures >= 5) {
$('#connection-error').show();
} else {
$('#connection-error').hide();
}
} catch (ex) {
blueslip.error('Failed to handle get_events error\n' +
blueslip.exception_msg(ex),
undefined,
ex.stack);
}
var retry_sec = Math.min(90, Math.exp(get_events_failures/2));
get_events_timeout = setTimeout(get_events, retry_sec*1000);
}
});
}
exports.assert_get_events_running = function assert_get_events_running(error_message) {
if (get_events_xhr === undefined && get_events_timeout === undefined) {
exports.restart_get_events({dont_block: true});
blueslip.error(error_message);
}
};
exports.restart_get_events = function restart_get_events(options) {
get_events(options);
};
exports.force_get_events = function force_get_events() {
get_events_timeout = setTimeout(get_events, 0);
};
exports.home_view_loaded = function home_view_loaded() {
waiting_on_homeview_load = false;
get_events_success([]);
$(document).trigger("home_view_loaded.zulip");
};
var watchdog_time = $.now();
setInterval(function () {
var new_time = $.now();
if ((new_time - watchdog_time) > 20000) { // 20 seconds.
// Defensively reset watchdog_time here in case there's an
// exception in one of the event handlers
watchdog_time = new_time;
// Our app's JS wasn't running, which probably means the machine was
// asleep.
$(document).trigger($.Event('unsuspend'));
}
watchdog_time = new_time;
}, 5000);
util.execute_early(function () {
$(document).on('unsuspend', function () {
// Immediately poll for new events on unsuspend
blueslip.log("Restarting get_events due to unsuspend");
get_events_failures = 0;
exports.restart_get_events({dont_block: true});
});
get_events();
});
exports.cleanup_event_queue = function cleanup_event_queue() {
// Submit a request to the server to cleanup our event queue
if (page_params.event_queue_expired === true) {
return;
}
// Set expired because in a reload we may be called twice.
page_params.event_queue_expired = true;
channel.del({
url: '/json/events',
data: {queue_id: page_params.event_queue_id}
});
};
window.addEventListener("beforeunload", function () {
exports.cleanup_event_queue();
});
// For unit testing
exports._get_events_success = get_events_success;
return exports;
}());
if (typeof module !== 'undefined') {
module.exports = server_events;
}