diff --git a/templates/zephyr/index.html b/templates/zephyr/index.html index 378e6e31d1..e0a61d4c54 100644 --- a/templates/zephyr/index.html +++ b/templates/zephyr/index.html @@ -30,6 +30,7 @@ + diff --git a/zephyr/static/js/compose.js b/zephyr/static/js/compose.js index 07be03f332..18e0a2822e 100644 --- a/zephyr/static/js/compose.js +++ b/zephyr/static/js/compose.js @@ -1,3 +1,7 @@ +function clear_compose_box() { + $("#zephyr_compose").find('input[type=text], textarea').val(''); +} + function compose_button() { clear_compose_box(); $('#sidebar a[href="#home"]').tab('show'); diff --git a/zephyr/static/js/ui.js b/zephyr/static/js/ui.js new file mode 100644 index 0000000000..8b96521473 --- /dev/null +++ b/zephyr/static/js/ui.js @@ -0,0 +1,133 @@ +function register_huddle_onclick(zephyr_row, sender) { + zephyr_row.find(".zephyr_sender").click(function (e) { + prepare_huddle(sender); + // The sender span is inside the messagebox, which also has an + // onclick handler. We don't want to trigger the messagebox + // handler. + e.stopPropagation(); + + // switch to the replybox hotkey handler + keydown_handler = process_key_in_input; + }); +} + +function register_onclick(zephyr_row, zephyr_id) { + zephyr_row.find(".messagebox").click(function (e) { + if (!(clicking && mouse_moved)) { + // Was a click (not a click-and-drag). + select_zephyr_by_id(zephyr_id); + respond_to_zephyr(); + } + mouse_moved = false; + clicking = false; + }); +} + +/* We use 'visibility' rather than 'display' and jQuery's show() / hide(), + because we want to reserve space for the email address. This avoids + things jumping around slightly when the email address is shown. */ + +function hide_email() { + $('.zephyr_sender_email').addClass('invisible'); +} + +function show_email(zephyr_id) { + hide_email(); + get_zephyr_row(zephyr_id).find('.zephyr_sender_email').removeClass('invisible'); +} + +function report_error(response, xhr, status_box) { + if (xhr.status.toString().charAt(0) === "4") { + // Only display the error response for 4XX, where we've crafted + // a nice response. + response += ": " + $.parseJSON(xhr.responseText).msg; + } + + status_box.removeClass(status_classes).addClass('alert-error') + .text(response).stop(true).fadeTo(0, 1); + status_box.show(); +} + +var clicking = false; +var mouse_moved = false; + +function zephyr_mousedown() { + mouse_moved = false; + clicking = true; +} + +function zephyr_mousemove() { + if (clicking) { + mouse_moved = true; + } +} + +function go_to_high_water_mark() { + select_and_show_by_id(high_water_mark); +} + +var autocomplete_needs_update = false; + +function update_autocomplete() { + class_list.sort(); + instance_list.sort(); + people_list.sort(); + + // limit number of items so the list doesn't fall off the screen + $( "#class" ).typeahead({ + source: class_list, + items: 3, + }); + $( "#instance" ).typeahead({ + source: instance_list, + items: 2, + }); + $( "#recipient" ).typeahead({ + source: people_list, + items: 4, + }); + + autocomplete_needs_update = false; +} + +$(function () { + // NB: This just binds to current elements, and won't bind to elements + // created after ready() is called. + $('input, textarea, button').focus(function () { + keydown_handler = process_key_in_input; + }); + $('input, textarea, button').blur(function () { + keydown_handler = process_hotkey; + }); + + $('#zephyr-type-tabs a[href="#class-message"]').on('shown', function (e) { + $('#class-message input:not(:hidden):first').focus().select(); + }); + $('#zephyr-type-tabs a[href="#personal-message"]').on('shown', function (e) { + $('#personal-message input:not(:hidden):first').focus().select(); + }); + + // Prepare the click handler for subbing to a new class to which + // you have composed a zephyr. + $('#create-it').click(function () { + sub_from_home(compose_class_name(), $('#class-dne')); + }); + + // Prepare the click handler for subbing to an existing class. + $('#sub-it').click(function () { + sub_from_home(compose_class_name(), $('#class-nosub')); + }); + + var last_mousewheel = 0; + $("#main_div").mousewheel(function () { + var time = $.now(); + if (time - last_mousewheel > 50) { + keep_pointer_in_view(); + last_mousewheel = time; + } + }); + + $('.button-slide').click(function () { + show_compose('class', $("#class")); + }); +}); diff --git a/zephyr/static/js/zephyr.js b/zephyr/static/js/zephyr.js index aa93fc4375..064c586dca 100644 --- a/zephyr/static/js/zephyr.js +++ b/zephyr/static/js/zephyr.js @@ -4,7 +4,8 @@ /*global $: false, jQuery: false, Handlebars: false, zephyr_json: false, initial_pointer: false, email: false, class_list: false, instance_list: false, people_list: false, - have_initial_messages: false, narrowed: false */ + have_initial_messages: false, narrowed: false, + autocomplete_needs_update: true */ var loading_spinner; var templates = {}; @@ -21,67 +22,12 @@ $(function () { templates.subscription = Handlebars.compile($("#template_subscription").html()); }); -function register_huddle_onclick(zephyr_row, sender) { - zephyr_row.find(".zephyr_sender").click(function (e) { - prepare_huddle(sender); - // The sender span is inside the messagebox, which also has an - // onclick handler. We don't want to trigger the messagebox - // handler. - e.stopPropagation(); - - // switch to the replybox hotkey handler - keydown_handler = process_key_in_input; - }); -} - -function register_onclick(zephyr_row, zephyr_id) { - zephyr_row.find(".messagebox").click(function (e) { - if (!(clicking && mouse_moved)) { - // Was a click (not a click-and-drag). - select_zephyr_by_id(zephyr_id); - respond_to_zephyr(); - } - mouse_moved = false; - clicking = false; - }); -} - var zephyr_array = []; var zephyr_dict = {}; var instance_list = []; var status_classes = 'alert-error alert-success alert-info'; -function report_error(response, xhr, status_box) { - if (xhr.status.toString().charAt(0) === "4") { - // Only display the error response for 4XX, where we've crafted - // a nice response. - response += ": " + $.parseJSON(xhr.responseText).msg; - } - - status_box.removeClass(status_classes).addClass('alert-error') - .text(response).stop(true).fadeTo(0, 1); - status_box.show(); -} - $(function () { - $('#zephyr-type-tabs a[href="#class-message"]').on('shown', function (e) { - $('#class-message input:not(:hidden):first').focus().select(); - }); - $('#zephyr-type-tabs a[href="#personal-message"]').on('shown', function (e) { - $('#personal-message input:not(:hidden):first').focus().select(); - }); - - // Prepare the click handler for subbing to a new class to which - // you have composed a zephyr. - $('#create-it').click(function () { - sub_from_home(compose_class_name(), $('#class-dne')); - }); - - // Prepare the click handler for subbing to an existing class. - $('#sub-it').click(function () { - sub_from_home(compose_class_name(), $('#class-nosub')); - }); - $('#sidebar a[href="#subscriptions"]').click(function () { $.ajax({ type: 'GET', @@ -103,15 +49,6 @@ $(function () { }, }); }); - - var last_mousewheel = 0; - $("#main_div").mousewheel(function () { - var time = $.now(); - if (time - last_mousewheel > 50) { - keep_pointer_in_view(); - last_mousewheel = time; - } - }); }); $.ajaxSetup({ @@ -432,20 +369,6 @@ function select_zephyr_by_id(zephyr_id) { select_zephyr(get_zephyr_row(zephyr_id), false); } -var clicking = false; -var mouse_moved = false; - -function zephyr_mousedown() { - mouse_moved = false; - clicking = true; -} - -function zephyr_mousemove() { - if (clicking) { - mouse_moved = true; - } -} - // Called on page load and when we [un]narrow. // Forces a call to select_zephyr even if the id has not changed, // because the visible table might have. @@ -501,65 +424,12 @@ function select_zephyr(next_zephyr, scroll_to) { } } -function go_to_high_water_mark() { - select_and_show_by_id(high_water_mark); -} - -/* We use 'visibility' rather than 'display' and jQuery's show() / hide(), - because we want to reserve space for the email address. This avoids - things jumping around slightly when the email address is shown. */ - -function hide_email() { - $('.zephyr_sender_email').addClass('invisible'); -} - -function show_email(zephyr_id) { - hide_email(); - get_zephyr_row(zephyr_id).find('.zephyr_sender_email').removeClass('invisible'); -} - -// NB: This just binds to current elements, and won't bind to elements -// created after ready() is called. - -$(function () { - $('input, textarea, button').focus(function () { - keydown_handler = process_key_in_input; - }); - $('input, textarea, button').blur(function () { - keydown_handler = process_hotkey; - }); -}); - function prepare_huddle(recipients) { // Used for both personals and huddles. show_compose('personal', $("#new_personal_zephyr")); $("#recipient").val(recipients); } -var autocomplete_needs_update = false; - -function update_autocomplete() { - class_list.sort(); - instance_list.sort(); - people_list.sort(); - - // limit number of items so the list doesn't fall off the screen - $( "#class" ).typeahead({ - source: class_list, - items: 3, - }); - $( "#instance" ).typeahead({ - source: instance_list, - items: 2, - }); - $( "#recipient" ).typeahead({ - source: people_list, - items: 4, - }); - - autocomplete_needs_update = false; -} - function same_recipient(a, b) { if ((a === undefined) || (b === undefined)) return false; @@ -793,10 +663,6 @@ function add_messages(data) { update_autocomplete(); } -function clear_compose_box() { - $("#zephyr_compose").find('input[type=text], textarea').val(''); -} - function get_updates() { console.log(new Date() + ': longpoll started'); $.ajax({ @@ -838,12 +704,7 @@ function get_updates() { }); } -$(function () { - get_updates(); - $('.button-slide').click(function () { - show_compose('class', $("#class")); - }); -}); +$(get_updates); function above_view(zephyr) { return zephyr.offset().top < $("#main_div").offset().top;