anything_slider_rails 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- data/.DS_Store +0 -0
- data/.gitignore +4 -0
- data/Gemfile +4 -0
- data/Rakefile +1 -0
- data/anything_slider_rails.gemspec +24 -0
- data/lib/anything_slider_rails/engine.rb +6 -0
- data/lib/anything_slider_rails/version.rb +3 -0
- data/lib/anything_slider_rails.rb +3 -0
- data/readme.MD +42 -0
- data/vendor/.DS_Store +0 -0
- data/vendor/assets/.DS_Store +0 -0
- data/vendor/assets/images/arrows-metallic.png +0 -0
- data/vendor/assets/images/arrows-minimalist.png +0 -0
- data/vendor/assets/images/construction.gif +0 -0
- data/vendor/assets/images/cs-portfolio.png +0 -0
- data/vendor/assets/images/default.png +0 -0
- data/vendor/assets/javascripts/jquery.anythingslider.fx.js +188 -0
- data/vendor/assets/javascripts/jquery.anythingslider.js +814 -0
- data/vendor/assets/javascripts/jquery.anythingslider.video.js +379 -0
- data/vendor/assets/javascripts/jquery.easing.1.2.js +140 -0
- data/vendor/assets/javascripts/swfobject.js +4 -0
- data/vendor/assets/stylesheets/animate.css +3813 -0
- data/vendor/assets/stylesheets/anythingslider-ie.css +65 -0
- data/vendor/assets/stylesheets/anythingslider.css.erb +202 -0
- data/vendor/assets/stylesheets/theme-construction.css.erb +142 -0
- data/vendor/assets/stylesheets/theme-cs-portfolio.css.erb +149 -0
- data/vendor/assets/stylesheets/theme-metallic.css.erb +146 -0
- data/vendor/assets/stylesheets/theme-minimalist-round.css.erb +144 -0
- data/vendor/assets/stylesheets/theme-minimalist-square.css.erb +144 -0
- metadata +109 -0
data/.DS_Store
ADDED
Binary file
|
data/.gitignore
ADDED
data/Gemfile
ADDED
data/Rakefile
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
require "bundler/gem_tasks"
|
@@ -0,0 +1,24 @@
|
|
1
|
+
# -*- encoding: utf-8 -*-
|
2
|
+
$:.push File.expand_path("../lib", __FILE__)
|
3
|
+
require "anything_slider_rails/version"
|
4
|
+
|
5
|
+
Gem::Specification.new do |s|
|
6
|
+
s.name = "anything_slider_rails"
|
7
|
+
s.version = AnythingSliderRails::VERSION
|
8
|
+
s.authors = ["Han"]
|
9
|
+
s.email = ["han@logicallsat.com"]
|
10
|
+
s.homepage = ""
|
11
|
+
s.summary = %q{AnythingSlider automated install for Rails 3.1+}
|
12
|
+
s.description = %q{Gem installation of jquery plugin, AnythingSlider}
|
13
|
+
|
14
|
+
s.rubyforge_project = "anything_slider_rails"
|
15
|
+
|
16
|
+
s.files = `git ls-files`.split("\n")
|
17
|
+
s.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
|
18
|
+
s.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
|
19
|
+
s.require_paths = ["lib", "vendor"]
|
20
|
+
|
21
|
+
s.add_dependency "railties", ">= 3.1.0"
|
22
|
+
s.add_development_dependency "bundler", "~> 1.0.0"
|
23
|
+
s.add_development_dependency "rails", "~> 3.1"
|
24
|
+
end
|
data/readme.MD
ADDED
@@ -0,0 +1,42 @@
|
|
1
|
+
# AnythingSlider for Rails
|
2
|
+
|
3
|
+
**AnythingSliderRails** packages the anything slider jquery plugin and stylesheets and allows you to merely include the required scripts in your manifest in order to start using the plugin.
|
4
|
+
|
5
|
+
# Included Javascripts
|
6
|
+
**minified js files are not included, since the rails asset pipeline sorta necessitates the compiling (and likely minifying) your js files for production**
|
7
|
+
|
8
|
+
jquery.anythingslider.fx.js
|
9
|
+
jquery.anythingslider.js
|
10
|
+
jquery.anythingslider.video.js
|
11
|
+
jquery.easing.1.2.js
|
12
|
+
swfobject.js
|
13
|
+
|
14
|
+
# Included Stylesheets
|
15
|
+
|
16
|
+
animate.css
|
17
|
+
anythingslider-ie.css
|
18
|
+
anythingslider.css
|
19
|
+
theme-construction.css
|
20
|
+
theme-cs-portfolio.css
|
21
|
+
theme-metallic.css
|
22
|
+
theme-minimalist-round.css
|
23
|
+
theme-minimalist-square.css
|
24
|
+
|
25
|
+
### Installation
|
26
|
+
|
27
|
+
This gem should work out of the box. All you have to do is add the gem to your Gemfile:
|
28
|
+
|
29
|
+
gem 'anything_slider_rails'
|
30
|
+
|
31
|
+
Then bundle install or update (depending on if you want to upgrade an older version of this gem).
|
32
|
+
|
33
|
+
bundle install
|
34
|
+
bundle update
|
35
|
+
|
36
|
+
In your assets/javascripts/application.js, you will need to add d3 to your manifest:
|
37
|
+
|
38
|
+
//= require jquery
|
39
|
+
.
|
40
|
+
.
|
41
|
+
//= require jquery.anythingslider
|
42
|
+
|
data/vendor/.DS_Store
ADDED
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
@@ -0,0 +1,188 @@
|
|
1
|
+
/*
|
2
|
+
* AnythingSlider Slide FX 1.6 for AnythingSlider v1.7.11+
|
3
|
+
* By Rob Garrison (aka Mottie & Fudgey)
|
4
|
+
* Dual licensed under the MIT and GPL licenses.
|
5
|
+
*/
|
6
|
+
(function($) {
|
7
|
+
$.fn.anythingSliderFx = function(effects, options){
|
8
|
+
|
9
|
+
// variable sizes shouldn't matter - it's just to get an idea to get the elements out of view
|
10
|
+
var wrap = $(this).closest('.anythingSlider'),
|
11
|
+
sliderWidth = wrap.width(),
|
12
|
+
sliderHeight = wrap.height(),
|
13
|
+
getBaseFx = function(s){
|
14
|
+
var size = s, size2;
|
15
|
+
// allow for start and end sizes/dimensions
|
16
|
+
if (s && typeof s === 'string' && s.indexOf(',') > 0) {
|
17
|
+
s = s.split(',');
|
18
|
+
size = $.trim(s[0]); size2 = $.trim(s[1]);
|
19
|
+
}
|
20
|
+
return {
|
21
|
+
// 'name' : [{ inFx: {effects}, { outFx: {effects} }, selector: []]
|
22
|
+
'top' : [{ inFx: { top: 0 }, outFx: { top: '-' + (size || sliderHeight) } }],
|
23
|
+
'bottom' : [{ inFx: { top: 0 }, outFx: { top: (size || sliderHeight) } }],
|
24
|
+
'left' : [{ inFx: { left: 0 }, outFx: { left: '-' + (size || sliderWidth) } }],
|
25
|
+
'right' : [{ inFx: { left: 0 }, outFx: { left: (size || sliderWidth) } }],
|
26
|
+
'fade' : [{ inFx: { opacity: size || 1 }, outFx: { opacity: 0 } }],
|
27
|
+
'expand' : [{ inFx: { width: size2 || '100%', height: size2 || '100%', top: '0%', left: '0%' } , outFx: { width: (size || '10%'), height: (size || '10%'), top: '50%', left: '50%' } }],
|
28
|
+
'grow' : [{ inFx: { top: 0, fontSize: size || '16px', opacity : 1 }, outFx: { top: '-200px', fontSize: size2 || '80px', opacity: 0 } }],
|
29
|
+
'listLR' : [{ inFx: { left: 0, opacity: 1 }, outFx: [{ left: (size || sliderWidth), opacity: 0 }, { left: '-' + (size || sliderWidth), opacity: 0 }], selector: [':odd', ':even'] }],
|
30
|
+
'listRL' : [{ inFx: { left: 0, opacity: 1 }, outFx: [{ left: (size || sliderWidth), opacity: 0 }, { left: '-' + (size || sliderWidth), opacity: 0 }], selector: [':even', ':odd'] }],
|
31
|
+
|
32
|
+
'caption-Top' : [{ inFx: { top: 0, opacity: 0.8 }, outFx: { top: ( '-' + size || -50 ), opacity: 0 } }],
|
33
|
+
'caption-Right' : [{ inFx: { right: 0, opacity: 0.8 }, outFx: { right: ( '-' + size || -150 ), opacity: 0 } }],
|
34
|
+
'caption-Bottom' : [{ inFx: { bottom: 0, opacity: 0.8 }, outFx: { bottom: ( '-' + size || -50 ), opacity: 0 } }],
|
35
|
+
'caption-Left' : [{ inFx: { left: 0, opacity: 0.8 }, outFx: { left: ( '-' + size || -150 ), opacity: 0 } }]
|
36
|
+
};
|
37
|
+
};
|
38
|
+
|
39
|
+
return this.each(function(){
|
40
|
+
|
41
|
+
$(this).data('AnythingSlider').fx = effects; // store fx list to allow dynamic modification
|
42
|
+
|
43
|
+
var defaults = $.extend({
|
44
|
+
easing : 'swing', // Default FX easing
|
45
|
+
timeIn : 400, // Default time for in FX animation
|
46
|
+
timeOut : 350, // Default time for out FX animation - when using predefined FX, this number gets divided by 2
|
47
|
+
stopRepeat : false, // stops repeating FX animation when clicking on the same navigation tab
|
48
|
+
outFxBind : 'slide_init', // When outFx animations are called
|
49
|
+
inFxBind : 'slide_complete', // When inFx animations are called
|
50
|
+
dataAnimate: 'data-animate' // data attribute containing the animate.css class names to add for in and out fx
|
51
|
+
}, options),
|
52
|
+
|
53
|
+
baseFx = getBaseFx(), // get base FX with standard sizes
|
54
|
+
|
55
|
+
// Animate FX
|
56
|
+
animateFx = function(el, opt, isOut, time){
|
57
|
+
if (el.length === 0 || typeof opt === 'undefined') { return; } // no fx
|
58
|
+
var o = opt[0] || opt,
|
59
|
+
s = o[1] || '',
|
60
|
+
// time needs to be a number, not a string
|
61
|
+
t = time || parseInt( ((s === '') ? o.duration : o[0].duration), 10);
|
62
|
+
if (isOut) {
|
63
|
+
// don't change caption position from absolute
|
64
|
+
if (el.css('position') !== 'absolute') { el.css({ position : 'relative' }); }
|
65
|
+
el.stop();
|
66
|
+
// multiple selectors for out animation
|
67
|
+
if (s !== ''){
|
68
|
+
el.filter(opt[1][0]).animate(o[0], { queue : false, duration : t, easing : o[0].easing });
|
69
|
+
el.filter(opt[1][1]).animate(s, { queue : true, duration : t, easing : o[0].easing });
|
70
|
+
return;
|
71
|
+
}
|
72
|
+
}
|
73
|
+
// animation for no extra selectors
|
74
|
+
el.animate(o, { queue : true, duration : t, easing : o.easing });
|
75
|
+
},
|
76
|
+
|
77
|
+
// Extract FX
|
78
|
+
getFx = function(opts, isOut){
|
79
|
+
// example: '.textSlide h3' : [ 'top fade', '200px' '500', 'easeOutBounce' ],
|
80
|
+
var tmp, bfx2,
|
81
|
+
ex = (isOut) ? 'outFx' : 'inFx', // object key
|
82
|
+
bfx = {}, // base effects
|
83
|
+
time = (isOut) ? defaults.timeOut : defaults.timeIn, // default duration settings
|
84
|
+
// split & process multiple built-in effects (e.g. 'top fade')
|
85
|
+
fx = $.trim(opts[0].replace(/\s+/g,' ')).split(' ');
|
86
|
+
|
87
|
+
// look for multiple selectors in the Out effects
|
88
|
+
if (isOut && fx.length === 1 && baseFx.hasOwnProperty(fx) && typeof (baseFx[fx][0].selector) !== 'undefined') {
|
89
|
+
bfx2 = baseFx[fx][0].outFx;
|
90
|
+
// add time and easing to first set, the animation will use it for both
|
91
|
+
bfx2[0].duration = opts[2] || defaults.timeOut;
|
92
|
+
bfx2[0].easing = opts[3] || defaults.easing;
|
93
|
+
return [bfx2, baseFx[fx][0].selector || [] ];
|
94
|
+
}
|
95
|
+
|
96
|
+
// combine base effects
|
97
|
+
$.each(fx, function(i,f){
|
98
|
+
// check if built-in effect exists
|
99
|
+
if (baseFx.hasOwnProperty(f)) {
|
100
|
+
var t = typeof opts[1] === 'undefined' || opts[1] === '',
|
101
|
+
// if size option is defined, get new base fx
|
102
|
+
tmp = (t) ? baseFx : getBaseFx(opts[1]);
|
103
|
+
$.extend(true, bfx, tmp[f][0][ex]);
|
104
|
+
t = opts[2] || bfx.duration || time; // user set time || built-in time || default time set above
|
105
|
+
bfx.duration = (isOut) ? t/2 : t; // out animation time is 1/2 of in time for predefined fx only
|
106
|
+
bfx.easing = isNaN(opts[3]) ? opts[3] || defaults.easing : opts[4] || defaults.easing;
|
107
|
+
}
|
108
|
+
});
|
109
|
+
return [bfx];
|
110
|
+
},
|
111
|
+
|
112
|
+
base = $(this)
|
113
|
+
|
114
|
+
// bind events for "OUT" effects - occur when leaving a page
|
115
|
+
.bind(defaults.outFxBind, function(e, slider){
|
116
|
+
if (defaults.stopRepeat && slider.$lastPage[0] === slider.$targetPage[0]) { return; }
|
117
|
+
var el, elOut, time, page = slider.$lastPage.add( slider.$items.eq(slider.exactPage) ).add( slider.$targetPage ),
|
118
|
+
FX = slider.fx; // allow dynamically added FX
|
119
|
+
if (slider.exactPage === 0) { page = page.add( slider.$items.eq( slider.pages ) ); } // add last (non-cloned) page if on first
|
120
|
+
if (slider.options.animationTime < defaults.timeOut) {
|
121
|
+
time = slider.options.animationTime || defaults.timeOut;
|
122
|
+
}
|
123
|
+
page = page.find('*').andSelf(); // include the panel in the selectors
|
124
|
+
for (el in FX) {
|
125
|
+
if (el === 'outFx') {
|
126
|
+
// process "out" custom effects
|
127
|
+
for (elOut in FX.outFx) {
|
128
|
+
// animate current/last slide, unless it's a clone, then effect the original
|
129
|
+
if (page.filter(elOut).length) { animateFx( page.filter(elOut), FX.outFx[elOut], true); }
|
130
|
+
}
|
131
|
+
} else if (el !== 'inFx') {
|
132
|
+
// Use built-in effects
|
133
|
+
if ($.isArray(FX[el]) && page.filter(el).length) {
|
134
|
+
animateFx( page.filter(el), getFx(FX[el],true), true, time);
|
135
|
+
}
|
136
|
+
}
|
137
|
+
}
|
138
|
+
el = page.filter('[' + defaults.dataAnimate + ']');
|
139
|
+
if (el.length) {
|
140
|
+
el.each(function(){
|
141
|
+
FX = $(this).attr(defaults.dataAnimate).split(',');
|
142
|
+
if (FX[0] !== '') {
|
143
|
+
$(this)
|
144
|
+
.removeClass(FX[0])
|
145
|
+
.addClass(FX[1] || FX[0]);
|
146
|
+
}
|
147
|
+
});
|
148
|
+
}
|
149
|
+
})
|
150
|
+
|
151
|
+
// bind events for "IN" effects - occurs on target page
|
152
|
+
.bind(defaults.inFxBind, function(e, slider){
|
153
|
+
if (defaults.stopRepeat && slider.$lastPage[0] === slider.$targetPage[0]) { return; }
|
154
|
+
var el, elIn, page = slider.$currentPage.add( slider.$items.eq(slider.exactPage) ),
|
155
|
+
FX = slider.fx; // allow dynamically added FX
|
156
|
+
page = page.find('*').andSelf(); // include the panel in the selectors
|
157
|
+
for (el in FX) {
|
158
|
+
if (el === 'inFx') {
|
159
|
+
// process "in" custom effects
|
160
|
+
for (elIn in FX.inFx) {
|
161
|
+
// animate current page
|
162
|
+
if (page.filter(elIn).length) { animateFx( page.filter(elIn), FX.inFx[elIn], false); }
|
163
|
+
}
|
164
|
+
// Use built-in effects
|
165
|
+
} else if (el !== 'outFx' && $.isArray(FX[el]) && page.filter(el).length) {
|
166
|
+
animateFx( page.filter(el), getFx(FX[el],false), false);
|
167
|
+
}
|
168
|
+
}
|
169
|
+
el = page.filter('[' + defaults.dataAnimate + ']');
|
170
|
+
if (el.length) {
|
171
|
+
el.each(function(){
|
172
|
+
FX = $(this).attr(defaults.dataAnimate).split(',');
|
173
|
+
if (FX[0] !== '') {
|
174
|
+
$(this)
|
175
|
+
.removeClass(FX[1] || FX[0])
|
176
|
+
.addClass(FX[0]);
|
177
|
+
}
|
178
|
+
});
|
179
|
+
}
|
180
|
+
})
|
181
|
+
.data('AnythingSlider');
|
182
|
+
|
183
|
+
// call gotoPage to trigger intro animation
|
184
|
+
$(window).load(function(){ base.gotoPage(base.currentPage, base.playing); });
|
185
|
+
|
186
|
+
});
|
187
|
+
};
|
188
|
+
})(jQuery);
|