paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-14 10:57:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add overlay lightbox for displaying inline image previews.

Browse Source 
This adds an event listener (by way of delegation) to the
.message_inline_image elements that pops up the overlay and hides it
when the overlay exit is clicked.

Fixes #654.
This commit is contained in:
Brock Whittaker
2016-09-21 17:05:24 -07:00
committed by Tim Abbott
parent 2ea7d2341e
commit 87afe61860
9 changed files with 191 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
static/js/ui.js
View File

@@ -281,6 +281,29 @@ exports.small_avatar_url = function (message) {
}
};
exports.lightbox_photo = function (image, user) {
// image should be an Image Object in JavaScript.
var url = $(image).attr("src"),
title = $(image).parent().attr("title");
$("#overlay .image-preview")
.css("background-image", "url(" + url + ")");
$("#overlay").addClass("show");
$(".right-sidebar, .column-middle-inner, .left-sidebar").addClass("visual-blur");
$(".title").text(title || "N/A");
$(".user").text(user);
$(".image-actions .open, .image-actions .download").attr("href", url);
};
exports.exit_lightbox_photo = function (image) {
$("#overlay").removeClass("show");
$(".right-sidebar, .column-middle-inner, .left-sidebar").removeClass("visual-blur");
};
var loading_more_messages_indicator_showing = false;
exports.show_loading_more_messages_indicator = function () {
if (! loading_more_messages_indicator_showing) {