Use delegated event handlers instead of inline, direct handlers on messages

(imported from commit dd7dc77e8282371a5f3b82e0cfa93f09d53a7a80)
This commit is contained in:
Zev Benjamin 2012-11-14 17:33:13 -05:00
parent 8c20362c18
commit a5ea766ff6
3 changed files with 75 additions and 65 deletions

View File

@ -20,27 +20,24 @@
{{#include_recipient}}
{{#if is_stream}}
<tr class="recipient_row">
<tr zid="{{id}}" class="recipient_row">
<td colspan="2"
class="message_header message_header_stream left_part">
</td>
<td class="message_header message_header_stream right_part">
<span class="message_label_clickable"
onclick="narrow.target({{id}}); narrow.by_recipient();"
<span class="message_label_clickable narrows_by_recipient"
title="Narrow to stream &quot;{{display_recipient}}&quot;">{{display_recipient}}</span>
&nbsp; | &nbsp;
<span class="message_label_clickable"
onclick="narrow.target({{id}}); narrow.by_subject();"
<span class="message_label_clickable narrows_by_subject"
title="Narrow to stream &quot;{{display_recipient}}&quot;, subject &quot;{{subject}}&quot;">{{subject}}</span>
</td>
</tr>
{{else}}
<tr class="recipient_row">
<tr zid="{{id}}" class="recipient_row">
<td colspan="2"
class="message_header message_header_huddle left_part">
</td>
<td class="message_label_clickable message_header message_header_huddle right_part"
onclick="narrow.target({{id}}); narrow.by_recipient();"
<td class="message_label_clickable narrows_by_recipient message_header message_header_huddle right_part"
title="Narrow to your private messages with {{display_reply_to}}">You and {{display_reply_to}}</td>
</tr>
{{/if}}
@ -50,20 +47,13 @@
<td class="message_picture">
{{#include_sender}}
<img class="img-rounded profile_picture user_info_hover"
src="https://secure.gravatar.com/avatar/{{gravatar_hash}}?d=identicon&s=30?stamp={{stamp}}"
onclick="userinfo_popover(event, this, {{id}});"/>
src="https://secure.gravatar.com/avatar/{{gravatar_hash}}?d=identicon&s=30?stamp={{stamp}}"/>
{{/include_sender}}
</td>
<td class="pointer"><p></p></td>
<td class="messagebox{{^include_sender}} prev_is_same_sender{{/include_sender}}{{^is_stream}} private-message{{/is_stream}}"
onclick="select_message_by_id({{id}});"
onmousedown="mousedown();"
onmousemove="mousemove();"
onmouseover="show_email({{id}});"
onmouseout="hide_email();">
<td class="messagebox{{^include_sender}} prev_is_same_sender{{/include_sender}}{{^is_stream}} private-message{{/is_stream}}">
{{#include_sender}}
<span class="message_sender user_info_hover"
onclick="userinfo_popover(event, this, {{id}});">
<span class="message_sender user_info_hover">
<span class="sender_name">{{sender_full_name}}</span>
<span class="sender_email invisible">{{sender_email}}</span>
</span>

View File

@ -5,44 +5,6 @@
var scroll_positions = {};
var gravatar_stamp = 1;
function register_onclick(message_row, message_id) {
message_row.find(".messagebox").click(function (e) {
if ($(e.target).is("a")) {
// If this click came from a hyperlink, don't trigger the
// reply action. The simple way of doing this is simply
// to call e.stopPropagation() from within the link's
// click handler.
//
// Unfortunately, on Firefox, this breaks Ctrl-click and
// Shift-click, because those are (apparently) implemented
// by adding an event listener on link clicks, and
// stopPropagation prevents them from being called.
return;
}
if (!(clicking && mouse_moved)) {
// Was a click (not a click-and-drag).
select_message_by_id(message_id);
respond_to_message();
}
mouse_moved = false;
clicking = false;
});
}
function register_user_info_mouseover(message_row, message_id) {
message_row.find(".user_info_hover").mouseover(function (e) {
show_email(message_id);
message_row.find(".sender_name").addClass("sender_hovered");
});
}
function register_user_info_mouseout(message_row, message_id) {
message_row.find(".user_info_hover").mouseout(function (e) {
hide_email();
message_row.find(".sender_name").removeClass("sender_hovered");
});
}
function focus_on(field_id) {
// Call after autocompleting on a field, to advance the focus to
// the next input field.
@ -61,13 +23,12 @@ function hide_email() {
$('.sender_email').addClass('invisible');
}
function show_email(message_id) {
function show_email(message_row) {
hide_email();
var row_with_email = rows.get(message_id);
while (!row_with_email.hasClass('include-sender')) {
row_with_email = row_with_email.prev();
while (!message_row.hasClass('include-sender')) {
message_row = message_row.prev();
}
row_with_email.find('.sender_email').removeClass('invisible');
message_row.find('.sender_email').removeClass('invisible');
}
function report_message(response, status_box, cls) {
@ -471,6 +432,69 @@ $(function () {
userinfo_currently_popped = undefined;
}
});
$("#main_div").on("click", ".messagebox", function (e) {
if ($(e.target).is("a")) {
// If this click came from a hyperlink, don't trigger the
// reply action. The simple way of doing this is simply
// to call e.stopPropagation() from within the link's
// click handler.
//
// Unfortunately, on Firefox, this breaks Ctrl-click and
// Shift-click, because those are (apparently) implemented
// by adding an event listener on link clicks, and
// stopPropagation prevents them from being called.
return;
}
if (!(clicking && mouse_moved)) {
// Was a click (not a click-and-drag).
var row = $(this).closest(".message_row");
select_message_by_id(row.attr('zid'));
respond_to_message();
}
mouse_moved = false;
clicking = false;
});
$("#main_div").on("mousedown", ".messagebox", mousedown);
$("#main_div").on("mousemove", ".messagebox", mousemove);
$("#main_div").on("mouseover", ".messagebox", function (e) {
var row = $(this).closest(".message_row");
show_email(row);
});
$("#main_div").on("mouseout", ".messagebox", function (e) {
hide_email();
});
$("#main_div").on("mouseover", ".user_info_hover", function (e) {
var row = $(this).closest(".message_row");
show_email(row);
row.find(".sender_name").addClass("sender_hovered");
});
$("#main_div").on("mouseout", ".user_info_hover", function (e) {
var row = $(this).closest(".message_row");
hide_email();
row.find(".sender_name").removeClass("sender_hovered");
});
$("#main_div").on("click", ".user_info_hover", function (e) {
var row = $(this).closest(".message_row");
userinfo_popover(e, this, row.attr('zid'));
});
$("#main_div").on("click", ".narrows_by_recipient", function (e) {
var row = $(this).closest(".recipient_row");
narrow.target(row.attr('zid'));
narrow.by_recipient();
});
$("#main_div").on("click", ".narrows_by_subject", function (e) {
var row = $(this).closest(".recipient_row");
narrow.target(row.attr('zid'));
narrow.by_subject();
});
});
function update_gravatars() {

View File

@ -355,10 +355,6 @@ function add_to_table(messages, table_name, filter_function, where, allow_collap
$.each(messages_to_render, function (index, message) {
var row = rows.get(message.id, table_name);
register_onclick(row, message.id);
register_user_info_mouseover(row, message.id);
register_user_info_mouseout(row, message.id);
row.find('.message_content a').each(function (index, link) {
link = $(link);
link.attr('target', '_blank')