foundation.accordion.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. ;(function ($, window, document, undefined) {
  2. 'use strict';
  3. Foundation.libs.accordion = {
  4. name : 'accordion',
  5. version : '5.5.3',
  6. settings : {
  7. content_class : 'content',
  8. active_class : 'active',
  9. multi_expand : false,
  10. toggleable : true,
  11. callback : function () {}
  12. },
  13. init : function (scope, method, options) {
  14. this.bindings(method, options);
  15. },
  16. events : function (instance) {
  17. var self = this;
  18. var S = this.S;
  19. self.create(this.S(instance));
  20. S(this.scope)
  21. .off('.fndtn.accordion')
  22. .on('click.fndtn.accordion', '[' + this.attr_name() + '] > dd > a, [' + this.attr_name() + '] > li > a', function (e) {
  23. var accordion = S(this).closest('[' + self.attr_name() + ']'),
  24. groupSelector = self.attr_name() + '=' + accordion.attr(self.attr_name()),
  25. settings = accordion.data(self.attr_name(true) + '-init') || self.settings,
  26. target = S('#' + this.href.split('#')[1]),
  27. aunts = $('> dd, > li', accordion),
  28. siblings = aunts.children('.' + settings.content_class),
  29. active_content = siblings.filter('.' + settings.active_class);
  30. e.preventDefault();
  31. if (accordion.attr(self.attr_name())) {
  32. siblings = siblings.add('[' + groupSelector + '] dd > ' + '.' + settings.content_class + ', [' + groupSelector + '] li > ' + '.' + settings.content_class);
  33. aunts = aunts.add('[' + groupSelector + '] dd, [' + groupSelector + '] li');
  34. }
  35. if (settings.toggleable && target.is(active_content)) {
  36. target.parent('dd, li').toggleClass(settings.active_class, false);
  37. target.toggleClass(settings.active_class, false);
  38. S(this).attr('aria-expanded', function(i, attr){
  39. return attr === 'true' ? 'false' : 'true';
  40. });
  41. settings.callback(target);
  42. target.triggerHandler('toggled', [accordion]);
  43. accordion.triggerHandler('toggled', [target]);
  44. return;
  45. }
  46. if (!settings.multi_expand) {
  47. siblings.removeClass(settings.active_class);
  48. aunts.removeClass(settings.active_class);
  49. aunts.children('a').attr('aria-expanded','false');
  50. }
  51. target.addClass(settings.active_class).parent().addClass(settings.active_class);
  52. settings.callback(target);
  53. target.triggerHandler('toggled', [accordion]);
  54. accordion.triggerHandler('toggled', [target]);
  55. S(this).attr('aria-expanded','true');
  56. });
  57. },
  58. create: function($instance) {
  59. var self = this,
  60. accordion = $instance,
  61. aunts = $('> .accordion-navigation', accordion),
  62. settings = accordion.data(self.attr_name(true) + '-init') || self.settings;
  63. aunts.children('a').attr('aria-expanded','false');
  64. aunts.has('.' + settings.content_class + '.' + settings.active_class).addClass(settings.active_class).children('a').attr('aria-expanded','true');
  65. if (settings.multi_expand) {
  66. $instance.attr('aria-multiselectable','true');
  67. }
  68. },
  69. toggle : function(options) {
  70. var options = typeof options !== 'undefined' ? options : {};
  71. var selector = typeof options.selector !== 'undefined' ? options.selector : '';
  72. var toggle_state = typeof options.toggle_state !== 'undefined' ? options.toggle_state : '';
  73. var $accordion = typeof options.$accordion !== 'undefined' ? options.$accordion : this.S(this.scope).closest('[' + this.attr_name() + ']');
  74. var $items = $accordion.find('> dd' + selector + ', > li' + selector);
  75. if ( $items.length < 1 ) {
  76. if ( window.console ) {
  77. console.error('Selection not found.', selector);
  78. }
  79. return false;
  80. }
  81. var S = this.S;
  82. var active_class = this.settings.active_class;
  83. $items.each(function() {
  84. var $item = S(this);
  85. var is_active = $item.hasClass(active_class);
  86. if ( ( is_active && toggle_state === 'close' ) || ( !is_active && toggle_state === 'open' ) || toggle_state === '' ) {
  87. $item.find('> a').trigger('click.fndtn.accordion');
  88. }
  89. });
  90. },
  91. open : function(options) {
  92. var options = typeof options !== 'undefined' ? options : {};
  93. options.toggle_state = 'open';
  94. this.toggle(options);
  95. },
  96. close : function(options) {
  97. var options = typeof options !== 'undefined' ? options : {};
  98. options.toggle_state = 'close';
  99. this.toggle(options);
  100. },
  101. off : function () {},
  102. reflow : function () {}
  103. };
  104. }(jQuery, window, window.document));