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.

app/views/posts/partials/show/_image.html.erb

@@ -1,3 +1,3 @@
 <% if policy(post).visible? %>
-  <%= image_tag(post.file_url_for(CurrentUser.user), :width => post.image_width_for(CurrentUser.user), :height => post.image_height_for(CurrentUser.user), :id => "image", "data-original-width" => post.image_width, "data-original-height" => post.image_height, "data-large-width" => post.large_image_width, "data-large-height" => post.large_image_height, "data-tags" => post.tag_string, :alt => post.presenter.humanized_essential_tag_string, "data-uploader" => post.uploader.name, "data-rating" => post.rating, "data-flags" => post.status_flags, "data-parent-id" => post.parent_id, "data-has-children" => post.has_children?, "data-has-active-children" => post.has_active_children?, "data-score" => post.score, "data-fav-count" => post.fav_count, "itemprop" => "contentUrl") %>
+  <%= image_tag(post.file_url_for(CurrentUser.user), width: post.image_width_for(CurrentUser.user), height: post.image_height_for(CurrentUser.user), id: "image", class: "fit-width", "data-original-width": post.image_width, "data-original-height": post.image_height, "data-large-width": post.large_image_width, "data-large-height": post.large_image_height, "data-tags": post.tag_string, alt: post.presenter.humanized_essential_tag_string, "data-uploader": post.uploader.name, "data-rating": post.rating, "data-flags": post.status_flags, "data-parent-id": post.parent_id, "data-has-children": post.has_children?, "data-has-active-children": post.has_active_children?, "data-score": post.score, "data-fav-count": post.fav_count, "itemprop": "contentUrl") %>
 <% end %>

app/views/posts/partials/show/_options.html.erb

@@ -1,4 +1,9 @@
 <ul>
+  <% if policy(post).visible? %>
+    <li id="post-option-resize-to-window">
+      <%= link_to "Resize to window", "#", class: "image-resize-to-window-link", "data-shortcut": "z" %>
+    </li>
+  <% end %>
   <% if post.visible? && post.has_large? && !post.is_ugoira? %>
     <li id="post-option-view-large" style="<%= CurrentUser.default_image_size == "original" ? "" : "display: none;" %>">
       <%= link_to "View large", post.tagged_large_file_url, id: "image-view-large-link" %>

app/views/posts/partials/show/_ugoira_original.html.erb

@@ -2,6 +2,7 @@
   :canvas,
   nil,
   :id => "image",
+  :class => "fit-width",
   :width => post.image_width,
   :height => post.image_height,
   "data-original-width" => post.image_width,

app/views/posts/partials/show/_ugoira_webm.html.erb

@@ -1,3 +1,3 @@
-<%= content_tag(:video, nil, :id => "image", :width => post.image_width, :height => post.image_height, :autoplay => true, :loop => true, :controls => "controls", :src => post.tagged_large_file_url) %>
+<%= content_tag(:video, nil, id: "image", class: "fit-width", width: post.image_width, height: post.image_height, autoplay: true, loop: true, controls: "controls", src: post.tagged_large_file_url) %>
 
 <p><%= link_to "Save this video (right click and save)", post.tagged_large_file_url %> | <%= link_to "View original", post_path(post, :original => 1) %></p>

app/views/posts/partials/show/_video.html.erb

@@ -1,7 +1,7 @@
 <% if post.is_ugoira? %>
-  <%= content_tag(:video, nil, :id => "image", :width => post.image_width, :height => post.image_height, :autoplay => true, :loop => true, :controls => "controls", :src => post.tagged_large_file_url) %>
+  <%= content_tag(:video, nil, id: "image", class: "fit-width", width: post.image_width, height: post.image_height, autoplay: true, loop: true, controls: "controls", src: post.tagged_large_file_url) %>
   <p><%= link_to "Save this video (right click and save)", post.tagged_large_file_url %></p>
 <% else %>
-  <%= content_tag(:video, nil, :id => "image", :width => post.image_width, :height => post.image_height, :autoplay => true, :loop => true, :controls => "controls", :src => post.tagged_file_url) %>
+  <%= content_tag(:video, nil, id: "image", class: "fit-width", width: post.image_width, height: post.image_height, autoplay: true, loop: true, controls: "controls", src: post.tagged_file_url) %>
   <p><%= link_to "Save this video (right click and save)", post.tagged_file_url %></p>
 <% end %>

app/views/posts/show.html.erb

@@ -50,10 +50,9 @@
 
   <%= render "posts/partials/show/notices", :post => @post %>
 
-  <%= content_tag(:section, { class: "image-container" }.merge(PostPresenter.data_attributes(@post))) do -%>
-    <div class="note-container"></div>
-    <div id="note-preview"></div>
+  <%= content_tag(:section, class: "image-container note-container", **PostPresenter.data_attributes(@post)) do -%>
     <%= render "posts/partials/show/embedded", post: @post %>
+    <div id="note-preview"></div>
   <% end -%>
 
   <% if policy(Favorite).create? %>