hermitage 0.0.3 → 0.0.4.1

data/CHANGELOG.md

@@ -1,3 +1,13 @@
+### 0.0.4.1 ###
+
+* RailsRenderCore is not a child of ActionView::Base anymore
+
+### 0.0.4 ###
+
+* Ability to preload neighbour images
+* Slide effect added and is used by default
+* Nice DSL syntax added for configuration
+
 ### 0.0.3 ###
 
 * *Attention*! In this version some options were renamed: attribute_full_size -> original, attribute_thumbnail -> thumbnail.

data/README.md

@@ -1,6 +1,7 @@
 # Hermitage
 
 [![Build Status](https://travis-ci.org/ImmaculatePine/hermitage.png?branch=master)](https://travis-ci.org/ImmaculatePine/hermitage)
+[![Code Climate](https://codeclimate.com/github/ImmaculatePine/hermitage.png)](https://codeclimate.com/github/ImmaculatePine/hermitage)
 
 Ruby library for generation of image galleries (thumbnails and original images viewer).
 
@@ -130,7 +131,7 @@ When you call `render_gallery_for` method Hermitage looks for config with name f
 In the example above Hermitage tries to find :images config because first argument of `render_gallery_for` method was array of Image instances.
 If there is no proper config :default config is used.
 
-Hermitage configs are described in config/initializers/hermitage.rb file.
+Hermitage configs are described in config/initializers/hermitage.rb file. For configuration you can use DSL syntax described below.
 
 #### Overwriting Defaults
 
@@ -138,10 +139,10 @@ You can overwrite :default config. These changes will be applied to all the gall
 
 Uncoment the following lines in config/initializers/hermitage.rb file and make some changes here:
 
-    Hermitage.configs[:default].merge!({
-      original: 'image.url(:medium)',
-      thumbnail: 'image.url(:small)'
-    })
+    Hermitage.configure :default do
+      original 'image.url(:medium)'
+      thumbnail 'image.url(:small)'
+    end
 
 Now Hermitage will use `image.url` method with :medium or :small argument to get images for the gallery.
 
@@ -169,19 +170,19 @@ Then your config/initializers/hermitage.rb could looks like this:
 
     # Some rules for :default config if needed...
 
-    Hermitage.configs[:pictures] = {
-      original: 'image_path',
-      thumbnail: 'image_path(:small)'
-    }
+    Hermitage.configure :pictures do
+      original 'image_path'
+      thumbnail 'image_path(:small)'
+    end
 
-    Hermitage.configs[:posts] = {
-      original: 'attachment',
-      thumbnail: 'attachment(:tiny)',
-      list_tag: :div,
-      item_tag: div,
-      list_class: 'posts',
-      item_class: 'post'
-    }
+    Hermitage.configure :posts do
+      original 'attachment'
+      thumbnail 'attachment(:tiny)'
+      list_tag :div
+      item_tag :div
+      list_class 'posts'
+      item_class 'post'
+    end
 
 Now when you write `render_gallery_for @pictures` or `render_gallery_for @posts` Hermitage will automatically choose the proper config.
 
@@ -206,6 +207,8 @@ In the example above the darkening will be disabled and both navigation buttons
 You can customize the following parameters:
 
 * `looped` - set it to false if after the last image the first should not be shown
+* `preloadNeighbours` - determines if next and previous images should be preloaded
+* `slideshowEffect` - how to show/hide images (correct values are 'slide' and 'fade'). Default value is 'slide'
 * `darkening.opacity` - opacity of darkening layer (0 if it should be disabled)
 * `darkening.styles` - any custom CSS for darkening layer
 * `navigationButtons.enabled` - are there navigation buttons

data/app/assets/javascripts/hermitage.js.coffee

@@ -7,8 +7,10 @@ root = exports ? this
 # Hermitage options
 root.hermitage =
   looped: true
+  preloadNeighbours: true
+  slideshowEffect: 'slide' # or 'fade'
 
-  # Image viewer z-index property
+  # Image viewer properties
   default:
     styles:
       zIndex: 10
@@ -21,8 +23,7 @@ root.hermitage =
   # Darkening properties
   darkening:
     default:
-      attributes:
-        id: 'overlay'
+      attributes: { id: 'overlay' }
       styles:
         position: 'absolute'
         top: 0
@@ -30,13 +31,14 @@ root.hermitage =
         width: '100%'
         height: '100%'
         backgroundColor: '#000'
-        
-    opacity: 0.85 # 0 if you don't want darkening
     styles: {}
+    opacity: 0.85 # 0 if you don't want darkening
+
 
   # Navigation buttons' properties
   navigationButtons:
     default:
+      attributes: {}
       styles:
         position: 'absolute'
         width: '50px'
@@ -54,27 +56,22 @@ root.hermitage =
 
     next:
       default:
-        attributes:
-          id: 'navigation-right'
-        styles:
-          right: 0
+        attributes: { id: 'navigation-right' }
+        styles: { right: 0 }
       styles: {}
       text: '▶'
 
     previous:
       default:
-        attributes:
-          id: 'navigation-left'
-        styles:
-          left: 0
+        attributes: { id: 'navigation-left' }
+        styles: { left: 0 }
       styles: {}
       text: '◀'
 
   # Close button properties
   closeButton:
     default:
-      attributes:
-        id: 'close-button'
+      attributes: { id: 'close-button' }
       styles:
         position: 'absolute'
         top: 0
@@ -84,16 +81,15 @@ root.hermitage =
         fontFamily: 'Tahoma,Arial,Helvetica,sans-serif'
         whiteSpace: 'nowrap'
         cursor: 'pointer'
-        
+    styles: {}        
     enabled: true
     text: '×'
-    styles: {}
+
 
   # Current image properties
   image:
     default:
-      attributes:
-        class: 'current'
+      attributes: { class: 'current' }
       styles:
         cursor: 'pointer'
         maxWidth: 'none' # Fix the conflict with Twitter Bootstrap
@@ -102,8 +98,7 @@ root.hermitage =
   # Bottom panel (for text or anything else)
   bottomPanel:
     default:
-      attributes:
-        class: 'bottom-panel'
+      attributes: { class: 'bottom-panel' }
       styles:
         position: 'absolute'
         bottom: 0
@@ -112,8 +107,7 @@ root.hermitage =
 
     text:
       default:
-        attributes:
-          class: 'text'
+        attributes: { class: 'text' }
         styles:
           width: '100%'
           height: '100%'
@@ -132,9 +126,6 @@ root.hermitage =
   # Array of images of current gallery
   images: []
 
-  # Array of texts for current gallery
-  texts: []
-
   # Timeout before adjustig elements after window resize
   resizeTimeout: 100
 
@@ -153,12 +144,10 @@ root.hermitage =
 
     # Clear old images and texts array
     hermitage.images.length = 0
-    hermitage.texts.length = 0
 
     # Create new images and texts array
     $.each $('a[rel="hermitage"]'), ->
-      hermitage.images.push($(this).attr('href'))
-      hermitage.texts.push($(this).attr('title'))
+      addImage($(this).attr('href'), $(this).attr('title'))
 
     # Set on click handlers to all elements that
     # have 'hermitage' rel attribute
@@ -173,54 +162,89 @@ root.hermitage =
         -> adjustImage(true),
         hermitage.resizeTimeout
 
+#
+# Working with images array
+#
+addImage = (source, text) ->
+  image =
+    source: source
+    text: text
+    loaded: false
+  hermitage.images.push(image)
+
+indexOfImage = (image) ->
+  source = if $(image).prop('tagName') is 'IMG' then $(image).attr('src') else $(image).attr('href')
+  imageObject = (img for img in hermitage.images when img.source is source)[0]
+  hermitage.images.indexOf(imageObject)
+
+imageAt = (index) -> hermitage.images[index]
+sourceFor = (index) -> imageAt(index).source
+textFor = (index) -> imageAt(index).text
+
 #
 # Helpers
 #
+$.fn.applyStyles = (params, withAnimation, complete = undefined) ->
+  if withAnimation
+    this.animate(params, { duration: hermitage.animationDuration, queue: false, complete: complete })
+  else
+    this.css(params)
 
 # Place element at the center of screen
 $.fn.center = (withAnimation = false, width = 0, height = 0, offsetX = 0, offsetY = 0) ->
   this.css('position', 'absolute')
 
   width = $(this).outerWidth() if width is 0
-  height = $(this).outerWidth() if height is 0
+  height = $(this).outerHeight() if height is 0
 
-  param =
+  params =
     top: "#{Math.max(0, ($(window).height() - height) / 2 + offsetY)}px"
     left: "#{Math.max(0, ($(window).width() - width) / 2 + offsetX)}px"
 
-  if withAnimation
-    this.animate(param, { duration: hermitage.animationDuration, queue: false })
-  else
-    this.css(param)
+  this.applyStyles(params, withAnimation)
 
 $.fn.setSize = (width, height, withAnimation = false) ->
   params = { width: width, height: height}
-
-  if withAnimation
-    this.animate(params, { duration: hermitage.animationDuration, queue: false })
-  else
-    this.css(params)
+  this.applyStyles(params, withAnimation)
 
 $.fn.maximizeLineHeight = (withAnimation = false) ->
-  param = { lineHeight: "#{this.outerHeight()}px" }
-  
-  if withAnimation
-    this.animate(param, { duration: hermitage.animationDuration, queue: false })
-  else
-    this.css(param)
+  params = { lineHeight: "#{this.outerHeight()}px" }
+  this.applyStyles(params, withAnimation)
+
+$.fn.showFromRight = (width = 0, height = 0, offsetX = 0, offsetY = 0) ->
+  this.css(left: "#{$(window).width()}px")
+  this.show()
+  this.center(true, width, height, offsetX, offsetY)
+
+$.fn.showFromLeft = (width = 0, height = 0, offsetX = 0, offsetY = 0) ->
+  this.css(left: "#{- $(this).outerWidth()}px")
+  this.show()
+  this.center(true, width, height, offsetX, offsetY)
+
+$.fn.hideToRight = (complete = undefined) ->
+  params = { left: "#{$(window).width()}px" }
+  this.applyStyles(params, true, complete)
+
+$.fn.hideToLeft = (complete = undefined) ->
+  params = { left: "#{- $(this).outerWidth()}px" }
+  this.applyStyles(params, true, complete)
 
 #
 # Hermitage logic
 #
 
+# Creates base element with attributes and styles from params
+createElement = (tag, params) ->
+  tag
+    .attr(params.default.attributes)
+    .css(params.default.styles)
+    .css(params.styles)
+
 # Creates darkening overlay, shows it and sets its click handler
 createDarkening = ->
-  $('<div>')
-    .attr(hermitage.darkening.default.attributes)
-    .css(hermitage.darkening.default.styles)
+  createElement($('<div>'), hermitage.darkening)
     .css('opacity', hermitage.darkening.opacity)
     .css('filter', "alpha(opacity='#{hermitage.darkening.opacity * 100}')")
-    .css(hermitage.darkening.styles)
     .appendTo($('#hermitage'))
     .hide()
     .fadeIn()
@@ -228,60 +252,42 @@ createDarkening = ->
 
 # Creates base navigation button and returns it
 createNavigationButton = ->
-  $('<div>')
+  createElement($('<div>'), hermitage.navigationButtons)
     .appendTo($('#hermitage'))
     .hide()
-    .css(hermitage.navigationButtons.default.styles)
     .maximizeLineHeight()
-    .css(hermitage.navigationButtons.styles)
 
 # Creates right navigation button and returns it
 createRightNavigationButton = ->
-  createNavigationButton()
-    .attr(hermitage.navigationButtons.next.default.attributes)
-    .css(hermitage.navigationButtons.next.default.styles)
-    .css(hermitage.navigationButtons.next.styles)
+  createElement(createNavigationButton(), hermitage.navigationButtons.next)
     .text(hermitage.navigationButtons.next.text)
     .click(showNextImage)
 
 # Create left navigation button and returns it
 createLeftNavigationButton = ->
-  createNavigationButton()
-    .attr(hermitage.navigationButtons.previous.default.attributes)
-    .css(hermitage.navigationButtons.previous.default.styles)
-    .css(hermitage.navigationButtons.previous.styles)
+  createElement(createNavigationButton(), hermitage.navigationButtons.previous)
     .text(hermitage.navigationButtons.previous.text)
     .click(showPreviousImage)
 
 # Creates close button
 createCloseButton = ->
-  $('<div>')
+  createElement($('<div>'), hermitage.closeButton)
     .appendTo($('#hermitage'))
     .hide()
-    .attr(hermitage.closeButton.default.attributes)
-    .css(hermitage.closeButton.default.styles)
     .text(hermitage.closeButton.text)
-    .css(hermitage.closeButton.styles)
     .click(closeGallery)
 
 createBotomPanel = ->
-  bottomPanel = $('<div>')
+  bottomPanel = createElement($('<div>'), hermitage.bottomPanel)
     .appendTo($('#hermitage'))
     .hide()
-    .attr(hermitage.bottomPanel.default.attributes)
-    .css(hermitage.bottomPanel.default.styles)
-    .css(hermitage.bottomPanel.styles)
 
-  text = $('<div>')
+  createElement($('<div>'), hermitage.bottomPanel.text)
     .appendTo(bottomPanel)
-    .attr(hermitage.bottomPanel.text.default.attributes)
-    .css(hermitage.bottomPanel.text.default.styles)
-    .css(hermitage.bottomPanel.text.styles)
 
 # Shows original image of the chosen one
 openGallery = (image) ->
   $('#hermitage')
-    .css('z-index', hermitage.zIndex)
     .empty()
     .show()
   
@@ -294,12 +300,9 @@ openGallery = (image) ->
   showImage(indexOfImage(image))
   
 # Shows image with specified index from images array
-showImage = (index) ->
-  img = $('<img />')
-    .attr(hermitage.image.default.attributes)
-    .css(hermitage.image.default.styles)
-    .attr('src', hermitage.images[index])
-    .css(hermitage.image.styles)
+showImage = (index, direction = undefined) ->
+  img = createElement($('<img />'), hermitage.image)
+    .attr('src', sourceFor(index))
     .hide()
     .appendTo($('#hermitage'))
   
@@ -309,7 +312,8 @@ showImage = (index) ->
     else
       showPreviousImage()
 
-  adjustImage(false, img)
+  adjustImage(false, img, direction)
+  preloadNeighboursFor(index)
 
 # Shows next image
 showNextImage = ->
@@ -317,11 +321,12 @@ showNextImage = ->
   if current.length is 1
     index = indexOfImage(current)
     return unless canShowNextAfter(index)
-    hideCurrentImage()
-    if index < hermitage.images.length - 1
-      showImage(index + 1)
-    else
-      showImage(0)
+    
+    direction = if hermitage.slideshowEffect is 'slide' then 'left' else undefined
+    hideCurrentImage(direction)
+
+    direction = if hermitage.slideshowEffect is 'slide' then 'right' else undefined
+    showImage nextIndexAfter(index), direction
 
 # Shows previous image
 showPreviousImage = ->
@@ -329,18 +334,30 @@ showPreviousImage = ->
   if current.length is 1
     index = indexOfImage(current)
     return unless canShowPreviousBefore(index)
-    hideCurrentImage()
-    if index > 0
-      showImage(index - 1)
-    else
-      showImage(hermitage.images.length - 1)
+    
+    direction = if hermitage.slideshowEffect is 'slide' then 'right' else undefined
+    hideCurrentImage(direction)
+
+    direction = if hermitage.slideshowEffect is 'slide' then 'left' else undefined
+    showImage previousIndexBefore(index), direction
 
 # Hides current image
-hideCurrentImage = ->
+# Arguments:
+# * direction - how to hide the image. It can apply options:
+#   * undefined - just fade out
+#   * 'right' - move to the right bound of screen
+#   * 'left' - move to the left bound of screen
+hideCurrentImage = (direction = undefined) ->
   current = $('img.current')
   if current.length is 1
-    current.fadeOut hermitage.animationDuration, ->
-      current.remove()
+    complete = -> current.remove()
+
+    if direction is 'right'
+      current.hideToRight(complete)
+    else if direction is 'left'
+      current.hideToLeft(complete)
+    else
+      current.fadeOut hermitage.animationDuration, complete
 
 # Starts fade out animation and clears Hermitage at the end of animation
 closeGallery = ->
@@ -355,7 +372,11 @@ closeGallery = ->
 # Attributes:
 # * `withAnimation` - boolean value determines if adjusting should be animated
 # * `image` - currently opened image. It is optional argument and can be evaluated by the method itself.
-adjustImage = (withAnimation = false, image = undefined) ->
+# * direction - how to show the image. It can apply options:
+#   * undefined - just fade in
+#   * 'right' - move from the right bound of screen
+#   * 'left' - move from the left bound of screen
+adjustImage = (withAnimation = false, image = undefined, direction = undefined) ->
 
   if image is undefined
     image = $('#hermitage img.current')
@@ -364,15 +385,16 @@ adjustImage = (withAnimation = false, image = undefined) ->
   index = indexOfImage(image)
 
   # Wait until source image is loaded
-  $('<img />').attr('src', hermitage.images[index]).load ->
-    
+  loadImage sourceFor(index), ->
+    imageAt(index).loaded = true
+
     # Offset for image position
     offsetY = 0
 
     maxWidth = $(window).width() - $('#navigation-left').outerWidth() - $('#navigation-right').outerWidth()
     maxHeight = $(window).height()
 
-    text = hermitage.texts[index]
+    text = textFor(index)
 
     if text
       offsetY = - $('#hermitage .bottom-panel').outerHeight() / 2
@@ -396,7 +418,13 @@ adjustImage = (withAnimation = false, image = undefined) ->
     image
       .setSize(this.width * scale, this.height * scale, withAnimation)
       .center(withAnimation, this.width * scale, this.height * scale, 0, offsetY)
-      .fadeIn(hermitage.animationDuration)
+    
+    if direction is 'right'
+      image.showFromRight(this.width * scale, this.height * scale, 0, offsetY)
+    else if direction is 'left'
+      image.showFromLeft(this.width * scale, this.height * scale, 0, offsetY)
+    else
+      image.fadeIn(hermitage.animationDuration)
 
     adjustNavigationButtons(withAnimation, image)
     adjustCloseButton(withAnimation, image)
@@ -414,9 +442,7 @@ adjustNavigationButtons = (withAnimation, current) ->
   next.maximizeLineHeight(withAnimation)
   
   # Show or hide buttons
-
   currentIndex = indexOfImage(current)
-  
   duration = hermitage.animationDuration
   
   if canShowPreviousBefore(currentIndex)
@@ -452,10 +478,6 @@ adjustBottomPanel = (withAnimation) ->
 
     panel.fadeIn(hermitage.animationDuration)
 
-indexOfImage = (image) ->
-  href = if $(image).prop('tagName') is 'IMG' then $(image).attr('src') else $(image).attr('href')
-  hermitage.images.indexOf(href)
-
 canShowNextAfter = (index) ->
   if index < hermitage.images.length - 1
     true
@@ -468,6 +490,36 @@ canShowPreviousBefore = (index) ->
   else
     hermitage.looped
 
+preloadNeighboursFor = (index) ->
+  return unless hermitage.preloadNeighbours
+
+  nextIndex = nextIndexAfter(index)
+  previousIndex = previousIndexBefore(index)
+
+  if canShowNextAfter(index) and not imageAt(nextIndex).loaded
+    loadImage sourceFor(nextIndex), ->
+      imageAt(nextIndex).loaded = true
+
+  if canShowPreviousBefore(index) and not imageAt(previousIndex).loaded
+    loadImage sourceFor(previousIndex), ->
+      imageAt(previousIndex).loaded = true
+
+loadImage = (source, complete) ->
+  $('<img />').attr('src', source).load(complete)
+
+nextIndexAfter = (index) ->
+  if index < hermitage.images.length - 1
+    index + 1
+  else
+    0
+
+previousIndexBefore = (index) ->
+  if index > 0
+    index - 1
+  else
+    hermitage.images.length - 1
+
+
 # Initialize gallery on page load
 $(document).ready(hermitage.init)
 $(document).on('page:load', hermitage.init)

data/lib/generators/hermitage/templates/hermitage.rb

@@ -3,17 +3,18 @@
 # Default config is used as base options hash for every gallery.
 # You can configure any of its options and they will be applied for every rendering.
 #
-# Hermitage.configs[:default].merge!({
-#   original: 'file.url',
-#   thumbnail: 'file.url(:thumbnail)',
-#   list_tag: :ul,
-#   item_tag: :li,
-#   list_class: 'thumbnails',
-#   item_class: 'span4',
-#   link_class: 'thumbnail',
-#   image_class: nil,
-#   each_slice: nil
-# })
+# Hermitage.configure :default do
+#   original 'file.url'
+#   thumbnail 'file.url(:thumbnail)'
+#   title nil
+#   list_tag :ul
+#   item_tag :li
+#   list_class 'thumbnails'
+#   item_class 'span4'
+#   link_class 'thumbnail'
+#   image_class nil
+#   each_slice nil
+# end
 
 # Also you can create your own configs that will be merged with default config to overwrite default options.
 #
@@ -25,6 +26,6 @@
 #
 # All available options are listed in default config above.
 #
-# Hermitage.configs[:images] = {
-
-# }
+# Hermitage.configure :images do
+#
+# end

data/lib/hermitage/configurator.rb

@@ -0,0 +1,31 @@
+module Hermitage
+
+  class Configurator
+
+    Defaults.constants.each do |c|
+      define_method c.downcase do |value|
+        @config.merge!({ c.downcase.to_sym => value })
+      end
+    end
+
+    def respond_to?(method_name)
+      Defaults.constants.include? method_name.upcase.to_sym || super
+    end
+
+    def initialize(config_name, &block)
+      Hermitage.configs[config_name] ||= {}
+      @config = Hermitage.configs[config_name]
+      self.instance_eval(&block) if block_given?
+    end
+
+    # Returns full options hash for specified objects and options.
+    # It chooses config accoring to the class name of objects in passed array
+    # and merges default options with the chosen config and with passed options hash.
+    def self.options_for(objects, options = {})
+      config_name = objects.first.class.to_s.pluralize.underscore.to_sym if defined?(Rails) && !objects.empty?
+      config = Hermitage.configs[config_name] || Hermitage.configs[:default]
+      Hermitage.configs[:default].merge(config).merge(options)
+    end
+  end
+
+end

data/lib/hermitage/rails_render_core.rb

@@ -0,0 +1,58 @@
+module Hermitage
+  
+  # This class performs all the rendering logic for Rails apps
+  class RailsRenderCore
+
+    def initialize(objects, options = {})
+      @objects = objects
+      @options = Configurator.options_for(objects, options)
+      @template = ActionView::Base.new
+    end
+
+    # Renders gallery markup
+    def render
+      # Initialize the resulting tag
+      tag = ''
+
+      # Slice objects into separate lists
+      lists = slice_objects
+
+      # Render each list into `tag` variable
+      lists.each do |list|
+        items = list.collect { |item| render_link_for(item) }
+        tag << render_content_tag_for(items)
+      end
+
+      tag.html_safe
+    end
+
+    private
+
+    # Slices objects into separate lists if it's necessary
+    def slice_objects
+      unless @options[:each_slice]
+        [@objects]
+      else
+        @objects.each_slice(@options[:each_slice]).to_a
+      end
+    end
+
+    # Renders link to the specific image in a gallery
+    def render_link_for(item)
+      original_path = eval("item.#{@options[:original]}")
+      thumbnail_path = eval("item.#{@options[:thumbnail]}")
+      title = @options[:title] ? eval("item.#{@options[:title]}") : nil
+      image = @template.image_tag(thumbnail_path, class: @options[:image_class])
+      @template.link_to(image, original_path, rel: 'hermitage', class: @options[:link_class], title: title)
+    end
+
+    # Renders items into content tag
+    def render_content_tag_for(items)
+      @template.content_tag(@options[:list_tag], class: @options[:list_class]) do
+        items.collect { |item| @template.concat(@template.content_tag(@options[:item_tag], item, class: @options[:item_class])) }
+      end
+    end
+
+  end
+
+end

data/lib/hermitage/version.rb

@@ -1,3 +1,3 @@
 module Hermitage
-  VERSION = '0.0.3'
+  VERSION = '0.0.4.1'
 end

data/lib/hermitage/view_helpers.rb

@@ -1,3 +1,5 @@
+require 'hermitage/rails_render_core' if defined? Rails
+
 module Hermitage
   
   module ViewHelpers
@@ -17,41 +19,7 @@ module Hermitage
     # Config names are formed by the class name of the first element in array.
     #
     def render_gallery_for(objects, options = {})
-      # Choose config accoring to class name of objects in passed array
-      config_name = objects.first.class.to_s.pluralize.underscore.to_sym if defined?(Rails) && !objects.empty?
-      config = Hermitage.configs.include?(config_name) ? config_name : :default
-      
-      # Merge default options with the chosen config and with passed options
-      options = Hermitage.configs[:default].merge(Hermitage.configs[config]).merge(options)
-      
-      # Create array of all list tags
-      lists = unless options[:each_slice]
-        [objects]
-      else
-        objects.each_slice(options[:each_slice]).to_a
-      end
-
-      # The resulting tag
-      tag = ''
-
-      # Render each list into `tag` variable
-      lists.each do |list|
-        # Array of items in current list
-        items = list.collect do |item|
-          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
-        tag << content_tag(options[:list_tag], class: options[:list_class]) do
-          items.collect { |item| concat(content_tag(options[:item_tag], item, class: options[:item_class])) }
-        end
-      end
-
-      tag.html_safe
+      RailsRenderCore.new(objects, options).render if defined? Rails
     end
 
   end

data/lib/hermitage.rb

@@ -1,5 +1,6 @@
 require 'hermitage/version'
 require 'hermitage/defaults'
+require 'hermitage/configurator'
 require 'hermitage/railtie' if defined? Rails
 require 'hermitage/engine' if defined? Rails
 
@@ -10,4 +11,8 @@ module Hermitage
   # Hash of configs presets
   self.configs = { default: Hermitage::Defaults.to_hash() }
   
+  def self.configure(config_name, &block)
+    configurator = Configurator.new(config_name, &block)
+  end
+
 end

data/spec/features/bottom_panel_spec.rb

@@ -3,14 +3,14 @@ require 'features_helper'
 
 describe 'bottom_panel', type: :feature, js: true do
   before(:each) do 
-    Hermitage.configs[:default].merge!({ title: 'description' })
+    Hermitage.configure :default do title 'description' end
     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() }
+  after(:each) { reset_configs }
 
   it 'has bottom panel' do
     page.should have_css('#hermitage .bottom-panel')

data/spec/features/preload_neighbours_spec.rb

@@ -0,0 +1,76 @@
+require 'spec_helper'
+
+describe 'preload_neighbours', type: :feature, js: true do
+
+  def clickAtImage(index)
+    page.first("a[href='/assets/#{index}-full.png']").click
+    sleep(1) # We want wait some time while animations and images preloading
+  end
+
+  def images
+    evaluate_script('hermitage.images')
+  end
+
+  shared_examples 'preloader' do
+    it 'preloads proper images' do
+      loaded = images().collect { |image| image['loaded'] }
+      loaded.should == expected
+    end
+  end
+
+  before(:each) { visit images_path }
+
+  context 'preload enabled' do
+    context 'loop enabled' do
+      let(:expected) { Array.new(3, true) }
+
+      context '1st image' do
+        before(:each) { clickAtImage(0) }
+        it_behaves_like 'preloader'
+      end
+
+      context 'middle image' do
+        before(:each) { clickAtImage(1) }
+        it_behaves_like 'preloader'
+      end
+
+      context 'last image' do
+        before(:each) { clickAtImage(2) }
+        it_behaves_like 'preloader'
+      end
+    end
+
+    context 'loop disabled' do
+      before(:each) { evaluate_script('hermitage.looped = false') }
+
+      context '1st image' do
+        before(:each) { clickAtImage(0) }
+        let(:expected) { [true, true, false] }
+        it_behaves_like 'preloader'
+      end
+
+      context 'middle image' do
+        before(:each) { clickAtImage(1) }
+        let(:expected) { [true, true, true] }
+        it_behaves_like 'preloader'
+      end
+
+      context 'last image' do
+        before(:each) { clickAtImage(2) }
+        let(:expected) { [false, true, true] }
+        it_behaves_like 'preloader'
+      end
+    end
+  end
+
+  context 'preload disabled' do
+    before(:each) do
+      evaluate_script('hermitage.preloadNeighbours = false')
+      clickAtImage(1)
+    end
+
+    let(:expected) { [false, true, false] }
+    it_behaves_like 'preloader'
+  end
+
+end

data/spec/features/render_gallery_spec.rb

@@ -13,7 +13,14 @@ describe 'render gallery', type: :feature, js: true do
   end
 
   it 'fills images array' do
-    evaluate_script('hermitage.images').should == ['/assets/0-full.png', '/assets/1-full.png', '/assets/2-full.png']
+    images = evaluate_script('hermitage.images')
+    expected = Array.new(3) do |i|
+      {
+        'source' => "/assets/#{i}-full.png",
+        'loaded' => false
+      }
+    end
+    images.should == expected
   end
 
 end

data/spec/lib/hermitage/configurator_spec.rb

@@ -0,0 +1,42 @@
+require 'spec_helper'
+
+describe Hermitage::Configurator do
+  after(:each) { reset_configs }
+
+  describe '.new' do
+    it 'can create new config' do
+      Hermitage::Configurator.new(:new_config)
+      Hermitage.configs.keys.should == [:default, :new_config]
+    end
+
+    it 'can change existing config' do
+      Hermitage::Configurator.new(:default) do
+        title 'description'
+      end
+
+      Hermitage.configs[:default][:title].should == 'description'
+    end
+  end
+
+  describe '#respond_to?' do
+    it 'responds to methods corresponing to options' do
+      configurator = Hermitage::Configurator.new(:new_config)
+      Hermitage::Defaults.constants.each do |c|
+        configurator.should respond_to(c.downcase.to_sym)
+      end
+    end
+  end
+
+  describe '.options_for' do
+    it 'merges default config with objects config and with options hash' do
+      Hermitage.configure :images do
+        title 'image_title'
+        list_class 'image-list'
+      end
+      Image = Class.new
+      objects = [Image.new]
+      result = Hermitage::Configurator.options_for(objects, { title: 'title' })
+      result.should == Hermitage::Defaults.to_hash.merge({ list_class: 'image-list', title: 'title' })
+    end
+  end
+end

data/spec/lib/hermitage/view_helpers_spec.rb

@@ -4,7 +4,7 @@ require 'dummy/app/models/dummy'
 describe Hermitage::ViewHelpers, type: :helper do
 
   # Reset Hermitage configs because they should not be shared among specs
-  before(:each) { Hermitage.configs = { default: Hermitage::Defaults.to_hash() } }
+  after(:each) { reset_configs }
   
   let(:template) { ActionView::Base.new }
 
@@ -52,7 +52,7 @@ describe Hermitage::ViewHelpers, type: :helper do
 
     context 'with configs' do
 
-      before(:each) { Hermitage.configs[:dummy_images] = { list_class: 'images-thumbnails' } }
+      before(:each) { Hermitage.configure :dummy_images do list_class 'images-thumbnails' end }
 
       let(:expected) { '<ul class="images-thumbnails"><li class="span4"><a class="thumbnail" href="/assets/0-full.png" rel="hermitage"><img alt="0 thumbnail" src="/assets/0-thumbnail.png" /></a></li><li class="span4"><a class="thumbnail" href="/assets/1-full.png" rel="hermitage"><img alt="1 thumbnail" src="/assets/1-thumbnail.png" /></a></li></ul>' }
       subject { template.render_gallery_for images }
@@ -61,10 +61,10 @@ describe Hermitage::ViewHelpers, type: :helper do
       context 'with overwritten defaults' do
 
         before(:each) do
-          Hermitage.configs[:default].merge!({
-            list_class: 'default-thumbnails',
-            item_class: 'span3'
-          })
+          Hermitage.configure :default do
+            list_class 'default-thumbnails'
+            item_class 'span3'
+          end
         end
 
         let(:expected) { '<ul class="images-thumbnails"><li class="span3"><a class="thumbnail" href="/assets/0-full.png" rel="hermitage"><img alt="0 thumbnail" src="/assets/0-thumbnail.png" /></a></li><li class="span3"><a class="thumbnail" href="/assets/1-full.png" rel="hermitage"><img alt="1 thumbnail" src="/assets/1-thumbnail.png" /></a></li></ul>' }

data/spec/spec_helper.rb

@@ -23,4 +23,8 @@ RSpec.configure do |config|
   config.order = 'random'
 end
 
-Capybara.javascript_driver = :poltergeist
+Capybara.javascript_driver = :poltergeist
+
+def reset_configs
+  Hermitage.configs = { default: Hermitage::Defaults.to_hash() }
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: hermitage
 version: !ruby/object:Gem::Version
-  version: 0.0.3
+  version: 0.0.4.1
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-09-08 00:00:00.000000000 Z
+date: 2013-09-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -209,8 +209,10 @@ files:
 - lib/generators/hermitage/install_generator.rb
 - lib/generators/hermitage/templates/hermitage.rb
 - lib/hermitage.rb
+- lib/hermitage/configurator.rb
 - lib/hermitage/defaults.rb
 - lib/hermitage/engine.rb
+- lib/hermitage/rails_render_core.rb
 - lib/hermitage/railtie.rb
 - lib/hermitage/version.rb
 - lib/hermitage/view_helpers.rb
@@ -266,6 +268,7 @@ files:
 - spec/features/bottom_panel_spec.rb
 - spec/features/engine_spec.rb
 - spec/features/navigation_spec.rb
+- spec/features/preload_neighbours_spec.rb
 - spec/features/render_gallery_spec.rb
 - spec/features/resize_spec.rb
 - spec/features/scale_spec.rb
@@ -273,6 +276,7 @@ files:
 - spec/features/viewer_spec.rb
 - spec/features_helper.rb
 - spec/generators/install_spec.rb
+- spec/lib/hermitage/configurator_spec.rb
 - spec/lib/hermitage/defaults_spec.rb
 - spec/lib/hermitage/railtie_spec.rb
 - spec/lib/hermitage/view_helpers_spec.rb
@@ -357,6 +361,7 @@ test_files:
 - spec/features/bottom_panel_spec.rb
 - spec/features/engine_spec.rb
 - spec/features/navigation_spec.rb
+- spec/features/preload_neighbours_spec.rb
 - spec/features/render_gallery_spec.rb
 - spec/features/resize_spec.rb
 - spec/features/scale_spec.rb
@@ -364,6 +369,7 @@ test_files:
 - spec/features/viewer_spec.rb
 - spec/features_helper.rb
 - spec/generators/install_spec.rb
+- spec/lib/hermitage/configurator_spec.rb
 - spec/lib/hermitage/defaults_spec.rb
 - spec/lib/hermitage/railtie_spec.rb
 - spec/lib/hermitage/view_helpers_spec.rb