posts: add back "resize to window" link.

* Add back "Resize to window" link.
* Add Z shortcut for resize to window link (mnemonic: Z for zoom image).
* Resize images to screen width by default on both desktop and mobile.
* Make it so that notes are nested directly inside the .image-container
  element with the image, instead of inside a separate .note-container
  element. This means .image-container and .note-container are now the
  same element. This is so that the size of the .note-container is
  driven by the size of the image, which ensures that notes are
  automatically resized as the image is resized.
This commit is contained in:
evazion
2020-03-26 00:22:18 -05:00
parent 1126147dee
commit 87a51129b8
12 changed files with 39 additions and 30 deletions

View File

@@ -300,7 +300,7 @@ Post.initialize_favlist = function() {
});
}
Post.expand_image = function(e) {
Post.view_original = function(e) {
if (Utility.test_max_width(660)) {
// Do the default behavior (navigate to image)
return;
@@ -347,9 +347,17 @@ Post.view_large = function(e) {
e.preventDefault();
}
Post.toggle_fit_window = function(e) {
$("#image").toggleClass("fit-width");
Note.Box.scale_all();
Post.resize_ugoira_controls();
e.preventDefault();
};
Post.initialize_post_image_resize_links = function() {
$("#image-resize-link").on("click.danbooru", Post.expand_image);
$("#image-resize-link").on("click.danbooru", Post.view_original);
$("#image-view-large-link").on("click.danbooru", Post.view_large);
$(document).on("click.danbooru", ".image-resize-to-window-link", Post.toggle_fit_window);
if ($("#image-resize-notice").length) {
Utility.keydown("v", "resize", function(e) {