RubyGems - artwork - Versions diffs - 0.6.1 → 0.7.0 - Mend

artwork 0.6.1 → 0.7.0

Files changed (11) hide show

checksums.yaml +4 -4
data/CHANGELOG.md +44 -0
data/README.md +63 -9
data/lib/artwork/configuration.rb +25 -16
data/lib/artwork/model.rb +17 -4
data/lib/artwork/version.rb +1 -1
data/spec/artwork/configuration_spec.rb +31 -11
data/spec/artwork/model_spec.rb +57 -7
data/spec/artwork/view_spec.rb +26 -2
data/spec/artwork_spec.rb +2 -2
metadata +3 -2

checksums.yaml CHANGED

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 6e56305fe5bd63752f1cf13ba018c3354b688b93
-  data.tar.gz: 3c11975ed676de962d5ad35056957de662dc6582
+  metadata.gz: 573aa33bc1c5aefabf51ff8509dc7bd55fa6a09e
+  data.tar.gz: f8c0aefbcb4d513b3b52b41aa08efa4cc4a59ddf
 SHA512:
-  metadata.gz: 161644ee8eb7fd885e020b8164cafdb0ad1fb9cc69a885c09af9668cef01fdb9c5ea509bc2f5871ab005a6afffe5fba533f748aeab405c793ebad9c9bbd7689c
-  data.tar.gz: 3e92cee31bbfac880b0fb56de9f12a24ceb989f9ee826f1e486845cb2ef9a6cf2d098b75f68717bb8b0e34f95532b62121b230967d722271cbc66db89933ef0e
+  metadata.gz: 3362f10528462b3405e0a1959c48d935c1ae220e09564dfef9326f112bcb523444dca904e4f80848c7e4626c9077c14710c19d0cf0eec6da0433c82988f7ecba
+  data.tar.gz: aa4077dfae88ef932c291891f53553dc1f5382b95cca2b831abbd47db5302a1c219b0e0ee4bc5a39747d418fec51d8e9a86b636e70811a64ff4944e74d0c2c34

data/CHANGELOG.md ADDED

@@ -0,0 +1,44 @@
+## v0.7.0
+**Backwards-incompatible changes**
+- Renamed `Artwork.default_resolution` to `Artwork.base_resolution`
+- Renamed `Artwork.actual_resolution_for` to `Artwork.actual_resolution_from`
+  and is now private
+**Other changes**
+- Added support for custom base resolutions via the following syntax:
+  `<%= artwork_tag @record, :cover, '800x@1200' %>`
+- Added `Artwork.actual_resolution` (set via `Artwork.configure_for(request)`)
+- Added support for responsive image sizes via the alternative sizes parameter
+  of `Artwork::Model.artwork_thumb_for(name, size, alternative_sizes = nil)`
+  Example usage:
+    Request full-width images if the current browser's viewport is 480 px or
+    less wide:
+    ```ruby
+    <%= artwork_tag @recrod, :cover, '800x', {480 => '320x@320'} %>
+    ```
+## v0.6.1
+- Added `Artwork.actual_resolution_for(request)` which returns the current
+  client's browser width, in pixels.
+## v0.6.0
+- Don't change viewport width & retina cookies when loaded in an iframe.
+## v0.5.0
+No changes.
+## v0.4.2
+- Set the cookies with `path=/`.
+## v0.4.1
+- Compatibility with newer versions of the Paperclip gem.

data/README.md CHANGED

@@ -1,12 +1,27 @@
 # Artwork
-Automated user-resolution-based image size choosing for your Rails views, but
-done at the backend. Works for any browser. Delivers the information needed for
-the calculations (browser window's dimentions and device's pixel ratio) via a
-cookie. Supports only Paperclip attachments.
+The Artwork gem provides simple server-side responsive images support for Rails
+which is similar in concept to the `<picture>` tag spec but requires no
+JavaScript, doesn't make extra requests and works in all browsers.
+Currently it supports only Paperclip attachments, but that can be changed
+failry easily.
 The gem should be thread-safe and should work with Rails 2.3 or newer.
+## How it works
+To do this "magic", the gem needs some information from the browser. Two pieces
+of knowledge travel from the browser to the server via a cookie:
+- the browser window's dimentions (width in pixels)
+- the device's pixel ratio
+These values are set in a cookie as early as possible during the first page
+load and then the page is reloaded with JavaScript. If these values change
+later on, for example if the user resizes their browser, no automatic reloading
+is performed.
 ## An example
 Say you've declared a default (base) resolution of 1440px. You design based on
@@ -56,7 +71,8 @@ Or install it yourself as:
     $ gem install artwork
-Add the following line at the top of your `<head>` section:
+Add the following line at the top of your `<head>` section, as early as
+possible, but **after** any `<meta viewport>` tags:
     <%= activate_resolution_independence %>
@@ -69,6 +85,11 @@ so you could prevent this if you add (*ABOVE* the top script):
     <style> .artwork-reload-splash body { display: none; } </style>
     <%= activate_resolution_independence %>
+### When you have a viewport meta tag
+If you have `<meta viewport>` tags, place them **before** the
+`activate_resolution_independence` call.
 ### Usage in frames
 The client-side code which checks for the current browser's resolutions will be
@@ -86,7 +107,7 @@ This has to happen before the `<%= activate_resolution_independence %>` call.
 Set the following variables in an app initializer:
 - `Artwork.supported_resolutions_list`
-- `Artwork.default_resolution`
+- `Artwork.base_resolution`
 Name your Paperclip attachment styles using the following convention:
@@ -108,7 +129,7 @@ conventions will be ignored and will bypass the artwork auto-sizing logic.
 Configure the gem by putting the following code in `config/initializers/artwork.rb`:
-    Artwork.default_resolution = 1440
+    Artwork.base_resolution = 1440
     Artwork.supported_resolutions_list = [1024, 1280, 1440, 1600, 1920, 2048, 3200, 3840]
 Include `Artwork::Model` in your models which have artworks.
@@ -122,12 +143,46 @@ the `artwork_tag` view helper. Example:
     <%= artwork_tag @film, :board, :'1440x', :image => {:class => 'poster'} %>
     <%= artwork_tag @gallery, :cover, :'900x' %>
+### Base (default) resolution
+The base resolution defeined by `Artwork.base_resolution` is there to assist
+in development and to make calculating the image width percentage in relation
+to the viewport width easier.
+For example, to define a half-width image in a setting where your base
+resolution is 1600 px, you can use:
+    <%= artwork_tag @record, :cover, :'800x' %>
+In general, it's convenient to set the base resolution to what your dev team's
+screen width is.
+### Custom base resolutions
+The gem supports per-tag base resolutions via the following syntax:
+    <%= artwork_tag @record, :cover, :'800x@1200' %>
+This effectively means "size the image as 2/3 of the viewport width".
+### Different image sizes based on different browser widths
+There is basic media query-like support built into
+`Artwork::Model.artwork_thumb_for(name, size, alternative_sizes = nil)`.
+For example, to request a full width image if the current browser's viewport
+is 480px or less wide, you can use the following code:
+```ruby
+<%= artwork_tag @recrod, :cover, '800x', {480 => '320x@320'} %>
+```
 ## Thumb Selection Algorithm
 The following criteria are taken into account for picking up the appropriate
 thumb name:
-- The `default_resolution` specified in the Artwork configuration file.
+- The `base_resolution` specified in the Artwork configuration file.
 - The current resolition, approximated to the nearest supported resolution
   which is larger than the current user's one.
 - Whether or not the screen is retina.
@@ -154,7 +209,6 @@ For a thumb to be returned as matching, all of the following must be true:
 If no such thumb exist, the largest one will match.
 ## Contributing
 1. [Fork it](https://github.com/mitio/artwork/fork)

data/lib/artwork/configuration.rb CHANGED

@@ -11,13 +11,13 @@ module Artwork
       set :supported_resolutions_list, list
     end
-    def default_resolution
-      get(:default_resolution) or @@default_resolution or raise "Please set #{__method__}"
+    def base_resolution
+      get(:base_resolution) or @@base_resolution or raise "Please set #{__method__}"
     end
-    def default_resolution=(resolution)
-      @@default_resolution ||= resolution
-      set :default_resolution, resolution
+    def base_resolution=(resolution)
+      @@base_resolution ||= resolution
+      set :base_resolution, resolution
     end
     def load_2x_images?
@@ -29,26 +29,25 @@ module Artwork
     end
     def current_resolution
-      get(:current_resolution) || default_resolution
+      get(:current_resolution) || base_resolution
     end
-    def actual_resolution_for(request)
-      browser_width = request.cookies['_width'].to_i
+    def current_resolution=(resolution)
+      set :current_resolution, resolution
+    end
-      if browser_width > 0
-        browser_width
-      else
-        default_resolution
-      end
+    def actual_resolution
+      get(:actual_resolution) || base_resolution
     end
-    def current_resolution=(resolution)
-      set :current_resolution, resolution
+    def actual_resolution=(resolution)
+      set :actual_resolution, resolution
     end
     def configure_for(request)
       Artwork.load_2x_images     = fetch_2x_images_flag_from(request)
       Artwork.current_resolution = current_resolution_from(request)
+      Artwork.actual_resolution  = actual_resolution_from(request)
     end
     def reset_configuration
@@ -73,7 +72,7 @@ module Artwork
     def current_resolution_from(request)
       browser_width = request.cookies['_width'].to_i
-      return default_resolution if browser_width.zero?
+      return base_resolution if browser_width.zero?
       supported_resolutions_list.each do |resolution|
         return resolution if browser_width <= resolution
@@ -81,5 +80,15 @@ module Artwork
       supported_resolutions_list.last
     end
+    def actual_resolution_from(request)
+      browser_width = request.cookies['_width'].to_i
+      if browser_width > 0
+        browser_width
+      else
+        base_resolution
+      end
+    end
   end
 end

data/lib/artwork/model.rb CHANGED

@@ -2,10 +2,17 @@ require 'artwork/thumbnail'
 module Artwork
   module Model
-    def artwork_thumb_for(attachment_name, size)
+    def artwork_thumb_for(attachment_name, size, alternative_sizes = nil)
+      size = determine_alternative_size_for(alternative_sizes) || size
+      size, base_resolution = size.to_s.split('@')
+      base_resolution ||= Artwork.base_resolution
       desired_thumb = Thumbnail.new(size)
       matching_thumb_name = nil
+      ratio_for_current_resolution = base_resolution.to_f / Artwork.current_resolution.to_f
       if desired_thumb.compatible?
         desired_size = desired_thumb.width / ratio_for_current_resolution
@@ -42,7 +49,7 @@ module Artwork
     end
     def artwork_url(attachment_name, size, options = {})
-      thumb_name = artwork_thumb_for(attachment_name, size)
+      thumb_name = artwork_thumb_for(attachment_name, size, options)
       send(attachment_name).url(thumb_name, options)
     end
@@ -52,8 +59,14 @@ module Artwork
     private
-    def ratio_for_current_resolution
-      Artwork.default_resolution.to_f / Artwork.current_resolution.to_f
+    def determine_alternative_size_for(alternative_sizes)
+      return unless alternative_sizes
+      new_size_definition = alternative_sizes \
+        .sort_by { |max_resolution, size| max_resolution } \
+        .find { |max_resolution, size| Artwork.actual_resolution <= max_resolution }
+      new_size_definition.last if new_size_definition
     end
   end
 end

data/lib/artwork/version.rb CHANGED

@@ -1,3 +1,3 @@
 module Artwork
-  VERSION = '0.6.1'
+  VERSION = '0.7.0'
 end

data/spec/artwork/configuration_spec.rb CHANGED

@@ -6,8 +6,9 @@ module Artwork
     before :each do
       [
-        :default_resolution, :supported_resolutions_list,
-        :current_resolution, :load_2x_images
+        :base_resolution, :supported_resolutions_list,
+        :current_resolution, :actual_resolution,
+        :load_2x_images,
       ].each do |key|
         Thread.current[key] = nil
@@ -15,7 +16,7 @@ module Artwork
       end
     end
-    [:default_resolution, :supported_resolutions_list].each do |option_name|
+    [:base_resolution, :supported_resolutions_list].each do |option_name|
       describe "##{option_name}" do
         let(:default_value) { option_name == :supported_resolutions_list ? [1440] : 1440 }
         let(:custom_value) { option_name == :supported_resolutions_list ? [1024] : 1024 }
@@ -70,8 +71,8 @@ module Artwork
     end
     describe '#current_resolution' do
-      it 'falls back to default_resolution' do
-        expect(config).to receive(:default_resolution).and_return('default')
+      it 'falls back to base_resolution' do
+        expect(config).to receive(:base_resolution).and_return('default')
         expect(config.current_resolution).to eq 'default'
       end
     end
@@ -83,6 +84,20 @@ module Artwork
       end
     end
+    describe '#actual_resolution' do
+      it 'falls back to base_resolution' do
+        expect(config).to receive(:base_resolution).and_return('default')
+        expect(config.actual_resolution).to eq 'default'
+      end
+    end
+    describe '#actual_resolution=' do
+      it 'allows setting the current actual resolution' do
+        config.actual_resolution = 12345
+        expect(config.actual_resolution).to eq 12345
+      end
+    end
     describe '#reset_configuration' do
       it 'resets the current_resolution' do
         config.current_resolution = 'current'
@@ -90,7 +105,7 @@ module Artwork
         config.reset_configuration
-        expect(config).to receive(:default_resolution).and_return('default')
+        expect(config).to receive(:base_resolution).and_return('default')
         expect(config.current_resolution).to eq 'default'
       end
@@ -109,17 +124,18 @@ module Artwork
         double :cookies => cookies_hash
       end
-      it 'sets current_resolution and load_2x_images from request cookies' do
+      it 'sets current_resolution, actual_resolution and load_2x_images from request cookies' do
         config.supported_resolutions_list = [1000, 2000, 3000]
         config.configure_for make_request('_retina' => '1', '_width' => '2000')
         expect(config.current_resolution).to eq 2000
+        expect(config.actual_resolution).to eq 2000
         expect(config.load_2x_images?).to eq true
       end
       it 'sets the load_2x_images flag from the _retina cookie' do
         config.supported_resolutions_list = [1000, 2000, 3000]
-        config.default_resolution = 1000
+        config.base_resolution = 1000
         config.configure_for make_request('_retina' => '0')
         expect(config.load_2x_images?).to eq false
@@ -128,26 +144,30 @@ module Artwork
         expect(config.load_2x_images?).to eq true
       end
-      it 'picks only from the supported resolutions list' do
+      it 'picks only from the supported resolutions list but stores the actual resolution as well' do
         config.supported_resolutions_list = [1000, 2000, 3000]
         config.configure_for make_request('_width' => '1234')
         expect(config.current_resolution).to eq 2000
+        expect(config.actual_resolution).to eq 1234
         config.configure_for make_request('_width' => '234')
         expect(config.current_resolution).to eq 1000
+        expect(config.actual_resolution).to eq 234
         config.configure_for make_request('_width' => '10234')
         expect(config.current_resolution).to eq 3000
+        expect(config.actual_resolution).to eq 10234
       end
-      it 'falls back to default_resolution if no _width cookie' do
+      it 'falls back to base_resolution if no _width cookie' do
         config.supported_resolutions_list = []
-        config.default_resolution = 5000
+        config.base_resolution = 5000
         config.configure_for make_request
         expect(config.current_resolution).to eq 5000
+        expect(config.actual_resolution).to eq 5000
       end
     end
   end

data/spec/artwork/model_spec.rb CHANGED

@@ -59,7 +59,7 @@ module Artwork
     describe '#artwork_url' do
       it 'returns the computed url of an attachment by delegating to artwork_thumb_for' do
-        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size).and_return(:computed_size)
+        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size, 'options').and_return(:computed_size)
         attachment = double
         expect(attachment).to receive(:url).with(:computed_size, 'options').and_return 'some/url'
@@ -69,7 +69,7 @@ module Artwork
       end
       it 'works with two arguments and a hash options' do
-        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size).and_return(:computed_size)
+        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size, :some => 'options').and_return(:computed_size)
         attachment = double
         expect(attachment).to receive(:url).with(:computed_size, :some => 'options').and_return 'some/url'
@@ -79,7 +79,7 @@ module Artwork
       end
       it 'works with two arguments only without any options hash' do
-        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size).and_return(:computed_size)
+        expect(instance).to receive(:artwork_thumb_for).with(:photo, :size, {}).and_return(:computed_size)
         attachment = double
         expect(attachment).to receive(:url).with(:computed_size, {}).and_return 'some/url'
@@ -91,13 +91,14 @@ module Artwork
     describe '#artwork_thumb_for' do
       before :each do
-        Artwork.default_resolution = 1000
+        Artwork.base_resolution    = 1000
         Artwork.current_resolution = 1000
+        Artwork.actual_resolution  = 1000
         Artwork.load_2x_images     = false
       end
       def expect_thumb(size, expected)
-        expect(instance.artwork_thumb_for(:image, size)).to eq expected
+        expect(instance.artwork_thumb_for(:image, *Array(size))).to eq expected
       end
       it 'picks the exact requested size if it exists' do
@@ -110,7 +111,7 @@ module Artwork
       end
       it 'scales the required size according to current_resolution' do
-        Artwork.default_resolution = 1000
+        Artwork.base_resolution = 1000
         Artwork.current_resolution = 2000
         expect_thumb '1000x', :'2000x'
@@ -136,7 +137,7 @@ module Artwork
         expect_thumb 'unsupported', :unsupported
         Artwork.load_2x_images     = true
-        Artwork.default_resolution = 1000
+        Artwork.base_resolution = 1000
         Artwork.current_resolution = 5000
         expect_thumb 'unsupported', :unsupported
@@ -161,6 +162,18 @@ module Artwork
         expect_thumb '200x_some_label', :'320x_some_label'
       end
+      it 'allows changing the base resolution per request' do
+        Artwork.current_resolution = 2000
+        expect_thumb '320x@320', :'2000x'
+        expect_thumb '320x@640', :'1280x'
+        Artwork.current_resolution = 320
+        expect_thumb '320x@320', :'320x'
+        expect_thumb '320x_some_label@320', :'320x_some_label'
+        expect_thumb '200x_some_label@320', :'320x_some_label'
+      end
       it 'considers the aspect ratio of the desired thumb' do
         expect_thumb '320x499', :'320x500'
         expect_thumb '319x498', :'320x500'
@@ -190,6 +203,43 @@ module Artwork
       it 'returns nil if no thumbnail matches the requested label' do
         expect_thumb '319x_nonexistant_label', nil
       end
+      context 'with an alternative sizes definition' do
+        it 'ignores alternative sizes if current resolution is above all the max resolutions given' do
+          Artwork.current_resolution = 1000
+          Artwork.actual_resolution  = 1000
+          expect_thumb ['320x', {700 => '100x@100'}], :'320x'
+        end
+        it 'picks the first alternative size if current resolution is smaller than all max resolutions' do
+          Artwork.current_resolution = 799
+          Artwork.actual_resolution  = 799
+          expect_thumb ['320x', {1280 => '500x', 800 => '1000x'}], :'1280x'
+        end
+        it 'picks the first alternative size if current resolution is smaller than all max resolutions and supports custom base resolutions' do
+          Artwork.current_resolution = 799
+          Artwork.actual_resolution  = 799
+          expect_thumb ['320x', {1280 => '50x@100', 800 => '100x@100'}], :'1280x'
+        end
+        it 'compares resolutions with <=' do
+          Artwork.current_resolution = 800
+          Artwork.actual_resolution  = 800
+          expect_thumb ['320x', {1280 => '50x@100', 800 => '100x@100'}], :'1280x'
+        end
+        it 'picks the largest alternative size if current resolution is smaller only than the max resolution given' do
+          Artwork.current_resolution = 1200
+          Artwork.actual_resolution  = 1200
+          expect_thumb ['320x', {1280 => '50x@100', 800 => '100x@100'}], :'640x'
+        end
+      end
     end
   end
 end

data/spec/artwork/view_spec.rb CHANGED

@@ -19,8 +19,32 @@ module Artwork
       end
     end
-    it 'defines the artwork_tag helper method' do
-      expect(View.instance_methods.map(&:to_sym)).to include(:artwork_tag)
+    describe '#artwork_tag' do
+      it 'is defined' do
+        expect(View.instance_methods.map(&:to_sym)).to include(:artwork_tag)
+      end
+      it 'returns an HTML img tag with the appropriate URL' do
+        record = double
+        expect(record).to receive(:artwork_url).with(:artwork_name, :size, {}).and_return('image_url')
+        allow(view_context).to receive(:content_tag).and_yield
+        expect(view_context).to receive(:image_tag).with('image_url', {:alt => nil}).and_return('image-tag-with-url')
+        generated_html = view_context.artwork_tag(record, :artwork_name, :size)
+        expect(generated_html).to eq 'image-tag-with-url'
+      end
+      it 'passes the options to artwork_url' do
+        record = double
+        expect(record).to receive(:artwork_url).with(:artwork_name, :size, {:some => 'options'}).and_return('image_url')
+        allow(view_context).to receive(:content_tag).and_yield
+        expect(view_context).to receive(:image_tag).with('image_url', {:alt => nil}).and_return('image-tag-with-url')
+        generated_html = view_context.artwork_tag(record, :artwork_name, :size, {:some => 'options'})
+        expect(generated_html).to eq 'image-tag-with-url'
+      end
     end
   end
 end

data/spec/artwork_spec.rb CHANGED

@@ -8,8 +8,8 @@ describe Artwork do
   it 'responds to configuration methods' do
     expect(Artwork).to respond_to(:configure_for)
     expect(Artwork).to respond_to(:reset_configuration)
-    expect(Artwork).to respond_to(:default_resolution)
-    expect(Artwork).to respond_to(:default_resolution=)
+    expect(Artwork).to respond_to(:base_resolution)
+    expect(Artwork).to respond_to(:base_resolution=)
     expect(Artwork).to respond_to(:supported_resolutions_list)
     expect(Artwork).to respond_to(:supported_resolutions_list=)
     expect(Artwork).to respond_to(:load_2x_images?)

metadata CHANGED

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: artwork
 version: !ruby/object:Gem::Version
-  version: 0.6.1
+  version: 0.7.0
 platform: ruby
 authors:
 - Dimitar Dimitrov
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2015-07-15 00:00:00.000000000 Z
+date: 2015-07-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -104,6 +104,7 @@ extra_rdoc_files: []
 files:
 - ".gitignore"
 - ".rspec"
+- CHANGELOG.md
 - Gemfile
 - LICENSE.txt
 - README.md