zurb-foundation 0.0.5 → 1.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (39) hide show
  1. data/README.markdown +56 -9
  2. data/app/assets/images/foundation/misc/button-gloss.png +0 -0
  3. data/app/assets/images/foundation/misc/button-overlay.png +0 -0
  4. data/app/assets/images/foundation/misc/custom-form-sprites.png +0 -0
  5. data/app/assets/images/foundation/misc/input-bg.png +0 -0
  6. data/app/assets/images/foundation/misc/modal-gloss.png +0 -0
  7. data/app/assets/images/foundation/misc/table-sorter.png +0 -0
  8. data/app/assets/images/foundation/orbit/bullets.jpg +0 -0
  9. data/app/assets/images/foundation/orbit/left-arrow.png +0 -0
  10. data/app/assets/images/foundation/orbit/loading.gif +0 -0
  11. data/app/assets/images/foundation/orbit/mask-black.png +0 -0
  12. data/app/assets/images/foundation/orbit/pause-black.png +0 -0
  13. data/app/assets/images/foundation/orbit/right-arrow.png +0 -0
  14. data/app/assets/images/foundation/orbit/rotator-black.png +0 -0
  15. data/app/assets/images/foundation/orbit/timer-black.png +0 -0
  16. data/app/assets/javascripts/foundation/app.js +3 -23
  17. data/app/assets/javascripts/foundation/forms.jquery.js +0 -0
  18. data/app/assets/javascripts/foundation/index.js +6 -6
  19. data/app/assets/javascripts/foundation/jquery.customforms.js +0 -0
  20. data/app/assets/javascripts/foundation/jquery.orbit-1.3.0.js +596 -0
  21. data/app/assets/javascripts/foundation/jquery.placeholder.min.js.erb +2 -0
  22. data/app/assets/javascripts/foundation/jquery.reveal.js +0 -0
  23. data/app/assets/stylesheets/foundation/forms.css.scss.erb +0 -0
  24. data/app/assets/stylesheets/foundation/globals.css.scss.erb +49 -27
  25. data/app/assets/stylesheets/foundation/index.css +6 -8
  26. data/app/assets/stylesheets/foundation/mobile.css.scss.erb +21 -21
  27. data/app/assets/stylesheets/foundation/{orbit-1.2.3.css.scss.erb → orbit.css.scss.erb} +17 -8
  28. data/app/assets/stylesheets/foundation/ui.css.scss.erb +0 -0
  29. data/foundation.gemspec +1 -0
  30. data/lib/foundation/generators/install_generator.rb +3 -3
  31. data/lib/foundation/version.rb +1 -1
  32. metadata +20 -14
  33. data/app/assets/javascripts/foundation/jquery.orbit-1.2.3.js +0 -401
  34. data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.eot +0 -0
  35. data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.svg +0 -223
  36. data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.ttf +0 -0
  37. data/app/assets/stylesheets/foundation/fonts/league/League_Gothic-webfont.woff +0 -0
  38. data/app/assets/stylesheets/foundation/fonts/league/SIL Open Font License 1.1.txt +0 -91
  39. 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
- /* http://meyerweb.com/eric/tools/css/reset/
22
- v2.0b1 | 201101
23
- NOTE: WORK IN PROGRESS
24
- USE WITH CAUTION AND TEST WITH ABANDON */
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, figcaption, figure,
36
- footer, header, hgroup, menu, nav, section, summary,
37
- time, mark, audio, video {
38
- margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline;
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 { display: block; }
45
- body { line-height: 1; }
46
- ol, ul { list-style: none; }
47
-
48
- audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }
49
-
50
- blockquote, q { quotes: none; }
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 { content: ''; content: none; }
53
- :focus { outline: none; }
54
-
55
- ins { text-decoration: none; }
56
- del { text-decoration: line-through; }
57
- table { border-collapse: collapse; border-spacing: 0; }
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: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-size: 13px; line-height: 18px; color: #555; position: relative; -webkit-font-smoothing: antialiased; }
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: 1.8rem; font-size: 18px; line-height: 24px; }
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, blockquote cite a:visited { color: #555; }
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
- .row:after, .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
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-1.2.3
6
- *= require ./reveal
7
- *= require ./reveal
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 handheld, only screen and (device-width: 768px), (device-width: 800px) {
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 handheld, only screen and (max-width: 767px) {
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, .offset-by-five-five { margin-left: 0% !important; }
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 handheld, only screen and (max-width: 767px) {
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-tablet { display: none !important; }
40
- .show-on-desktop { display: block; }
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-tablet { display: block !important; }
44
- .hide-on-desktop { display: none; }
43
+ .hide-on-tablets { display: block !important; }
44
+ .hide-on-desktops { display: none; }
45
45
 
46
46
 
47
- @media handheld, only screen and (device-width: 768px), only screen and (device-width: 1280px), only screen and (device-width: 800px) {
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-tablet { display: none !important; }
50
- .hide-on-desktop { display: block !important; }
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-tablet { display: block !important; }
54
- .show-on-desktop { display: none !important; }
53
+ .show-on-tablets { display: block !important; }
54
+ .show-on-desktops { display: none !important; }
55
55
  }
56
56
 
57
57
 
58
- @media handheld, only screen and (max-width: 767px) {
58
+ @media only screen and (max-width: 767px) {
59
59
  .hide-on-phones { display: none !important; }
60
- .hide-on-tablet { display: block !important; }
61
- .hide-on-desktop { display: block !important; }
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-tablet { display: none !important; }
65
- .show-on-desktop { display: none !important; }
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 handheld, only screen and (max-width: 767px) {
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 handheld, only screen and (max-width: 767px) {
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 handheld, only screen and (max-width: 767px) {
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
- #featured {
12
- width: 940px;
13
- height: 450px;
14
- background: #000 url(<%= asset_path "foundation/orbit/loading.gif" %>) no-repeat center center;
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
- #featured>img,
17
- #featured>div,
18
- #featured>a { display: none; }
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
@@ -22,4 +22,5 @@ Gem::Specification.new do |s|
22
22
  # s.add_development_dependency "rspec"
23
23
  # s.add_runtime_dependency "rest-client"
24
24
  s.add_runtime_dependency "rails", "~> 3.1.0"
25
+ s.add_runtime_dependency "jquery-rails", "~> 1.0"
25
26
  end
@@ -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 replace_assets
9
- copy_file 'application.js', "app/assets/javascripts/application.js"
10
- copy_file 'application.css', "app/assets/stylesheets/application.css"
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
@@ -1,3 +1,3 @@
1
1
  module Foundation
2
- VERSION = "0.0.5"
2
+ VERSION = "1.0.0"
3
3
  end
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.5
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-14 00:00:00.000000000 -07:00
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: &2158619800 !ruby/object:Gem::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: *2158619800
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.2.3.js
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-1.2.3.css.scss.erb
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: -657682274503973215
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: -657682274503973215
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
-