foundation-rails 5.0.3.1 → 5.1.0.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +1 -0
  3. data/README.md +6 -2
  4. data/bower.json +7 -0
  5. data/lib/foundation/rails/version.rb +1 -1
  6. data/update-gem.sh +13 -0
  7. data/vendor/assets/javascripts/foundation.js +2 -1
  8. data/vendor/assets/javascripts/foundation/foundation.abide.js +67 -33
  9. data/vendor/assets/javascripts/foundation/foundation.accordion.js +19 -11
  10. data/vendor/assets/javascripts/foundation/foundation.alert.js +8 -5
  11. data/vendor/assets/javascripts/foundation/foundation.clearing.js +74 -52
  12. data/vendor/assets/javascripts/foundation/foundation.dropdown.js +52 -46
  13. data/vendor/assets/javascripts/foundation/foundation.equalizer.js +63 -0
  14. data/vendor/assets/javascripts/foundation/foundation.interchange.js +47 -26
  15. data/vendor/assets/javascripts/foundation/foundation.joyride.js +42 -36
  16. data/vendor/assets/javascripts/foundation/foundation.js +286 -118
  17. data/vendor/assets/javascripts/foundation/foundation.magellan.js +139 -98
  18. data/vendor/assets/javascripts/foundation/foundation.offcanvas.js +8 -6
  19. data/vendor/assets/javascripts/foundation/foundation.orbit.js +29 -21
  20. data/vendor/assets/javascripts/foundation/foundation.reveal.js +58 -50
  21. data/vendor/assets/javascripts/foundation/foundation.tab.js +22 -10
  22. data/vendor/assets/javascripts/foundation/foundation.tooltip.js +38 -26
  23. data/vendor/assets/javascripts/foundation/foundation.topbar.js +79 -73
  24. data/vendor/assets/stylesheets/foundation/_functions.scss +37 -18
  25. data/vendor/assets/stylesheets/foundation/_settings.scss +115 -110
  26. data/vendor/assets/stylesheets/foundation/components/_block-grid.scss +14 -9
  27. data/vendor/assets/stylesheets/foundation/components/_breadcrumbs.scss +2 -2
  28. data/vendor/assets/stylesheets/foundation/components/_button-groups.scss +1 -1
  29. data/vendor/assets/stylesheets/foundation/components/_clearing.scss +13 -1
  30. data/vendor/assets/stylesheets/foundation/components/_dropdown-buttons.scss +1 -1
  31. data/vendor/assets/stylesheets/foundation/components/_flex-video.scss +1 -1
  32. data/vendor/assets/stylesheets/foundation/components/_forms.scss +23 -29
  33. data/vendor/assets/stylesheets/foundation/components/_global.scss +23 -54
  34. data/vendor/assets/stylesheets/foundation/components/_grid.scss +38 -31
  35. data/vendor/assets/stylesheets/foundation/components/_inline-lists.scss +2 -2
  36. data/vendor/assets/stylesheets/foundation/components/_joyride.scss +2 -2
  37. data/vendor/assets/stylesheets/foundation/components/_magellan.scss +2 -2
  38. data/vendor/assets/stylesheets/foundation/components/_offcanvas.scss +96 -96
  39. data/vendor/assets/stylesheets/foundation/components/_orbit.scss +3 -0
  40. data/vendor/assets/stylesheets/foundation/components/_progress-bars.scss +2 -2
  41. data/vendor/assets/stylesheets/foundation/components/_reveal.scss +8 -3
  42. data/vendor/assets/stylesheets/foundation/components/_side-nav.scss +10 -5
  43. data/vendor/assets/stylesheets/foundation/components/_sub-nav.scss +6 -3
  44. data/vendor/assets/stylesheets/foundation/components/_tabs.scss +2 -0
  45. data/vendor/assets/stylesheets/foundation/components/_tooltips.scss +11 -1
  46. data/vendor/assets/stylesheets/foundation/components/_top-bar.scss +20 -7
  47. data/vendor/assets/stylesheets/foundation/components/_type.scss +82 -4
  48. data/vendor/assets/stylesheets/foundation/components/_visibility.scss +2 -2
  49. metadata +5 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 2fd598d5ae96286d88ac087631a64d61221aadc2
4
- data.tar.gz: 20bb7218e4535c4d32e7fb4386273e5b50e24beb
3
+ metadata.gz: 2a91edad2d0aa9d012f21be4826ffe70ed4d60bd
4
+ data.tar.gz: e2b77d4c9a12372a84418407d85bd25684f50304
5
5
  SHA512:
6
- metadata.gz: f4241f4e5fb173c541ff2205ca4508395f369dedc6e469f6e4c67999108c3ab545a906c98c753dea9173f506edabf27517fbb36488269c91971b3a3f5541827d
7
- data.tar.gz: 30e52bc1180b1e89f139f2956789e980a39919862cba0716920fcde2969cbc40983675fe5a2cf47605e2f36b00f4a6e7eb28cf724f3e39703d7ae5cce168ec90
6
+ metadata.gz: f3f515dfcdf6eef038ca6407c8fe018f81f6a9a460895e71fcfb09baaf14b40d7c152ae7fa5488062b8c5cb8fcc47053e29acd0c51a4d61168707b9f542e6409
7
+ data.tar.gz: d33b4cafc4efc36a99add35aba603d88c587998b6271ee73bc9bdb18be3fd4059467401b8f2014e0e1853c191e217dd9f8bb4653a48b3732f3833b74a1ba9a72
data/.gitignore CHANGED
@@ -15,3 +15,4 @@ spec/reports
15
15
  test/tmp
16
16
  test/version_tmp
17
17
  tmp
18
+ /bower_components/*
data/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # Foundation::Rails
2
2
 
3
- TODO: Write a gem description
3
+ The easiest way to use Foundation in your Rails app.
4
4
 
5
5
  ## Installation
6
6
 
@@ -18,7 +18,11 @@ Or install it yourself as:
18
18
 
19
19
  ## Usage
20
20
 
21
- TODO: Write usage instructions here
21
+ After Foundation has been added to your `Gemfile` you can install it into your project by running:
22
+
23
+ ```bash
24
+ rails g foundation:install
25
+ ```
22
26
 
23
27
  ## Contributing
24
28
 
data/bower.json ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "name": "foundation-rails",
3
+ "version": "5.1.0.0",
4
+ "dependencies": {
5
+ "foundation": "5.1.0"
6
+ }
7
+ }
@@ -1,5 +1,5 @@
1
1
  module Foundation
2
2
  module Rails
3
- VERSION = "5.0.3.1"
3
+ VERSION = "5.1.0.1"
4
4
  end
5
5
  end
data/update-gem.sh ADDED
@@ -0,0 +1,13 @@
1
+ #! /bin/sh
2
+
3
+ bower install
4
+ rm -rf vendor/assets/javascripts/vendor
5
+ rm -rf vendor/assets/stylesheets
6
+ mkdir -p vendor/assets/javascripts/vendor
7
+ mkdir -p vendor/assets/stylesheets
8
+ cp bower_components/modernizr/modernizr.js vendor/assets/javascripts/vendor/.
9
+ cp -R bower_components/foundation/js/foundation/ vendor/assets/javascripts/foundation/
10
+ cp -R bower_components/foundation/scss/ vendor/assets/stylesheets/
11
+ cp bower_components/foundation/scss/foundation/_settings.scss vendor/assets/.
12
+
13
+ # echo "Now update version.rb"
@@ -12,4 +12,5 @@
12
12
  //= require foundation/foundation.reveal
13
13
  //= require foundation/foundation.tab
14
14
  //= require foundation/foundation.tooltip
15
- //= require foundation/foundation.topbar
15
+ //= require foundation/foundation.topbar
16
+ //= require foundation/foundation.equalizer
@@ -4,16 +4,17 @@
4
4
  Foundation.libs.abide = {
5
5
  name : 'abide',
6
6
 
7
- version : '5.0.3',
7
+ version : '5.1.0',
8
8
 
9
9
  settings : {
10
+ live_validate : true,
10
11
  focus_on_invalid : true,
11
12
  error_labels: true, // labels with a for="inputId" will recieve an `error` class
12
13
  timeout : 1000,
13
14
  patterns : {
14
- alpha: /[a-zA-Z]+/,
15
- alpha_numeric : /[a-zA-Z0-9]+/,
16
- integer: /-?\d+/,
15
+ alpha: /^[a-zA-Z]+$/,
16
+ alpha_numeric : /^[a-zA-Z0-9]+$/,
17
+ integer: /^\d+$/,
17
18
  number: /-?(?:\d+|\d{1,3}(?:,\d{3})+)?(?:\.\d+)?/,
18
19
 
19
20
  // generic password: upper-case, lower-case, number/special character, and min 8 characters
@@ -52,14 +53,19 @@
52
53
 
53
54
  events : function (scope) {
54
55
  var self = this,
55
- form = $(scope).attr('novalidate', 'novalidate'),
56
- settings = form.data('abide-init');
56
+ form = self.S(scope).attr('novalidate', 'novalidate'),
57
+ settings = form.data(this.attr_name(true) + '-init');
58
+
59
+ this.invalid_attr = this.add_namespace('data-invalid');
57
60
 
58
61
  form
59
62
  .off('.abide')
60
63
  .on('submit.fndtn.abide validate.fndtn.abide', function (e) {
61
- var is_ajax = /ajax/i.test($(this).attr('data-abide'));
62
- return self.validate($(this).find('input, textarea, select').get(), e, is_ajax);
64
+ var is_ajax = /ajax/i.test(self.S(this).attr(self.attr_name()));
65
+ return self.validate(self.S(this).find('input, textarea, select').get(), e, is_ajax);
66
+ })
67
+ .on('reset', function() {
68
+ return self.reset($(this));
63
69
  })
64
70
  .find('input, textarea, select')
65
71
  .off('.abide')
@@ -68,24 +74,33 @@
68
74
  })
69
75
  .on('keydown.fndtn.abide', function (e) {
70
76
  var settings = $(this).closest('form').data('abide-init');
71
- clearTimeout(self.timer);
72
- self.timer = setTimeout(function () {
73
- self.validate([this], e);
74
- }.bind(this), settings.timeout);
77
+ if (settings.live_validate === true) {
78
+ clearTimeout(self.timer);
79
+ self.timer = setTimeout(function () {
80
+ self.validate([this], e);
81
+ }.bind(this), settings.timeout);
82
+ }
75
83
  });
76
84
  },
77
85
 
86
+ reset : function (form) {
87
+ form.removeAttr(this.invalid_attr);
88
+ $(this.invalid_attr, form).removeAttr(this.invalid_attr);
89
+ $('.error', form).not('small').removeClass('error');
90
+ },
91
+
78
92
  validate : function (els, e, is_ajax) {
79
93
  var validations = this.parse_patterns(els),
80
94
  validation_count = validations.length,
81
- form = $(els[0]).closest('form'),
95
+ form = this.S(els[0]).closest('form'),
82
96
  submit_event = /submit/.test(e.type);
83
97
 
98
+ // Has to count up to make sure the focus gets applied to the top error
84
99
  for (var i=0; i < validation_count; i++) {
85
100
  if (!validations[i] && (submit_event || is_ajax)) {
86
101
  if (this.settings.focus_on_invalid) els[i].focus();
87
102
  form.trigger('invalid');
88
- $(els[i]).closest('form').attr('data-invalid', '');
103
+ this.S(els[i]).closest('form').attr(this.invalid_attr, '');
89
104
  return false;
90
105
  }
91
106
  }
@@ -94,7 +109,7 @@
94
109
  form.trigger('valid');
95
110
  }
96
111
 
97
- form.removeAttr('data-invalid');
112
+ form.removeAttr(this.invalid_attr);
98
113
 
99
114
  if (is_ajax) return false;
100
115
 
@@ -102,10 +117,10 @@
102
117
  },
103
118
 
104
119
  parse_patterns : function (els) {
105
- var count = els.length,
120
+ var i = els.length,
106
121
  el_patterns = [];
107
122
 
108
- for (var i = count - 1; i >= 0; i--) {
123
+ while (i--) {
109
124
  el_patterns.push(this.pattern(els[i]));
110
125
  }
111
126
 
@@ -134,37 +149,51 @@
134
149
  },
135
150
 
136
151
  check_validation_and_apply_styles : function (el_patterns) {
137
- var count = el_patterns.length,
152
+ var i = el_patterns.length,
138
153
  validations = [];
139
154
 
140
- for (var i = count - 1; i >= 0; i--) {
155
+ while (i--) {
141
156
  var el = el_patterns[i][0],
142
157
  required = el_patterns[i][2],
143
158
  value = el.value,
144
- is_equal = el.getAttribute('data-equalto'),
159
+ direct_parent = this.S(el).parent(),
160
+ is_equal = el.getAttribute(this.add_namespace('data-equalto')),
145
161
  is_radio = el.type === "radio",
146
162
  is_checkbox = el.type === "checkbox",
147
- label = $('label[for="' + el.getAttribute('id') + '"]'),
163
+ label = this.S('label[for="' + el.getAttribute('id') + '"]'),
148
164
  valid_length = (required) ? (el.value.length > 0) : true;
149
165
 
166
+ var parent;
167
+
168
+ if (!direct_parent.is('label')) {
169
+ parent = direct_parent;
170
+ } else {
171
+ parent = direct_parent.parent();
172
+ }
173
+
150
174
  if (is_radio && required) {
151
175
  validations.push(this.valid_radio(el, required));
152
176
  } else if (is_checkbox && required) {
153
177
  validations.push(this.valid_checkbox(el, required));
154
178
  } else if (is_equal && required) {
155
- validations.push(this.valid_equal(el, required));
179
+ validations.push(this.valid_equal(el, required, parent));
156
180
  } else {
181
+
157
182
  if (el_patterns[i][1].test(value) && valid_length ||
158
183
  !required && el.value.length < 1) {
159
- $(el).removeAttr('data-invalid').parent().removeClass('error');
184
+ this.S(el).removeAttr(this.invalid_attr);
185
+ parent.removeClass('error');
160
186
  if (label.length > 0 && this.settings.error_labels) label.removeClass('error');
161
187
 
162
188
  validations.push(true);
189
+ $(el).triggerHandler('valid');
163
190
  } else {
164
- $(el).attr('data-invalid', '').parent().addClass('error');
191
+ this.S(el).attr(this.invalid_attr, '');
192
+ parent.addClass('error');
165
193
  if (label.length > 0 && this.settings.error_labels) label.addClass('error');
166
194
 
167
195
  validations.push(false);
196
+ $(el).triggerHandler('invalid');
168
197
  }
169
198
  }
170
199
  }
@@ -173,12 +202,13 @@
173
202
  },
174
203
 
175
204
  valid_checkbox : function(el, required) {
176
- var el = $(el),
205
+ var el = this.S(el),
177
206
  valid = (el.is(':checked') || !required);
207
+
178
208
  if (valid) {
179
- el.removeAttr('data-invalid').parent().removeClass('error');
209
+ el.removeAttr(this.invalid_attr).parent().removeClass('error');
180
210
  } else {
181
- el.attr('data-invalid', '').parent().addClass('error');
211
+ el.attr(this.invalid_attr, '').parent().addClass('error');
182
212
  }
183
213
 
184
214
  return valid;
@@ -190,30 +220,34 @@
190
220
  count = group.length,
191
221
  valid = false;
192
222
 
223
+ // Has to count up to make sure the focus gets applied to the top error
193
224
  for (var i=0; i < count; i++) {
194
225
  if (group[i].checked) valid = true;
195
226
  }
196
227
 
228
+ // Has to count up to make sure the focus gets applied to the top error
197
229
  for (var i=0; i < count; i++) {
198
230
  if (valid) {
199
- $(group[i]).removeAttr('data-invalid').parent().removeClass('error');
231
+ this.S(group[i]).removeAttr(this.invalid_attr).parent().removeClass('error');
200
232
  } else {
201
- $(group[i]).attr('data-invalid', '').parent().addClass('error');
233
+ this.S(group[i]).attr(this.invalid_attr, '').parent().addClass('error');
202
234
  }
203
235
  }
204
236
 
205
237
  return valid;
206
238
  },
207
239
 
208
- valid_equal: function(el, required) {
209
- var from = document.getElementById(el.getAttribute('data-equalto')).value,
240
+ valid_equal: function(el, required, parent) {
241
+ var from = document.getElementById(el.getAttribute(this.add_namespace('data-equalto'))).value,
210
242
  to = el.value,
211
243
  valid = (from === to);
212
244
 
213
245
  if (valid) {
214
- $(el).removeAttr('data-invalid').parent().removeClass('error');
246
+ this.S(el).removeAttr(this.invalid_attr);
247
+ parent.removeClass('error');
215
248
  } else {
216
- $(el).attr('data-invalid', '').parent().addClass('error');
249
+ this.S(el).attr(this.invalid_attr, '');
250
+ parent.addClass('error');
217
251
  }
218
252
 
219
253
  return valid;
@@ -4,7 +4,7 @@
4
4
  Foundation.libs.accordion = {
5
5
  name : 'accordion',
6
6
 
7
- version : '5.0.3',
7
+ version : '5.1.0',
8
8
 
9
9
  settings : {
10
10
  active_class: 'active',
@@ -12,25 +12,33 @@
12
12
  },
13
13
 
14
14
  init : function (scope, method, options) {
15
- this.bindings(method, options);
15
+ this.bindings(method, options);
16
16
  },
17
17
 
18
18
  events : function () {
19
- $(this.scope).off('.accordion').on('click.fndtn.accordion', '[data-accordion] > dd > a', function (e) {
20
- var accordion = $(this).parent(),
21
- target = $('#' + this.href.split('#')[1]),
22
- siblings = $('> dd > .content', target.closest('[data-accordion]')),
23
- settings = accordion.parent().data('accordion-init'),
24
- active = $('> dd > .content.' + settings.active_class, accordion.parent());
19
+ var self = this;
20
+ var S = this.S;
21
+ S(this.scope)
22
+ .off('.fndtn.accordion')
23
+ .on('click.fndtn.accordion', '[' + this.attr_name() + '] > dd > a', function (e) {
24
+ var accordion = S(this).closest('[' + self.attr_name() + ']'),
25
+ target = S('#' + this.href.split('#')[1]),
26
+ siblings = S('dd > .content', accordion),
27
+ aunts = $('> dd', accordion),
28
+ settings = accordion.data(self.attr_name(true) + '-init'),
29
+ active_content = S('dd > .content.' + settings.active_class, accordion),
30
+ active_parent = S('dd.' + settings.active_class, accordion);
25
31
 
26
32
  e.preventDefault();
27
33
 
28
- if (active[0] == target[0] && settings.toggleable) {
29
- return target.toggleClass(settings.active_class);
34
+ if (active_content[0] == target[0] && settings.toggleable) {
35
+ active_parent.toggleClass(settings.active_class, false);
36
+ return target.toggleClass(settings.active_class, false);
30
37
  }
31
38
 
32
39
  siblings.removeClass(settings.active_class);
33
- target.addClass(settings.active_class);
40
+ aunts.removeClass(settings.active_class);
41
+ target.addClass(settings.active_class).parent().addClass(settings.active_class);
34
42
  });
35
43
  },
36
44
 
@@ -4,7 +4,7 @@
4
4
  Foundation.libs.alert = {
5
5
  name : 'alert',
6
6
 
7
- version : '5.0.3',
7
+ version : '5.1.0',
8
8
 
9
9
  settings : {
10
10
  animation: 'fadeOut',
@@ -17,13 +17,16 @@
17
17
  },
18
18
 
19
19
  events : function () {
20
- $(this.scope).off('.alert').on('click.fndtn.alert', '[data-alert] a.close', function (e) {
21
- var alertBox = $(this).closest("[data-alert]"),
22
- settings = alertBox.data('alert-init') || Foundation.libs.alert.settings;
20
+ var self = this,
21
+ S = this.S;
22
+
23
+ $(this.scope).off('.alert').on('click.fndtn.alert', '[' + this.attr_name() + '] a.close', function (e) {
24
+ var alertBox = S(this).closest('[' + self.attr_name() + ']'),
25
+ settings = alertBox.data(self.attr_name(true) + '-init') || self.settings;
23
26
 
24
27
  e.preventDefault();
25
28
  alertBox[settings.animation](settings.speed, function () {
26
- $(this).trigger('closed').remove();
29
+ S(this).trigger('closed').remove();
27
30
  settings.callback();
28
31
  });
29
32
  });
@@ -4,12 +4,12 @@
4
4
  Foundation.libs.clearing = {
5
5
  name : 'clearing',
6
6
 
7
- version: '5.0.3',
7
+ version: '5.1.0',
8
8
 
9
9
  settings : {
10
10
  templates : {
11
11
  viewing : '<a href="#" class="clearing-close">&times;</a>' +
12
- '<div class="visible-img" style="display: none"><img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D" alt="" />' +
12
+ '<div class="visible-img" style="display: none"><div class="clearing-touch-label"></div><img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D" alt="" />' +
13
13
  '<p class="clearing-caption"></p><a href="#" class="clearing-main-prev"><span></span></a>' +
14
14
  '<a href="#" class="clearing-main-next"><span></span></a></div>'
15
15
  },
@@ -18,6 +18,8 @@
18
18
  // add 'div.clearing-blackout, div.visible-img' to close on background click
19
19
  close_selectors : '.clearing-close',
20
20
 
21
+ touch_label : '&larr;&nbsp;Swipe to Advance&nbsp;&rarr;',
22
+
21
23
  // event initializers and locks
22
24
  init : false,
23
25
  locked : false
@@ -25,37 +27,38 @@
25
27
 
26
28
  init : function (scope, method, options) {
27
29
  var self = this;
28
- Foundation.inherit(this, 'throttle loaded');
30
+ Foundation.inherit(this, 'throttle image_loaded');
29
31
 
30
32
  this.bindings(method, options);
31
33
 
32
- if ($(this.scope).is('[data-clearing]')) {
33
- this.assemble($('li', this.scope));
34
+ if (self.S(this.scope).is('[' + this.attr_name() + ']')) {
35
+ this.assemble(self.S('li', this.scope));
34
36
  } else {
35
- $('[data-clearing]', this.scope).each(function () {
36
- self.assemble($('li', this));
37
+ self.S('[' + this.attr_name() + ']', this.scope).each(function () {
38
+ self.assemble(self.S('li', this));
37
39
  });
38
40
  }
39
41
  },
40
42
 
41
43
  events : function (scope) {
42
- var self = this;
44
+ var self = this,
45
+ S = self.S;
43
46
 
44
- $(this.scope)
47
+ S(this.scope)
45
48
  .off('.clearing')
46
- .on('click.fndtn.clearing', 'ul[data-clearing] li',
49
+ .on('click.fndtn.clearing', 'ul[' + this.attr_name() + '] li',
47
50
  function (e, current, target) {
48
- var current = current || $(this),
51
+ var current = current || S(this),
49
52
  target = target || current,
50
53
  next = current.next('li'),
51
- settings = current.closest('[data-clearing]').data('clearing-init'),
52
- image = $(e.target);
54
+ settings = current.closest('[' + self.attr_name() + ']').data(self.attr_name(true) + '-init'),
55
+ image = S(e.target);
53
56
 
54
57
  e.preventDefault();
55
58
 
56
59
  if (!settings) {
57
60
  self.init();
58
- settings = current.closest('[data-clearing]').data('clearing-init');
61
+ settings = current.closest('[' + self.attr_name() + ']').data(self.attr_name(true) + '-init');
59
62
  }
60
63
 
61
64
  // if clearing is open and the current image is
@@ -64,7 +67,7 @@
64
67
  current[0] === target[0] &&
65
68
  next.length > 0 && self.is_open(current)) {
66
69
  target = next;
67
- image = $('img', target);
70
+ image = S('img', target);
68
71
  }
69
72
 
70
73
  // set current and target to the clicked li if not otherwise defined.
@@ -81,16 +84,17 @@
81
84
  .on('keydown.fndtn.clearing',
82
85
  function (e) { self.keydown(e) });
83
86
 
84
- $(window).off('.clearing').on('resize.fndtn.clearing',
87
+ S(window).off('.clearing').on('resize.fndtn.clearing',
85
88
  function () { self.resize() });
86
89
 
87
90
  this.swipe_events(scope);
88
91
  },
89
92
 
90
93
  swipe_events : function (scope) {
91
- var self = this;
94
+ var self = this,
95
+ S = self.S;
92
96
 
93
- $(this.scope)
97
+ S(this.scope)
94
98
  .on('touchstart.fndtn.clearing', '.visible-img', function(e) {
95
99
  if (!e.touches) { e = e.originalEvent; }
96
100
  var data = {
@@ -101,7 +105,7 @@
101
105
  is_scrolling: undefined
102
106
  };
103
107
 
104
- $(this).data('swipe-transition', data);
108
+ S(this).data('swipe-transition', data);
105
109
  e.stopPropagation();
106
110
  })
107
111
  .on('touchmove.fndtn.clearing', '.visible-img', function(e) {
@@ -109,7 +113,7 @@
109
113
  // Ignore pinch/zoom events
110
114
  if(e.touches.length > 1 || e.scale && e.scale !== 1) return;
111
115
 
112
- var data = $(this).data('swipe-transition');
116
+ var data = S(this).data('swipe-transition');
113
117
 
114
118
  if (typeof data === 'undefined') {
115
119
  data = {};
@@ -129,7 +133,7 @@
129
133
  }
130
134
  })
131
135
  .on('touchend.fndtn.clearing', '.visible-img', function(e) {
132
- $(this).data('swipe-transition', {});
136
+ S(this).data('swipe-transition', {});
133
137
  e.stopPropagation();
134
138
  });
135
139
  },
@@ -140,24 +144,31 @@
140
144
  if ($el.parent().hasClass('carousel')) return;
141
145
  $el.after('<div id="foundationClearingHolder"></div>');
142
146
 
143
- var holder = $('#foundationClearingHolder'),
144
- settings = $el.data('clearing-init'),
147
+ var holder = this.S('#foundationClearingHolder'),
148
+ settings = $el.data(this.attr_name(true) + '-init'),
145
149
  grid = $el.detach(),
146
150
  data = {
147
151
  grid: '<div class="carousel">' + grid[0].outerHTML + '</div>',
148
152
  viewing: settings.templates.viewing
149
153
  },
150
154
  wrapper = '<div class="clearing-assembled"><div>' + data.viewing +
151
- data.grid + '</div></div>';
155
+ data.grid + '</div></div>',
156
+ touch_label = this.settings.touch_label;
157
+
158
+ if (Modernizr.touch) {
159
+ wrapper = $(wrapper).find('.clearing-touch-label').html(touch_label).end();
160
+ }
152
161
 
153
- return holder.after(wrapper).remove();
162
+ holder.after(wrapper).remove();
154
163
  },
155
164
 
156
165
  open : function ($image, current, target) {
157
- var root = target.closest('.clearing-assembled'),
158
- container = $('div', root).first(),
159
- visible_image = $('.visible-img', container),
160
- image = $('img', visible_image).not($image);
166
+ var self = this,
167
+ root = target.closest('.clearing-assembled'),
168
+ container = self.S('div', root).first(),
169
+ visible_image = self.S('.visible-img', container),
170
+ image = self.S('img', visible_image).not($image),
171
+ label = self.S('.clearing-touch-label', container);
161
172
 
162
173
  if (!this.locked()) {
163
174
  // set the image to the selected thumbnail
@@ -165,15 +176,15 @@
165
176
  .attr('src', this.load($image))
166
177
  .css('visibility', 'hidden');
167
178
 
168
- this.loaded(image, function () {
179
+ this.image_loaded(image, function () {
169
180
  image.css('visibility', 'visible');
170
181
  // toggle the gallery
171
182
  root.addClass('clearing-blackout');
172
183
  container.addClass('clearing-container');
173
184
  visible_image.show();
174
185
  this.fix_height(target)
175
- .caption($('.clearing-caption', visible_image), $image)
176
- .center(image)
186
+ .caption(self.S('.clearing-caption', visible_image), $image)
187
+ .center_and_label(image,label)
177
188
  .shift(current, target, function () {
178
189
  target.siblings().removeClass('visible');
179
190
  target.addClass('visible');
@@ -197,7 +208,7 @@
197
208
  container = $('div', root).first();
198
209
  visible_image = $('.visible-img', container);
199
210
  this.settings.prev_index = 0;
200
- $('ul[data-clearing]', root)
211
+ $('ul[' + this.attr_name() + ']', root)
201
212
  .attr('style', '').closest('.clearing-blackout')
202
213
  .removeClass('clearing-blackout');
203
214
  container.removeClass('clearing-container');
@@ -212,28 +223,29 @@
212
223
  },
213
224
 
214
225
  keydown : function (e) {
215
- var clearing = $('ul[data-clearing]', '.clearing-blackout'),
226
+ var clearing = $('ul[' + this.attr_name() + ']', '.clearing-blackout'),
216
227
  NEXT_KEY = this.rtl ? 37 : 39,
217
228
  PREV_KEY = this.rtl ? 39 : 37,
218
229
  ESC_KEY = 27;
219
230
 
220
231
  if (e.which === NEXT_KEY) this.go(clearing, 'next');
221
232
  if (e.which === PREV_KEY) this.go(clearing, 'prev');
222
- if (e.which === ESC_KEY) $('a.clearing-close').trigger('click');
233
+ if (e.which === ESC_KEY) this.S('a.clearing-close').trigger('click');
223
234
  },
224
235
 
225
236
  nav : function (e, direction) {
226
- var clearing = $('ul[data-clearing]', '.clearing-blackout');
237
+ var clearing = $('ul[' + this.attr_name() + ']', '.clearing-blackout');
227
238
 
228
239
  e.preventDefault();
229
240
  this.go(clearing, direction);
230
241
  },
231
242
 
232
243
  resize : function () {
233
- var image = $('img', '.clearing-blackout .visible-img');
244
+ var image = $('img', '.clearing-blackout .visible-img'),
245
+ label = $('.clearing-touch-label', '.clearing-blackout');
234
246
 
235
247
  if (image.length) {
236
- this.center(image);
248
+ this.center_and_label(image, label);
237
249
  }
238
250
  },
239
251
 
@@ -243,7 +255,7 @@
243
255
  self = this;
244
256
 
245
257
  lis.each(function () {
246
- var li = $(this),
258
+ var li = self.S(this),
247
259
  image = li.find('img');
248
260
 
249
261
  if (li.height() > image.outerHeight()) {
@@ -262,28 +274,32 @@
262
274
  .siblings('.visible-img');
263
275
 
264
276
  if (target.next().length > 0) {
265
- $('.clearing-main-next', visible_image)
277
+ this.S('.clearing-main-next', visible_image)
266
278
  .removeClass('disabled');
267
279
  } else {
268
- $('.clearing-main-next', visible_image)
280
+ this.S('.clearing-main-next', visible_image)
269
281
  .addClass('disabled');
270
282
  }
271
283
 
272
284
  if (target.prev().length > 0) {
273
- $('.clearing-main-prev', visible_image)
285
+ this.S('.clearing-main-prev', visible_image)
274
286
  .removeClass('disabled');
275
287
  } else {
276
- $('.clearing-main-prev', visible_image)
288
+ this.S('.clearing-main-prev', visible_image)
277
289
  .addClass('disabled');
278
290
  }
279
291
  },
280
292
 
281
- center : function (target) {
293
+ center_and_label : function (target, label) {
282
294
  if (!this.rtl) {
283
295
  target.css({
284
296
  marginLeft : -(target.outerWidth() / 2),
285
297
  marginTop : -(target.outerHeight() / 2)
286
298
  });
299
+ label.css({
300
+ marginLeft : -(label.outerWidth() / 2),
301
+ marginTop : -(target.outerHeight() / 2)-label.outerHeight()-10
302
+ });
287
303
  } else {
288
304
  target.css({
289
305
  marginRight : -(target.outerWidth() / 2),
@@ -291,6 +307,12 @@
291
307
  left: 'auto',
292
308
  right: '50%'
293
309
  });
310
+ label.css({
311
+ marginRight : -(label.outerWidth() / 2),
312
+ marginTop : -(target.outerHeight() / 2)-label.outerHeight()-10,
313
+ left: 'auto',
314
+ right: '50%'
315
+ });
294
316
  }
295
317
  return this;
296
318
  },
@@ -319,12 +341,12 @@
319
341
  img : function (img) {
320
342
  if (img.length) {
321
343
  var new_img = new Image(),
322
- new_a = $('a', img);
344
+ new_a = this.S('a', img);
323
345
 
324
346
  if (new_a.length) {
325
347
  new_img.src = new_a.attr('href');
326
348
  } else {
327
- new_img.src = $('img', img).attr('src');
349
+ new_img.src = this.S('img', img).attr('src');
328
350
  }
329
351
  }
330
352
  return this;
@@ -350,11 +372,11 @@
350
372
  // directional methods
351
373
 
352
374
  go : function ($ul, direction) {
353
- var current = $('.visible', $ul),
375
+ var current = this.S('.visible', $ul),
354
376
  target = current[direction]();
355
377
 
356
378
  if (target.length) {
357
- $('img', target)
379
+ this.S('img', target)
358
380
  .trigger('click', [current, target]);
359
381
  }
360
382
  },
@@ -402,9 +424,9 @@
402
424
  },
403
425
 
404
426
  direction : function ($el, current, target) {
405
- var lis = $('li', $el),
427
+ var lis = this.S('li', $el),
406
428
  li_width = lis.outerWidth() + (lis.outerWidth() / 4),
407
- up_count = Math.floor($('.clearing-container').outerWidth() / li_width) - 1,
429
+ up_count = Math.floor(this.S('.clearing-container').outerWidth() / li_width) - 1,
408
430
  target_index = lis.index(target),
409
431
  response;
410
432
 
@@ -451,8 +473,8 @@
451
473
  },
452
474
 
453
475
  off : function () {
454
- $(this.scope).off('.fndtn.clearing');
455
- $(window).off('.fndtn.clearing');
476
+ this.S(this.scope).off('.fndtn.clearing');
477
+ this.S(window).off('.fndtn.clearing');
456
478
  },
457
479
 
458
480
  reflow : function () {