Show attachments in issues/comments and add preview for images

This commit is contained in:
Justin Nuß 2014-07-24 13:50:03 +02:00
parent fa1db64ff0
commit 43e5de7f83
5 changed files with 145 additions and 24 deletions

View file

@ -1794,4 +1794,29 @@ body {
color: #444;
font-weight: bold;
line-height: 30px;
}
.issue-main .attachments {
margin: 0px 10px 10px 10px;
}
.issue-main .attachments .attachment-label {
margin-right: 5px;
}
.attachment-preview {
position: absolute;
top: 0px;
bottom: 0px;
margin: 5px;
padding: 8px;
background: #fff;
border: 1px solid #d8d8d8;
box-shadow: 0 0 5px 1px #d8d8d8;
}
.attachment-preview-img {
border: 1px solid #d8d8d8;
}

View file

@ -520,6 +520,61 @@ function initIssue() {
});
}());
// Preview for images.
(function() {
var $hoverElement = $("<div></div>");
var $hoverImage = $("<img />");
$hoverElement.addClass("attachment-preview");
$hoverElement.hide();
$hoverImage.addClass("attachment-preview-img");
$hoverElement.append($hoverImage);
$(document.body).append($hoverElement);
var over = function() {
var $this = $(this);
if ($this.text().match(/\.(png|jpg|jpeg|gif)$/) == false) {
return;
}
if ($hoverImage.attr("src") != $this.attr("href")) {
$hoverImage.attr("src", $this.attr("href"));
$hoverImage.load(function() {
var height = this.height;
var width = this.width;
if (height > 300) {
var factor = 300 / height;
height = factor * height;
width = factor * width;
}
$hoverImage.css({"height": height, "width": width});
var offset = $this.offset();
var left = offset.left, top = offset.top + $this.height() + 5;
$hoverElement.css({"top": top + "px", "left": left + "px"});
$hoverElement.css({"height": height + 16, "width": width + 16});
$hoverElement.show();
});
} else {
$hoverElement.show();
}
};
var out = function() {
$hoverElement.hide();
};
$(".issue-main .attachments .attachment").hover(over, out);
}());
// Upload.
(function() {
var $attached = $("#attached");
var $attachments = $("input[name=attachments]");