coinslider-rails 0.0.1

data/Gemfile

@@ -0,0 +1,24 @@
+source 'http://rubygems.org'
+
+gem 'rails', '>= 3.1.0'
+
+gem 'sqlite3'
+
+group :assets do
+  gem 'sass-rails', ">= 3.1.0"
+  gem 'coffee-rails', ">= 3.1.0"
+  gem 'uglifier'
+end
+
+gem 'jquery-rails'
+
+group :test do
+  gem 'rspec'
+  gem 'rspec-rails'
+  gem 'turn', :require => false
+  gem 'minitest'
+  gem 'capybara'
+  gem 'capybara-webkit'
+  gem 'mocha'
+end
+

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright (c) 2012 Javier Guerra
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,40 @@
+# Coinslider
+
+Rails gem installer for [coinslider](http://workshop.rs/projects/coin-slider/) jquery lib
+
+## Installation
+
+Add into your Gemfile
+
+```
+gem 'jquery-rails'
+gem 'coinslider-rails'
+```
+
+Now run ```bundle install```
+
+The edit your ```app/assets/javascripts/application.js``` with the line:
+
+```
+//= require jquery
+//= require coinslider
+```
+
+At last you should edit ```app/assets/stylesheets/application.css``` with:
+
+```
+//= require coinslider
+```
+
+## Usage
+
+Basic usage
+
+```
+$(function(){
+  $("#gallery").coinslider();
+});
+```
+
+For a full list of options visit:
+[Coinslider Official Website](http://workshop.rs/2010/04/coin-slider-image-slider-with-unique-effects/)

data/Rakefile

@@ -0,0 +1,12 @@
+# encoding: UTF-8
+require 'bundler'
+Bundler::GemHelper.install_tasks
+
+require "rspec/core/rake_task"
+
+RSpec::Core::RakeTask.new(:spec) do |t|
+  t.ruby_opts = ['-r test/unit']
+  t.rspec_opts = %w[--color]
+end
+
+task :default => :spec

data/lib/coinslider-rails.rb

@@ -0,0 +1,3 @@
+if defined? Rails && Rails::VERSION::MAJOR == 3 && Rails::VERSION::MINOR >= 1
+  require 'coinslider/engine'
+end

data/lib/coinslider/engine.rb

@@ -0,0 +1,5 @@
+module Coinslider
+  module Rails
+    class Engine < ::Rails::Engine; end
+  end
+end

data/vendor/assets/javascripts/coinslider-main.js

@@ -0,0 +1,487 @@
+/**
+ * Coin Slider - Unique jQuery Image Slider
+ * @version: 1.0 - (2010/04/04)
+ * @requires jQuery v1.2.2 or later 
+ * @author Ivan Lazarevic
+ * Examples and documentation at: http://workshop.rs/projects/coin-slider/
+ 
+ * Licensed under MIT licence:
+ *   http://www.opensource.org/licenses/mit-license.php
+**/
+
+(function($) {
+
+	var params 		= new Array;
+	var order		= new Array;
+	var images		= new Array;
+	var links		= new Array;
+	var linksTarget = new Array;
+	var titles		= new Array;
+	var interval	= new Array;
+	var imagePos	= new Array;
+	var appInterval = new Array;	
+	var squarePos	= new Array;	
+	var reverse		= new Array;
+	
+	$.fn.coinslider= $.fn.CoinSlider = function(options){
+		
+		init = function(el){
+				
+			order[el.id] 		= new Array();	// order of square appereance
+			images[el.id]		= new Array();
+			links[el.id]		= new Array();
+			linksTarget[el.id]	= new Array();
+			titles[el.id]		= new Array();
+			imagePos[el.id]		= 0;
+			squarePos[el.id]	= 0;
+			reverse[el.id]		= 1;						
+				
+			params[el.id] = $.extend({}, $.fn.coinslider.defaults, options);
+						
+			// create images, links and titles arrays
+			$.each($('#'+el.id+' img'), function(i,item){
+				images[el.id][i] 		= $(item).attr('src');
+				links[el.id][i] 		= $(item).parent().is('a') ? $(item).parent().attr('href') : '';
+				linksTarget[el.id][i] 	= $(item).parent().is('a') ? $(item).parent().attr('target') : '';
+				titles[el.id][i] 		= $(item).next().is('span') ? $(item).next().html() : '';
+				$(item).hide();
+				$(item).next().hide();
+			});			
+			
+
+			// set panel
+			$(el).css({
+				'background-image':'url('+images[el.id][0]+')',
+				'width': params[el.id].width,
+				'height': params[el.id].height,
+				'position': 'relative',
+				'background-position': 'top left'
+			}).wrap("<div class='coin-slider' id='coin-slider-"+el.id+"' />");	
+			
+				
+			// create title bar
+			$('#'+el.id).append("<div class='cs-title' id='cs-title-"+el.id+"' style='position: absolute; bottom:0; left: 0; z-index: 1000;'></div>");
+						
+			$.setFields(el);
+			
+			if(params[el.id].navigation)
+				$.setNavigation(el);
+			
+			$.transition(el,0);
+			$.transitionCall(el);
+				
+		}
+		
+		// squares positions
+		$.setFields = function(el){
+			
+			tWidth = sWidth = parseInt(params[el.id].width/params[el.id].spw);
+			tHeight = sHeight = parseInt(params[el.id].height/params[el.id].sph);
+			
+			counter = sLeft = sTop = 0;
+			tgapx = gapx = params[el.id].width - params[el.id].spw*sWidth;
+			tgapy = gapy = params[el.id].height - params[el.id].sph*sHeight;
+			
+			for(i=1;i <= params[el.id].sph;i++){
+				gapx = tgapx;
+				
+					if(gapy > 0){
+						gapy--;
+						sHeight = tHeight+1;
+					} else {
+						sHeight = tHeight;
+					}
+				
+				for(j=1; j <= params[el.id].spw; j++){	
+
+					if(gapx > 0){
+						gapx--;
+						sWidth = tWidth+1;
+					} else {
+						sWidth = tWidth;
+					}
+
+					order[el.id][counter] = i+''+j;
+					counter++;
+					
+					if(params[el.id].links)
+						$('#'+el.id).append("<a href='"+links[el.id][0]+"' class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></a>");
+					else
+						$('#'+el.id).append("<div class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></div>");
+								
+					// positioning squares
+					$("#cs-"+el.id+i+j).css({ 
+						'background-position': -sLeft +'px '+(-sTop+'px'),
+						'left' : sLeft ,
+						'top': sTop
+					});
+				
+					sLeft += sWidth;
+				}
+
+				sTop += sHeight;
+				sLeft = 0;					
+					
+			}
+			
+			
+			$('.cs-'+el.id).mouseover(function(){
+				$('#cs-navigation-'+el.id).show();
+			});
+		
+			$('.cs-'+el.id).mouseout(function(){
+				$('#cs-navigation-'+el.id).hide();
+			});	
+			
+			$('#cs-title-'+el.id).mouseover(function(){
+				$('#cs-navigation-'+el.id).show();
+			});
+		
+			$('#cs-title-'+el.id).mouseout(function(){
+				$('#cs-navigation-'+el.id).hide();
+			});	
+			
+			if(params[el.id].hoverPause){	
+				$('.cs-'+el.id).mouseover(function(){
+					params[el.id].pause = true;
+				});
+			
+				$('.cs-'+el.id).mouseout(function(){
+					params[el.id].pause = false;
+				});	
+				
+				$('#cs-title-'+el.id).mouseover(function(){
+					params[el.id].pause = true;
+				});
+			
+				$('#cs-title-'+el.id).mouseout(function(){
+					params[el.id].pause = false;
+				});	
+			}
+					
+			
+		};
+				
+		
+		$.transitionCall = function(el){
+		
+			clearInterval(interval[el.id]);	
+			delay = params[el.id].delay + params[el.id].spw*params[el.id].sph*params[el.id].sDelay;
+			interval[el.id] = setInterval(function() { $.transition(el)  }, delay);
+			
+		}
+		
+		// transitions
+		$.transition = function(el,direction){
+			
+			if(params[el.id].pause == true) return;
+			
+			$.effect(el);
+			
+			squarePos[el.id] = 0;
+			appInterval[el.id] = setInterval(function() { $.appereance(el,order[el.id][squarePos[el.id]])  },params[el.id].sDelay);
+					
+			$(el).css({ 'background-image': 'url('+images[el.id][imagePos[el.id]]+')' });
+			
+			if(typeof(direction) == "undefined")
+				imagePos[el.id]++;
+			else
+				if(direction == 'prev')
+					imagePos[el.id]--;
+				else
+					imagePos[el.id] = direction;
+		
+			if  (imagePos[el.id] == images[el.id].length) {
+				imagePos[el.id] = 0;
+			}
+			
+			if (imagePos[el.id] == -1){
+				imagePos[el.id] = images[el.id].length-1;
+			}
+	
+			$('.cs-button-'+el.id).removeClass('cs-active');
+			$('#cs-button-'+el.id+"-"+(imagePos[el.id]+1)).addClass('cs-active');
+			
+			if(titles[el.id][imagePos[el.id]]){
+				$('#cs-title-'+el.id).css({ 'opacity' : 0 }).animate({ 'opacity' : params[el.id].opacity }, params[el.id].titleSpeed);
+				$('#cs-title-'+el.id).html(titles[el.id][imagePos[el.id]]);
+			} else {
+				$('#cs-title-'+el.id).css('opacity',0);
+			}				
+				
+		};
+		
+		$.appereance = function(el,sid){
+
+			$('.cs-'+el.id).attr('href',links[el.id][imagePos[el.id]]).attr('target',linksTarget[el.id][imagePos[el.id]]);
+
+			if (squarePos[el.id] == params[el.id].spw*params[el.id].sph) {
+				clearInterval(appInterval[el.id]);
+				return;
+			}
+
+			$('#cs-'+el.id+sid).css({ opacity: 0, 'background-image': 'url('+images[el.id][imagePos[el.id]]+')' });
+			$('#cs-'+el.id+sid).animate({ opacity: 1 }, 300);
+			squarePos[el.id]++;
+			
+		};
+		
+		// navigation
+		$.setNavigation = function(el){
+			// create prev and next 
+			$(el).append("<div id='cs-navigation-"+el.id+"'></div>");
+			$('#cs-navigation-'+el.id).hide();
+			
+			$('#cs-navigation-'+el.id).append("<a href='#' id='cs-prev-"+el.id+"' class='cs-prev'>prev</a>");
+			$('#cs-navigation-'+el.id).append("<a href='#' id='cs-next-"+el.id+"' class='cs-next'>next</a>");
+			$('#cs-prev-'+el.id).css({
+				'position' 	: 'absolute',
+				'top'		: params[el.id].height/2 - 15,
+				'left'		: 0,
+				'z-index' 	: 1001,
+				'line-height': '30px',
+				'opacity'	: params[el.id].opacity
+			}).click( function(e){
+				e.preventDefault();
+				$.transition(el,'prev');
+				$.transitionCall(el);		
+			}).mouseover( function(){ $('#cs-navigation-'+el.id).show() });
+	
+			$('#cs-next-'+el.id).css({
+				'position' 	: 'absolute',
+				'top'		: params[el.id].height/2 - 15,
+				'right'		: 0,
+				'z-index' 	: 1001,
+				'line-height': '30px',
+				'opacity'	: params[el.id].opacity
+			}).click( function(e){
+				e.preventDefault();
+				$.transition(el);
+				$.transitionCall(el);
+			}).mouseover( function(){ $('#cs-navigation-'+el.id).show() });
+		
+			// image buttons
+			$("<div id='cs-buttons-"+el.id+"' class='cs-buttons'></div>").appendTo($('#coin-slider-'+el.id));
+
+			
+			for(k=1;k<images[el.id].length+1;k++){
+				$('#cs-buttons-'+el.id).append("<a href='#' class='cs-button-"+el.id+"' id='cs-button-"+el.id+"-"+k+"'>"+k+"</a>");
+			}
+			
+			$.each($('.cs-button-'+el.id), function(i,item){
+				$(item).click( function(e){
+					$('.cs-button-'+el.id).removeClass('cs-active');
+					$(this).addClass('cs-active');
+					e.preventDefault();
+					$.transition(el,i);
+					$.transitionCall(el);				
+				})
+			});	
+			
+			$('#cs-navigation-'+el.id+' a').mouseout(function(){
+				$('#cs-navigation-'+el.id).hide();
+				params[el.id].pause = false;
+			});						
+
+			$("#cs-buttons-"+el.id).css({
+				'left'			: '50%',
+				'margin-left' 	: -images[el.id].length*15/2-5,
+				'position'		: 'relative'
+				
+			});
+			
+				
+		}
+
+
+
+
+		// effects
+		$.effect = function(el){
+			
+			effA = ['random','swirl','rain','straight'];
+			if(params[el.id].effect == '')
+				eff = effA[Math.floor(Math.random()*(effA.length))];
+			else
+				eff = params[el.id].effect;
+
+			order[el.id] = new Array();
+
+			if(eff == 'random'){
+				counter = 0;
+				  for(i=1;i <= params[el.id].sph;i++){
+				  	for(j=1; j <= params[el.id].spw; j++){	
+				  		order[el.id][counter] = i+''+j;
+						counter++;
+				  	}
+				  }	
+				$.random(order[el.id]);
+			}
+			
+			if(eff == 'rain')	{
+				$.rain(el);
+			}
+			
+			if(eff == 'swirl')
+				$.swirl(el);
+				
+			if(eff == 'straight')
+				$.straight(el);
+				
+			reverse[el.id] *= -1;
+			if(reverse[el.id] > 0){
+				order[el.id].reverse();
+			}
+
+		}
+
+			
+		// shuffle array function
+		$.random = function(arr) {
+						
+		  var i = arr.length;
+		  if ( i == 0 ) return false;
+		  while ( --i ) {
+		     var j = Math.floor( Math.random() * ( i + 1 ) );
+		     var tempi = arr[i];
+		     var tempj = arr[j];
+		     arr[i] = tempj;
+		     arr[j] = tempi;
+		   }
+		}	
+		
+		//swirl effect by milos popovic
+		$.swirl = function(el){
+
+			var n = params[el.id].sph;
+			var m = params[el.id].spw;
+
+			var x = 1;
+			var y = 1;
+			var going = 0;
+			var num = 0;
+			var c = 0;
+			
+			var dowhile = true;
+						
+			while(dowhile) {
+				
+				num = (going==0 || going==2) ? m : n;
+				
+				for (i=1;i<=num;i++){
+					
+					order[el.id][c] = x+''+y;
+					c++;
+
+					if(i!=num){
+						switch(going){
+							case 0 : y++; break;
+							case 1 : x++; break;
+							case 2 : y--; break;
+							case 3 : x--; break;
+						
+						}
+					}
+				}
+				
+				going = (going+1)%4;
+
+				switch(going){
+					case 0 : m--; y++; break;
+					case 1 : n--; x++; break;
+					case 2 : m--; y--; break;
+					case 3 : n--; x--; break;		
+				}
+				
+				check = $.max(n,m) - $.min(n,m);			
+				if(m<=check && n<=check)
+					dowhile = false;
+									
+			}
+		}
+
+		// rain effect
+		$.rain = function(el){
+			var n = params[el.id].sph;
+			var m = params[el.id].spw;
+
+			var c = 0;
+			var to = to2 = from = 1;
+			var dowhile = true;
+
+
+			while(dowhile){
+				
+				for(i=from;i<=to;i++){
+					order[el.id][c] = i+''+parseInt(to2-i+1);
+					c++;
+				}
+				
+				to2++;
+				
+				if(to < n && to2 < m && n<m){
+					to++;	
+				}
+				
+				if(to < n && n>=m){
+					to++;	
+				}
+				
+				if(to2 > m){
+					from++;
+				}
+				
+				if(from > to) dowhile= false;
+				
+			}			
+
+		}
+
+		// straight effect
+		$.straight = function(el){
+			counter = 0;
+			for(i=1;i <= params[el.id].sph;i++){
+				for(j=1; j <= params[el.id].spw; j++){	
+					order[el.id][counter] = i+''+j;
+					counter++;
+				}
+				
+			}
+		}
+
+		$.min = function(n,m){
+			if (n>m) return m;
+			else return n;
+		}
+		
+		$.max = function(n,m){
+			if (n<m) return m;
+			else return n;
+		}		
+	
+	this.each (
+		function(){ init(this); }
+	);
+	
+
+	};
+	
+	
+	// default values
+	$.fn.coinslider.defaults = {	
+		width: 565, // width of slider panel
+		height: 290, // height of slider panel
+		spw: 7, // squares per width
+		sph: 5, // squares per height
+		delay: 3000, // delay between images in ms
+		sDelay: 30, // delay beetwen squares in ms
+		opacity: 0.7, // opacity of title and navigation
+		titleSpeed: 500, // speed of title appereance in ms
+		effect: '', // random, swirl, rain, straight
+		navigation: true, // prev next and buttons
+		links : true, // show images as links 
+		hoverPause: true // pause on hover		
+	};	
+	
+})(jQuery);
+	

data/vendor/assets/javascripts/coinslider.js

@@ -0,0 +1,3 @@
+/*
+ *= require coinslider-main
+*/

data/vendor/assets/stylesheets/coin-slider-styles.css.erb

@@ -0,0 +1,17 @@
+/*
+	Coin Slider jQuery plugin CSS styles
+	http://workshop.rs/projects/coin-slider
+*/
+
+
+.coin-slider { overflow: hidden; zoom: 1; position: relative; }
+.coin-slider a{ text-decoration: none; outline: none; border: none; }
+
+.cs-buttons { font-size: 0px; padding: 10px; float: left; }
+.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
+.cs-active { background-color: #B8C4CF; color: #FFFFFF; }
+
+.cs-title { width: 545px; padding: 10px; background-color: #000000; color: #FFFFFF; }
+
+.cs-prev, 
+.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }

data/vendor/assets/stylesheets/coinslider.css

@@ -0,0 +1,3 @@
+/*
+ *= require coin-slider-styles
+*/

metadata

@@ -0,0 +1,124 @@
+--- !ruby/object:Gem::Specification 
+name: coinslider-rails
+version: !ruby/object:Gem::Version 
+  hash: 29
+  prerelease: 
+  segments: 
+  - 0
+  - 0
+  - 1
+  version: 0.0.1
+platform: ruby
+authors: 
+- Javier Guerra
+- Ivan Lazarevic
+autorequire: 
+bindir: bin
+cert_chain: []
+
+date: 2012-05-16 00:00:00 Z
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: railties
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 3
+        segments: 
+        - 3
+        - 1
+        - 0
+        version: 3.1.0
+  type: :runtime
+  version_requirements: *id001
+- !ruby/object:Gem::Dependency 
+  name: bundler
+  prerelease: false
+  requirement: &id002 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 23
+        segments: 
+        - 1
+        - 0
+        - 0
+        version: 1.0.0
+  type: :development
+  version_requirements: *id002
+- !ruby/object:Gem::Dependency 
+  name: rails
+  prerelease: false
+  requirement: &id003 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 3
+        segments: 
+        - 3
+        - 1
+        - 0
+        version: 3.1.0
+  type: :development
+  version_requirements: *id003
+description: This gem provides jQuery Coinslider for your Rails 3.1+ application.
+email: 
+- tijuanate@gmail.com
+executables: []
+
+extensions: []
+
+extra_rdoc_files: []
+
+files: 
+- lib/coinslider/engine.rb
+- lib/coinslider-rails.rb
+- vendor/assets/javascripts/coinslider-main.js
+- vendor/assets/javascripts/coinslider.js
+- vendor/assets/stylesheets/coin-slider-styles.css.erb
+- vendor/assets/stylesheets/coinslider.css
+- MIT-LICENSE
+- Rakefile
+- Gemfile
+- README.md
+homepage: https://github.com/javierg/coinslier-rails
+licenses: []
+
+post_install_message: 
+rdoc_options: []
+
+require_paths: 
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      hash: 3
+      segments: 
+      - 0
+      version: "0"
+required_rubygems_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      hash: 3
+      segments: 
+      - 0
+      version: "0"
+requirements: []
+
+rubyforge_project: 
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: Coinslider for Rails 3.1+
+test_files: []
+
+has_rdoc: