Convert notes to use percentages instead of exact coordinates
- This allows for the note boxes to be easily resized -- Now resizing the note container resizes all of the note boxes -- The z-index and position values had to be adjusted for this --- So that the note/preview boxes were still visible --- So that the image was selectable with right clicks - All of the inner box styles have been moved to the outer box -- Now the inner box is only a container for the note body - The always resize image option has been removed from user settings -- The value still exists on the model for future rename/reuse - The max width is set at 100% for responsive mode to fit the screen
This commit is contained in:
@@ -33,13 +33,8 @@ Post.initialize_all = function() {
|
||||
this.initialize_favlist();
|
||||
this.initialize_post_sections();
|
||||
this.initialize_post_image_resize_links();
|
||||
this.initialize_post_image_resize_to_window_link();
|
||||
this.initialize_recommended();
|
||||
this.initialize_ugoira_player();
|
||||
|
||||
if (CurrentUser.data("always-resize-images") || (Utility.meta("viewport") && (window.screen.width <= 660))) {
|
||||
$("#image-resize-to-window-link").click();
|
||||
}
|
||||
}
|
||||
|
||||
if ($("#c-posts #a-show, #c-uploads #a-new").length) {
|
||||
@@ -325,7 +320,6 @@ Post.expand_image = function(e) {
|
||||
$notice.children().eq(0).hide();
|
||||
$notice.children().eq(1).show(); // Loading message
|
||||
Note.Box.scale_all();
|
||||
$image.data("scale-factor", 1);
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
@@ -357,45 +351,6 @@ Post.initialize_post_image_resize_links = function() {
|
||||
}
|
||||
}
|
||||
|
||||
Post.resize_image_to_window = function($img) {
|
||||
var sidebar_width = 0;
|
||||
var client_width = 0;
|
||||
|
||||
if (($img.data("scale-factor") === 1) || ($img.data("scale-factor") === undefined)) {
|
||||
if ($(window).width() > 660) {
|
||||
sidebar_width = $("#sidebar").width() || 0;
|
||||
client_width = $(window).width() - sidebar_width - 75;
|
||||
} else {
|
||||
client_width = $(window).width() - 2;
|
||||
}
|
||||
|
||||
if ($img.width() > client_width) {
|
||||
var isVideo = $img.prop("tagName") === "VIDEO";
|
||||
var width = isVideo ? $img.prop("width") : $img.data("original-width");
|
||||
var height = isVideo ? $img.prop("height") : $img.data("original-height");
|
||||
var ratio = client_width / width;
|
||||
$img.data("scale-factor", ratio);
|
||||
$img.css("width", width * ratio);
|
||||
$img.css("height", height * ratio);
|
||||
Post.resize_ugoira_controls();
|
||||
}
|
||||
} else {
|
||||
$img.data("scale-factor", 1);
|
||||
$img.width($img.data("original-width"));
|
||||
$img.height($img.data("original-height"));
|
||||
Post.resize_ugoira_controls();
|
||||
}
|
||||
|
||||
Note.Box.scale_all();
|
||||
}
|
||||
|
||||
Post.initialize_post_image_resize_to_window_link = function() {
|
||||
$("#image-resize-to-window-link").on("click.danbooru", function(e) {
|
||||
Post.resize_image_to_window($("#image"));
|
||||
e.preventDefault();
|
||||
});
|
||||
}
|
||||
|
||||
Post.initialize_excerpt = function() {
|
||||
$("#excerpt").hide();
|
||||
|
||||
@@ -460,6 +415,7 @@ Post.initialize_ugoira_player = function() {
|
||||
let file_url = $("#image-container").data("file-url");
|
||||
|
||||
Ugoira.create_player(content_type, frames, file_url);
|
||||
$(window).on("resize.danbooru.ugoira_scale", Post.resize_ugoira_controls);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user