comfy_carousel 0.0.0 → 0.0.1

data/Gemfile

@@ -2,6 +2,7 @@ source 'http://rubygems.org'
 
 gem 'rails',          '>=3.1.0'
 gem 'jquery-rails',   '>=1.0.0'
+gem 'paperclip',      '>=2.3.0'
 
 group :test do
   gem 'sqlite3'

data/Gemfile.lock

@@ -30,6 +30,7 @@ GEM
       multi_json (~> 1.0)
     arel (3.0.0)
     builder (3.0.0)
+    cocaine (0.2.1)
     erubis (2.7.0)
     git (1.2.5)
     hike (1.2.1)
@@ -50,6 +51,11 @@ GEM
       treetop (~> 1.4.8)
     mime-types (1.17.2)
     multi_json (1.0.4)
+    paperclip (2.5.2)
+      activerecord (>= 2.3.0)
+      activesupport (>= 2.3.2)
+      cocaine (>= 0.0.2)
+      mime-types
     polyglot (0.3.3)
     rack (1.4.1)
     rack-cache (1.1)
@@ -94,5 +100,6 @@ PLATFORMS
 DEPENDENCIES
   jeweler
   jquery-rails (>= 1.0.0)
+  paperclip (>= 2.3.0)
   rails (>= 3.1.0)
   sqlite3

data/LICENSE

@@ -0,0 +1,20 @@
+Copyright (c) 2012 Oleg Khabarov, The Working Group
+
+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

@@ -1,3 +1,36 @@
-# ComfyCarousel
+# ComfyCarousel [![Build Status](https://secure.travis-ci.org/comfy/comfy-carousel.png)](http://travis-ci.org/comfy/comfy-carousel) [![Dependency Status](https://gemnasium.com/comfy/comfy-carousel.png)](https://gemnasium.com/comfy/comfy-carousel)
 
-Throwing some code here, will make a gem eventually.
+This is a small engine that allows you to manage slideshows.
+
+## Installation
+
+Add gem definition to your Gemfile:
+
+    gem 'comfy_carousel'
+    
+Then from the Rails project's root run:
+    
+    bundle install
+    rails g comfy:carousel
+    rake db:migrate
+    
+You should be able to access `/admin/carousel/carousels` where you can add carousels and their slides.
+
+This gem comes bundled with [slides.jquery.js](http://slidesjs.com/) that you can use via asset pipeline by adding this line to your `app/assets/javascripts/application.js`:
+
+    //= require slides.jquery
+    
+## Usage
+
+There's nothing on the front-end really. You have access to `Carousel::Carousel` objects that in turn can be used to access their slides. Like so:
+
+    @carousel = Carousel::Carousel.find_by_identifier('my_carousel')
+    @slides = carousel.slides
+    
+Each slide will have following attributes: `label`, `content`, `url`, `file` (paperclip object), and `position`
+
+---
+
+ComfyCarousel is released under the [MIT license](https://github.com/comfy/comfy-carousel/raw/master/LICENSE)
+
+Copyright 2012 Oleg Khabarov, [The Working Group Inc](http://www.twg.ca)

data/Rakefile

@@ -10,7 +10,7 @@ begin
     gem.name        = 'comfy_carousel'
     gem.homepage    = 'http://github.com/comfy/comfy_carousel'
     gem.license     = 'MIT'
-    gem.summary     = 'ComfyCarousel is a carousel engine for Rails 3.1 apps (and ComfortableMexicanSofa)'
+    gem.summary     = 'ComfyCarousel is a carousel engine for Rails 3.1+ apps (and ComfortableMexicanSofa)'
     gem.description = ''
     gem.email       = 'oleg@twg.ca'
     gem.authors     = ['Oleg Khabarov', 'The Working Group Inc.']

data/VERSION

@@ -1 +1 @@
-0.0.0
+0.0.1

data/app/assets/javascripts/slides.jquery.js

@@ -0,0 +1,555 @@
+/*
+* Slides, A Slideshow Plugin for jQuery
+* Intructions: http://slidesjs.com
+* By: Nathan Searles, http://nathansearles.com
+* Version: 1.1.9
+* Updated: September 5th, 2011
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+(function($){
+	$.fn.slides = function( option ) {
+		// override defaults with specified option
+		option = $.extend( {}, $.fn.slides.option, option );
+
+		return this.each(function(){
+			// wrap slides in control container, make sure slides are block level
+			$('.' + option.container, $(this)).children().wrapAll('<div class="slides_control"/>');
+			
+			var elem = $(this),
+				control = $('.slides_control',elem),
+				total = control.children().size(),
+				width = control.children().outerWidth(),
+				height = control.children().outerHeight(),
+				start = option.start - 1,
+				effect = option.effect.indexOf(',') < 0 ? option.effect : option.effect.replace(' ', '').split(',')[0],
+				paginationEffect = option.effect.indexOf(',') < 0 ? effect : option.effect.replace(' ', '').split(',')[1],
+				next = 0, prev = 0, number = 0, current = 0, loaded, active, clicked, position, direction, imageParent, pauseTimeout, playInterval;
+			
+			// is there only one slide?
+			if (total < 2) {
+				// Fade in .slides_container
+				$('.' + option.container, $(this)).fadeIn(option.fadeSpeed, option.fadeEasing, function(){
+					// let the script know everything is loaded
+					loaded = true;
+					// call the loaded funciton
+					option.slidesLoaded();
+				});
+				// Hide the next/previous buttons
+				$('.' + option.next + ', .' + option.prev).fadeOut(0);
+				return false;
+			}
+
+			// animate slides
+			function animate(direction, effect, clicked) {
+				if (!active && loaded) {
+					active = true;
+					// start of animation
+					option.animationStart(current + 1);
+					switch(direction) {
+						case 'next':
+							// change current slide to previous
+							prev = current;
+							// get next from current + 1
+							next = current + 1;
+							// if last slide, set next to first slide
+							next = total === next ? 0 : next;
+							// set position of next slide to right of previous
+							position = width*2;
+							// distance to slide based on width of slides
+							direction = -width*2;
+							// store new current slide
+							current = next;
+						break;
+						case 'prev':
+							// change current slide to previous
+							prev = current;
+							// get next from current - 1
+							next = current - 1;
+							// if first slide, set next to last slide
+							next = next === -1 ? total-1 : next;								
+							// set position of next slide to left of previous
+							position = 0;								
+							// distance to slide based on width of slides
+							direction = 0;		
+							// store new current slide
+							current = next;
+						break;
+						case 'pagination':
+							// get next from pagination item clicked, convert to number
+							next = parseInt(clicked,10);
+							// get previous from pagination item with class of current
+							prev = $('.' + option.paginationClass + ' li.'+ option.currentClass +' a', elem).attr('href').match('[^#/]+$');
+							// if next is greater then previous set position of next slide to right of previous
+							if (next > prev) {
+								position = width*2;
+								direction = -width*2;
+							} else {
+							// if next is less then previous set position of next slide to left of previous
+								position = 0;
+								direction = 0;
+							}
+							// store new current slide
+							current = next;
+						break;
+					}
+
+					// fade animation
+					if (effect === 'fade') {
+						// fade animation with crossfade
+						if (option.crossfade) {
+							// put hidden next above current
+							control.children(':eq('+ next +')', elem).css({
+								zIndex: 10
+							// fade in next
+							}).fadeIn(option.fadeSpeed, option.fadeEasing, function(){
+								if (option.autoHeight) {
+									// animate container to height of next
+									control.animate({
+										height: control.children(':eq('+ next +')', elem).outerHeight()
+									}, option.autoHeightSpeed, function(){
+										// hide previous
+										control.children(':eq('+ prev +')', elem).css({
+											display: 'none',
+											zIndex: 0
+										});								
+										// reset z index
+										control.children(':eq('+ next +')', elem).css({
+											zIndex: 0
+										});									
+										// end of animation
+										option.animationComplete(next + 1);
+										active = false;
+									});
+								} else {
+									// hide previous
+									control.children(':eq('+ prev +')', elem).css({
+										display: 'none',
+										zIndex: 0
+									});									
+									// reset zindex
+									control.children(':eq('+ next +')', elem).css({
+										zIndex: 0
+									});									
+									// end of animation
+									option.animationComplete(next + 1);
+									active = false;
+								}
+							});
+						} else {
+							// fade animation with no crossfade
+							control.children(':eq('+ prev +')', elem).fadeOut(option.fadeSpeed,  option.fadeEasing, function(){
+								// animate to new height
+								if (option.autoHeight) {
+									control.animate({
+										// animate container to height of next
+										height: control.children(':eq('+ next +')', elem).outerHeight()
+									}, option.autoHeightSpeed,
+									// fade in next slide
+									function(){
+										control.children(':eq('+ next +')', elem).fadeIn(option.fadeSpeed, option.fadeEasing);
+									});
+								} else {
+								// if fixed height
+									control.children(':eq('+ next +')', elem).fadeIn(option.fadeSpeed, option.fadeEasing, function(){
+										// fix font rendering in ie, lame
+										if($.browser.msie) {
+											$(this).get(0).style.removeAttribute('filter');
+										}
+									});
+								}									
+								// end of animation
+								option.animationComplete(next + 1);
+								active = false;
+							});
+						}
+					// slide animation
+					} else {
+						// move next slide to right of previous
+						control.children(':eq('+ next +')').css({
+							left: position,
+							display: 'block'
+						});
+						// animate to new height
+						if (option.autoHeight) {
+							control.animate({
+								left: direction,
+								height: control.children(':eq('+ next +')').outerHeight()
+							},option.slideSpeed, option.slideEasing, function(){
+								control.css({
+									left: -width
+								});
+								control.children(':eq('+ next +')').css({
+									left: width,
+									zIndex: 5
+								});
+								// reset previous slide
+								control.children(':eq('+ prev +')').css({
+									left: width,
+									display: 'none',
+									zIndex: 0
+								});
+								// end of animation
+								option.animationComplete(next + 1);
+								active = false;
+							});
+							// if fixed height
+							} else {
+								// animate control
+								control.animate({
+									left: direction
+								},option.slideSpeed, option.slideEasing, function(){
+									// after animation reset control position
+									control.css({
+										left: -width
+									});
+									// reset and show next
+									control.children(':eq('+ next +')').css({
+										left: width,
+										zIndex: 5
+									});
+									// reset previous slide
+									control.children(':eq('+ prev +')').css({
+										left: width,
+										display: 'none',
+										zIndex: 0
+									});
+									// end of animation
+									option.animationComplete(next + 1);
+									active = false;
+								});
+							}
+						}
+					// set current state for pagination
+					if (option.pagination) {
+						// remove current class from all
+						$('.'+ option.paginationClass +' li.' + option.currentClass, elem).removeClass(option.currentClass);
+						// add current class to next
+						$('.' + option.paginationClass + ' li:eq('+ next +')', elem).addClass(option.currentClass);
+					}
+				}
+			} // end animate function
+			
+			function stop() {
+				// clear interval from stored id
+				clearInterval(elem.data('interval'));
+			}
+
+			function pause() {
+				if (option.pause) {
+					// clear timeout and interval
+					clearTimeout(elem.data('pause'));
+					clearInterval(elem.data('interval'));
+					// pause slide show for option.pause amount
+					pauseTimeout = setTimeout(function() {
+						// clear pause timeout
+						clearTimeout(elem.data('pause'));
+						// start play interval after pause
+						playInterval = setInterval(	function(){
+							animate("next", effect);
+						},option.play);
+						// store play interval
+						elem.data('interval',playInterval);
+					},option.pause);
+					// store pause interval
+					elem.data('pause',pauseTimeout);
+				} else {
+					// if no pause, just stop
+					stop();
+				}
+			}
+				
+			// 2 or more slides required
+			if (total < 2) {
+				return;
+			}
+			
+			// error corection for start slide
+			if (start < 0) {
+				start = 0;
+			}
+			
+			if (start > total) {
+				start = total - 1;
+			}
+					
+			// change current based on start option number
+			if (option.start) {
+				current = start;
+			}
+			
+			// randomizes slide order
+			if (option.randomize) {
+				control.randomize();
+			}
+			
+			// make sure overflow is hidden, width is set
+			$('.' + option.container, elem).css({
+				overflow: 'hidden',
+				// fix for ie
+				position: 'relative'
+			});
+			
+			// set css for slides
+			control.children().css({
+				position: 'absolute',
+				top: 0, 
+				left: control.children().outerWidth(),
+				zIndex: 0,
+				display: 'none'
+			 });
+			
+			// set css for control div
+			control.css({
+				position: 'relative',
+				// size of control 3 x slide width
+				width: (width * 3),
+				// set height to slide height
+				height: height,
+				// center control to slide
+				left: -width
+			});
+			
+			// show slides
+			$('.' + option.container, elem).css({
+				display: 'block'
+			});
+
+			// if autoHeight true, get and set height of first slide
+			if (option.autoHeight) {
+				control.children().css({
+					height: 'auto'
+				});
+				control.animate({
+					height: control.children(':eq('+ start +')').outerHeight()
+				},option.autoHeightSpeed);
+			}
+			
+			// checks if image is loaded
+			if (option.preload && control.find('img:eq(' + start + ')').length) {
+				// adds preload image
+				$('.' + option.container, elem).css({
+					background: 'url(' + option.preloadImage + ') no-repeat 50% 50%'
+				});
+				
+				// gets image src, with cache buster
+				var img = control.find('img:eq(' + start + ')').attr('src') + '?' + (new Date()).getTime();
+				
+				// check if the image has a parent
+				if ($('img', elem).parent().attr('class') != 'slides_control') {
+					// If image has parent, get tag name
+					imageParent = control.children(':eq(0)')[0].tagName.toLowerCase();
+				} else {
+					// Image doesn't have parent, use image tag name
+					imageParent = control.find('img:eq(' + start + ')');
+				}
+
+				// checks if image is loaded
+				control.find('img:eq(' + start + ')').attr('src', img).load(function() {
+					// once image is fully loaded, fade in
+					control.find(imageParent + ':eq(' + start + ')').fadeIn(option.fadeSpeed, option.fadeEasing, function(){
+						$(this).css({
+							zIndex: 5
+						});
+						// removes preload image
+						$('.' + option.container, elem).css({
+							background: ''
+						});
+						// let the script know everything is loaded
+						loaded = true;
+						// call the loaded funciton
+						option.slidesLoaded();
+					});
+				});
+			} else {
+				// if no preloader fade in start slide
+				control.children(':eq(' + start + ')').fadeIn(option.fadeSpeed, option.fadeEasing, function(){
+					// let the script know everything is loaded
+					loaded = true;
+					// call the loaded funciton
+					option.slidesLoaded();
+				});
+			}
+			
+			// click slide for next
+			if (option.bigTarget) {
+				// set cursor to pointer
+				control.children().css({
+					cursor: 'pointer'
+				});
+				// click handler
+				control.children().click(function(){
+					// animate to next on slide click
+					animate('next', effect);
+					return false;
+				});									
+			}
+			
+			// pause on mouseover
+			if (option.hoverPause && option.play) {
+				control.bind('mouseover',function(){
+					// on mouse over stop
+					stop();
+				});
+				control.bind('mouseleave',function(){
+					// on mouse leave start pause timeout
+					pause();
+				});
+			}
+			
+			// generate next/prev buttons
+			if (option.generateNextPrev) {
+				$('.' + option.container, elem).after('<a href="#" class="'+ option.prev +'">Prev</a>');
+				$('.' + option.prev, elem).after('<a href="#" class="'+ option.next +'">Next</a>');
+			}
+			
+			// next button
+			$('.' + option.next ,elem).click(function(e){
+				e.preventDefault();
+				if (option.play) {
+					pause();
+				}
+				animate('next', effect);
+			});
+			
+			// previous button
+			$('.' + option.prev, elem).click(function(e){
+				e.preventDefault();
+				if (option.play) {
+					 pause();
+				}
+				animate('prev', effect);
+			});
+			
+			// generate pagination
+			if (option.generatePagination) {
+				// create unordered list
+				if (option.prependPagination) {
+					elem.prepend('<ul class='+ option.paginationClass +'></ul>');
+				} else {
+					elem.append('<ul class='+ option.paginationClass +'></ul>');
+				}
+				// for each slide create a list item and link
+				control.children().each(function(){
+					$('.' + option.paginationClass, elem).append('<li><a href="#'+ number +'">'+ (number+1) +'</a></li>');
+					number++;
+				});
+			} else {
+				// if pagination exists, add href w/ value of item number to links
+				$('.' + option.paginationClass + ' li a', elem).each(function(){
+					$(this).attr('href', '#' + number);
+					number++;
+				});
+			}
+			
+			// add current class to start slide pagination
+			$('.' + option.paginationClass + ' li:eq('+ start +')', elem).addClass(option.currentClass);
+			
+			// click handling 
+			$('.' + option.paginationClass + ' li a', elem ).click(function(){
+				// pause slideshow
+				if (option.play) {
+					 pause();
+				}
+				// get clicked, pass to animate function					
+				clicked = $(this).attr('href').match('[^#/]+$');
+				// if current slide equals clicked, don't do anything
+				if (current != clicked) {
+					animate('pagination', paginationEffect, clicked);
+				}
+				return false;
+			});
+			
+			// click handling 
+			$('a.link', elem).click(function(){
+				// pause slideshow
+				if (option.play) {
+					 pause();
+				}
+				// get clicked, pass to animate function					
+				clicked = $(this).attr('href').match('[^#/]+$') - 1;
+				// if current slide equals clicked, don't do anything
+				if (current != clicked) {
+					animate('pagination', paginationEffect, clicked);
+				}
+				return false;
+			});
+		
+			if (option.play) {
+				// set interval
+				playInterval = setInterval(function() {
+					animate('next', effect);
+				}, option.play);
+				// store interval id
+				elem.data('interval',playInterval);
+			}
+		});
+	};
+	
+	// default options
+	$.fn.slides.option = {
+		preload: false, // boolean, Set true to preload images in an image based slideshow
+		preloadImage: '/img/loading.gif', // string, Name and location of loading image for preloader. Default is "/img/loading.gif"
+		container: 'slides_container', // string, Class name for slides container. Default is "slides_container"
+		generateNextPrev: false, // boolean, Auto generate next/prev buttons
+		next: 'next', // string, Class name for next button
+		prev: 'prev', // string, Class name for previous button
+		pagination: true, // boolean, If you're not using pagination you can set to false, but don't have to
+		generatePagination: true, // boolean, Auto generate pagination
+		prependPagination: false, // boolean, prepend pagination
+		paginationClass: 'pagination', // string, Class name for pagination
+		currentClass: 'current', // string, Class name for current class
+		fadeSpeed: 350, // number, Set the speed of the fading animation in milliseconds
+		fadeEasing: '', // string, must load jQuery's easing plugin before http://gsgd.co.uk/sandbox/jquery/easing/
+		slideSpeed: 350, // number, Set the speed of the sliding animation in milliseconds
+		slideEasing: '', // string, must load jQuery's easing plugin before http://gsgd.co.uk/sandbox/jquery/easing/
+		start: 1, // number, Set the speed of the sliding animation in milliseconds
+		effect: 'slide', // string, '[next/prev], [pagination]', e.g. 'slide, fade' or simply 'fade' for both
+		crossfade: false, // boolean, Crossfade images in a image based slideshow
+		randomize: false, // boolean, Set to true to randomize slides
+		play: 0, // number, Autoplay slideshow, a positive number will set to true and be the time between slide animation in milliseconds
+		pause: 0, // number, Pause slideshow on click of next/prev or pagination. A positive number will set to true and be the time of pause in milliseconds
+		hoverPause: false, // boolean, Set to true and hovering over slideshow will pause it
+		autoHeight: false, // boolean, Set to true to auto adjust height
+		autoHeightSpeed: 350, // number, Set auto height animation time in milliseconds
+		bigTarget: false, // boolean, Set to true and the whole slide will link to next slide on click
+		animationStart: function(){}, // Function called at the start of animation
+		animationComplete: function(){}, // Function called at the completion of animation
+		slidesLoaded: function() {} // Function is called when slides is fully loaded
+	};
+	
+	// Randomize slide order on load
+	$.fn.randomize = function(callback) {
+		function randomizeOrder() { return(Math.round(Math.random())-0.5); }
+			return($(this).each(function() {
+			var $this = $(this);
+			var $children = $this.children();
+			var childCount = $children.length;
+			if (childCount > 1) {
+				$children.hide();
+				var indices = [];
+				for (i=0;i<childCount;i++) { indices[indices.length] = i; }
+				indices = indices.sort(randomizeOrder);
+				$.each(indices,function(j,k) { 
+					var $child = $children.eq(k);
+					var $clone = $child.clone(true);
+					$clone.show().appendTo($this);
+					if (callback !== undefined) {
+						callback($child, $clone);
+					}
+				$child.remove();
+			});
+			}
+		}));
+	};
+})(jQuery);