Template:Fudan Button/Javascript

/*! @license

• Project: Buttons
• Description: A highly customizable CSS button library built with Sass and Compass
• Author: Alex Wolfe and Rob Levin
• License: Apache License v2.0
• /

// the semi-colon before function invocation is a safety net against concatenated // scripts and/or other plugins which may not be closed properly.

(function ( $, window, document, undefined ) {

 'use strict';

 // undefined is used here as the undefined global variable in ECMAScript 3 is
 // mutable (ie. it can be changed by someone else). undefined isn't really being
 // passed in so we can ensure the value of it is truly undefined. In ES5, undefined
 // can no longer be modified.

 // window and document are passed through as local variable rather than global
 // as this (slightly) quickens the resolution process and can be more efficiently
 // minified (especially when both are regularly referenced in your plugin).

 // Create the defaults once
 var pluginName = "menuButton";
 var menuClass = ".button-dropdown";
 var defaults = {
   propertyName: "value"
 };

 // The actual plugin constructor
 function Plugin( element, options ) {

   //SET OPTIONS
   this.options = $.extend( {}, defaults, options );
   this._defaults = defaults;
   this._name = pluginName;

   //REGISTER ELEMENT
   this.$element = $(element);

   //INITIALIZE
   this.init();
 }

 Plugin.prototype = {
   constructor: Plugin,

   init: function() {
     // WE DON'T STOP PROPGATION SO CLICKS WILL AUTOMATICALLY
     // TOGGLE AND REMOVE THE DROPDOWN
     this.toggle();
   },

   toggle: function(el, options) {
     if(this.$element.data('dropdown') === 'show') {
       this.hideMenu();
     }
     else {
       this.showMenu();
     }
   },

   showMenu: function() {
     this.$element.data('dropdown', 'show');
     this.$element.find('ul').show();
     this.$element.find('.button:first').addClass('is-active');
   },

   hideMenu: function() {
     this.$element.data('dropdown', 'hide');
     this.$element.find('ul').hide();
     this.$element.find('.button:first').removeClass('is-active');
   }
 };

 // A really lightweight plugin wrapper around the constructor,
 // preventing against multiple instantiations
 $.fn[pluginName] = function ( options ) {
   return this.each(function () {

     // TOGGLE BUTTON IF IT EXISTS
     if ($.data(this, "plugin_" + pluginName)) {
       $.data(this, "plugin_" + pluginName).toggle();
     }
     // OTHERWISE CREATE A NEW INSTANCE
     else {
       $.data(this, "plugin_" + pluginName, new Plugin( this, options ));
     }
   });
 };

 //CLOSE OPEN DROPDOWN MENUS IF CLICKED SOMEWHERE ELSE
 $(document).on('click', function(e) {
   $.each($('[data-buttons=dropdown]'), function(i, value) {
     if ($(e.target.offsetParent)[0] != $(this)[0]) {
       if ($.data(this, "plugin_" + pluginName)) {
         $.data(this, "plugin_" + pluginName).hideMenu();
         $(this).find('ul').hide();
       }
     }
   });
 });

 //DELEGATE CLICK EVENT FOR DROPDOWN MENUS
 $(document).on('click', '[data-buttons=dropdown]', function(e) {
   var $dropdown = $(e.currentTarget);
   $dropdown.menuButton();
 });

 //IGNORE CLICK EVENTS FROM DISPLAY BUTTON IN DROPDOWN
 $(document).on('click', '[data-buttons=dropdown] > a', function(e) {
   e.preventDefault();
 });

})( jQuery, window, document);