zulip/static/js/stream_list.js

var stream_list = (function () {

var exports = {};

var zoomed_stream = '';
var private_messages_open = false;
var last_private_message_count = 0;
var last_mention_count = 0;
var previous_sort_order;
var previous_unpinned_order;

function filter_streams_by_search(streams) {
    var search_box = $(".stream-list-filter");

    var search_term = search_box.expectOne().val().trim();

    if (search_term === '') {
        return streams;
    }

    var search_terms = search_term.toLowerCase().split(",");
    search_terms = _.map(search_terms, function (s) {
        return s.trim();
    });

    var filtered_streams = _.filter(streams, function (stream) {
        return _.any(search_terms, function (search_term) {
            var lower_stream_name = stream.toLowerCase().split(" ");
            return _.any(lower_stream_name, function (name) {
                return name.indexOf(search_term) === 0;
            });
        });
    });

    return filtered_streams;
}

exports.create_initial_sidebar_rows = function () {
    // This code is slightly opaque, but it ends up building
    // up list items and attaching them to the "sub" data
    // structures that are kept in stream_data.js.
    var subs = stream_data.subscribed_subs();

    _.each(subs, function (sub) {
        exports.create_sidebar_row(sub);
    });
};

exports.build_stream_list = function () {
    // This function assumes we have already created the individual
    // sidebar rows.  Our job here is to build the bigger widget,
    // which largely is a matter of arranging the individual rows in
    // the right order.
    var streams = stream_data.subscribed_streams();
    if (streams.length === 0) {
        return;
    }

    streams = filter_streams_by_search(streams);

    var sort_recent = (streams.length > 40);
    var pinned_streams = [];
    var unpinned_streams = [];
    var parent = $('#stream_filters');
    var elems = [];

    function add_sidebar_li(stream) {
        var li = $(stream_data.get_sub(stream).sidebar_li);
        if (sort_recent) {
            if (stream_data.is_active(stream)) {
                li.removeClass('inactive_stream');
            } else {
                li.addClass('inactive_stream');
            }
        }
        elems.push(li.get(0));
    }

    _.each(streams, function (stream) {
        var pinned = stream_data.get_sub(stream).pin_to_top;
        if (pinned) {
            pinned_streams.push(stream);
        } else {
            unpinned_streams.push(stream);
        }
    });

    unpinned_streams.sort(function (a, b) {
        if (sort_recent) {
            if (stream_data.is_active(b) && ! stream_data.is_active(a)) {
                return 1;
            } else if (! stream_data.is_active(b) && stream_data.is_active(a)) {
                return -1;
            }
        }
        return util.strcmp(a, b);
    });

    streams = pinned_streams.concat(unpinned_streams);

    if (previous_sort_order !== undefined && util.array_compare(previous_sort_order, streams)
                                          && util.array_compare(previous_unpinned_order, unpinned_streams)) {
        return;
    }
    previous_sort_order = streams;
    previous_unpinned_order = unpinned_streams;
    parent.empty();

    _.each(pinned_streams, function (stream) {
        var li = $(stream_data.get_sub(stream).sidebar_li);
        if (sort_recent) {
            if (! stream_data.is_active(stream)) {
                li.addClass('inactive_stream');
            } else {
                li.removeClass('inactive_stream');
            }
        }
        elems.push(li.get(0));
    });

    if (pinned_streams.length > 0) {
        _.each(pinned_streams, add_sidebar_li);
        elems.push($('<hr class="pinned-stream-split">').get(0));
    }
    if (unpinned_streams.length > 0) {
        _.each(unpinned_streams, add_sidebar_li);
    }

    $(elems).appendTo(parent);
};

function iterate_to_find(selector, name_to_find, context) {
    var lowercase_name = name_to_find.toLowerCase();
    var found = _.find($(selector, context), function (elem) {
        return $(elem).attr('data-name').toLowerCase() === lowercase_name;
    });
    return found ? $(found) : $();
}

// TODO: Now that the unread count functions support the user sidebar
// as well, we probably should consider moving them to a different file.
function get_filter_li(type, name) {
    if (type === 'stream') {
        var sub = stream_data.get_sub(name);
        return $("#stream_sidebar_" + sub.stream_id);
    } else if (type === "private") {
        if (name.indexOf(",") < 0) {
            return $("li.user_sidebar_entry[data-email='" + name + "']");
        } else {
            return $("li.group-pms-sidebar-entry[data-emails='" + name + "']");
        }
    }
    return iterate_to_find("#" + type + "_filters > li", name);
}

function zoom_in() {
    popovers.hide_all();
    topic_list.zoom_in();
    $("#streams_list").expectOne().removeClass("zoom-out").addClass("zoom-in");
    zoomed_stream = narrow.stream();

    // Hide stream list titles and pinned stream splitter
    $(".stream-filters-label").each(function () {
        $(this).hide();
    });
    $(".pinned-stream-split").each(function () {
        $(this).hide();
    });

    $("#stream_filters li.narrow-filter").each(function () {
        var elt = $(this);

        if (elt.attr('data-name') === zoomed_stream) {
            elt.show();
        } else {
            elt.hide();
        }
    });
}

function zoom_out() {
    popovers.hide_all();
    topic_list.zoom_out();

    // Show stream list titles and pinned stream splitter
    $(".stream-filters-label").each(function () {
        $(this).show();
    });
    $(".pinned-stream-split").each(function () {
        $(this).show();
    });

    $("#streams_list").expectOne().removeClass("zoom-in").addClass("zoom-out");
    $("#stream_filters li.narrow-filter").show();
}

function remove_expanded_private_messages() {
    popovers.hide_topic_sidebar_popover();
    $("ul.expanded_private_messages").remove();
    resize.resize_stream_filters_container();
}

function reset_to_unnarrowed(narrowed_within_same_stream) {
    if (topic_list.is_zoomed() && narrowed_within_same_stream !== true) {
        zoom_out();
    }

    private_messages_open = false;
    $("ul.filters li").removeClass('active-filter active-sub-filter');
    topic_list.remove_expanded_topics();
    remove_expanded_private_messages();
}

function get_private_message_filter_li(conversation) {
    var pm_li = get_filter_li('global', 'private');
    return iterate_to_find(".expanded_private_messages li.expanded_private_message",
        conversation, pm_li);
}

exports.set_in_home_view = function (stream, in_home) {
    var li = get_filter_li('stream', stream);
    if (in_home) {
        li.removeClass("out_of_home_view");
    } else {
        li.addClass("out_of_home_view");
    }
};

function build_stream_sidebar_row(name) {
    var sub = stream_data.get_sub(name);
    var args = {name: name,
                id: sub.stream_id,
                uri: narrow.by_stream_uri(name),
                not_in_home_view: (stream_data.in_home_view(name) === false),
                invite_only: sub.invite_only,
                color: stream_data.get_color(name),
                pin_to_top: sub.pin_to_top
               };
    args.dark_background = stream_color.get_color_class(args.color);
    var list_item = $(templates.render('stream_sidebar_row', args));
    $("#stream_filters").append(list_item);
    return list_item;
}

exports.create_sidebar_row = function (sub) {
    var stream_name = sub.name;

    if (exports.get_stream_li(stream_name).length) {
        // already exists
        return;
    }
    var li = build_stream_sidebar_row(stream_name);
    if (li) {
        sub.sidebar_li = li;
    }
};

exports.redraw_stream_privacy = function (stream_name) {
    var li = exports.get_stream_li(stream_name);
    var div = li.find('.stream-privacy');
    var swatch = li.find('.streamlist_swatch');
    var sub = stream_data.get_sub(stream_name);
    var color = stream_data.get_color(stream_name);
    var dark_background = stream_color.get_color_class(color);

    var args = {
        invite_only: sub.invite_only,
        dark_background: dark_background
    };

    if (sub.invite_only) {
        swatch.addClass("private-stream-swatch");
    } else {
        swatch.removeClass("private-stream-swatch");
    }

    var html = templates.render('stream_privacy', args);
    div.html(html);
};

exports.get_stream_li = function (stream_name) {
    return get_filter_li('stream', stream_name);
};

exports.get_count = function (type, name) {
    return get_filter_li(type, name).find('.count .value').text();
};

function update_count_in_dom(count_span, value_span, count) {
    if (count === 0) {
        count_span.hide();
        if (count_span.parent().hasClass("subscription_block")) {
            count_span.parent(".subscription_block").removeClass("stream-with-count");
        } else if (count_span.parent().hasClass("user_sidebar_entry")) {
            count_span.parent(".user_sidebar_entry").removeClass("user-with-count");
        } else if (count_span.parent().hasClass("group-pms-sidebar-entry")) {
            count_span.parent(".group-pms-sidebar-entry").removeClass("group-with-count");
        }
        value_span.text('');
        return;
    }

    count_span.show();

    if (count_span.parent().hasClass("subscription_block")) {
        count_span.parent(".subscription_block").addClass("stream-with-count");
    } else if (count_span.parent().hasClass("user_sidebar_entry")) {
        count_span.parent(".user_sidebar_entry").addClass("user-with-count");
    } else if (count_span.parent().hasClass("group-pms-sidebar-entry")) {
            count_span.parent(".group-pms-sidebar-entry").addClass("group-with-count");
    }
    value_span.text(count);
}

function set_count(type, name, count) {
    var count_span = get_filter_li(type, name).find('.count');
    var value_span = count_span.find('.value');
    update_count_in_dom(count_span, value_span, count);
}

function set_count_toggle_button(elem, count) {
    if (count === 0) {
        if (elem.is(':animated')) {
            return elem.stop(true, true).hide();
        }
        return elem.hide(500);
    } else if ((count > 0) && (count < 1000)) {
        elem.show(500);
        return elem.text(count);
    } else {
        elem.show(500);
        return elem.text("1k+");
    }
}

exports.set_pm_conversation_count = function (conversation, count) {
    var pm_li = get_private_message_filter_li(conversation);
    var count_span = pm_li.find('.private_message_count');
    var value_span = count_span.find('.value');

    if (count_span.length === 0 || value_span.length === 0) {
        return;
    }

    count_span.removeClass("zero_count");
    update_count_in_dom(count_span, value_span, count);
};

exports.remove_narrow_filter = function (name, type) {
    get_filter_li(type, name).remove();
};

exports._build_private_messages_list = function (active_conversation, max_private_messages) {

    var private_messages = message_store.recent_private_messages || [];
    var display_messages = [];
    var hiding_messages = false;

    _.each(private_messages, function (private_message_obj, idx) {
        var recipients_string = private_message_obj.display_reply_to;
        var replies_to = private_message_obj.reply_to;
        var num_unread = unread.num_unread_for_person(private_message_obj.reply_to);

        var always_visible = (idx < max_private_messages) || (num_unread > 0)
            || (replies_to === active_conversation);

        if (!always_visible) {
            hiding_messages = true;
        }

        var display_message = {
            recipients: recipients_string,
            reply_to: replies_to,
            unread: num_unread,
            is_zero: num_unread === 0,
            zoom_out_hide: !always_visible,
            url: narrow.pm_with_uri(private_message_obj.reply_to)
        };
        display_messages.push(display_message);
    });

    var recipients_dom = templates.render('sidebar_private_message_list',
                                  {messages: display_messages,
                                   want_show_more_messages_links: hiding_messages});
    return recipients_dom;
};

function rebuild_recent_topics(stream) {
    // TODO: Call rebuild_recent_topics less, not on every new
    // message.
    var stream_li = get_filter_li('stream', stream);
    topic_list.rebuild(stream_li, stream);
}

function rebuild_recent_private_messages(active_conversation) {
    remove_expanded_private_messages();
    if (private_messages_open)
    {
        var max_private_messages = 5;
        var private_li = get_filter_li('global', 'private');
        var private_messages_dom = exports._build_private_messages_list(active_conversation,
            max_private_messages);
        private_li.append(private_messages_dom);
    }
    if (active_conversation) {
        get_private_message_filter_li(active_conversation).addClass('active-sub-filter');
    }

    resize.resize_stream_filters_container();
}

exports.update_streams_sidebar = function () {
    exports.build_stream_list();

    if (! narrow.active()) {
        return;
    }

    var op_stream = narrow.filter().operands('stream');
    if (op_stream.length !== 0) {
        if (stream_data.is_subscribed(op_stream[0])) {
            rebuild_recent_topics(op_stream[0]);
        }
    }
};

exports.update_private_messages = function () {
    exports._build_private_messages_list();

    if (! narrow.active()) {
        return;
    }

    var is_pm_filter = _.contains(narrow.filter().operands('is'), "private");
    var conversation = narrow.filter().operands('pm-with');
    if (conversation.length === 1) {
        rebuild_recent_private_messages(conversation[0]);
    } else if (conversation.length !== 0) {
        // TODO: This should be the reply-to of the thread.
        rebuild_recent_private_messages("");
    } else if (is_pm_filter) {
        rebuild_recent_private_messages("");
    }
};

function do_new_messages_animation(message_type) {
    var li = get_filter_li("global", message_type);
    li.addClass("new_messages");
    function mid_animation() {
        li.removeClass("new_messages");
        li.addClass("new_messages_fadeout");
    }
    function end_animation() {
        li.removeClass("new_messages_fadeout");
    }
    setTimeout(mid_animation, 3000);
    setTimeout(end_animation, 6000);
}

function animate_private_message_changes(new_private_message_count) {
    if (new_private_message_count > last_private_message_count) {
        do_new_messages_animation('private');
    }
    last_private_message_count = new_private_message_count;
}

function animate_mention_changes(new_mention_count) {
    if (new_mention_count > last_mention_count) {
        do_new_messages_animation('mentioned');
    }
    last_mention_count = new_mention_count;
}


exports.set_presence_list_count = function (person, count) {
    set_count("private", person, count);
};

exports.update_dom_with_unread_counts = function (counts) {
    // counts is just a data object that gets calculated elsewhere
    // Our job is to update some DOM elements.

    // counts.stream_count maps streams to counts
    counts.stream_count.each(function (count, stream) {
        set_count("stream", stream, count);
    });

    // counts.subject_count maps streams to hashes of topics to counts
    counts.subject_count.each(function (subject_hash, stream) {
        subject_hash.each(function (count, subject) {
            topic_list.set_count(stream, subject, count);
        });
    });

    counts.pm_count.each(function (count, person) {
        exports.set_presence_list_count(person, count);
        exports.set_pm_conversation_count(person, count);
    });

    // integer counts
    set_count("global", "private", counts.private_message_count);
    set_count("global", "mentioned", counts.mentioned_message_count);
    set_count("global", "home", counts.home_unread_messages);

    set_count_toggle_button($("#streamlist-toggle-unreadcount"), counts.home_unread_messages);
    set_count_toggle_button($("#userlist-toggle-unreadcount"), counts.private_message_count);

    animate_private_message_changes(counts.private_message_count);
    animate_mention_changes(counts.mentioned_message_count);
};

exports.rename_stream = function (sub, new_name) {
    sub.sidebar_li = build_stream_sidebar_row(new_name);
    exports.build_stream_list(); // big hammer
};

exports.refresh_pinned_or_unpinned_stream = function (sub) {
    // Pinned/unpinned streams require re-ordering.
    // We use kind of brute force now, which is probably fine.
    sub.sidebar_li = build_stream_sidebar_row(sub.name);
    exports.build_stream_list();
    exports.update_streams_sidebar();
};

$(function () {
    // TODO, Eventually topic_list won't be a big singleton,
    // and we can create more component-based click handlers for
    // each stream.
    topic_list.set_click_handlers({
        zoom_in: zoom_in,
        zoom_out: zoom_out
    });

    $(document).on('narrow_activated.zulip', function (event) {
        reset_to_unnarrowed(narrow.stream() === zoomed_stream);

        // TODO: handle confused filters like "in:all stream:foo"
        var op_in = event.filter.operands('in');
        if (op_in.length !== 0) {
            if (['all', 'home'].indexOf(op_in[0]) !== -1) {
                $("#global_filters li[data-name='" + op_in[0] + "']").addClass('active-filter');
            }
        }
        var op_is = event.filter.operands('is');
        if (op_is.length !== 0) {
            if (['starred', 'mentioned'].indexOf(op_is[0]) !== -1) {
                $("#global_filters li[data-name='" + op_is[0] + "']").addClass('active-filter');
            }
        }

        var op_pm = event.filter.operands('pm-with');
        if ((op_is.length !== 0 && _.contains(op_is, "private")) || op_pm.length !== 0) {
            private_messages_open = true;
            if (op_pm.length === 1) {
                $("#user_presences li[data-email='" + op_pm[0] + "']").addClass('active-filter');
                rebuild_recent_private_messages(op_pm[0]);
            } else if (op_pm.length !== 0) {
                // TODO: Should pass the reply-to of the thread
                rebuild_recent_private_messages("");
            } else {
                $("#global_filters li[data-name='private']").addClass('active-filter zoom-out');
                rebuild_recent_private_messages("");
            }
        }

        var op_stream = event.filter.operands('stream');
        if (op_stream.length !== 0 && stream_data.is_subscribed(op_stream[0])) {
            var stream_li = get_filter_li('stream', op_stream[0]);
            var op_subject = event.filter.operands('topic');
            if (op_subject.length === 0) {
                stream_li.addClass('active-filter');
            }
            rebuild_recent_topics(op_stream[0]);
            unread.process_visible();
        }
    });

    $(document).on('narrow_deactivated.zulip', function (event) {
        reset_to_unnarrowed();
        $("#global_filters li[data-name='home']").addClass('active-filter');
    });

    $(document).on('subscription_add_done.zulip', function (event) {
        exports.create_sidebar_row(event.sub);
        exports.build_stream_list();
    });

    $(document).on('subscription_remove_done.zulip', function (event) {
        var stream_name = event.sub.name;
        exports.remove_narrow_filter(stream_name, 'stream');
        // We need to make sure we resort if the removed sub gets added again
        previous_sort_order = undefined;
        previous_unpinned_order = undefined;
    });

    $('#global_filters').on('click', '.show-more-private-messages', function (e) {
        popovers.hide_all();
        $(".expanded_private_messages").expectOne().removeClass("zoom-out").addClass("zoom-in");
        $(".expanded_private_messages li.expanded_private_message").each(function () {
            $(this).show();
        });

        e.preventDefault();
        e.stopPropagation();
    });

    $('#stream_filters').on('click', 'li .subscription_block', function (e) {
        if (e.metaKey || e.ctrlKey) {
            return;
        }
        if (ui.home_tab_obscured()) {
            ui.change_tab_to('#home');
        }
        var stream = $(e.target).parents('li').attr('data-name');

        narrow.by('stream', stream, {select_first_unread: true, trigger: 'sidebar'});

        e.preventDefault();
        e.stopPropagation();
    });

});

function actually_update_streams_for_search() {
    exports.update_streams_sidebar();
    resize.resize_page_components();
}

var update_streams_for_search = _.throttle(actually_update_streams_for_search, 50);

exports.searching = function () {
    return $('.stream-list-filter').expectOne().is(':focus');
};

exports.escape_search = function () {
    var filter = $('.stream-list-filter').expectOne();
    if (filter.val() === '') {
        exports.clear_and_hide_search();
        return;
    }
    filter.val('');
    update_streams_for_search();
};

exports.initiate_search = function () {
    var filter = $('.stream-list-filter').expectOne();
    filter.removeClass('notdisplayed');
    filter.focus();
};

exports.clear_and_hide_search = function () {
    var filter = $('.stream-list-filter');
    if (filter.val() !== '') {
        filter.val('');
        update_streams_for_search();
    }
    filter.blur();
    filter.addClass('notdisplayed');
};

function focus_stream_filter (e) {
    e.stopPropagation();
}

function maybe_select_stream (e) {
    if (e.keyCode === 13) {
        // Enter key was pressed

        var topStream = $('#stream_filters li.narrow-filter').first().data('name');
        if (topStream !== undefined) {
            // undefined if there are no results
            if (ui.home_tab_obscured()) {
                ui.change_tab_to('#home');
            }
            exports.clear_and_hide_search();
            narrow.by('stream', topStream, {select_first_unread: true, trigger: 'sidebar enter key'});
            e.preventDefault();
            e.stopPropagation();
        }
    }
}

function toggle_filter_displayed(e) {
    if (e.target.id === 'streams_inline_cog') {
        return;
    }
    if (0 === $('.stream-list-filter.notdisplayed').length) {
        exports.clear_and_hide_search();
    } else {
        exports.initiate_search();
    }
    e.preventDefault();
}

$(function () {
    $(".stream-list-filter").expectOne()
        .on('click', focus_stream_filter)
        .on('input', update_streams_for_search)
        .on('keydown', maybe_select_stream);
});

$(function () {
    $("#streams_header").expectOne()
        .on('click', toggle_filter_displayed);
});

return exports;
}());
if (typeof module !== 'undefined') {
    module.exports = stream_list;
}