zurb-foundation 0.0.5 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.markdown +56 -9
- data/app/assets/images/foundation/misc/button-gloss.png +0 -0
- data/app/assets/images/foundation/misc/button-overlay.png +0 -0
- data/app/assets/images/foundation/misc/custom-form-sprites.png +0 -0
- data/app/assets/images/foundation/misc/input-bg.png +0 -0
- data/app/assets/images/foundation/misc/modal-gloss.png +0 -0
- data/app/assets/images/foundation/misc/table-sorter.png +0 -0
- data/app/assets/images/foundation/orbit/bullets.jpg +0 -0
- data/app/assets/images/foundation/orbit/left-arrow.png +0 -0
- data/app/assets/images/foundation/orbit/loading.gif +0 -0
- data/app/assets/images/foundation/orbit/mask-black.png +0 -0
- data/app/assets/images/foundation/orbit/pause-black.png +0 -0
- data/app/assets/images/foundation/orbit/right-arrow.png +0 -0
- data/app/assets/images/foundation/orbit/rotator-black.png +0 -0
- data/app/assets/images/foundation/orbit/timer-black.png +0 -0
- data/app/assets/javascripts/foundation/app.js +3 -23
- data/app/assets/javascripts/foundation/forms.jquery.js +0 -0
- data/app/assets/javascripts/foundation/index.js +6 -6
- data/app/assets/javascripts/foundation/jquery.customforms.js +0 -0
- data/app/assets/javascripts/foundation/jquery.orbit-1.3.0.js +596 -0
- data/app/assets/javascripts/foundation/jquery.placeholder.min.js.erb +2 -0
- data/app/assets/javascripts/foundation/jquery.reveal.js +0 -0
- data/app/assets/stylesheets/foundation/forms.css.scss.erb +0 -0
- data/app/assets/stylesheets/foundation/globals.css.scss.erb +49 -27
- data/app/assets/stylesheets/foundation/index.css +6 -8
- data/app/assets/stylesheets/foundation/mobile.css.scss.erb +21 -21
- data/app/assets/stylesheets/foundation/{orbit-1.2.3.css.scss.erb → orbit.css.scss.erb} +17 -8
- data/app/assets/stylesheets/foundation/ui.css.scss.erb +0 -0
- data/foundation.gemspec +1 -0
- data/lib/foundation/generators/install_generator.rb +3 -3
- data/lib/foundation/version.rb +1 -1
- metadata +20 -14
- data/app/assets/javascripts/foundation/jquery.orbit-1.2.3.js +0 -401
- data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.eot +0 -0
- data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.svg +0 -223
- data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.ttf +0 -0
- data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.woff +0 -0
- data/app/assets/stylesheets/foundation/fonts/league/SIL Open Font License 1.1.txt +0 -91
- data/app/assets/stylesheets/foundation/fonts/league/font.css.erb +0 -18
@@ -0,0 +1,2 @@
|
|
1
|
+
/*! http://mths.be/placeholder v1.8.5 by @mathias */
|
2
|
+
(function(g,a,$){var f='placeholder' in a.createElement('input'),b='placeholder' in a.createElement('textarea');if(f&&b){$.fn.placeholder=function(){return this};$.fn.placeholder.input=$.fn.placeholder.textarea=true}else{$.fn.placeholder=function(){return this.filter((f?'textarea':':input')+'[placeholder]').bind('focus.placeholder',c).bind('blur.placeholder',e).trigger('blur.placeholder').end()};$.fn.placeholder.input=f;$.fn.placeholder.textarea=b;$(function(){$('form').bind('submit.placeholder',function(){var h=$('.placeholder',this).each(c);setTimeout(function(){h.each(e)},10)})});$(g).bind('unload.placeholder',function(){$('.placeholder').val('')})}function d(i){var h={},j=/^jQuery\d+$/;$.each(i.attributes,function(l,k){if(k.specified&&!j.test(k.name)){h[k.name]=k.value}});return h}function c(){var h=$(this);if(h.val()===h.attr('placeholder')&&h.hasClass('placeholder')){if(h.data('placeholder-password')){h.hide().next().show().focus().attr('id',h.removeAttr('id').data('placeholder-id'))}else{h.val('').removeClass('placeholder')}}}function e(){var l,k=$(this),h=k,j=this.id;if(k.val()===''){if(k.is(':password')){if(!k.data('placeholder-textinput')){try{l=k.clone().attr({type:'text'})}catch(i){l=$('<input>').attr($.extend(d(this),{type:'text'}))}l.removeAttr('name').data('placeholder-password',true).data('placeholder-id',j).bind('focus.placeholder',c);k.data('placeholder-textinput',l).data('placeholder-id',j).before(l)}k=k.removeAttr('id').hide().prev().attr('id',j).show()}k.addClass('placeholder').val(k.attr('placeholder'))}else{k.removeClass('placeholder')}}}(this,document,jQuery));
|
File without changes
|
File without changes
|
@@ -18,10 +18,12 @@
|
|
18
18
|
:: Global Reset & Standards
|
19
19
|
-------------------------------------------------- */
|
20
20
|
|
21
|
-
/*
|
22
|
-
|
23
|
-
|
24
|
-
|
21
|
+
/*
|
22
|
+
Eric Meyer's CSS Reset
|
23
|
+
http://meyerweb.com/eric/tools/css/reset/
|
24
|
+
v2.0 | 20110126
|
25
|
+
License: none (public domain)
|
26
|
+
*/
|
25
27
|
|
26
28
|
html, body, div, span, applet, object, iframe,
|
27
29
|
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
@@ -32,33 +34,46 @@
|
|
32
34
|
dl, dt, dd, ol, ul, li,
|
33
35
|
fieldset, form, label, legend,
|
34
36
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
35
|
-
article, aside, canvas, details,
|
36
|
-
|
37
|
-
|
38
|
-
|
37
|
+
article, aside, canvas, details, embed,
|
38
|
+
figure, figcaption, footer, header, hgroup,
|
39
|
+
menu, nav, output, ruby, section, summary,
|
40
|
+
time, mark, audio, video {
|
41
|
+
margin: 0;
|
42
|
+
padding: 0;
|
43
|
+
border: 0;
|
44
|
+
font: inherit;
|
45
|
+
vertical-align: baseline;
|
46
|
+
}
|
47
|
+
html {
|
48
|
+
font-size: 62.5%;
|
39
49
|
}
|
40
|
-
html { font-size: 62.5%; -webkit-text-size-adjust:none; -ms-text-size-adjust:none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
|
41
|
-
|
42
50
|
/* HTML5 display-role reset for older browsers */
|
43
51
|
article, aside, details, figcaption, figure,
|
44
|
-
footer, header, hgroup, menu, nav, section {
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
52
|
+
footer, header, hgroup, menu, nav, section {
|
53
|
+
display: block;
|
54
|
+
}
|
55
|
+
body {
|
56
|
+
line-height: 1;
|
57
|
+
}
|
58
|
+
ol, ul {
|
59
|
+
list-style: none;
|
60
|
+
}
|
61
|
+
blockquote, q {
|
62
|
+
quotes: none;
|
63
|
+
}
|
51
64
|
blockquote:before, blockquote:after,
|
52
|
-
q:before, q:after {
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
65
|
+
q:before, q:after {
|
66
|
+
content: '';
|
67
|
+
content: none;
|
68
|
+
}
|
69
|
+
table {
|
70
|
+
border-collapse: collapse;
|
71
|
+
border-spacing: 0;
|
72
|
+
}
|
58
73
|
|
59
74
|
|
60
75
|
|
61
|
-
body { background: #fff; font-family: "
|
76
|
+
body { background: #fff; font-family: "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, "Lucida Grande", sans-serif; font-size: 13px; line-height: 18px; color: #555; position: relative; -webkit-font-smoothing: antialiased; }
|
62
77
|
|
63
78
|
|
64
79
|
/* --------------------------------------------------
|
@@ -77,7 +92,7 @@
|
|
77
92
|
|
78
93
|
p { line-height: 17px; margin: 0 0 18px; }
|
79
94
|
p img { margin: 0; }
|
80
|
-
p.lead { font-size:
|
95
|
+
p.lead { font-size: 18px; font-size: 1.8rem; line-height: 24px; }
|
81
96
|
|
82
97
|
/* Mobile */
|
83
98
|
|
@@ -96,7 +111,7 @@
|
|
96
111
|
blockquote { margin: 0 0 18px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; }
|
97
112
|
blockquote cite { display: block; font-size: 12px; font-size: 1.2rem; color: #555; }
|
98
113
|
blockquote cite:before { content: "\2014 \0020"; }
|
99
|
-
blockquote cite a, blockquote cite a:visited
|
114
|
+
blockquote cite a, blockquote cite a:visited { color: #555; }
|
100
115
|
|
101
116
|
hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 12px 0 18px; height: 0; }
|
102
117
|
|
@@ -215,11 +230,18 @@
|
|
215
230
|
|
216
231
|
|
217
232
|
/* Clear the columns automagically */
|
218
|
-
|
233
|
+
/*
|
234
|
+
.row:after, .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
|
219
235
|
.row:last-child:after { content: ""; }
|
220
236
|
* html .row, * html .clearfix { height: 1%; }
|
221
237
|
.row, .clearfix { display: inline-block; }
|
222
238
|
.row, .clearfix { display: block; }
|
239
|
+
*/
|
240
|
+
|
241
|
+
/* Testing Nicolas Gallagher's micro clearfix */
|
242
|
+
.row:before, .row:after, .clearfix:before, .clearfix:after { content:""; display:table; }
|
243
|
+
.row:after, .clearfix:after { clear: both; }
|
244
|
+
.row, .clearfix { zoom: 1; }
|
223
245
|
|
224
246
|
|
225
247
|
|
@@ -1,10 +1,8 @@
|
|
1
1
|
/*
|
2
|
-
*= require ./globals
|
3
|
-
*= require ./ui
|
4
|
-
*= require ./forms
|
5
|
-
*= require ./orbit
|
6
|
-
*= require ./reveal
|
7
|
-
*= require ./
|
8
|
-
*= require ./mobile
|
9
|
-
*= require ./fonts/league/font
|
2
|
+
*= require ./globals.css
|
3
|
+
*= require ./ui.css
|
4
|
+
*= require ./forms.css
|
5
|
+
*= require ./orbit.css
|
6
|
+
*= require ./reveal.css
|
7
|
+
*= require ./mobile.css
|
10
8
|
*/
|
@@ -3,20 +3,20 @@
|
|
3
3
|
-------------------------------------------------- */
|
4
4
|
|
5
5
|
/* Tablet screens */
|
6
|
-
@media
|
6
|
+
@media only screen and (device-width: 768px), (device-width: 800px) {
|
7
7
|
/* Currently unused */
|
8
8
|
}
|
9
9
|
|
10
10
|
|
11
11
|
/* Mobile */
|
12
|
-
@media
|
12
|
+
@media only screen and (max-width: 767px) {
|
13
13
|
body { -webkit-text-size-adjust: none; }
|
14
14
|
|
15
15
|
.row, body, .container { width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; }
|
16
16
|
.row .row .column, .row .row .columns { padding: 0; }
|
17
17
|
.column, .columns { width: auto !important; float: none; margin-left: 0px; margin-right: 0px; padding-left: 20px; padding-right: 20px; }
|
18
18
|
.column:last-child, .columns:last-child { margin-right: 0px; }
|
19
|
-
.offset-by-one, .offset-by-two, .offset-by-three, .offset-by-four, .offset-by-five, .offset-by-six, .offset-by-seven, .offset-by-eight, .offset-by-nine, .offset-by-ten, .offset-by-eleven
|
19
|
+
.offset-by-one, .offset-by-two, .offset-by-three, .offset-by-four, .offset-by-five, .offset-by-six, .offset-by-seven, .offset-by-eight, .offset-by-nine, .offset-by-ten, .offset-by-eleven { margin-left: 0% !important; }
|
20
20
|
}
|
21
21
|
|
22
22
|
|
@@ -24,7 +24,7 @@
|
|
24
24
|
:: Block Grids
|
25
25
|
-------------------------------------------------- */
|
26
26
|
|
27
|
-
@media
|
27
|
+
@media only screen and (max-width: 767px) {
|
28
28
|
.block-grid.mobile li { float: none; width: 100%; }
|
29
29
|
}
|
30
30
|
|
@@ -36,33 +36,33 @@
|
|
36
36
|
|
37
37
|
|
38
38
|
.show-on-phones { display: none !important; }
|
39
|
-
.show-on-
|
40
|
-
.show-on-
|
39
|
+
.show-on-tablets { display: none !important; }
|
40
|
+
.show-on-desktops { display: block; }
|
41
41
|
|
42
42
|
.hide-on-phones { display: block !important; }
|
43
|
-
.hide-on-
|
44
|
-
.hide-on-
|
43
|
+
.hide-on-tablets { display: block !important; }
|
44
|
+
.hide-on-desktops { display: none; }
|
45
45
|
|
46
46
|
|
47
|
-
@media
|
47
|
+
@media only screen and (device-width: 768px), only screen and (device-width: 1280px), only screen and (device-width: 800px) {
|
48
48
|
.hide-on-phones { display: block !important; }
|
49
|
-
.hide-on-
|
50
|
-
.hide-on-
|
49
|
+
.hide-on-tablets { display: none !important; }
|
50
|
+
.hide-on-desktops { display: block !important; }
|
51
51
|
|
52
52
|
.show-on-phones { display: none !important; }
|
53
|
-
.show-on-
|
54
|
-
.show-on-
|
53
|
+
.show-on-tablets { display: block !important; }
|
54
|
+
.show-on-desktops { display: none !important; }
|
55
55
|
}
|
56
56
|
|
57
57
|
|
58
|
-
@media
|
58
|
+
@media only screen and (max-width: 767px) {
|
59
59
|
.hide-on-phones { display: none !important; }
|
60
|
-
.hide-on-
|
61
|
-
.hide-on-
|
60
|
+
.hide-on-tablets { display: block !important; }
|
61
|
+
.hide-on-desktops { display: block !important; }
|
62
62
|
|
63
63
|
.show-on-phones { display: block !important; }
|
64
|
-
.show-on-
|
65
|
-
.show-on-
|
64
|
+
.show-on-tablets { display: none !important; }
|
65
|
+
.show-on-desktops { display: none !important; }
|
66
66
|
}
|
67
67
|
|
68
68
|
|
@@ -71,7 +71,7 @@
|
|
71
71
|
---------------------------------------------------*/
|
72
72
|
|
73
73
|
|
74
|
-
@media
|
74
|
+
@media only screen and (max-width: 767px) {
|
75
75
|
input.input-text, input.input-text.oversize, textarea,
|
76
76
|
form.nice input.input-text, form.nice input.input-text.oversize, form.nice textarea { display: block; width: 96%; padding: 6px 2% 4px; font-size: 18px; }
|
77
77
|
form.nice input.input-text, form.nice input.input-text.oversize, form.nice textarea { -webkit-border-radius: 2px; -moz-border-radius: 2px; }
|
@@ -87,14 +87,14 @@
|
|
87
87
|
---------------------------------------------------*/
|
88
88
|
|
89
89
|
/* Buttons */
|
90
|
-
@media
|
90
|
+
@media only screen and (max-width: 767px) {
|
91
91
|
.button { display: block; }
|
92
92
|
button.button { width: 100%; padding-left: 0px; padding-right: 0px; }
|
93
93
|
}
|
94
94
|
|
95
95
|
/* Tabs */
|
96
96
|
|
97
|
-
@media
|
97
|
+
@media only screen and (max-width: 767px) {
|
98
98
|
dl.tabs.mobile, dl.nice.tabs.mobile { width: auto; margin: 20px -20px 40px; height: auto; }
|
99
99
|
dl.tabs.mobile dt, dl.tabs.mobile dd, dl.nice.tabs.mobile dt, dl.nice.tabs.mobile dd { float: none; height: auto; }
|
100
100
|
|
@@ -8,14 +8,14 @@
|
|
8
8
|
|
9
9
|
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
|
10
10
|
================================================== */
|
11
|
-
#
|
12
|
-
width:
|
13
|
-
height:
|
14
|
-
background: #
|
11
|
+
#caseStudies {
|
12
|
+
width: 1000px;
|
13
|
+
height: 210px;
|
14
|
+
background: #fff url(<%= asset_path "foundation/orbit/loading.gif" %>) no-repeat center center;
|
15
15
|
overflow: hidden; }
|
16
|
-
#
|
17
|
-
#
|
18
|
-
#
|
16
|
+
#caseStudies>img,
|
17
|
+
#caseStudies>div,
|
18
|
+
#caseStudies>a { display: none; }
|
19
19
|
|
20
20
|
|
21
21
|
|
@@ -198,4 +198,13 @@ div.slider-nav span.left {
|
|
198
198
|
|
199
199
|
.orbit-bullets li.active.has-thumb {
|
200
200
|
background-position: 0 0;
|
201
|
-
border-top: 2px solid #000; }
|
201
|
+
border-top: 2px solid #000; }
|
202
|
+
|
203
|
+
/* FLUID LAYOUT
|
204
|
+
================================================== */
|
205
|
+
.orbit .fluid-placeholder {
|
206
|
+
visibility: hidden;
|
207
|
+
position: static;
|
208
|
+
display: block;
|
209
|
+
width: 100%;
|
210
|
+
}
|
File without changes
|
data/foundation.gemspec
CHANGED
@@ -5,9 +5,9 @@ module Foundation
|
|
5
5
|
class InstallGenerator < Rails::Generators::Base
|
6
6
|
source_root File.join(File.dirname(__FILE__), 'templates')
|
7
7
|
|
8
|
-
def
|
9
|
-
|
10
|
-
|
8
|
+
def add_assets
|
9
|
+
insert_into_file "app/assets/javascripts/application.js", "//= require foundation\n", :after => "jquery_ujs\n"
|
10
|
+
insert_into_file "app/assets/stylesheets/application.css", " *= require foundation\n", :after => "require_self\n"
|
11
11
|
end
|
12
12
|
end
|
13
13
|
end
|
data/lib/foundation/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: zurb-foundation
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0
|
4
|
+
version: 1.0.0
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,12 +9,12 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2011-10-
|
12
|
+
date: 2011-10-18 00:00:00.000000000 -07:00
|
13
13
|
default_executable:
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: rails
|
17
|
-
requirement: &
|
17
|
+
requirement: &2153527300 !ruby/object:Gem::Requirement
|
18
18
|
none: false
|
19
19
|
requirements:
|
20
20
|
- - ~>
|
@@ -22,7 +22,18 @@ dependencies:
|
|
22
22
|
version: 3.1.0
|
23
23
|
type: :runtime
|
24
24
|
prerelease: false
|
25
|
-
version_requirements: *
|
25
|
+
version_requirements: *2153527300
|
26
|
+
- !ruby/object:Gem::Dependency
|
27
|
+
name: jquery-rails
|
28
|
+
requirement: &2153526720 !ruby/object:Gem::Requirement
|
29
|
+
none: false
|
30
|
+
requirements:
|
31
|
+
- - ~>
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '1.0'
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: *2153526720
|
26
37
|
description: An easy to use, powerful, and flexible framework for building prototypes
|
27
38
|
and production code on any kind of device.
|
28
39
|
email:
|
@@ -53,19 +64,14 @@ files:
|
|
53
64
|
- app/assets/javascripts/foundation/forms.jquery.js
|
54
65
|
- app/assets/javascripts/foundation/index.js
|
55
66
|
- app/assets/javascripts/foundation/jquery.customforms.js
|
56
|
-
- app/assets/javascripts/foundation/jquery.orbit-1.
|
67
|
+
- app/assets/javascripts/foundation/jquery.orbit-1.3.0.js
|
68
|
+
- app/assets/javascripts/foundation/jquery.placeholder.min.js.erb
|
57
69
|
- app/assets/javascripts/foundation/jquery.reveal.js
|
58
|
-
- app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.eot
|
59
|
-
- app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.svg
|
60
|
-
- app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.ttf
|
61
|
-
- app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.woff
|
62
|
-
- app/assets/stylesheets/foundation/fonts/league/SIL Open Font License 1.1.txt
|
63
|
-
- app/assets/stylesheets/foundation/fonts/league/font.css.erb
|
64
70
|
- app/assets/stylesheets/foundation/forms.css.scss.erb
|
65
71
|
- app/assets/stylesheets/foundation/globals.css.scss.erb
|
66
72
|
- app/assets/stylesheets/foundation/index.css
|
67
73
|
- app/assets/stylesheets/foundation/mobile.css.scss.erb
|
68
|
-
- app/assets/stylesheets/foundation/orbit
|
74
|
+
- app/assets/stylesheets/foundation/orbit.css.scss.erb
|
69
75
|
- app/assets/stylesheets/foundation/reveal.css.scss.erb
|
70
76
|
- app/assets/stylesheets/foundation/ui.css.scss.erb
|
71
77
|
- foundation.gemspec
|
@@ -93,7 +99,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
93
99
|
version: '0'
|
94
100
|
segments:
|
95
101
|
- 0
|
96
|
-
hash:
|
102
|
+
hash: 404425595582427159
|
97
103
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
98
104
|
none: false
|
99
105
|
requirements:
|
@@ -102,7 +108,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
102
108
|
version: '0'
|
103
109
|
segments:
|
104
110
|
- 0
|
105
|
-
hash:
|
111
|
+
hash: 404425595582427159
|
106
112
|
requirements: []
|
107
113
|
rubyforge_project: foundation
|
108
114
|
rubygems_version: 1.6.2
|
@@ -1,401 +0,0 @@
|
|
1
|
-
/*
|
2
|
-
* jQuery Orbit Plugin 1.2.3
|
3
|
-
* www.ZURB.com/playground
|
4
|
-
* Copyright 2010, ZURB
|
5
|
-
* Free to use under the MIT license.
|
6
|
-
* http://www.opensource.org/licenses/mit-license.php
|
7
|
-
*/
|
8
|
-
|
9
|
-
|
10
|
-
(function($) {
|
11
|
-
|
12
|
-
$.fn.orbit = function(options) {
|
13
|
-
|
14
|
-
//Defaults to extend options
|
15
|
-
var defaults = {
|
16
|
-
animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push
|
17
|
-
animationSpeed: 600, // how fast animtions are
|
18
|
-
timer: true, // true or false to have the timer
|
19
|
-
advanceSpeed: 4000, // if timer is enabled, time between transitions
|
20
|
-
pauseOnHover: false, // if you hover pauses the slider
|
21
|
-
startClockOnMouseOut: false, // if clock should start on MouseOut
|
22
|
-
startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again
|
23
|
-
directionalNav: true, // manual advancing directional navs
|
24
|
-
captions: true, // do you want captions?
|
25
|
-
captionAnimation: 'fade', // fade, slideOpen, none
|
26
|
-
captionAnimationSpeed: 600, // if so how quickly should they animate in
|
27
|
-
bullets: false, // true or false to activate the bullet navigation
|
28
|
-
bulletThumbs: false, // thumbnails for the bullets
|
29
|
-
bulletThumbLocation: '', // location from this file where thumbs will be
|
30
|
-
afterSlideChange: function(){} // empty function
|
31
|
-
};
|
32
|
-
|
33
|
-
//Extend those options
|
34
|
-
var options = $.extend(defaults, options);
|
35
|
-
|
36
|
-
return this.each(function() {
|
37
|
-
|
38
|
-
// ==============
|
39
|
-
// ! SETUP
|
40
|
-
// ==============
|
41
|
-
|
42
|
-
//Global Variables
|
43
|
-
var activeSlide = 0,
|
44
|
-
numberSlides = 0,
|
45
|
-
orbitWidth,
|
46
|
-
orbitHeight,
|
47
|
-
locked;
|
48
|
-
|
49
|
-
//Initialize
|
50
|
-
var orbit = $(this).addClass('orbit'),
|
51
|
-
orbitWrapper = orbit.wrap('<div class="orbit-wrapper" />').parent();
|
52
|
-
//orbit.add(orbitWidth).width('1px').height('1px');
|
53
|
-
|
54
|
-
//Collect all slides and set slider size of largest image
|
55
|
-
var slides = orbit.children('img, a, div');
|
56
|
-
slides.each(function() {
|
57
|
-
var _slide = $(this),
|
58
|
-
_slideWidth = _slide.width(),
|
59
|
-
_slideHeight = _slide.height();
|
60
|
-
if(_slideWidth > orbit.width()) {
|
61
|
-
orbit.add(orbitWrapper).width(_slideWidth);
|
62
|
-
orbitWidth = orbit.width();
|
63
|
-
}
|
64
|
-
if(_slideHeight > orbit.height()) {
|
65
|
-
orbit.add(orbitWrapper).height(_slideHeight);
|
66
|
-
orbitHeight = orbit.height();
|
67
|
-
}
|
68
|
-
numberSlides++;
|
69
|
-
});
|
70
|
-
|
71
|
-
//Animation locking functions
|
72
|
-
function unlock() {
|
73
|
-
locked = false;
|
74
|
-
}
|
75
|
-
function lock() {
|
76
|
-
locked = true;
|
77
|
-
}
|
78
|
-
|
79
|
-
//If there is only a single slide remove nav, timer and bullets
|
80
|
-
if(slides.length == 1) {
|
81
|
-
options.directionalNav = false;
|
82
|
-
options.timer = false;
|
83
|
-
options.bullets = false;
|
84
|
-
}
|
85
|
-
|
86
|
-
//Set initial front photo z-index and fades it in
|
87
|
-
slides.eq(activeSlide)
|
88
|
-
.css({"z-index" : 3})
|
89
|
-
.fadeIn(function() {
|
90
|
-
//brings in all other slides IF css declares a display: none
|
91
|
-
slides.css({"display":"block"})
|
92
|
-
});
|
93
|
-
|
94
|
-
// ==============
|
95
|
-
// ! TIMER
|
96
|
-
// ==============
|
97
|
-
|
98
|
-
//Timer Execution
|
99
|
-
function startClock() {
|
100
|
-
if(!options.timer || options.timer == 'false') {
|
101
|
-
return false;
|
102
|
-
//if timer is hidden, don't need to do crazy calculations
|
103
|
-
} else if(timer.is(':hidden')) {
|
104
|
-
clock = setInterval(function(e){
|
105
|
-
shift("next");
|
106
|
-
}, options.advanceSpeed);
|
107
|
-
//if timer is visible and working, let's do some math
|
108
|
-
} else {
|
109
|
-
timerRunning = true;
|
110
|
-
pause.removeClass('active')
|
111
|
-
clock = setInterval(function(e){
|
112
|
-
var degreeCSS = "rotate("+degrees+"deg)"
|
113
|
-
degrees += 2
|
114
|
-
rotator.css({
|
115
|
-
"-webkit-transform": degreeCSS,
|
116
|
-
"-moz-transform": degreeCSS,
|
117
|
-
"-o-transform": degreeCSS
|
118
|
-
});
|
119
|
-
if(degrees > 180) {
|
120
|
-
rotator.addClass('move');
|
121
|
-
mask.addClass('move');
|
122
|
-
}
|
123
|
-
if(degrees > 360) {
|
124
|
-
rotator.removeClass('move');
|
125
|
-
mask.removeClass('move');
|
126
|
-
degrees = 0;
|
127
|
-
shift("next");
|
128
|
-
}
|
129
|
-
}, options.advanceSpeed/180);
|
130
|
-
}
|
131
|
-
}
|
132
|
-
function stopClock() {
|
133
|
-
if(!options.timer || options.timer == 'false') { return false; } else {
|
134
|
-
timerRunning = false;
|
135
|
-
clearInterval(clock);
|
136
|
-
pause.addClass('active');
|
137
|
-
}
|
138
|
-
}
|
139
|
-
|
140
|
-
//Timer Setup
|
141
|
-
if(options.timer) {
|
142
|
-
var timerHTML = '<div class="timer"><span class="mask"><span class="rotator"></span></span><span class="pause"></span></div>'
|
143
|
-
orbitWrapper.append(timerHTML);
|
144
|
-
var timer = $('div.timer'),
|
145
|
-
timerRunning;
|
146
|
-
if(timer.length != 0) {
|
147
|
-
var rotator = $('div.timer span.rotator'),
|
148
|
-
mask = $('div.timer span.mask'),
|
149
|
-
pause = $('div.timer span.pause'),
|
150
|
-
degrees = 0,
|
151
|
-
clock;
|
152
|
-
startClock();
|
153
|
-
timer.click(function() {
|
154
|
-
if(!timerRunning) {
|
155
|
-
startClock();
|
156
|
-
} else {
|
157
|
-
stopClock();
|
158
|
-
}
|
159
|
-
});
|
160
|
-
if(options.startClockOnMouseOut){
|
161
|
-
var outTimer;
|
162
|
-
orbitWrapper.mouseleave(function() {
|
163
|
-
outTimer = setTimeout(function() {
|
164
|
-
if(!timerRunning){
|
165
|
-
startClock();
|
166
|
-
}
|
167
|
-
}, options.startClockOnMouseOutAfter)
|
168
|
-
})
|
169
|
-
orbitWrapper.mouseenter(function() {
|
170
|
-
clearTimeout(outTimer);
|
171
|
-
})
|
172
|
-
}
|
173
|
-
}
|
174
|
-
}
|
175
|
-
|
176
|
-
//Pause Timer on hover
|
177
|
-
if(options.pauseOnHover) {
|
178
|
-
orbitWrapper.mouseenter(function() {
|
179
|
-
stopClock();
|
180
|
-
});
|
181
|
-
}
|
182
|
-
|
183
|
-
// ==============
|
184
|
-
// ! CAPTIONS
|
185
|
-
// ==============
|
186
|
-
|
187
|
-
//Caption Setup
|
188
|
-
if(options.captions) {
|
189
|
-
var captionHTML = '<div class="orbit-caption"></div>';
|
190
|
-
orbitWrapper.append(captionHTML);
|
191
|
-
var caption = orbitWrapper.children('.orbit-caption');
|
192
|
-
setCaption();
|
193
|
-
}
|
194
|
-
|
195
|
-
//Caption Execution
|
196
|
-
function setCaption() {
|
197
|
-
if(!options.captions || options.captions =="false") {
|
198
|
-
return false;
|
199
|
-
} else {
|
200
|
-
var _captionLocation = slides.eq(activeSlide).data('caption'); //get ID from rel tag on image
|
201
|
-
_captionHTML = $(_captionLocation).html(); //get HTML from the matching HTML entity
|
202
|
-
//Set HTML for the caption if it exists
|
203
|
-
if(_captionHTML) {
|
204
|
-
caption
|
205
|
-
.attr('id',_captionLocation) // Add ID caption
|
206
|
-
.html(_captionHTML); // Change HTML in Caption
|
207
|
-
//Animations for Caption entrances
|
208
|
-
if(options.captionAnimation == 'none') {
|
209
|
-
caption.show();
|
210
|
-
}
|
211
|
-
if(options.captionAnimation == 'fade') {
|
212
|
-
caption.fadeIn(options.captionAnimationSpeed);
|
213
|
-
}
|
214
|
-
if(options.captionAnimation == 'slideOpen') {
|
215
|
-
caption.slideDown(options.captionAnimationSpeed);
|
216
|
-
}
|
217
|
-
} else {
|
218
|
-
//Animations for Caption exits
|
219
|
-
if(options.captionAnimation == 'none') {
|
220
|
-
caption.hide();
|
221
|
-
}
|
222
|
-
if(options.captionAnimation == 'fade') {
|
223
|
-
caption.fadeOut(options.captionAnimationSpeed);
|
224
|
-
}
|
225
|
-
if(options.captionAnimation == 'slideOpen') {
|
226
|
-
caption.slideUp(options.captionAnimationSpeed);
|
227
|
-
}
|
228
|
-
}
|
229
|
-
}
|
230
|
-
}
|
231
|
-
|
232
|
-
// ==================
|
233
|
-
// ! DIRECTIONAL NAV
|
234
|
-
// ==================
|
235
|
-
|
236
|
-
//DirectionalNav { rightButton --> shift("next"), leftButton --> shift("prev");
|
237
|
-
if(options.directionalNav) {
|
238
|
-
if(options.directionalNav == "false") { return false; }
|
239
|
-
var directionalNavHTML = '<div class="slider-nav"><span class="right">Right</span><span class="left">Left</span></div>';
|
240
|
-
orbitWrapper.append(directionalNavHTML);
|
241
|
-
var leftBtn = orbitWrapper.children('div.slider-nav').children('span.left'),
|
242
|
-
rightBtn = orbitWrapper.children('div.slider-nav').children('span.right');
|
243
|
-
leftBtn.click(function() {
|
244
|
-
stopClock();
|
245
|
-
shift("prev");
|
246
|
-
});
|
247
|
-
rightBtn.click(function() {
|
248
|
-
stopClock();
|
249
|
-
shift("next")
|
250
|
-
});
|
251
|
-
}
|
252
|
-
|
253
|
-
// ==================
|
254
|
-
// ! BULLET NAV
|
255
|
-
// ==================
|
256
|
-
|
257
|
-
//Bullet Nav Setup
|
258
|
-
if(options.bullets) {
|
259
|
-
var bulletHTML = '<ul class="orbit-bullets"></ul>';
|
260
|
-
orbitWrapper.append(bulletHTML);
|
261
|
-
var bullets = $('ul.orbit-bullets');
|
262
|
-
for(i=0; i<numberSlides; i++) {
|
263
|
-
var liMarkup = $('<li>'+(i+1)+'</li>');
|
264
|
-
if(options.bulletThumbs) {
|
265
|
-
var thumbName = slides.eq(i).data('thumb');
|
266
|
-
if(thumbName) {
|
267
|
-
var liMarkup = $('<li class="has-thumb">'+i+'</li>')
|
268
|
-
liMarkup.css({"background" : "url("+options.bulletThumbLocation+thumbName+") no-repeat"});
|
269
|
-
}
|
270
|
-
}
|
271
|
-
$('ul.orbit-bullets').append(liMarkup);
|
272
|
-
liMarkup.data('index',i);
|
273
|
-
liMarkup.click(function() {
|
274
|
-
stopClock();
|
275
|
-
shift($(this).data('index'));
|
276
|
-
});
|
277
|
-
}
|
278
|
-
setActiveBullet();
|
279
|
-
}
|
280
|
-
|
281
|
-
//Bullet Nav Execution
|
282
|
-
function setActiveBullet() {
|
283
|
-
if(!options.bullets) { return false; } else {
|
284
|
-
bullets.children('li').removeClass('active').eq(activeSlide).addClass('active');
|
285
|
-
}
|
286
|
-
}
|
287
|
-
|
288
|
-
// ====================
|
289
|
-
// ! SHIFT ANIMATIONS
|
290
|
-
// ====================
|
291
|
-
|
292
|
-
//Animating the shift!
|
293
|
-
function shift(direction) {
|
294
|
-
//remember previous activeSlide
|
295
|
-
var prevActiveSlide = activeSlide,
|
296
|
-
slideDirection = direction;
|
297
|
-
//exit function if bullet clicked is same as the current image
|
298
|
-
if(prevActiveSlide == slideDirection) { return false; }
|
299
|
-
//reset Z & Unlock
|
300
|
-
function resetAndUnlock() {
|
301
|
-
slides
|
302
|
-
.eq(prevActiveSlide)
|
303
|
-
.css({"z-index" : 1});
|
304
|
-
unlock();
|
305
|
-
options.afterSlideChange.call(this);
|
306
|
-
}
|
307
|
-
if(slides.length == "1") { return false; }
|
308
|
-
if(!locked) {
|
309
|
-
lock();
|
310
|
-
//deduce the proper activeImage
|
311
|
-
if(direction == "next") {
|
312
|
-
activeSlide++
|
313
|
-
if(activeSlide == numberSlides) {
|
314
|
-
activeSlide = 0;
|
315
|
-
}
|
316
|
-
} else if(direction == "prev") {
|
317
|
-
activeSlide--
|
318
|
-
if(activeSlide < 0) {
|
319
|
-
activeSlide = numberSlides-1;
|
320
|
-
}
|
321
|
-
} else {
|
322
|
-
activeSlide = direction;
|
323
|
-
if (prevActiveSlide < activeSlide) {
|
324
|
-
slideDirection = "next";
|
325
|
-
} else if (prevActiveSlide > activeSlide) {
|
326
|
-
slideDirection = "prev"
|
327
|
-
}
|
328
|
-
}
|
329
|
-
//set to correct bullet
|
330
|
-
setActiveBullet();
|
331
|
-
|
332
|
-
//set previous slide z-index to one below what new activeSlide will be
|
333
|
-
slides
|
334
|
-
.eq(prevActiveSlide)
|
335
|
-
.css({"z-index" : 2});
|
336
|
-
|
337
|
-
//fade
|
338
|
-
if(options.animation == "fade") {
|
339
|
-
slides
|
340
|
-
.eq(activeSlide)
|
341
|
-
.css({"opacity" : 0, "z-index" : 3})
|
342
|
-
.animate({"opacity" : 1}, options.animationSpeed, resetAndUnlock);
|
343
|
-
}
|
344
|
-
//horizontal-slide
|
345
|
-
if(options.animation == "horizontal-slide") {
|
346
|
-
if(slideDirection == "next") {
|
347
|
-
slides
|
348
|
-
.eq(activeSlide)
|
349
|
-
.css({"left": orbitWidth, "z-index" : 3})
|
350
|
-
.animate({"left" : 0}, options.animationSpeed, resetAndUnlock);
|
351
|
-
}
|
352
|
-
if(slideDirection == "prev") {
|
353
|
-
slides
|
354
|
-
.eq(activeSlide)
|
355
|
-
.css({"left": -orbitWidth, "z-index" : 3})
|
356
|
-
.animate({"left" : 0}, options.animationSpeed, resetAndUnlock);
|
357
|
-
}
|
358
|
-
}
|
359
|
-
//vertical-slide
|
360
|
-
if(options.animation == "vertical-slide") {
|
361
|
-
if(slideDirection == "prev") {
|
362
|
-
slides
|
363
|
-
.eq(activeSlide)
|
364
|
-
.css({"top": orbitHeight, "z-index" : 3})
|
365
|
-
.animate({"top" : 0}, options.animationSpeed, resetAndUnlock);
|
366
|
-
}
|
367
|
-
if(slideDirection == "next") {
|
368
|
-
slides
|
369
|
-
.eq(activeSlide)
|
370
|
-
.css({"top": -orbitHeight, "z-index" : 3})
|
371
|
-
.animate({"top" : 0}, options.animationSpeed, resetAndUnlock);
|
372
|
-
}
|
373
|
-
}
|
374
|
-
//push-over
|
375
|
-
if(options.animation == "horizontal-push") {
|
376
|
-
if(slideDirection == "next") {
|
377
|
-
slides
|
378
|
-
.eq(activeSlide)
|
379
|
-
.css({"left": orbitWidth, "z-index" : 3})
|
380
|
-
.animate({"left" : 0}, options.animationSpeed, resetAndUnlock);
|
381
|
-
slides
|
382
|
-
.eq(prevActiveSlide)
|
383
|
-
.animate({"left" : -orbitWidth}, options.animationSpeed);
|
384
|
-
}
|
385
|
-
if(slideDirection == "prev") {
|
386
|
-
slides
|
387
|
-
.eq(activeSlide)
|
388
|
-
.css({"left": -orbitWidth, "z-index" : 3})
|
389
|
-
.animate({"left" : 0}, options.animationSpeed, resetAndUnlock);
|
390
|
-
slides
|
391
|
-
.eq(prevActiveSlide)
|
392
|
-
.animate({"left" : orbitWidth}, options.animationSpeed);
|
393
|
-
}
|
394
|
-
}
|
395
|
-
setCaption();
|
396
|
-
} //lock
|
397
|
-
}//orbit function
|
398
|
-
});//each call
|
399
|
-
}//orbit plugin call
|
400
|
-
})(jQuery);
|
401
|
-
|