fixes #2692: Rework bookmarklet preview

app/assets/javascripts/notes.js

@@ -176,6 +176,9 @@ Danbooru.Note = {
 
     scale_all: function() {
       var container = document.getElementById('note-container');
+      if (container === null) {
+        return;
+      }
       // Hide notes while rescaling, to prevent unnecessary reflowing
       var was_visible = container.style.display != 'none';
       if (was_visible) {

app/assets/javascripts/posts.js

@@ -115,10 +115,6 @@
 
     $tag_string.css({"resize": "none", "width": "100%"});
     $tag_string.focus().selectEnd().height($tag_string[0].scrollHeight);
-
-    var $image = $("#c-uploads .ui-wrapper #image, #c-uploads .ui-wrapper:has(#image)");
-    $image.height($image.resizable("option", "maxHeight"));
-    $image.width($image.resizable("option", "maxWidth"));
   }
 
   Danbooru.Post.close_edit_dialog = function(e, ui) {
@@ -351,33 +347,35 @@
     }
   }
 
-  Danbooru.Post.initialize_post_image_resize_to_window_link = function() {
+  Danbooru.Post.resize_image_to_window = function($img) {
-    $("#image-resize-to-window-link").click(function(e) {
+    if (($img.data("scale-factor") === 1) || ($img.data("scale-factor") === undefined)) {
-      var $img = $("#image");
+      if ($(window).width() > 660) {
-
+        var client_width = $(window).width() - $("#sidebar").width() - 75;
-      if (($img.data("scale-factor") === 1) || ($img.data("scale-factor") === undefined)) {
-        if ($(window).width() > 660) {
-          var client_width = $(window).width() - $("#sidebar").width() - 75;
-        } else {
-          var client_width = $(window).width() - 30;
-        }
-        var client_height = $(window).height();
-
-        if ($img.width() > client_width) {
-          var ratio = client_width / $img.data("original-width");
-          $img.data("scale-factor", ratio);
-          $img.css("width", $img.data("original-width") * ratio);
-          $img.css("height", $img.data("original-height") * ratio);
-          Danbooru.Post.resize_ugoira_controls();
-        }
       } else {
-        $img.data("scale-factor", 1);
+        var client_width = $(window).width() - 30;
-        $img.width($img.data("original-width"));
+      }
-        $img.height($img.data("original-height"));
+      var client_height = $(window).height();
+
+      if ($img.width() > client_width) {
+        var ratio = client_width / $img.data("original-width");
+        $img.data("scale-factor", ratio);
+        $img.css("width", $img.data("original-width") * ratio);
+        $img.css("height", $img.data("original-height") * ratio);
         Danbooru.Post.resize_ugoira_controls();
       }
+    } else {
+      $img.data("scale-factor", 1);
+      $img.width($img.data("original-width"));
+      $img.height($img.data("original-height"));
+      Danbooru.Post.resize_ugoira_controls();
+    }
 
-      Danbooru.Note.Box.scale_all();
+    Danbooru.Note.Box.scale_all();
+  }
+
+  Danbooru.Post.initialize_post_image_resize_to_window_link = function() {
+    $("#image-resize-to-window-link").click(function(e) {
+      Danbooru.Post.resize_image_to_window($("#image"));
       e.preventDefault();
     });
   }

app/assets/javascripts/uploads.js

@@ -107,32 +107,27 @@
     $("#source-info ul").show();
   }
 
+  Danbooru.Upload.update_scale = function() {
+    var $image = $("#image");
+    var ratio = $image.data("scale-factor");
+    if (ratio < 1) {
+      $("#scale").html("Scaled " + parseInt(100 * ratio) + "% (original: " + $image.data("original-width") + "x" + $image.data("original-height") + ")");
+    } else {
+      $("#scale").html("Original: " + $image.data("original-width") + "x" + $image.data("original-height"));
+    }
+  }
+
   Danbooru.Upload.initialize_image = function() {
     var $image = $("#image");
     if ($image.length) {
-      var height = $image.height();
       var width = $image.width();
-      if (height > 400) {
+      var height = $image.height();
-        var ratio = 400.0 / height;
+      $image.data("original-width", width);
-        $image.height(height * ratio);
+      $image.data("original-height", height);
-        $image.width(width * ratio);
+      Danbooru.Post.resize_image_to_window($image);
-        $("#scale").html("Scaled " + parseInt(100 * ratio) + "% (original: " + width + "x" + height + ")");
+      Danbooru.Post.initialize_post_image_resize_to_window_link();
-        $image.resizable({
+      Danbooru.Upload.update_scale();
-          maxHeight: height,
+      $("#image-resize-to-window-link").click(Danbooru.Upload.update_scale);
-          maxWidth: width,
-          aspectRatio: width/height,
-          handles: "e, s, se",
-          resize: function( event, ui ){
-            var origin_width = ui.element.resizable("option","maxWidth");
-            var origin_height = ui.element.resizable("option","maxHeight");
-            var height = ui.size.height;
-            var ratio = height/origin_height;
-            $("#scale").html("Scaled " + parseInt(100 * ratio) + "% (original: " + origin_width + "x" + origin_height + ")");
-          }
-        });
-      } else {
-        $("#scale").html("(original: " + width + "x" + height + ")");
-      }
     }
   }
 })();

app/views/uploads/_image.html.erb

@@ -14,6 +14,6 @@
       <li><strong>Referrer:</strong> <%= params[:ref] %></li>
     <% end %>
 
-    <li id="scale"></li>
+    <li><span id="scale"></span> (<%= link_to "toggle size", "#", :id => "image-resize-to-window-link" %>)</li>
   </ul>
 <% end %>