diff --git a/dist/vanilla-modal.js b/dist/vanilla-modal.js index b452149..306f580 100644 --- a/dist/vanilla-modal.js +++ b/dist/vanilla-modal.js @@ -7,7 +7,7 @@ var _prototypeProperties = function (child, staticProps, instanceProps) { /** * @class VanillaModal - * @version 1.0.1 + * @version 1.1.0 * @author Ben Ceglowski */ var VanillaModal = (function () { @@ -220,6 +220,21 @@ var VanillaModal = (function () { enumerable: true, configurable: true }, + _detectTransition: { + value: function DetectTransition() { + var css = window.getComputedStyle(this.$.modal, null); + var transitionDuration = ["transitionDuration", "oTransitionDuration", "MozTransitionDuration", "webkitTransitionDuration"]; + var hasTransition = transitionDuration.filter(function (i) { + if (typeof css[i] === "string" && parseFloat(css[i]) > 0) { + return true; + } + }); + return hasTransition.length ? true : false; + }, + writable: true, + enumerable: true, + configurable: true + }, _close: { /** @@ -228,7 +243,8 @@ var VanillaModal = (function () { value: function Close(e) { if (typeof this.$$.onBeforeClose === "function") this.$$.onBeforeClose.call(this); this._removeClass(this.$.page, this.$$["class"]); - if (this.$$.transitions && this.$$.transitionEnd) { + var transitions = this._detectTransition(); + if (this.$$.transitions && this.$$.transitionEnd && transitions) { this._closeModalWithTransition(); } else { this._closeModal(); diff --git a/dist/vanilla-modal.min.js b/dist/vanilla-modal.min.js index 50ceb22..bd595f5 100644 --- a/dist/vanilla-modal.min.js +++ b/dist/vanilla-modal.min.js @@ -1,8 +1,8 @@ /** * @name vanilla-modal - * @version 1.0.1 + * @version 1.1.0 * @author Ben Ceglowski * @url http://phuse.ca * @date 2015-02-03 * @license MIT - */;"use strict";var _prototypeProperties=function(a,b,c){b&&Object.defineProperties(a,b),c&&Object.defineProperties(a.prototype,c)},VanillaModal=function(){function a(a){this.$$={modal:".modal",modalInner:".modal-inner",modalContent:".modal-content",open:'[rel="modal:open"]',close:'[rel="modal:close"]',page:"body","class":"modal-visible",loadClass:"vanilla-modal",clickOutside:!0,closeKey:27,transitions:!0,transitionEnd:null,onBeforeOpen:function(){},onBeforeClose:function(){},onOpen:function(){},onClose:function(){}},this._applyUserSettings(a),this.error=!1,this.isOpen=!1,this.current=null,this.open=this._open.bind(this),this.close=this._close.bind(this),this.$$.transitionEnd=this._transitionEndVendorSniff(),this.$=this._setupDomNodes(),this.error?console.error("Please fix errors before proceeding."):(this._addLoadedCssClass(),this._events().add())}return _prototypeProperties(a,null,{_applyUserSettings:{value:function(a){if("object"==typeof a)for(var b in a)a.hasOwnProperty(b)&&(this.$$[b]=a[b])},writable:!0,enumerable:!0,configurable:!0},_transitionEndVendorSniff:{value:function(){if(this.$$.transitions!==!1){var a=document.createElement("div"),b={transition:"transitionend",OTransition:"otransitionend",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(var c in b)if(b.hasOwnProperty(c)&&void 0!==a.style[c])return b[c]}},writable:!0,enumerable:!0,configurable:!0},_getNode:{value:function(a,b){var c=b||document,d=c.querySelector(a);return d?d:(this.error=!0,console.error(a+" not found in document."))},writable:!0,enumerable:!0,configurable:!0},_setupDomNodes:{value:function(){var a={};return a.modal=this._getNode(this.$$.modal),a.page=this._getNode(this.$$.page),a.modalInner=this._getNode(this.$$.modalInner,this.modal),a.modalContent=this._getNode(this.$$.modalContent,this.modal),a},writable:!0,enumerable:!0,configurable:!0},_addLoadedCssClass:{value:function(){this._addClass(this.$.page,this.$$.loadClass)},writable:!0,enumerable:!0,configurable:!0},_addClass:{value:function(a,b){if(!(!a instanceof HTMLElement)){var c=a.className.split(" ");-1===c.indexOf(b)&&c.push(b),a.className=c.join(" ")}},writable:!0,enumerable:!0,configurable:!0},_removeClass:{value:function(a,b){if(!(!a instanceof HTMLElement)){var c=a.className.split(" ");c.indexOf(b)>-1&&c.splice(c.indexOf(b),1),a.className=c.join(" ")}},writable:!0,enumerable:!0,configurable:!0},_setOpenId:{value:function(){var a=this.current.id||"anonymous";this.$.page.setAttribute("data-current-modal",a)},writable:!0,enumerable:!0,configurable:!0},_removeOpenId:{value:function(){this.$.page.removeAttribute("data-current-modal")},writable:!0,enumerable:!0,configurable:!0},_getElementContext:{value:function(a){return a&&"string"==typeof a.hash?document.querySelector(a.hash):"string"==typeof a?document.querySelector(a):console.error("No selector supplied to open()")},writable:!0,enumerable:!0,configurable:!0},_open:{value:function(a){return this.current=this._getElementContext(a),this.current instanceof HTMLElement==!1?console.error("VanillaModal target must exist on page."):("function"==typeof this.$$.onBeforeOpen&&this.$$.onBeforeOpen.call(this),this._captureNode(),this._addClass(this.$.page,this.$$["class"]),this._setOpenId(),this.isOpen=!0,void("function"==typeof this.$$.onOpen&&this.$$.onOpen.call(this)))},writable:!0,enumerable:!0,configurable:!0},_close:{value:function(){"function"==typeof this.$$.onBeforeClose&&this.$$.onBeforeClose.call(this),this._removeClass(this.$.page,this.$$["class"]),this.$$.transitions&&this.$$.transitionEnd?this._closeModalWithTransition():this._closeModal()},writable:!0,enumerable:!0,configurable:!0},_closeModal:{value:function(){this._removeOpenId(this.$.page),this._releaseNode(),this.isOpen=!1,this.current=null,"function"==typeof this.$$.onClose&&this.$$.onClose.call(this)},writable:!0,enumerable:!0,configurable:!0},_closeModalWithTransition:{value:function(){var a=function(){this.$.modal.removeEventListener(this.$$.transitionEnd,a),this._closeModal()}.bind(this);this.$.modal.addEventListener(this.$$.transitionEnd,a)},writable:!0,enumerable:!0,configurable:!0},_captureNode:{value:function(){for(;this.current.childNodes.length>0;)this.$.modalContent.appendChild(this.current.childNodes[0])},writable:!0,enumerable:!0,configurable:!0},_releaseNode:{value:function(){for(;this.$.modalContent.childNodes.length>0;)this.current.appendChild(this.$.modalContent.childNodes[0])},writable:!0,enumerable:!0,configurable:!0},_closeKeyHandler:{value:function(a){"number"==typeof this.$$.closeKey&&a.which===this.$$.closeKey&&this.isOpen===!0&&(a.preventDefault(),this.close())},writable:!0,enumerable:!0,configurable:!0},_outsideClickHandler:{value:function(a){if(this.$$.clickOutside===!0){for(var b=a.target;b!=document.body;){if(b===this.$.modalInner)return;b=b.parentNode}this.close()}},writable:!0,enumerable:!0,configurable:!0},_matches:{value:function(a,b){for(var c=a.target,d=(c.document||c.ownerDocument).querySelectorAll(b),e=0;e-1&&c.splice(c.indexOf(b),1),a.className=c.join(" ")}},writable:!0,enumerable:!0,configurable:!0},_setOpenId:{value:function(){var a=this.current.id||"anonymous";this.$.page.setAttribute("data-current-modal",a)},writable:!0,enumerable:!0,configurable:!0},_removeOpenId:{value:function(){this.$.page.removeAttribute("data-current-modal")},writable:!0,enumerable:!0,configurable:!0},_getElementContext:{value:function(a){return a&&"string"==typeof a.hash?document.querySelector(a.hash):"string"==typeof a?document.querySelector(a):console.error("No selector supplied to open()")},writable:!0,enumerable:!0,configurable:!0},_open:{value:function(a){return this.current=this._getElementContext(a),this.current instanceof HTMLElement==!1?console.error("VanillaModal target must exist on page."):("function"==typeof this.$$.onBeforeOpen&&this.$$.onBeforeOpen.call(this),this._captureNode(),this._addClass(this.$.page,this.$$["class"]),this._setOpenId(),this.isOpen=!0,void("function"==typeof this.$$.onOpen&&this.$$.onOpen.call(this)))},writable:!0,enumerable:!0,configurable:!0},_detectTransition:{value:function(){var a=window.getComputedStyle(this.$.modal,null),b=["transitionDuration","oTransitionDuration","MozTransitionDuration","webkitTransitionDuration"],c=b.filter(function(b){return"string"==typeof a[b]&&parseFloat(a[b])>0?!0:void 0});return c.length?!0:!1},writable:!0,enumerable:!0,configurable:!0},_close:{value:function(){"function"==typeof this.$$.onBeforeClose&&this.$$.onBeforeClose.call(this),this._removeClass(this.$.page,this.$$["class"]);var a=this._detectTransition();this.$$.transitions&&this.$$.transitionEnd&&a?this._closeModalWithTransition():this._closeModal()},writable:!0,enumerable:!0,configurable:!0},_closeModal:{value:function(){this._removeOpenId(this.$.page),this._releaseNode(),this.isOpen=!1,this.current=null,"function"==typeof this.$$.onClose&&this.$$.onClose.call(this)},writable:!0,enumerable:!0,configurable:!0},_closeModalWithTransition:{value:function(){var a=function(){this.$.modal.removeEventListener(this.$$.transitionEnd,a),this._closeModal()}.bind(this);this.$.modal.addEventListener(this.$$.transitionEnd,a)},writable:!0,enumerable:!0,configurable:!0},_captureNode:{value:function(){for(;this.current.childNodes.length>0;)this.$.modalContent.appendChild(this.current.childNodes[0])},writable:!0,enumerable:!0,configurable:!0},_releaseNode:{value:function(){for(;this.$.modalContent.childNodes.length>0;)this.current.appendChild(this.$.modalContent.childNodes[0])},writable:!0,enumerable:!0,configurable:!0},_closeKeyHandler:{value:function(a){"number"==typeof this.$$.closeKey&&a.which===this.$$.closeKey&&this.isOpen===!0&&(a.preventDefault(),this.close())},writable:!0,enumerable:!0,configurable:!0},_outsideClickHandler:{value:function(a){if(this.$$.clickOutside===!0){for(var b=a.target;b!=document.body;){if(b===this.$.modalInner)return;b=b.parentNode}this.close()}},writable:!0,enumerable:!0,configurable:!0},_matches:{value:function(a,b){for(var c=a.target,d=(c.document||c.ownerDocument).querySelectorAll(b),e=0;e 0) { + return true; + } + }); + return (hasTransition.length) ? true : false; + } + /** * @param {Event} e */ _close(e) { if (typeof this.$$.onBeforeClose === 'function') this.$$.onBeforeClose.call(this); this._removeClass(this.$.page, this.$$.class); - if (this.$$.transitions && this.$$.transitionEnd) { + var transitions = this._detectTransition(); + if (this.$$.transitions && this.$$.transitionEnd && transitions) { this._closeModalWithTransition(); } else { this._closeModal();