hermitage 0.0.2.1 → 0.0.3

data/lib/hermitage/view_helpers.rb

@@ -38,10 +38,11 @@ module Hermitage
       lists.each do |list|
         # Array of items in current list
         items = list.collect do |item|
-          full_image_path = eval("item.#{options[:attribute_full_size]}")
-          thumbnail_image_path = eval("item.#{options[:attribute_thumbnail]}")
-          image = image_tag(thumbnail_image_path, class: options[:image_class])
-          link_to(image, full_image_path, rel: 'hermitage', class: options[:link_class])
+          original_path = eval("item.#{options[:original]}")
+          thumbnail_path = eval("item.#{options[:thumbnail]}")
+          title = options[:title] ? eval("item.#{options[:title]}") : nil
+          image = image_tag(thumbnail_path, class: options[:image_class])
+          link_to(image, original_path, rel: 'hermitage', class: options[:link_class], title: title)
         end
         
         # Convert these items into content tag string

data/spec/dummy/app/models/dummy.rb

@@ -20,8 +20,13 @@ end
 class DummyImage
   attr_accessor :file
   def initialize(name)
+    @name = name
     @file = DummyFile.new(name)
   end
+
+  def description
+    "description of #{@name}"
+  end
 end
 
 class DummyPhoto < DummyBase

data/spec/features/bottom_panel_spec.rb

@@ -0,0 +1,28 @@
+require 'spec_helper'
+require 'features_helper'
+
+describe 'bottom_panel', type: :feature, js: true do
+  before(:each) do 
+    Hermitage.configs[:default].merge!({ title: 'description' })
+    visit images_path
+    page.first('a[rel="hermitage"]').click
+    page.should have_css('img.current')
+  end
+
+  # I don't want any influence of this config to another tests
+  after(:each) { Hermitage.configs[:default] = Hermitage::Defaults.to_hash() }
+
+  it 'has bottom panel' do
+    page.should have_css('#hermitage .bottom-panel')
+  end
+
+  it 'has description of image' do
+    page.should have_css('#hermitage .bottom-panel .text')
+    jquery_text('#hermitage .bottom-panel .text').should == 'description of 0'
+  end
+
+  it 'affects upon image size and position' do
+    top('.current').should == 221 # if window height is 768px
+  end
+
+end

data/spec/features/navigation_spec.rb

@@ -41,35 +41,63 @@ describe 'navigation', type: :feature, js: true do
     end
   end
 
+  context 'with loop' do
+    before(:each) do
+      visit images_path
+      page.first('a[href="/assets/1-full.png"]').click
+      page.should have_css('img.current') # Wait for loading before testing
+    end
 
-  before(:each) do
-    visit images_path
-    page.first('a[href="/assets/1-full.png"]').click
-    page.should have_css('img.current') # Wait for loading before testing
-  end
+    describe 'by clicking on image' do
+      describe 'at the right side' do
+        let(:click_action) { Proc.new { click_at_right('img.current') } }
+        it_behaves_like 'navigation to next'
+      end
 
-  describe 'by clicking on image' do
-    describe 'at the right side' do
-      let(:click_action) { Proc.new { click_at_right('img.current') } }
-      it_behaves_like 'navigation to next'
+      describe 'at the left side' do
+        let(:click_action) { Proc.new { click_at_left('img.current') } }
+        it_behaves_like 'navigation to previous'
+      end
     end
 
-    describe 'at the left side' do
-      let(:click_action) { Proc.new { click_at_left('img.current') } }
-      it_behaves_like 'navigation to previous'
+    describe 'by clicking on navigation button' do
+      describe 'right' do
+        let(:click_action) { Proc.new { page.find('#navigation-right').click() } }
+        it_behaves_like 'navigation to next'
+      end
+
+      describe 'left' do
+        let(:click_action) { Proc.new { page.find('#navigation-left').click() } }
+        it_behaves_like 'navigation to previous'
+      end
     end
   end
 
-  describe 'by clicking on navigation button' do
-    describe 'right' do
-      let(:click_action) { Proc.new { page.find('#navigation-right').click() } }
-      it_behaves_like 'navigation to next'
+  context 'without loop' do
+    before(:each) do
+      visit images_path
+      evaluate_script('hermitage.looped = false')
+      page.first("a[href='/assets/#{image}-full.png']").click
+      page.should have_css('img.current')
+    end
+
+    describe 'first image' do
+      let(:image) { "0" }
+      it { page.should_not have_css('#navigation-left') }
+      it { page.should have_css('#navigation-right') }
+    end
+
+    describe 'middle image' do
+      let(:image) { "1" }
+      it { page.should have_css('#navigation-left') }
+      it { page.should have_css('#navigation-right') }
     end
 
-    describe 'left' do
-      let(:click_action) { Proc.new { page.find('#navigation-left').click() } }
-      it_behaves_like 'navigation to previous'
+    describe 'last image' do
+      let(:image) { "2" }
+      it { page.should have_css('#navigation-left') }
+      it { page.should_not have_css('#navigation-right') }
     end
   end
-  
+
 end

data/spec/features/resize_spec.rb

@@ -0,0 +1,51 @@
+require 'spec_helper'
+require 'features_helper'
+
+describe 'resize', type: :feature, js: true do
+  before(:each) do 
+    visit images_path
+    page.first('a[rel="hermitage"]').click
+    page.should have_css('img.current')
+  end
+
+  shared_examples 'resize' do
+    before(:each) do
+      page.driver.resize(window_width, window_height)
+      sleep(1) # Wait for animation complete
+    end
+
+    it 'adjusts image' do
+      width('.current').should == expected_width
+      height('.current').should == expected_height
+      top('.current').should == expected_top
+      left('.current').should == expected_left
+    end
+
+    it 'adjusts navigation buttons' do
+      css('#navigation-left', 'line-height').should == expected_line_height
+      css('#navigation-right', 'line-height').should == expected_line_height
+    end    
+  end
+
+  describe 'make window smaller' do
+    let(:window_width) { 300 }
+    let(:window_height) { 300 }
+    let(:expected_width) { 200 }
+    let(:expected_height) { 200 }
+    let(:expected_top) { 50 }
+    let(:expected_left) { 50 }
+    let(:expected_line_height) { '300px' }
+    it_behaves_like 'resize'
+
+    describe 'then make window larger' do
+      let(:window_width) { 500 }
+      let(:window_height) { 500 }
+      let(:expected_width) { 256 }
+      let(:expected_height) { 256 }
+      let(:expected_top) { 122 }
+      let(:expected_left) { 122 }
+      let(:expected_line_height) { '500px' }
+      it_behaves_like 'resize'
+    end
+  end
+end

data/spec/features/scale_spec.rb

@@ -11,18 +11,18 @@ describe 'scale', type: :feature, js: true do
   end
 
   context 'exceed the bounds of window by width' do
-    let(:window_width) { 400 }
+    let(:window_width) { 300 }
     let(:window_height) { 1000 }
 
     it 'scales the image' do
-      width('.current').should == 176
-      height('.current').should == 176
+      width('.current').should == 200
+      height('.current').should == 200
     end
   end
 
   context 'exceed the bounds of window by height' do
     let(:window_width) { 1000 }
-    let(:window_height) { 300 }
+    let(:window_height) { 200 }
 
     it 'scales the image' do
       width('.current').should == 200
@@ -31,12 +31,12 @@ describe 'scale', type: :feature, js: true do
   end
 
   context 'exceed the bounds of window by both dimensions' do
-    let(:window_width) { 400 }
+    let(:window_width) { 250 }
     let(:window_height) { 300 }
 
     it 'scales the image to the minimum scale coefficient' do
-      width('.current').should == 176
-      height('.current').should == 176
+      width('.current').should == 150
+      height('.current').should == 150
     end
   end
 
@@ -50,20 +50,20 @@ describe 'scale', type: :feature, js: true do
     end
 
     context 'by width' do
-      let(:window_width) { 200 }
+      let(:window_width) { 150 }
       let(:window_height) { 1000 }
       it_behaves_like 'minimum allowed size'
     end
 
     context 'by height' do
       let(:window_width) { 1000 }
-      let(:window_height) { 200 }
+      let(:window_height) { 90 }
       it_behaves_like 'minimum allowed size'
     end
 
     context 'by both dimensions' do
-      let(:window_width) { 200 }
-      let(:window_height) { 200 }
+      let(:window_width) { 150 }
+      let(:window_height) { 90 }
       it_behaves_like 'minimum allowed size'
     end
   end

data/spec/features/viewer_customization_spec.rb

@@ -14,80 +14,51 @@ describe 'viewer_customization', type: :feature, js: true do
     # There will be sleep(1) in tests where we should wait until fade in animation is ended
   end
 
-  context 'zIndex' do
-    let(:js) { 'hermitage.zIndex = 5'}
-    it { css('#hermitage', 'z-index').should == '5' }
-  end
-
   context 'darkening.opacity' do
     let(:js) { 'hermitage.darkening.opacity = 0.5'}
     before(:each) { sleep(1) }
     it { css('#overlay', 'opacity').should == '0.5' }
   end
 
-  context 'darkening.color' do
-    let(:js) { 'hermitage.darkening.color = "#FAFAFA"' }
+  context 'darkening.styles' do
+    let(:js) { 'hermitage.darkening.styles = { backgroundColor: "#FAFAFA" }' }
     it { css('#overlay', 'background-color').should == 'rgb(250, 250, 250)' }
   end
 
-  context 'navigationButton.enabled' do
-    let(:js) { 'hermitage.navigationButton.enabled = false' }
+  context 'navigationButtons.enabled' do
+    let(:js) { 'hermitage.navigationButtons.enabled = false' }
     it { should_not have_css('#navigation-left') }
     it { should_not have_css('#navigation-right') }
   end
 
-  context 'navigationButton.color' do
-    let(:js) { 'hermitage.navigationButton.color = "#000"'}
-
-    shared_examples 'navigation button' do
-      it 'sets border color' do
-        css(selector, 'border-top-color').should == 'rgb(0, 0, 0)'
-        css(selector, 'border-right-color').should == 'rgb(0, 0, 0)'
-        css(selector, 'border-bottom-color').should == 'rgb(0, 0, 0)'
-        css(selector, 'border-left-color').should == 'rgb(0, 0, 0)'
-      end  
-    end
-    
-    context 'left' do
-      let(:selector) { '#navigation-left' }
-      it_behaves_like 'navigation button'
-    end
-
-    context 'right' do
-      let(:selector) { '#navigation-right' }
-      it_behaves_like 'navigation button'
-    end
+  context 'navigationButtons.styles' do
+    let(:js) { 'hermitage.navigationButtons.styles = { backgroundColor: "#000", width: "100px" }'}
+    it { css('#navigation-left', 'background-color').should == 'rgb(0, 0, 0)' }
+    it { css('#navigation-left', 'width').should == '100px' }
+    it { css('#navigation-right', 'background-color').should == 'rgb(0, 0, 0)' }
+    it { css('#navigation-right', 'width').should == '100px' }
   end
 
-  context 'navigationButton.width' do
-    let(:js) { 'hermitage.navigationButton.width = 100' }
-    it { css('#navigation-left', 'width').should == '100px' }
+  context 'navigationButtons.next.styles' do
+    let(:js) { 'hermitage.navigationButtons.next.styles = { width: "100px" }'}
+    it { css('#navigation-left', 'width').should == '50px' }
     it { css('#navigation-right', 'width').should == '100px' }
   end
 
-  context 'navigationButton.borderRadius' do
-    let(:js) { 'hermitage.navigationButton.borderRadius = 5' }
+  context 'navigationButtons.previous.styles' do
+    let(:js) { 'hermitage.navigationButtons.previous.styles = { width: "100px" }'}
+    it { css('#navigation-left', 'width').should == '100px' }
+    it { css('#navigation-right', 'width').should == '50px' }
+  end
 
-    it 'sets border radiuses for left button' do
-      css('#navigation-left', 'border-top-left-radius').should == '5px'
-      css('#navigation-left', 'border-bottom-left-radius').should == '5px'
-      css('#navigation-left', 'border-top-right-radius').should == '0px'
-      css('#navigation-left', 'border-bottom-right-radius').should == '0px'
-    end
-    
-    it 'sets border radiuses for right button' do
-      css('#navigation-right', 'border-top-left-radius').should == '0px'
-      css('#navigation-right', 'border-bottom-left-radius').should == '0px'
-      css('#navigation-right', 'border-top-right-radius').should == '5px'
-      css('#navigation-right', 'border-bottom-right-radius').should == '5px'
-    end
+  context 'navigationButtons.next.text' do
+    let(:js) { 'hermitage.navigationButtons.next.text = ">"'}
+    it { jquery_text('#navigation-right').should == '>' }
   end
-  
-  context 'navigationButton.margin' do
-    let(:js) { 'hermitage.navigationButton.margin = 30' }
-    before(:each) { sleep(1) }
-    it { css('#navigation-left', 'left').should == "#{left('.current') - 30 - width('#navigation-left')}px" }
-    it { css('#navigation-right', 'left').should == "#{left('.current') + width('.current') + 30}px" }
+
+  context 'navigationButtons.previous.text' do
+    let(:js) { 'hermitage.navigationButtons.previous.text = "<"'}
+    it { jquery_text('#navigation-left').should == '<' }
   end
 
   context 'closeButton.enabled' do
@@ -97,37 +68,32 @@ describe 'viewer_customization', type: :feature, js: true do
   
   context 'closeButton.text' do
     let(:js) { 'hermitage.closeButton.text = "Close"' }
-    it { text('#close-button').should == 'Close' }
+    it { jquery_text('#close-button').should == 'Close' }
   end
 
-  context 'closeButton.color' do
-    let(:js) { 'hermitage.closeButton.color = "#777"' }
+  context 'closeButton.styles' do
+    let(:js) { 'hermitage.closeButton.styles = { color: "#777" }' }
     it { css('#close-button', 'color').should == 'rgb(119, 119, 119)' }
   end
 
-  context 'closeButton.fontSize' do
-    let(:js) { 'hermitage.closeButton.fontSize = 10' }
-    it { css('#close-button', 'font-size').should == '10px' }
-  end
-
-  context 'windowPadding.x' do
-    let(:js) { 'hermitage.windowPadding.x = 100'}
-    let(:before_click) { Proc.new{ page.driver.resize(500, 1000) } }
-
-    it 'scales the image' do
-      width('.current').should == 176
-      height('.current').should == 176
+  context 'image.styles' do
+    let(:js) { 'hermitage.image.styles = { border: "5px solid #000" }' }
+    it 'sets all borders width to 5px'  do
+      css('.current', 'border-top-width').should == '5px'
+      css('.current', 'border-right-width').should == '5px'
+      css('.current', 'border-bottom-width').should == '5px'
+      css('.current', 'border-left-width').should == '5px'
     end
   end
 
-  context 'windowPadding.y' do
-    let(:js) { 'hermitage.windowPadding.y = 100'}
-    let(:before_click) { Proc.new{ page.driver.resize(1000, 400) } }
+  context 'bottomPanel.styles' do
+    let(:js) { 'hermitage.bottomPanel.styles = { backgroundColor: "#777" }' }
+    it { css('#hermitage .bottom-panel', 'background-color').should == 'rgb(119, 119, 119)' }
+  end
 
-    it 'scales the image' do
-      width('.current').should == 200
-      height('.current').should == 200
-    end
+  context 'bottomPanel.text.styles' do
+    let(:js) { 'hermitage.bottomPanel.text.styles = { textAlign: "left" }' }
+    it { css('#hermitage .bottom-panel .text', 'text-align').should == 'left' }
   end
 
   shared_examples 'image scaled to the minimum allowed size' do
@@ -139,13 +105,13 @@ describe 'viewer_customization', type: :feature, js: true do
 
   context 'minimumSize.width' do
     let(:js) { 'hermitage.minimumSize.width = 200'}
-    let(:before_click) { Proc.new{ page.driver.resize(300, 1000) } }
+    let(:before_click) { Proc.new{ page.driver.resize(250, 1000) } }
     it_behaves_like 'image scaled to the minimum allowed size'
   end
 
   context 'minimumSize.width' do
     let(:js) { 'hermitage.minimumSize.height = 200'}
-    let(:before_click) { Proc.new{ page.driver.resize(1000, 250) } }
+    let(:before_click) { Proc.new{ page.driver.resize(1000, 150) } }
     it_behaves_like 'image scaled to the minimum allowed size'
   end
 

data/spec/features/viewer_spec.rb

@@ -15,7 +15,7 @@ describe 'viewer', type: :feature, js: true do
     page.should have_css('div#hermitage div#overlay') 
   end
 
-  it 'has full size image' do
+  it 'has original image' do
     page.should have_css("div#hermitage img[src='/assets/0-full.png']") 
   end
 

data/spec/features_helper.rb

@@ -37,6 +37,6 @@ def click_at_right(selector)
   click_at(selector, 0.75, 0.5)
 end
 
-def text(selector)
+def jquery_text(selector)
   evaluate_script("$('#{selector}').text()")
 end

data/spec/lib/hermitage/defaults_spec.rb

@@ -4,8 +4,9 @@ describe Hermitage::Defaults do
   describe '#to_hash' do
     it "returns hash with symbolized constants' names as keys" do
       Hermitage::Defaults.to_hash().should == {
-        attribute_full_size: 'file.url',
-        attribute_thumbnail: 'file.url(:thumbnail)',
+        original: 'file.url',
+        thumbnail: 'file.url(:thumbnail)',
+        title: nil,
         list_tag: :ul,
         item_tag: :li,
         list_class: 'thumbnails',

data/spec/lib/hermitage/view_helpers_spec.rb

@@ -19,12 +19,18 @@ describe Hermitage::ViewHelpers, type: :helper do
 
     context 'with options' do
       
-      context 'attribute_full_size and attribute_thumbnail' do
-        subject { template.render_gallery_for images, attribute_full_size: 'photo', attribute_thumbnail: 'photo(:thumbnail)' }
+      context 'original and thumbnail' do
+        subject { template.render_gallery_for images, original: 'photo', thumbnail: 'photo(:thumbnail)' }
         let(:images) { Array.new(2) { |i| DummyPhoto.new(i.to_s) } }
         it { should == expected }
       end
 
+      context 'title' do
+        subject { template.render_gallery_for images, title: 'description' }
+        let(:expected) { '<ul class="thumbnails"><li class="span4"><a class="thumbnail" href="/assets/0-full.png" rel="hermitage" title="description of 0"><img alt="0 thumbnail" src="/assets/0-thumbnail.png" /></a></li><li class="span4"><a class="thumbnail" href="/assets/1-full.png" rel="hermitage" title="description of 1"><img alt="1 thumbnail" src="/assets/1-thumbnail.png" /></a></li></ul>' }
+        it { should == expected }
+      end
+
       context 'list_tag and item_tag' do
         subject { template.render_gallery_for images, list_tag: :div, item_tag: :div }
         let(:expected) { '<div class="thumbnails"><div class="span4"><a class="thumbnail" href="/assets/0-full.png" rel="hermitage"><img alt="0 thumbnail" src="/assets/0-thumbnail.png" /></a></div><div class="span4"><a class="thumbnail" href="/assets/1-full.png" rel="hermitage"><img alt="1 thumbnail" src="/assets/1-thumbnail.png" /></a></div></div>' }

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: hermitage
 version: !ruby/object:Gem::Version
-  version: 0.0.2.1
+  version: 0.0.3
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-09-05 00:00:00.000000000 Z
+date: 2013-09-08 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -187,7 +187,7 @@ dependencies:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: '0'
-description: Ruby library for generation of image galleries.
+description: Ruby library for image galleries generation.
 email:
 - immaculate.pine@gmail.com
 executables: []
@@ -263,9 +263,11 @@ files:
 - spec/dummy/public/422.html
 - spec/dummy/public/500.html
 - spec/dummy/public/favicon.ico
+- spec/features/bottom_panel_spec.rb
 - spec/features/engine_spec.rb
 - spec/features/navigation_spec.rb
 - spec/features/render_gallery_spec.rb
+- spec/features/resize_spec.rb
 - spec/features/scale_spec.rb
 - spec/features/viewer_customization_spec.rb
 - spec/features/viewer_spec.rb
@@ -300,8 +302,8 @@ rubyforge_project:
 rubygems_version: 1.8.25
 signing_key: 
 specification_version: 3
-summary: Ruby library for generation of image galleries (thumbnails and full size
-  images viewer).
+summary: Ruby library for image galleries generation (thumbnails and original images
+  viewer).
 test_files:
 - spec/dummy/README.rdoc
 - spec/dummy/Rakefile
@@ -352,9 +354,11 @@ test_files:
 - spec/dummy/public/422.html
 - spec/dummy/public/500.html
 - spec/dummy/public/favicon.ico
+- spec/features/bottom_panel_spec.rb
 - spec/features/engine_spec.rb
 - spec/features/navigation_spec.rb
 - spec/features/render_gallery_spec.rb
+- spec/features/resize_spec.rb
 - spec/features/scale_spec.rb
 - spec/features/viewer_customization_spec.rb
 - spec/features/viewer_spec.rb