/app/scripts/vendor/foundation/jquery.foundation.buttons.js

https://bitbucket.org/ceoaliongroo/torredelprior · JavaScript · 74 lines · 53 code · 13 blank · 8 comment · 3 complexity · 7b4debddf16ffad788ccf97f2f8f2604 MD5 · raw file

  1. ;(function ($, window, undefined) {
  2. 'use strict';
  3. $.fn.foundationButtons = function (options) {
  4. var $doc = $(document),
  5. config = $.extend({
  6. dropdownAsToggle:true,
  7. activeClass:'active'
  8. }, options),
  9. // close all dropdowns except for the dropdown passed
  10. closeDropdowns = function (dropdown) {
  11. $('.button.dropdown').find('ul').not(dropdown).removeClass('show-dropdown');
  12. },
  13. // reset all toggle states except for the button passed
  14. resetToggles = function (button) {
  15. var buttons = $('.button.dropdown').not(button);
  16. buttons.add($('> span.' + config.activeClass, buttons)).removeClass(config.activeClass);
  17. };
  18. // Prevent event propagation on disabled buttons
  19. $doc.on('click.fndtn', '.button.disabled', function (e) {
  20. e.preventDefault();
  21. });
  22. $('.button.dropdown > ul', this).addClass('no-hover');
  23. // reset other active states
  24. $doc.on('click.fndtn', '.button.dropdown:not(.split), .button.dropdown.split span', function (e) {
  25. var $el = $(this),
  26. button = $el.closest('.button.dropdown'),
  27. dropdown = $('> ul', button);
  28. e.preventDefault();
  29. // close other dropdowns
  30. closeDropdowns(config.dropdownAsToggle ? dropdown : '');
  31. dropdown.toggleClass('show-dropdown');
  32. if (config.dropdownAsToggle) {
  33. resetToggles(button);
  34. $el.toggleClass(config.activeClass);
  35. }
  36. });
  37. // close all dropdowns and deactivate all buttons
  38. $doc.on('click.fndtn', 'body, html', function (e) {
  39. // check original target instead of stopping event propagation to play nice with other events
  40. if (!$(e.originalEvent.target).is('.button.dropdown:not(.split), .button.dropdown.split span')) {
  41. closeDropdowns();
  42. if (config.dropdownAsToggle) {
  43. resetToggles();
  44. }
  45. }
  46. });
  47. // Positioning the Flyout List
  48. var normalButtonHeight = $('.button.dropdown:not(.large):not(.small):not(.tiny)', this).outerHeight() - 1,
  49. largeButtonHeight = $('.button.large.dropdown', this).outerHeight() - 1,
  50. smallButtonHeight = $('.button.small.dropdown', this).outerHeight() - 1,
  51. tinyButtonHeight = $('.button.tiny.dropdown', this).outerHeight() - 1;
  52. $('.button.dropdown:not(.large):not(.small):not(.tiny) > ul', this).css('top', normalButtonHeight);
  53. $('.button.dropdown.large > ul', this).css('top', largeButtonHeight);
  54. $('.button.dropdown.small > ul', this).css('top', smallButtonHeight);
  55. $('.button.dropdown.tiny > ul', this).css('top', tinyButtonHeight);
  56. $('.button.dropdown.up:not(.large):not(.small):not(.tiny) > ul', this).css('top', 'auto').css('bottom', normalButtonHeight - 2);
  57. $('.button.dropdown.up.large > ul', this).css('top', 'auto').css('bottom', largeButtonHeight - 2);
  58. $('.button.dropdown.up.small > ul', this).css('top', 'auto').css('bottom', smallButtonHeight - 2);
  59. $('.button.dropdown.up.tiny > ul', this).css('top', 'auto').css('bottom', tinyButtonHeight - 2);
  60. };
  61. })( jQuery, this );