foundation-rails 6.1.2.0 → 6.2.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (102) hide show
  1. checksums.yaml +4 -4
  2. data/.travis.yml +7 -6
  3. data/README.md +1 -1
  4. data/Rakefile +5 -1
  5. data/bower.json +3 -3
  6. data/foundation-rails.gemspec +1 -0
  7. data/lib/foundation-rails.rb +1 -0
  8. data/lib/foundation/rails/version.rb +1 -1
  9. data/lib/generators/foundation/templates/foundation_and_overrides.scss +2 -2
  10. data/vendor/assets/js/foundation.abide.js.es6 +462 -0
  11. data/vendor/assets/js/{foundation.accordion.js → foundation.accordion.js.es6} +55 -47
  12. data/vendor/assets/js/{foundation.accordionMenu.js → foundation.accordionMenu.js.es6} +46 -35
  13. data/vendor/assets/js/{foundation.core.js → foundation.core.js.es6} +10 -8
  14. data/vendor/assets/js/{foundation.drilldown.js → foundation.drilldown.js.es6} +75 -49
  15. data/vendor/assets/js/{foundation.dropdown.js → foundation.dropdown.js.es6} +100 -88
  16. data/vendor/assets/js/{foundation.dropdownMenu.js → foundation.dropdownMenu.js.es6} +134 -128
  17. data/vendor/assets/js/{foundation.equalizer.js → foundation.equalizer.js.es6} +72 -61
  18. data/vendor/assets/js/{foundation.interchange.js → foundation.interchange.js.es6} +44 -45
  19. data/vendor/assets/js/{foundation.js → foundation.js.es6} +0 -0
  20. data/vendor/assets/js/{foundation.magellan.js → foundation.magellan.js.es6} +80 -83
  21. data/vendor/assets/js/foundation.offcanvas.js.es6 +395 -0
  22. data/vendor/assets/js/foundation.orbit.js.es6 +445 -0
  23. data/vendor/assets/js/{foundation.responsiveMenu.js → foundation.responsiveMenu.js.es6} +37 -31
  24. data/vendor/assets/js/foundation.responsiveToggle.js.es6 +112 -0
  25. data/vendor/assets/js/foundation.reveal.js.es6 +544 -0
  26. data/vendor/assets/js/{foundation.slider.js → foundation.slider.js.es6} +235 -184
  27. data/vendor/assets/js/{foundation.sticky.js → foundation.sticky.js.es6} +177 -166
  28. data/vendor/assets/js/{foundation.tabs.js → foundation.tabs.js.es6} +138 -118
  29. data/vendor/assets/js/{foundation.toggler.js → foundation.toggler.js.es6} +34 -37
  30. data/vendor/assets/js/{foundation.tooltip.js → foundation.tooltip.js.es6} +162 -153
  31. data/vendor/assets/js/foundation.util.box.js.es6 +183 -0
  32. data/vendor/assets/js/{foundation.util.keyboard.js → foundation.util.keyboard.js.es6} +54 -54
  33. data/vendor/assets/js/{foundation.util.mediaQuery.js → foundation.util.mediaQuery.js.es6} +46 -46
  34. data/vendor/assets/js/{foundation.util.motion.js → foundation.util.motion.js.es6} +58 -48
  35. data/vendor/assets/js/foundation.util.nest.js.es6 +76 -0
  36. data/vendor/assets/js/foundation.util.timerAndImageLoader.js.es6 +86 -0
  37. data/vendor/assets/js/{foundation.util.touch.js → foundation.util.touch.js.es6} +2 -2
  38. data/vendor/assets/js/foundation.util.triggers.js.es6 +239 -0
  39. data/vendor/assets/scss/_global.scss +28 -27
  40. data/vendor/assets/scss/components/_badge.scss +1 -1
  41. data/vendor/assets/scss/components/_button-group.scss +77 -26
  42. data/vendor/assets/scss/components/_button.scss +8 -8
  43. data/vendor/assets/scss/components/_callout.scss +2 -2
  44. data/vendor/assets/scss/components/_drilldown.scss +4 -0
  45. data/vendor/assets/scss/components/_dropdown-menu.scss +104 -54
  46. data/vendor/assets/scss/components/_flex.scss +28 -0
  47. data/vendor/assets/scss/components/_label.scss +1 -1
  48. data/vendor/assets/scss/components/_media-object.scss +37 -7
  49. data/vendor/assets/scss/components/_menu-icon.scss +9 -0
  50. data/vendor/assets/scss/components/_menu.scss +127 -29
  51. data/vendor/assets/scss/components/_off-canvas.scss +1 -0
  52. data/vendor/assets/scss/components/_pagination.scss +3 -3
  53. data/vendor/assets/scss/components/_progress-bar.scss +1 -25
  54. data/vendor/assets/scss/components/_reveal.scss +12 -6
  55. data/vendor/assets/scss/components/_slider.scss +3 -35
  56. data/vendor/assets/scss/components/_table.scss +8 -0
  57. data/vendor/assets/scss/components/_tabs.scss +5 -10
  58. data/vendor/assets/scss/components/_title-bar.scss +27 -10
  59. data/vendor/assets/scss/components/_tooltip.scss +0 -4
  60. data/vendor/assets/scss/components/_top-bar.scss +93 -21
  61. data/vendor/assets/scss/components/_visibility.scss +1 -1
  62. data/vendor/assets/scss/forms/_checkbox.scss +1 -1
  63. data/vendor/assets/scss/forms/_error.scss +7 -5
  64. data/vendor/assets/scss/forms/_forms.scss +3 -0
  65. data/vendor/assets/scss/forms/_help-text.scss +1 -1
  66. data/vendor/assets/scss/forms/_input-group.scss +44 -9
  67. data/vendor/assets/scss/forms/_meter.scss +109 -0
  68. data/vendor/assets/scss/forms/_progress.scss +85 -0
  69. data/vendor/assets/scss/forms/_range.scss +144 -0
  70. data/vendor/assets/scss/forms/_select.scss +1 -1
  71. data/vendor/assets/scss/forms/_text.scss +10 -1
  72. data/vendor/assets/scss/foundation.scss +16 -5
  73. data/vendor/assets/scss/grid/_classes.scss +5 -18
  74. data/vendor/assets/scss/grid/_column.scss +13 -11
  75. data/vendor/assets/scss/grid/_flex-grid.scss +54 -80
  76. data/vendor/assets/scss/grid/_grid.scss +22 -10
  77. data/vendor/assets/scss/grid/_layout.scss +18 -0
  78. data/vendor/assets/scss/grid/_row.scss +11 -15
  79. data/vendor/assets/scss/motion-ui/_classes.scss +10 -3
  80. data/vendor/assets/scss/motion-ui/effects/_fade.scss +4 -1
  81. data/vendor/assets/scss/motion-ui/effects/_zoom.scss +1 -1
  82. data/vendor/assets/scss/motion-ui/transitions/_slide.scss +1 -1
  83. data/vendor/assets/scss/motion-ui/util/_transition.scss +1 -1
  84. data/vendor/assets/scss/settings/_settings.scss +64 -47
  85. data/vendor/assets/scss/typography/_base.scss +4 -0
  86. data/vendor/assets/scss/typography/_print.scss +9 -5
  87. data/vendor/assets/scss/util/_breakpoint.scss +31 -25
  88. data/vendor/assets/scss/util/_color.scss +19 -0
  89. data/vendor/assets/scss/util/_flex.scss +68 -0
  90. data/vendor/assets/scss/util/_mixins.scss +13 -7
  91. data/vendor/assets/scss/util/_util.scss +1 -5
  92. data/vendor/assets/scss/util/_value.scss +9 -28
  93. metadata +51 -31
  94. data/vendor/assets/js/foundation.abide.js +0 -418
  95. data/vendor/assets/js/foundation.offcanvas.js +0 -376
  96. data/vendor/assets/js/foundation.orbit.js +0 -421
  97. data/vendor/assets/js/foundation.responsiveToggle.js +0 -106
  98. data/vendor/assets/js/foundation.reveal.js +0 -514
  99. data/vendor/assets/js/foundation.util.box.js +0 -169
  100. data/vendor/assets/js/foundation.util.nest.js +0 -63
  101. data/vendor/assets/js/foundation.util.timerAndImageLoader.js +0 -82
  102. data/vendor/assets/js/foundation.util.triggers.js +0 -224
@@ -46,12 +46,12 @@
46
46
 
47
47
  /// Creates a menu icon with a set width, height, number of bars, and colors. The mixin uses the height of the icon and the weight of the bars to determine spacing. <div class="docs-example-burger"></div>
48
48
  ///
49
- /// @param {Color} $color - Color to use for the icon.
50
- /// @param {Color} $color-hover - Color to use when the icon is hovered over.
51
- /// @param {Number} $width - Width of the icon.
52
- /// @param {Number} $height - Height of the icon.
53
- /// @param {Number} $weight - Height of individual bars in the icon.
54
- /// @param {Number} $bars - Number of bars in the icon.
49
+ /// @param {Color} $color [$black] - Color to use for the icon.
50
+ /// @param {Color} $color-hover [$dark-gray] - Color to use when the icon is hovered over.
51
+ /// @param {Number} $width [20px] - Width of the icon.
52
+ /// @param {Number} $height [16px] - Height of the icon.
53
+ /// @param {Number} $weight [2px] - Height of individual bars in the icon.
54
+ /// @param {Number} $bars [3] - Number of bars in the icon.
55
55
  @mixin hamburger(
56
56
  $color: $black,
57
57
  $color-hover: $dark-gray,
@@ -119,22 +119,28 @@
119
119
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #{$rgb}"></polygon></svg>');
120
120
 
121
121
  @media screen and (min-width:0\0) {
122
- @if lightness($color) < 50% {
122
+ @if lightness($color) < 60% {
123
+ // White triangle
123
124
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg==');
124
125
  }
125
126
  @else {
127
+ // Black triangle
126
128
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAMBJREFUeNrEllsOhCAMRVszC9IlzU7KCmVHTJsoMWYMUtpyv9BgbuXQB5ZSdgBYYY4ycgBivk8KYFsQMfMiTTBP4o3nUzCKzOabLJbLy2/g31evGkAginR4/ZegKH5qX3bJCscA3t0x3kgO5tQFyhhFf50xRqFLbyMUNJQzgyjGS/wgCpvKqkRBpuWrE4V9d+1E4dPUXqIg107SQOE/2DRQxMwTDygIInVDET9T3lCoj/6j/VCmGjZOl2lKpZ8AAwDQP7zIimDGFQAAAABJRU5ErkJggg==');
127
129
  }
128
130
  }
129
131
  }
130
132
 
131
133
  /// Applies the micro clearfix hack popularized by Nicolas Gallagher. Include this mixin on a container if its children are all floated, to give the container a proper height.
134
+ /// The clearfix is augmented with specific styles to prevent borders in flexbox environments
132
135
  /// @link http://nicolasgallagher.com/micro-clearfix-hack/ Micro Clearfix Hack
136
+ /// @link http://danisadesigner.com/blog/flexbox-clear-fix-pseudo-elements/ Flexbox fix
133
137
  @mixin clearfix {
134
138
  &::before,
135
139
  &::after {
136
140
  content: ' ';
137
141
  display: table;
142
+ flex-basis: 0;
143
+ order: 1;
138
144
  }
139
145
 
140
146
  &::after {
@@ -2,14 +2,10 @@
2
2
  // foundation.zurb.com
3
3
  // Licensed under MIT Open Source
4
4
 
5
- // Utilities
6
5
  @import 'unit';
7
6
  @import 'value';
8
7
  @import 'color';
9
8
  @import 'selector';
10
-
11
- // Libraries
9
+ @import 'flex';
12
10
  @import 'breakpoint';
13
-
14
- // Mixins
15
11
  @import 'mixins';
@@ -89,38 +89,19 @@
89
89
  style: solid,
90
90
  color: #000,
91
91
  );
92
- @return map-get($defaults, $elem);
93
- }
94
92
 
95
- /// Calculates x^y, where x is `$base` and y is `$power`.
96
- /// @access private
97
- ///
98
- /// @param {Number} $base - Base number (x).
99
- /// @param {Number} $power - Exponent (y).
100
- @function pow($base, $power) {
101
- @if $power == 0 { @return 1; }
102
- @return $base * pow($base, $power - 1);
93
+ @return map-get($defaults, $elem);
103
94
  }
104
95
 
105
- // TODO: Remove this (it's used by the grid but is overkill)
106
- /// Given a user-defined list of keywords and a list of possible keywords, find the ones that were passed in.
107
- /// @access private
96
+ /// Finds a value in a nested map.
97
+ /// @link https://css-tricks.com/snippets/sass/deep-getset-maps/ Deep Get/Set in Maps
108
98
  ///
109
- /// @param {List} $opts - List of values to find keywords in.
110
- /// @param {List} $seeking - List of all possible keywords.
111
- ///
112
- /// @returns {Map} A map of all keywords in $seeking. If a keyword was found in $opts, its value is true, otherwise false.
113
- @function -zf-get-options($opts, $seeking) {
114
- @if type-of($opts) != 'list' {
115
- $opts: ($opts);
116
- }
117
-
118
- $map: ();
119
- @each $keyword in $seeking {
120
- $val: if(index($opts, $keyword) != null, true, false);
121
- $item: ($keyword: $val);
122
- $map: map-merge($map, $item);
99
+ /// @param {Map} $map - Map to pull a value from.
100
+ /// @param {String} $keys... - Keys to use when looking for a value.
101
+ /// @return The value found in the map.
102
+ @function map-deep-get($map, $keys...) {
103
+ @each $key in $keys {
104
+ $map: map-get($map, $key);
123
105
  }
124
-
125
106
  @return $map;
126
107
  }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: foundation-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 6.1.2.0
4
+ version: 6.2.0.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - ZURB
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2016-01-24 00:00:00.000000000 Z
11
+ date: 2016-03-01 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass
@@ -44,6 +44,20 @@ dependencies:
44
44
  - - ">="
45
45
  - !ruby/object:Gem::Version
46
46
  version: 3.1.0
47
+ - !ruby/object:Gem::Dependency
48
+ name: sprockets-es6
49
+ requirement: !ruby/object:Gem::Requirement
50
+ requirements:
51
+ - - ">="
52
+ - !ruby/object:Gem::Version
53
+ version: 0.9.0
54
+ type: :runtime
55
+ prerelease: false
56
+ version_requirements: !ruby/object:Gem::Requirement
57
+ requirements:
58
+ - - ">="
59
+ - !ruby/object:Gem::Version
60
+ version: 0.9.0
47
61
  - !ruby/object:Gem::Dependency
48
62
  name: bundler
49
63
  requirement: !ruby/object:Gem::Requirement
@@ -146,35 +160,35 @@ files:
146
160
  - spec/features/generator_spec.rb
147
161
  - spec/spec_helper.rb
148
162
  - spec/support/helpers.rb
149
- - vendor/assets/js/foundation.abide.js
150
- - vendor/assets/js/foundation.accordion.js
151
- - vendor/assets/js/foundation.accordionMenu.js
152
- - vendor/assets/js/foundation.core.js
153
- - vendor/assets/js/foundation.drilldown.js
154
- - vendor/assets/js/foundation.dropdown.js
155
- - vendor/assets/js/foundation.dropdownMenu.js
156
- - vendor/assets/js/foundation.equalizer.js
157
- - vendor/assets/js/foundation.interchange.js
158
- - vendor/assets/js/foundation.js
159
- - vendor/assets/js/foundation.magellan.js
160
- - vendor/assets/js/foundation.offcanvas.js
161
- - vendor/assets/js/foundation.orbit.js
162
- - vendor/assets/js/foundation.responsiveMenu.js
163
- - vendor/assets/js/foundation.responsiveToggle.js
164
- - vendor/assets/js/foundation.reveal.js
165
- - vendor/assets/js/foundation.slider.js
166
- - vendor/assets/js/foundation.sticky.js
167
- - vendor/assets/js/foundation.tabs.js
168
- - vendor/assets/js/foundation.toggler.js
169
- - vendor/assets/js/foundation.tooltip.js
170
- - vendor/assets/js/foundation.util.box.js
171
- - vendor/assets/js/foundation.util.keyboard.js
172
- - vendor/assets/js/foundation.util.mediaQuery.js
173
- - vendor/assets/js/foundation.util.motion.js
174
- - vendor/assets/js/foundation.util.nest.js
175
- - vendor/assets/js/foundation.util.timerAndImageLoader.js
176
- - vendor/assets/js/foundation.util.touch.js
177
- - vendor/assets/js/foundation.util.triggers.js
163
+ - vendor/assets/js/foundation.abide.js.es6
164
+ - vendor/assets/js/foundation.accordion.js.es6
165
+ - vendor/assets/js/foundation.accordionMenu.js.es6
166
+ - vendor/assets/js/foundation.core.js.es6
167
+ - vendor/assets/js/foundation.drilldown.js.es6
168
+ - vendor/assets/js/foundation.dropdown.js.es6
169
+ - vendor/assets/js/foundation.dropdownMenu.js.es6
170
+ - vendor/assets/js/foundation.equalizer.js.es6
171
+ - vendor/assets/js/foundation.interchange.js.es6
172
+ - vendor/assets/js/foundation.js.es6
173
+ - vendor/assets/js/foundation.magellan.js.es6
174
+ - vendor/assets/js/foundation.offcanvas.js.es6
175
+ - vendor/assets/js/foundation.orbit.js.es6
176
+ - vendor/assets/js/foundation.responsiveMenu.js.es6
177
+ - vendor/assets/js/foundation.responsiveToggle.js.es6
178
+ - vendor/assets/js/foundation.reveal.js.es6
179
+ - vendor/assets/js/foundation.slider.js.es6
180
+ - vendor/assets/js/foundation.sticky.js.es6
181
+ - vendor/assets/js/foundation.tabs.js.es6
182
+ - vendor/assets/js/foundation.toggler.js.es6
183
+ - vendor/assets/js/foundation.tooltip.js.es6
184
+ - vendor/assets/js/foundation.util.box.js.es6
185
+ - vendor/assets/js/foundation.util.keyboard.js.es6
186
+ - vendor/assets/js/foundation.util.mediaQuery.js.es6
187
+ - vendor/assets/js/foundation.util.motion.js.es6
188
+ - vendor/assets/js/foundation.util.nest.js.es6
189
+ - vendor/assets/js/foundation.util.timerAndImageLoader.js.es6
190
+ - vendor/assets/js/foundation.util.touch.js.es6
191
+ - vendor/assets/js/foundation.util.triggers.js.es6
178
192
  - vendor/assets/scss/_global.scss
179
193
  - vendor/assets/scss/components/_accordion-menu.scss
180
194
  - vendor/assets/scss/components/_accordion.scss
@@ -188,9 +202,11 @@ files:
188
202
  - vendor/assets/scss/components/_dropdown-menu.scss
189
203
  - vendor/assets/scss/components/_dropdown.scss
190
204
  - vendor/assets/scss/components/_flex-video.scss
205
+ - vendor/assets/scss/components/_flex.scss
191
206
  - vendor/assets/scss/components/_float.scss
192
207
  - vendor/assets/scss/components/_label.scss
193
208
  - vendor/assets/scss/components/_media-object.scss
209
+ - vendor/assets/scss/components/_menu-icon.scss
194
210
  - vendor/assets/scss/components/_menu.scss
195
211
  - vendor/assets/scss/components/_off-canvas.scss
196
212
  - vendor/assets/scss/components/_orbit.scss
@@ -214,6 +230,9 @@ files:
214
230
  - vendor/assets/scss/forms/_help-text.scss
215
231
  - vendor/assets/scss/forms/_input-group.scss
216
232
  - vendor/assets/scss/forms/_label.scss
233
+ - vendor/assets/scss/forms/_meter.scss
234
+ - vendor/assets/scss/forms/_progress.scss
235
+ - vendor/assets/scss/forms/_range.scss
217
236
  - vendor/assets/scss/forms/_select.scss
218
237
  - vendor/assets/scss/forms/_text.scss
219
238
  - vendor/assets/scss/foundation.scss
@@ -256,6 +275,7 @@ files:
256
275
  - vendor/assets/scss/typography/_typography.scss
257
276
  - vendor/assets/scss/util/_breakpoint.scss
258
277
  - vendor/assets/scss/util/_color.scss
278
+ - vendor/assets/scss/util/_flex.scss
259
279
  - vendor/assets/scss/util/_mixins.scss
260
280
  - vendor/assets/scss/util/_selector.scss
261
281
  - vendor/assets/scss/util/_unit.scss
@@ -1,418 +0,0 @@
1
- !function(Foundation, $) {
2
- 'use strict';
3
-
4
- /**
5
- * Creates a new instance of Abide.
6
- * @class
7
- * @fires Abide#init
8
- * @param {Object} element - jQuery object to add the trigger to.
9
- * @param {Object} options - Overrides to the default plugin settings.
10
- */
11
- function Abide(element, options) {
12
- this.$element = element;
13
- this.options = $.extend({}, Abide.defaults, this.$element.data(), options);
14
-
15
- this._init();
16
-
17
- Foundation.registerPlugin(this, 'Abide');
18
- }
19
-
20
- /**
21
- * Default settings for plugin
22
- */
23
- Abide.defaults = {
24
- /**
25
- * The default event to validate inputs. Checkboxes and radios validate immediately.
26
- * Remove or change this value for manual validation.
27
- * @option
28
- * @example 'fieldChange'
29
- */
30
- validateOn: 'fieldChange',
31
- /**
32
- * Class to be applied to input labels on failed validation.
33
- * @option
34
- * @example 'is-invalid-label'
35
- */
36
- labelErrorClass: 'is-invalid-label',
37
- /**
38
- * Class to be applied to inputs on failed validation.
39
- * @option
40
- * @example 'is-invalid-input'
41
- */
42
- inputErrorClass: 'is-invalid-input',
43
- /**
44
- * Class selector to use to target Form Errors for show/hide.
45
- * @option
46
- * @example '.form-error'
47
- */
48
- formErrorSelector: '.form-error',
49
- /**
50
- * Class added to Form Errors on failed validation.
51
- * @option
52
- * @example 'is-visible'
53
- */
54
- formErrorClass: 'is-visible',
55
- /**
56
- * Set to true to validate text inputs on any value change.
57
- * @option
58
- * @example false
59
- */
60
- liveValidate: false,
61
-
62
- patterns: {
63
- alpha : /^[a-zA-Z]+$/,
64
- alpha_numeric : /^[a-zA-Z0-9]+$/,
65
- integer : /^[-+]?\d+$/,
66
- number : /^[-+]?\d*(?:[\.\,]\d+)?$/,
67
-
68
- // amex, visa, diners
69
- card : /^(?:4[0-9]{12}(?:[0-9]{3})?|5[1-5][0-9]{14}|6(?:011|5[0-9][0-9])[0-9]{12}|3[47][0-9]{13}|3(?:0[0-5]|[68][0-9])[0-9]{11}|(?:2131|1800|35\d{3})\d{11})$/,
70
- cvv : /^([0-9]){3,4}$/,
71
-
72
- // http://www.whatwg.org/specs/web-apps/current-work/multipage/states-of-the-type-attribute.html#valid-e-mail-address
73
- email : /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+$/,
74
-
75
- url : /^(https?|ftp|file|ssh):\/\/(((([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-zA-Z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-zA-Z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-zA-Z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-zA-Z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-zA-Z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-zA-Z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-zA-Z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/,
76
- // abc.de
77
- domain : /^([a-zA-Z0-9]([a-zA-Z0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,8}$/,
78
-
79
- datetime : /^([0-2][0-9]{3})\-([0-1][0-9])\-([0-3][0-9])T([0-5][0-9])\:([0-5][0-9])\:([0-5][0-9])(Z|([\-\+]([0-1][0-9])\:00))$/,
80
- // YYYY-MM-DD
81
- date : /(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))$/,
82
- // HH:MM:SS
83
- time : /^(0[0-9]|1[0-9]|2[0-3])(:[0-5][0-9]){2}$/,
84
- dateISO : /^\d{4}[\/\-]\d{1,2}[\/\-]\d{1,2}$/,
85
- // MM/DD/YYYY
86
- month_day_year : /^(0[1-9]|1[012])[- \/.](0[1-9]|[12][0-9]|3[01])[- \/.]\d{4}$/,
87
- // DD/MM/YYYY
88
- day_month_year : /^(0[1-9]|[12][0-9]|3[01])[- \/.](0[1-9]|1[012])[- \/.]\d{4}$/,
89
-
90
- // #FFF or #FFFFFF
91
- color : /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/
92
- },
93
- /**
94
- * Optional validation functions to be used. `equalTo` being the only default included function.
95
- * Functions should return only a boolean if the input is valid or not. Functions are given the following arguments:
96
- * el : The jQuery element to validate.
97
- * required : Boolean value of the required attribute be present or not.
98
- * parent : The direct parent of the input.
99
- * @option
100
- */
101
- validators: {
102
- equalTo: function (el, required, parent) {
103
- return $('#' + el.attr('data-equalto')).val() === el.val();
104
- }
105
- }
106
- };
107
-
108
-
109
- /**
110
- * Initializes the Abide plugin and calls functions to get Abide functioning on load.
111
- * @private
112
- */
113
- Abide.prototype._init = function(){
114
- this.$inputs = this.$element.find('input, textarea, select').not('[data-abide-ignore]');
115
-
116
- this._events();
117
- };
118
-
119
- /**
120
- * Initializes events for Abide.
121
- * @private
122
- */
123
- Abide.prototype._events = function() {
124
- var _this = this;
125
-
126
- this.$element.off('.abide')
127
- .on('reset.zf.abide', function(e){
128
- _this.resetForm();
129
- })
130
- .on('submit.zf.abide', function(e){
131
- return _this.validateForm();
132
- });
133
-
134
- if(this.options.validateOn === 'fieldChange'){
135
- this.$inputs.off('change.zf.abide')
136
- .on('change.zf.abide', function(e){
137
- _this.validateInput($(this));
138
- });
139
- }
140
-
141
- if(this.options.liveValidate){
142
- this.$inputs.off('input.zf.abide')
143
- .on('input.zf.abide', function(e){
144
- _this.validateInput($(this));
145
- });
146
- }
147
- },
148
- /**
149
- * Calls necessary functions to update Abide upon DOM change
150
- * @private
151
- */
152
- Abide.prototype._reflow = function() {
153
- this._init();
154
- };
155
- /**
156
- * Checks whether or not a form element has the required attribute and if it's checked or not
157
- * @param {Object} element - jQuery object to check for required attribute
158
- * @returns {Boolean} Boolean value depends on whether or not attribute is checked or empty
159
- */
160
- Abide.prototype.requiredCheck = function($el) {
161
- if(!$el.attr('required')) return true;
162
- var isGood = true;
163
- switch ($el[0].type) {
164
-
165
- case 'checkbox':
166
- case 'radio':
167
- isGood = $el[0].checked;
168
- break;
169
-
170
- case 'select':
171
- case 'select-one':
172
- case 'select-multiple':
173
- var opt = $el.find('option:selected');
174
- if(!opt.length || !opt.val()) isGood = false;
175
- break;
176
-
177
- default:
178
- if(!$el.val() || !$el.val().length) isGood = false;
179
- }
180
- return isGood;
181
- };
182
- /**
183
- * Based on $el, get the first element with selector in this order:
184
- * 1. The element's direct sibling('s).
185
- * 3. The element's parent's children.
186
- *
187
- * This allows for multiple form errors per input, though if none are found, no form errors will be shown.
188
- *
189
- * @param {Object} $el - jQuery object to use as reference to find the form error selector.
190
- * @returns {Object} jQuery object with the selector.
191
- */
192
- Abide.prototype.findFormError = function($el){
193
- var $error = $el.siblings(this.options.formErrorSelector);
194
- if(!$error.length){
195
- $error = $el.parent().find(this.options.formErrorSelector);
196
- }
197
- return $error;
198
- };
199
- /**
200
- * Get the first element in this order:
201
- * 2. The <label> with the attribute `[for="someInputId"]`
202
- * 3. The `.closest()` <label>
203
- *
204
- * @param {Object} $el - jQuery object to check for required attribute
205
- * @returns {Boolean} Boolean value depends on whether or not attribute is checked or empty
206
- */
207
- Abide.prototype.findLabel = function($el) {
208
- var $label = this.$element.find('label[for="' + $el[0].id + '"]');
209
- if(!$label.length){
210
- return $el.closest('label');
211
- }
212
- return $label;
213
- };
214
- /**
215
- * Adds the CSS error class as specified by the Abide settings to the label, input, and the form
216
- * @param {Object} $el - jQuery object to add the class to
217
- */
218
- Abide.prototype.addErrorClasses = function($el){
219
- var $label = this.findLabel($el),
220
- $formError = this.findFormError($el);
221
-
222
- if($label.length){
223
- $label.addClass(this.options.labelErrorClass);
224
- }
225
- if($formError.length){
226
- $formError.addClass(this.options.formErrorClass);
227
- }
228
- $el.addClass(this.options.inputErrorClass).attr('data-invalid', '');
229
- };
230
- /**
231
- * Removes CSS error class as specified by the Abide settings from the label, input, and the form
232
- * @param {Object} $el - jQuery object to remove the class from
233
- */
234
- Abide.prototype.removeErrorClasses = function($el){
235
- var $label = this.findLabel($el),
236
- $formError = this.findFormError($el);
237
-
238
- if($label.length){
239
- $label.removeClass(this.options.labelErrorClass);
240
- }
241
- if($formError.length){
242
- $formError.removeClass(this.options.formErrorClass);
243
- }
244
- $el.removeClass(this.options.inputErrorClass).removeAttr('data-invalid');
245
- };
246
- /**
247
- * Goes through a form to find inputs and proceeds to validate them in ways specific to their type
248
- * @fires Abide#invalid
249
- * @fires Abide#valid
250
- * @param {Object} element - jQuery object to validate, should be an HTML input
251
- * @returns {Boolean} goodToGo - If the input is valid or not.
252
- */
253
- Abide.prototype.validateInput = function($el){
254
- var clearRequire = this.requiredCheck($el),
255
- validated = false,
256
- customValidator = true,
257
- validator = $el.attr('data-validator'),
258
- equalTo = true;
259
-
260
- switch ($el[0].type) {
261
-
262
- case 'radio':
263
- validated = this.validateRadio($el.attr('name'));
264
- break;
265
-
266
- case 'checkbox':
267
- validated = clearRequire;
268
- break;
269
-
270
- case 'select':
271
- case 'select-one':
272
- case 'select-multiple':
273
- validated = clearRequire;
274
- break;
275
-
276
- default:
277
- validated = this.validateText($el);
278
- }
279
-
280
- if(validator){ customValidator = this.matchValidation($el, validator, $el.attr('required')); }
281
- if($el.attr('data-equalto')){ equalTo = this.options.validators.equalTo($el); }
282
-
283
- var goodToGo = [clearRequire, validated, customValidator, equalTo].indexOf(false) === -1,
284
- message = (goodToGo ? 'valid' : 'invalid') + '.zf.abide';
285
-
286
- this[goodToGo ? 'removeErrorClasses' : 'addErrorClasses']($el);
287
-
288
- /**
289
- * Fires when the input is done checking for validation. Event trigger is either `valid.zf.abide` or `invalid.zf.abide`
290
- * Trigger includes the DOM element of the input.
291
- * @event Abide#valid
292
- * @event Abide#invalid
293
- */
294
- $el.trigger(message, [$el]);
295
-
296
- return goodToGo;
297
- };
298
- /**
299
- * Goes through a form and if there are any invalid inputs, it will display the form error element
300
- * @returns {Boolean} noError - true if no errors were detected...
301
- * @fires Abide#formvalid
302
- * @fires Abide#forminvalid
303
- */
304
- Abide.prototype.validateForm = function(){
305
- var acc = [],
306
- _this = this;
307
-
308
- this.$inputs.each(function(){
309
- acc.push(_this.validateInput($(this)));
310
- });
311
-
312
- var noError = acc.indexOf(false) === -1;
313
-
314
- this.$element.find('[data-abide-error]').css('display', (noError ? 'none' : 'block'));
315
- /**
316
- * Fires when the form is finished validating. Event trigger is either `formvalid.zf.abide` or `forminvalid.zf.abide`.
317
- * Trigger includes the element of the form.
318
- * @event Abide#formvalid
319
- * @event Abide#forminvalid
320
- */
321
- this.$element.trigger((noError ? 'formvalid' : 'forminvalid') + '.zf.abide', [this.$element]);
322
-
323
- return noError;
324
- };
325
- /**
326
- * Determines whether or a not a text input is valid based on the pattern specified in the attribute. If no matching pattern is found, returns true.
327
- * @param {Object} $el - jQuery object to validate, should be a text input HTML element
328
- * @param {String} pattern - string value of one of the RegEx patterns in Abide.options.patterns
329
- * @returns {Boolean} Boolean value depends on whether or not the input value matches the pattern specified
330
- */
331
- Abide.prototype.validateText = function($el, pattern){
332
- // pattern = pattern ? pattern : $el.attr('pattern') ? $el.attr('pattern') : $el.attr('type');
333
- pattern = (pattern || $el.attr('pattern') || $el.attr('type'));
334
- var inputText = $el.val();
335
-
336
- return inputText.length ?//if text, check if the pattern exists, if so, test it, if no text or no pattern, return true.
337
- this.options.patterns.hasOwnProperty(pattern) ? this.options.patterns[pattern].test(inputText) :
338
- pattern && pattern !== $el.attr('type') ? new RegExp(pattern).test(inputText) : true : true;
339
- }; /**
340
- * Determines whether or a not a radio input is valid based on whether or not it is required and selected
341
- * @param {String} groupName - A string that specifies the name of a radio button group
342
- * @returns {Boolean} Boolean value depends on whether or not at least one radio input has been selected (if it's required)
343
- */
344
- Abide.prototype.validateRadio = function(groupName){
345
- var $group = this.$element.find(':radio[name="' + groupName + '"]'),
346
- counter = [],
347
- _this = this;
348
-
349
- $group.each(function(){
350
- var rdio = $(this),
351
- clear = _this.requiredCheck(rdio);
352
- counter.push(clear);
353
- if(clear) _this.removeErrorClasses(rdio);
354
- });
355
-
356
- return counter.indexOf(false) === -1;
357
- };
358
- /**
359
- * Determines if a selected input passes a custom validation function. Multiple validations can be used, if passed to the element with `data-validator="foo bar baz"` in a space separated listed.
360
- * @param {Object} $el - jQuery input element.
361
- * @param {String} validators - a string of function names matching functions in the Abide.options.validators object.
362
- * @param {Boolean} required - self explanatory?
363
- * @returns {Boolean} - true if validations passed.
364
- */
365
- Abide.prototype.matchValidation = function($el, validators, required){
366
- var _this = this;
367
- required = required ? true : false;
368
- var clear = validators.split(' ').map(function(v){
369
- return _this.options.validators[v]($el, required, $el.parent());
370
- });
371
- return clear.indexOf(false) === -1;
372
- };
373
- /**
374
- * Resets form inputs and styles
375
- * @fires Abide#formreset
376
- */
377
- Abide.prototype.resetForm = function() {
378
- var $form = this.$element,
379
- opts = this.options;
380
-
381
- $('.' + opts.labelErrorClass, $form).not('small').removeClass(opts.labelErrorClass);
382
- $('.' + opts.inputErrorClass, $form).not('small').removeClass(opts.inputErrorClass);
383
- $(opts.formErrorSelector + '.' + opts.formErrorClass).removeClass(opts.formErrorClass);
384
- $form.find('[data-abide-error]').css('display', 'none');
385
- $(':input', $form).not(':button, :submit, :reset, :hidden, [data-abide-ignore]').val('').removeAttr('data-invalid');
386
- /**
387
- * Fires when the form has been reset.
388
- * @event Abide#formreset
389
- */
390
- $form.trigger('formreset.zf.abide', [$form]);
391
- };
392
- /**
393
- * Destroys an instance of Abide.
394
- * Removes error styles and classes from elements, without resetting their values.
395
- */
396
- Abide.prototype.destroy = function(){
397
- var _this = this;
398
- this.$element.off('.abide')
399
- .find('[data-abide-error]').css('display', 'none');
400
- this.$inputs.off('.abide')
401
- .each(function(){
402
- _this.removeErrorClasses($(this));
403
- });
404
-
405
- Foundation.unregisterPlugin(this);
406
- };
407
-
408
- Foundation.plugin(Abide, 'Abide');
409
-
410
- // Exports for AMD/Browserify
411
- if (typeof module !== 'undefined' && typeof module.exports !== 'undefined')
412
- module.exports = Abide;
413
- if (typeof define === 'function')
414
- define(['foundation'], function() {
415
- return Abide;
416
- });
417
-
418
- }(Foundation, jQuery);