{"version":3,"names":[],"mappings":"","sources":["uiMorphingButton_inflow.js"],"sourcesContent":["/**\r\n * uiMorphingButton_inflow.js v1.0.0\r\n * http://www.codrops.com\r\n *\r\n * Licensed under the MIT license.\r\n * http://www.opensource.org/licenses/mit-license.php\r\n * \r\n * Copyright 2014, Codrops\r\n * http://www.codrops.com\r\n */\r\n;( function( window ) {\r\n\t\r\n\t'use strict';\r\n\r\n\tvar transEndEventNames = {\r\n\t\t\t'WebkitTransition': 'webkitTransitionEnd',\r\n\t\t\t'MozTransition': 'transitionend',\r\n\t\t\t'OTransition': 'oTransitionEnd',\r\n\t\t\t'msTransition': 'MSTransitionEnd',\r\n\t\t\t'transition': 'transitionend'\r\n\t\t},\r\n\t\ttransEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],\r\n\t\tsupport = { transitions : Modernizr.csstransitions };\r\n\r\n\tfunction extend( a, b ) {\r\n\t\tfor( var key in b ) { \r\n\t\t\tif( b.hasOwnProperty( key ) ) {\r\n\t\t\t\ta[key] = b[key];\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn a;\r\n\t}\r\n\r\n\tfunction UIMorphingButton( el, options ) {\r\n\t\tthis.el = el;\r\n\t\tthis.options = extend( {}, this.options );\r\n\t\textend( this.options, options );\r\n\t\tthis._init();\r\n\t}\r\n\r\n\tUIMorphingButton.prototype.options = {\r\n\t\tcloseEl : '',\r\n\t\tonBeforeOpen : function() { return false; },\r\n\t\tonAfterOpen : function() { return false; },\r\n\t\tonBeforeClose : function() { return false; },\r\n\t\tonAfterClose : function() { return false; }\r\n\t}\r\n\r\n\tUIMorphingButton.prototype._init = function() {\r\n\t\t// save element height\r\n\t\tthis.elH = this.el.offsetHeight;\r\n\t\t// the button\r\n\t\tthis.button = this.el.querySelector( 'button' );\r\n\t\t// state\r\n\t\tthis.expanded = false;\r\n\t\t// content el\r\n\t\tthis.contentEl = this.el.querySelector( '.morph-content' );\r\n\t\t// init events\r\n\t\tthis._initEvents();\r\n\t}\r\n\r\n\tUIMorphingButton.prototype._initEvents = function() {\r\n\t\tvar self = this;\r\n\t\t// open\r\n\t\tthis.button.addEventListener( 'click', function() { self.toggle(); } );\r\n\t\t// close\r\n\t\tif( this.options.closeEl !== '' ) {\r\n\t\t\tvar closeEl = this.el.querySelector( this.options.closeEl );\r\n\t\t\tif( closeEl ) {\r\n\t\t\t\tcloseEl.addEventListener( 'click', function() { self.toggle(); } );\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\tUIMorphingButton.prototype.toggle = function() {\r\n\t\tif( this.isAnimating ) return false;\r\n\r\n\t\t// callback\r\n\t\tif( this.expanded ) {\r\n\t\t\tthis.options.onBeforeClose();\r\n\t\t}\r\n\t\telse {\r\n\t\t\t// add class active (solves z-index problem when more than one button is in the page)\r\n\t\t\tclassie.addClass( this.el, 'active' );\r\n\t\t\tthis.options.onBeforeOpen();\r\n\t\t}\r\n\r\n\t\tthis.isAnimating = true;\r\n\r\n\t\tvar self = this,\r\n\t\t\tonEndTransitionFn = function( ev ) {\r\n\t\t\t\tif( ev.target !== this ) return false;\r\n\r\n\t\t\t\tif( support.transitions ) {\r\n\t\t\t\t\tthis.removeEventListener( transEndEventName, onEndTransitionFn );\r\n\t\t\t\t}\r\n\t\t\t\tself.isAnimating = false;\r\n\t\t\t\t\r\n\t\t\t\t// callback\r\n\t\t\t\tif( self.expanded ) {\r\n\t\t\t\t\t// remove class active (after closing)\r\n\t\t\t\t\tclassie.removeClass( self.el, 'active' );\r\n\t\t\t\t\tself.options.onAfterClose();\r\n\t\t\t\t}\r\n\t\t\t\telse {\r\n\t\t\t\t\tself.options.onAfterOpen();\r\n\t\t\t\t}\r\n\r\n\t\t\t\tself.expanded = !self.expanded;\r\n\t\t\t};\r\n\r\n\t\tif( support.transitions ) {\r\n\t\t\tthis.el.addEventListener( transEndEventName, onEndTransitionFn );\r\n\t\t}\r\n\t\telse {\r\n\t\t\tonEndTransitionFn();\r\n\t\t}\r\n\t\t\r\n\t\t// add/remove class \"open\" to the button wraper\r\n\t\tthis.el.style.height = this.expanded ? this.elH + 'px' : this.contentEl.offsetHeight + 'px';\r\n\t\t\r\n\t\tif( this.expanded ) {\r\n\t\t\tclassie.removeClass( this.el, 'open' );\r\n\t\t}\r\n\t\telse {\r\n\t\t\tclassie.addClass( this.el, 'open' );\r\n\t\t}\r\n\t}\r\n\r\n\t// add to global namespace\r\n\twindow.UIMorphingButton = UIMorphingButton;\r\n\r\n})( window );"],"file":"uiMorphingButton_inflow.js"}