From 7ce138f493b8a11e8f58370e933d4eb030a729a5 Mon Sep 17 00:00:00 2001 From: Oscar Strangio Date: Wed, 1 Aug 2018 09:38:53 +1000 Subject: [PATCH] :bookmark: Release v2.2 --- dist/focus-min.js | 2 +- dist/focus.js | 30 +++++++++++++++++------------- package.json | 2 +- src/focus.js | 11 ++++++----- 4 files changed, 25 insertions(+), 20 deletions(-) diff --git a/dist/focus-min.js b/dist/focus-min.js index 8d3b3da..8b0ca6d 100644 --- a/dist/focus-min.js +++ b/dist/focus-min.js @@ -1 +1 @@ -"use strict";var Focus=function(t,e){var s=e||{};if(this.settings=Object.assign({visibleClass:"visible",bodyClass:"active-popup",triggerClass:null,detach:null,innerSelector:".popup-inner",autoFocusSelector:"[data-auto-focus]",slide:null,slideSpeed:200,visible:!1,showCallback:null,hideCallback:null,error:null},s),this.visible=this.settings.visible,this.element=document.querySelector(t),this.innerElement=document.querySelector(t+" "+this.settings.innerSelector),this.closeElement=document.querySelector(t+" [data-close]"),this.target=t,this.settings.slide){var i=this.element.style.display;this.element.style.display="block",this.maxHeight=this.element.offsetHeight,this.element.style.display=i,this.height=this.element.offsetHeight,this.counter=this.height}this.show=this.show.bind(this),this.hide=this.hide.bind(this),this.toggle=this.toggle.bind(this),this.detach=this.detach.bind(this),this.slideDown=this.slideDown.bind(this),this.slideUp=this.slideUp.bind(this),this.settings.detach&&document.addEventListener("DOMContentLoaded",this.detach),Focus.elements[t]=this};Focus.elements={},Focus.getTarget=function(t){var e=t.target;return"A"===e.tagName&&t.preventDefault(),e.dataset.target||null},Focus.eventHandler=function(t,e,s){var i=Focus.elements[e];return i||(i=new Focus(e)),"hide"===s?i.hide():i.toggle()},Focus.closeEvent=function(t){var e=Focus.getTarget(t);e?Focus.eventHandler(t,e,"hide"):this.hide()},Focus.escEvent=function(t){27===t.keyCode&&(this.element.removeEventListener("keyup",Focus.escEvent),this.hide())},Focus.buildEventListeners=function(){for(var t=document.querySelectorAll("[data-trigger]"),e=function(e){var s=t[e].dataset.target;t[e].addEventListener("click",function(t){Focus.eventHandler(t,s)})},s=0;s0?t.style.maxHeight=this.counter+"px":(t.style.maxHeight=null,t.style.display="none",t.style.overflow=null,clearInterval(this.interval))}.bind(this),this.settings.slideSpeed/100)},Focus.prototype.show=function(){if(this.visible&&this.element.classList.contains(this.settings.visibleClass))this.settings.error&&"function"==typeof this.settings.error&&this.settings.error("Focus: Error this element is already visible",this);else{if(this.settings.triggerClass){var t=document.querySelector('[data-target="'+this.target+'"]');Focus.addClass(t,this.settings.triggerClass)}this.settings.slide&&this.slideDown(this.settings.slideDuration),Focus.addClass(this.element,this.settings.visibleClass),Focus.addClass(document.body,this.settings.bodyClass),this.visible=!0;var e=document.querySelector(this.target+" "+this.settings.autoFocusSelector);e&&setTimeout(function(){e.focus()},300),this.closeElement&&this.closeElement.addEventListener("click",Focus.closeEvent.bind(this)),this.innerElement&&this.innerElement.addEventListener("click",Focus.closeEvent.bind(this)),this.element.addEventListener("keyup",Focus.escEvent.bind(this)),this.settings.showCallback&&"function"==typeof this.settings.showCallback&&this.settings.showCallback(this)}return this},Focus.prototype.hide=function(){if(this.visible||this.element.classList.contains(this.settings.visibleClass)){if(Focus.removeClass(this.element,this.settings.visibleClass),this.settings.triggerClass){var t=document.querySelector('[data-target="'+this.target+'"]');Focus.removeClass(t,this.settings.triggerClass)}this.settings.slide&&this.slideUp(this.settings.slideDuration),Focus.removeClass(document.body,this.settings.bodyClass),this.closeElement&&this.closeElement.removeEventListener("click",Focus.closeEvent),this.innerElement&&this.innerElement.removeEventListener("click",Focus.closeEvent),this.visible=!1,this.settings.hideCallback&&"function"==typeof this.settings.hideCallback&&this.settings.hideCallback(this)}else this.settings.error&&"function"==typeof this.settings.error&&this.settings.error("Focus: Error this element is already hidden",this);return this},Focus.prototype.toggle=function(){return this.visible?this.hide():this.show(),this},Focus.prototype.detach=function(){return document.body.appendChild(this.element),this},document.addEventListener("DOMContentLoaded",Focus.buildEventListeners); \ No newline at end of file +"use strict";var Focus=function(t,e){var s=e||{};if(this.settings=Object.assign({visibleClass:"visible",bodyClass:"active-popup",triggerClass:null,detach:null,innerSelector:".popup-inner",autoFocusSelector:"[data-auto-focus]",slide:null,slideSpeed:200,visible:!1,showCallback:null,hideCallback:null,error:null},s),this.visible=this.settings.visible,this.element=document.querySelector(t),this.innerElement=document.querySelector(t+" "+this.settings.innerSelector),this.closeElement=document.querySelector(t+" [data-close]"),this.target=t,this.settings.slide){var i=this.element.style.display;this.element.style.display="block",this.maxHeight=this.element.offsetHeight,this.element.style.display=i,this.height=this.element.offsetHeight,this.counter=this.height}this.show=this.show.bind(this),this.hide=this.hide.bind(this),this.toggle=this.toggle.bind(this),this.detach=this.detach.bind(this),this.slideDown=this.slideDown.bind(this),this.slideUp=this.slideUp.bind(this),this.settings.detach&&document.addEventListener("DOMContentLoaded",this.detach),Focus.elements[t]=this};Focus.elements={},Focus.getTarget=function(t){var e=t.target;return"A"===e.tagName&&t.preventDefault(),e.dataset.target||null},Focus.eventHandler=function(t,e,s){var i=Focus.elements[e];return i||(i=new Focus(e)),"hide"===s?i.hide():i.toggle()},Focus.closeEvent=function(t){var e=Focus.getTarget(t);e?Focus.eventHandler(t,e,"hide"):this.hide()},Focus.escEvent=function(t){27===t.keyCode&&(this.element.removeEventListener("keyup",Focus.escEvent),this.hide())},Focus.buildEventListeners=function(){for(var t=document.querySelectorAll("[data-trigger]"),e=function(e){var s=t[e].dataset.target;t[e].addEventListener("click",function(t){Focus.eventHandler(t,s)})},s=0;s0?e.style.maxHeight=t.counter+"px":(e.style.maxHeight=null,e.style.display="none",e.style.overflow=null,clearInterval(t.interval))},this.settings.slideSpeed/100)},Focus.prototype.show=function(){if(this.visible&&this.element.classList.contains(this.settings.visibleClass))this.settings.error&&"function"==typeof this.settings.error&&this.settings.error("Focus: Error this element is already visible",this);else{if(this.settings.triggerClass){var t=document.querySelector('[data-target="'+this.target+'"]');Focus.addClass(t,this.settings.triggerClass)}this.settings.slide&&this.slideDown(this.settings.slideDuration),Focus.addClass(this.element,this.settings.visibleClass),Focus.addClass(document.body,this.settings.bodyClass),this.visible=!0;var e=document.querySelector(this.target+" "+this.settings.autoFocusSelector);e&&setTimeout(function(){e.focus()},300),this.closeElement&&this.closeElement.addEventListener("click",Focus.closeEvent.bind(this)),this.innerElement&&this.innerElement.addEventListener("click",Focus.closeEvent.bind(this)),this.element.addEventListener("keyup",Focus.escEvent.bind(this)),this.settings.showCallback&&"function"==typeof this.settings.showCallback&&this.settings.showCallback(this)}return this},Focus.prototype.hide=function(){if(this.visible||this.element.classList.contains(this.settings.visibleClass)){if(Focus.removeClass(this.element,this.settings.visibleClass),this.settings.triggerClass){var t=document.querySelector('[data-target="'+this.target+'"]');Focus.removeClass(t,this.settings.triggerClass)}this.settings.slide&&this.slideUp(this.settings.slideDuration),Focus.removeClass(document.body,this.settings.bodyClass),this.closeElement&&this.closeElement.removeEventListener("click",Focus.closeEvent),this.innerElement&&this.innerElement.removeEventListener("click",Focus.closeEvent),this.visible=!1,this.settings.hideCallback&&"function"==typeof this.settings.hideCallback&&this.settings.hideCallback(this)}else this.settings.error&&"function"==typeof this.settings.error&&this.settings.error("Focus: Error this element is already hidden",this);return this},Focus.prototype.toggle=function(){return this.visible?this.hide():this.show(),this},Focus.prototype.detach=function(){return document.body.appendChild(this.element),this},document.addEventListener("DOMContentLoaded",Focus.buildEventListeners); \ No newline at end of file diff --git a/dist/focus.js b/dist/focus.js index 6c86ee8..0fe5b5a 100644 --- a/dist/focus.js +++ b/dist/focus.js @@ -185,6 +185,8 @@ Focus.removeClass = function removeAClassFromAGivenElement(element, className) { }; Focus.prototype.slideDown = function slideDown() { + var _this = this; + var el = this.element; // Display none var defaultDisplay = this.element.style.display; @@ -204,38 +206,40 @@ Focus.prototype.slideDown = function slideDown() { var adder = this.maxHeight / 100; // Iteratively increase the height - this.interval = setInterval(function interval() { - this.counter += adder; - if (this.counter < this.maxHeight) { - el.style.maxHeight = this.counter + 'px'; + this.interval = setInterval(function () { + _this.counter += adder; + if (_this.counter < _this.maxHeight) { + el.style.maxHeight = _this.counter + 'px'; } else { el.style.maxHeight = null; el.style.overflow = null; - this.height = this.element.offsetHeight; - clearInterval(this.interval); + _this.height = _this.element.offsetHeight; + clearInterval(_this.interval); } - }.bind(this), this.settings.slideSpeed / 100); + }, this.settings.slideSpeed / 100); }; Focus.prototype.slideUp = function slideUp() { + var _this2 = this; + var el = this.element; var subtractor = this.maxHeight / 100; // To hide the content of the element el.style.overflow = 'hidden'; // Decreasing the height - this.interval = setInterval(function interval() { - this.counter -= subtractor; - if (this.counter > 0) { - el.style.maxHeight = this.counter + 'px'; + this.interval = setInterval(function () { + _this2.counter -= subtractor; + if (_this2.counter > 0) { + el.style.maxHeight = _this2.counter + 'px'; } else { el.style.maxHeight = null; el.style.display = 'none'; el.style.overflow = null; - clearInterval(this.interval); + clearInterval(_this2.interval); } - }.bind(this), this.settings.slideSpeed / 100); + }, this.settings.slideSpeed / 100); }; /* diff --git a/package.json b/package.json index 8eb2d70..094329e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Focus", - "version": "2.1.0", + "version": "2.2.0", "license": "SEE LICENSE IN LICENSE", "description": "Front end visibility manager for popups, modals notifications, drawers, accordions and tabs", "repository": { diff --git a/src/focus.js b/src/focus.js index cc8322b..b42c40d 100644 --- a/src/focus.js +++ b/src/focus.js @@ -7,7 +7,8 @@ |\ |/ -Focus v2.2 +Focus +version v2.2 https://github.com/Elkfox/Focus Copyright (c) 2018 Elkfox Co Pty Ltd @@ -196,7 +197,7 @@ Focus.prototype.slideDown = function slideDown() { const adder = this.maxHeight / 100; // Iteratively increase the height - this.interval = setInterval(function interval() { + this.interval = setInterval(() => { this.counter += adder; if (this.counter < this.maxHeight) { el.style.maxHeight = `${this.counter}px`; @@ -206,7 +207,7 @@ Focus.prototype.slideDown = function slideDown() { this.height = this.element.offsetHeight; clearInterval(this.interval); } - }.bind(this), this.settings.slideSpeed / 100); + }, this.settings.slideSpeed / 100); }; Focus.prototype.slideUp = function slideUp() { @@ -216,7 +217,7 @@ Focus.prototype.slideUp = function slideUp() { el.style.overflow = 'hidden'; // Decreasing the height - this.interval = setInterval(function interval() { + this.interval = setInterval(() => { this.counter -= subtractor; if (this.counter > 0) { el.style.maxHeight = `${this.counter}px`; @@ -227,7 +228,7 @@ Focus.prototype.slideUp = function slideUp() { clearInterval(this.interval); } - }.bind(this), this.settings.slideSpeed / 100); + }, this.settings.slideSpeed / 100); }; /*