Merge pull request #2300 from swcraig/use-image-template-in-frontend

Use product image template in frontend

frontend/app/views/spree/checkout/_delivery.html.erb

@@ -26,7 +26,9 @@
             <tbody>
               <% ship_form.object.manifest.each do |item| %>
                 <tr class="stock-item">
-                  <td class="item-image"><%= image_tag item.variant.display_image.attachment(:mini) %></td>
+                  <td class="item-image">
+                    <%= render 'spree/shared/image', image: item.variant.display_image, size: :mini %>
+                  </td>
                   <td class="item-name"><%= item.variant.name %></td>
                   <td class="item-qty"><%= item.quantity %></td>
                   <td class="item-price"><%= display_price(item.variant) %></td>
@@ -72,7 +74,9 @@
             <tbody>
               <% @differentiator.missing.each do |variant, quantity| %>
                 <tr class="stock-item">
-                  <td class="item-image"><%= image_tag variant.display_image.attachment(:mini) %></td>
+                  <td class="item-image">
+                    <%= render 'spree/shared/image', image: variant.display_image, size: :mini %>
+                  </td>
                   <td class="item-name"><%= variant.name %></td>
                   <td class="item-qty"><%= quantity %></td>
                   <td class="item-price"><%= display_price(variant) %></td>

frontend/app/views/spree/orders/_line_item.html.erb

@@ -3,9 +3,9 @@
   <tr class="<%= cycle('', 'alt') %> line-item">
     <td class="cart-item-image" data-hook="cart_item_image">
       <% if variant.images.length == 0 %>
-        <%= link_to image_tag(variant.product.display_image.attachment(:small)), variant.product %>
+        <%= link_to(render('spree/shared/image', image: variant.product.display_image, size: :small), variant.product) %>
       <% else %>
-        <%= link_to image_tag(variant.images.first.attachment.url(:small)), variant.product %>
+        <%= link_to(render('spree/shared/image', image: variant.images.first, size: :small), variant.product) %>
       <% end %>
     </td>
     <td class="cart-item-description" data-hook="cart_item_description">

frontend/app/views/spree/products/_image.html.erb

@@ -1,5 +1,5 @@
 <% if defined?(image) && image %>
-  <%= image_tag image.attachment.url(:product), itemprop: "image" %>
+  <%= render 'spree/shared/image', image: image, size: :product, itemprop: "image" %>
 <% else %>
-  <%= image_tag @product.display_image.attachment(:product), itemprop: "image" %>
+  <%= render 'spree/shared/image', image: @product.display_image, size: :product, itemprop: "image" %>
 <% end %>

frontend/app/views/spree/shared/_image.html.erb

@@ -0,0 +1,12 @@
+<% size ||= :mini %>
+<% itemprop ||= nil %>
+
+<% if image && image.attachment? %>
+  <% if itemprop %>
+    <%= image_tag image.attachment(size), itemprop: itemprop %>
+  <% else %>
+    <%= image_tag image.attachment(size) %>
+  <% end %>
+<% else %>
+  <span class="image-placeholder <%= size %>"></span>
+<% end %>

frontend/app/views/spree/shared/_order_details.html.erb

@@ -63,9 +63,9 @@
       <tr data-hook="order_details_line_item_row">
         <td data-hook="order_item_image">
           <% if item.variant.images.length == 0 %>
-            <%= link_to image_tag(item.variant.product.display_image.attachment(:small)), item.variant.product %>
+            <%= link_to(render('spree/shared/image', image: item.variant.product.display_image, size: :small), item.variant.product) %>
           <% else %>
-            <%= link_to image_tag(item.variant.images.first.attachment.url(:small)), item.variant.product %>
+            <%= link_to(render('spree/shared/image', image: item.variant.images.first, size: :small), item.variant.product) %>
           <% end %>
         </td>
         <td data-hook="order_item_description">

frontend/app/views/spree/shared/_products.html.erb

@@ -28,7 +28,7 @@
       <li id="product_<%= product.id %>" class="columns three <%= cycle("alpha", "secondary", "", "omega secondary", name: "classes") %>" data-hook="products_list_item" itemscope itemtype="http://schema.org/Product">
         <% cache(@taxon.present? ? [I18n.locale, current_pricing_options, @taxon, product] : [I18n.locale, current_pricing_options, product]) do %>
           <div class="product-image">
-            <%= link_to image_tag(product.display_image.attachment(:small), itemprop: "image"), url, itemprop: 'url' %>
+            <%= link_to(render('spree/shared/image', image: product.display_image, size: :small, itemprop: "image"), url, itemprop: 'url') %>
           </div>
           <%= link_to truncate(product.name, length: 50), url, class: 'info', itemprop: "name", title: product.name %>
           <span itemprop="offers" itemscope itemtype="http://schema.org/Offer">