diff --git a/boards/models/image.py b/boards/models/image.py --- a/boards/models/image.py +++ b/boards/models/image.py @@ -97,8 +97,6 @@ class PostImage(models.Model, Viewable): ' height="{}"' \ ' data-width="{}"' \ ' data-height="{}" />' \ - '' \ '' \ ''\ .format(CSS_CLASS_IMAGE, CSS_CLASS_THUMB, diff --git a/boards/static/css/base.css b/boards/static/css/base.css --- a/boards/static/css/base.css +++ b/boards/static/css/base.css @@ -97,6 +97,5 @@ textarea, input { } .post-image-full { - display: none; width: 100%; } 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 @@ -29,13 +29,28 @@ var IMAGE_VIEWERS = [ ['popup', new PopupImageViewer()] ]; +var FULL_IMG_CLASS = 'post-image-full'; + function ImageViewer() {} ImageViewer.prototype.view = function (post) {}; function SimpleImageViewer() {} SimpleImageViewer.prototype.view = function (post) { - post.find('img').toggle(); + var images = post.find('img'); + images.toggle(); + + // When we first enlarge an image, a full image needs to be created + if (images.length == 1) { + var parent = images.first().parent(); + var link = parent.attr('href'); + + var fullImg = $('') + .addClass(FULL_IMG_CLASS) + .attr('src', link); + + parent.append(fullImg); + } }; function PopupImageViewer() {}