* Fix preview images not being resized to fit the screen when using the bookmarklet. * Fit images to both screen width and height by default. Previously we fit to screen width only, so tall images were hard to see. * Allow clicking on the image or pressing Z to toggle image size. * Move size information to above the image and add resize links: ** small: fit width and height ** large: fit width ** full: fit none * Bind the image error handler in an onerror attribute on the image itself so that it will always fire. Before it wouldn't fire if the image failed immediately on pageload before we could bind the error handler.
23 lines
1.1 KiB
Plaintext
23 lines
1.1 KiB
Plaintext
<% if params[:url] %>
|
|
<p id="upload-image-metadata">
|
|
<strong>Size</strong>
|
|
<% if @remote_size %>
|
|
<span id="upload-image-metadata-filesize"><%= number_to_human_size(@remote_size) %></span>
|
|
<% end %>
|
|
<span id="upload-image-metadata-resolution"></span>
|
|
<span id="upload-image-metadata-size-links">
|
|
(<a id="upload-image-view-small" href="">small</a> | <a id="upload-image-view-large" href="">large</a> | <a id="upload-image-view-full" href="">full</a>)
|
|
</span>
|
|
</p>
|
|
|
|
<div id="upload-image">
|
|
<% if ImageProxy.needs_proxy?(@source.image_url) %>
|
|
<%= tag.img src: image_proxy_uploads_path(url: @source.image_url), title: "Preview", id: "image", class: "fit-width fit-height", onerror: "Danbooru.Upload.no_image_available()", "data-shortcut": "z" %>
|
|
<% elsif @source.image_url.present? %>
|
|
<%= tag.img src: @source.image_url, title: "Preview", id: "image", referrerpolicy: "no-referrer", class: "fit-width fit-height", onerror: "Danbooru.Upload.no_image_available()", "data-shortcut": "z" %>
|
|
<% end %>
|
|
|
|
<div id="no-image-available">No image preview available</div>
|
|
</div>
|
|
<% end %>
|