# HG changeset patch # User neko259 # Date 2015-10-01 14:42:54 # Node ID fb813b0498b04f7cad8e2a59a894f72b72f83762 # Parent a5568e38c2335be927837c1f3c02acb16e93ef1e Compute new image size in popup from the original size, not the previous before resize (now loss now) diff --git a/boards/static/js/image.js b/boards/static/js/image.js --- a/boards/static/js/image.js +++ b/boards/static/js/image.js @@ -31,6 +31,8 @@ var IMAGE_VIEWERS = [ var FULL_IMG_CLASS = 'post-image-full'; +var ATTR_SCALE = 'scale'; + function ImageViewer() {} ImageViewer.prototype.view = function (post) {}; @@ -76,8 +78,8 @@ PopupImageViewer.prototype.view = functi if (!existingPopups.length) { var imgElement= el.find('img'); - var img_w = imgElement.attr('data-width'); - var img_h = imgElement.attr('data-height'); + var full_img_w = imgElement.attr('data-width'); + var full_img_h = imgElement.attr('data-height'); var win = $(window); @@ -87,16 +89,16 @@ PopupImageViewer.prototype.view = functi // New image size var w_scale = 1; var h_scale = 1; - if (img_w > win_w) { - w_scale = img_w / (win_w - margin); + if (full_img_w > win_w) { + w_scale = full_img_w / (win_w - margin); } - if (img_h > win_h) { - h_scale = img_h / (win_h - margin); + if (full_img_h > win_h) { + h_scale = full_img_h / (win_h - margin); } var scale = Math.max(w_scale, h_scale) - img_w = img_w / scale; - img_h = img_h / scale; + var img_w = full_img_w / scale; + var img_h = full_img_h / scale; var postNode = $(el); @@ -105,6 +107,7 @@ PopupImageViewer.prototype.view = functi newImage.addClass('img-full') .attr('id', thumb_id) .attr('src', postNode.attr('href')) + .attr(ATTR_SCALE, scale) .appendTo(postNode) .css({ 'width': img_w, @@ -117,19 +120,23 @@ PopupImageViewer.prototype.view = functi var cx = event.originalEvent.clientX; var cy = event.originalEvent.clientY; - var i_w = parseFloat(newImage.width()); - var i_h = parseFloat(newImage.height()); + var scale = newImage.attr(ATTR_SCALE) / (delta > 0 ? 1.25 : 0.8); - var newIW = i_w * (delta > 0 ? 1.25 : 0.8); - var newIH = i_h * (delta > 0 ? 1.25 : 0.8); + var oldWidth = newImage.width(); + var oldHeight = newImage.height(); + + var newIW = full_img_w / scale; + var newIH = full_img_h / scale; newImage.width(newIW); newImage.height(newIH); + newImage.attr(ATTR_SCALE, scale); + // Set position var oldPosition = newImage.position(); newImage.css({ - left: parseInt(cx - (newIW/i_w) * (cx - parseInt(oldPosition.left, 10)), 10), - top: parseInt(cy - (newIH/i_h) * (cy - parseInt(oldPosition.top, 10)), 10) + left: parseInt(cx - (newIW/oldWidth) * (cx - parseInt(oldPosition.left, 10)), 10), + top: parseInt(cy - (newIH/oldHeight) * (cy - parseInt(oldPosition.top, 10)), 10) }); return false;