diff --git a/demos/typical/index.html b/demos/typical/index.html index 913b909..1fa09a9 100644 --- a/demos/typical/index.html +++ b/demos/typical/index.html @@ -40,7 +40,7 @@
  • ...
    • - +
    @@ -53,7 +53,7 @@ - + @@ -84,7 +84,7 @@

    Overlay and close button

    var offsideMenu1 = offside( '#menu-1', { slidingElementsSelector: '#container, #results', - debug: true, + debug: true, buttonsSelector: '.menu-btn-1, .menu-btn-1--close', slidingSide: 'left', beforeOpen: function(){}, @@ -94,7 +94,7 @@

    Overlay and close button

    var offsideMenu2 = offside( '#menu-2', { slidingElementsSelector: '#container, #results', - debug: true, + debug: true, buttonsSelector: '.menu-btn-2, .menu-btn-2--close', slidingSide: 'right', beforeOpen: function(){}, @@ -102,7 +102,7 @@

    Overlay and close button

    }); var overlay = document.querySelector('.site-overlay') - .addEventListener( 'click', window.offside.factory.closeOpenOffside ); + .addEventListener( 'click', offside.factory.closeOpenOffside ); console.log(offsideMenu1); console.log(offsideMenu2); @@ -110,4 +110,4 @@

    Overlay and close button

    - \ No newline at end of file + diff --git a/dist/offside.js b/dist/offside.js index ce66793..07e32ab 100644 --- a/dist/offside.js +++ b/dist/offside.js @@ -1,4 +1,4 @@ -/* offside-js 1.3.1 22-05-2016 +/* offside-js 1.3.1 25-03-2018 * Minimal JavaScript kit without library dependencies to push things off-canvas using just class manipulation * https://github.com/toomuchdesign/offside.git * @@ -7,16 +7,6 @@ */ ;(function ( window, document, undefined ) { - - /* - * The first time Offside is called, it creates a singleton-factory object - * and place it into "window.offside.factory". - * - * Offside factory serves the following purposes: - * - DOM initialization - * - Centralized Offside instances management and initialization - */ - 'use strict'; // Self-invoking function returning the object which contains @@ -255,7 +245,7 @@ // Offside instance private properties var offside = domEl, // Hello, I'm the Offside instance - offsideButtons = getDomElements( offsideSettings.buttonsSelector ), // Offside toggle buttons + offsideButtons = getDomElements( offsideSettings.buttonsSelector ), // Offside toggle buttons slidingSide = offsideSettings.slidingSide, offsideClass = 'offside', // Class added to Offside instance when initialized offsideSideClass = offsideClass + '--' + slidingSide, // Class added to Offside instance when initialized (eg. offside offside--left) @@ -347,7 +337,7 @@ return id; } */ - + // Set up and initialize a new Offside instance _initOffside = function() { @@ -469,20 +459,30 @@ } // initOffsideFactory() end - return { + var singleton = { // Get the Singleton instance if one exists // or create one if it doesn't getInstance: function ( el, options ) { - if ( !window.offside.factory ) { - window.offside.factory = initOffsideFactory( options ); + /* + * When Offside is called for the first time, + * inject a singleton-factory object + * as a static method in "offside.factory". + * + * Offside factory serves the following purposes: + * - DOM initialization + * - Centralized Offside instances management and initialization + */ + if ( !singleton.getInstance.factory ) { + singleton.getInstance.factory = initOffsideFactory( options ); } - return window.offside.factory.getOffsideInstance( el, options ); + return singleton.getInstance.factory.getOffsideInstance( el, options ); } }; - + + return singleton; })(); // Store in window a reference to the Offside singleton factory @@ -492,4 +492,4 @@ window.offside = offside.getInstance; } -})( window, document ); \ No newline at end of file +})( window, document ); diff --git a/dist/offside.min.js b/dist/offside.min.js index b992423..b255bdc 100644 --- a/dist/offside.min.js +++ b/dist/offside.min.js @@ -1 +1 @@ -!function(a,b,c){"use strict";var d=function(){function d(d){function e(){B.forEach(function(a){m(a,u)}),y||m(b.documentElement,"no-csstransforms3d"),m(A,t)}function f(){if(!a.getComputedStyle)return!1;var d,e=b.createElement("p"),f={webkitTransform:"-webkit-transform",OTransform:"-o-transform",msTransform:"-ms-transform",MozTransform:"-moz-transform",transform:"transform"};b.body.insertBefore(e,null);for(var g in f)e.style[g]!==c&&(e.style[g]="translate3d(1px,1px,1px)",d=a.getComputedStyle(e).getPropertyValue(f[g]));return b.body.removeChild(e),d!==c&&d.length>0&&"none"!==d}function g(a,b,d){var e=q(a!==c?a:".offside");return e!==!1?new h(e[0],b,d):null}function h(a,b,c){var d,e;e={buttonsSelector:"",slidingSide:"left",init:function(){},beforeOpen:function(){},afterOpen:function(){},beforeClose:function(){},afterClose:function(){},beforeDestroy:function(){},afterDestroy:function(){}};for(d in b)e.hasOwnProperty(d)&&(e[d]=b[d]);var f=a,g=q(e.buttonsSelector),h=e.slidingSide,i="offside",j=i+"--"+h,t="is-open",u=s+"--is-open",v=s+"--is-"+h,y=c||0,B=function(){r(z,y)===!1?D():E()},D=function(){e.beforeOpen(),x&&(x=!1,l()),k(),m(A,u),m(A,v),m(f,t),z.push(y),e.afterOpen()},E=function(){var a=r(z,y);a!==!1&&(e.beforeClose(),n(A,u),n(A,v),n(f,t),z.splice(a,1),e.afterClose())},F=function(){k()},G=function(a){a.preventDefault(),B()},H=function(){C&&J(),m(f,i),m(f,j),g.forEach(function(a){o(a,"click",G)}),e.init()},I=function(){e.beforeDestroy(),E(),g.forEach(function(a){p(a,"click",G)}),n(f,i),n(f,j),delete w[y],e.afterDestroy()},J=function(){f||console.error('Offside alert: "offside" selector could not match any element'),g.length||console.error('Offside alert: "buttonsSelector" selector could not match any element')};this.toggle=function(){B()},this.open=function(){D()},this.close=function(){E()},this.closeAll=function(){F()},this.destroy=function(){I()},H()}var i,j,k=function(a){z.length>0&&(isNaN(a)?z.forEach(function(a){w[a].close()}):w[a].close())},l=function(){m(A,v)},m=function(a,b){a.classList?a.classList.add(b):a.className=(a.className+" "+b).trim()},n=function(a,b){a.classList?a.classList.remove(b):a.className=a.className.replace(new RegExp("(^|\\b)"+b.split(" ").join("|")+"(\\b|$)","gi")," ")},o=function(a,b,c){a.addEventListener(b,c)},p=function(a,b,c){a.removeEventListener(b,c)},q=function(a){return a instanceof HTMLElement?[a]:Array.isArray(a)?a:"string"==typeof a?Array.apply(null,b.querySelectorAll(a)):!1},r=function(a,b){var c=a.indexOf(b);return c>-1?c:!1};j={slidingElementsSelector:".offside-sliding-element",disableCss3dTransforms:!1,debug:!1};for(i in d)j.hasOwnProperty(i)&&(j[i]=d[i]);var s="offside-js",t=s+"--init",u="offside-sliding-element",v=s+"--interact",w=[],x=!0,y=j.disableCss3dTransforms?!1:f(),z=[],A=b.body,B=q(j.slidingElementsSelector),C=j.debug;return e(),{closeOpenOffside:function(){k()},getOffsideInstance:function(a,b){var c=w.length||0,d=g(a,b,c);return null!==d?w[c]=d:void 0}}}return{getInstance:function(b,c){return a.offside.factory||(a.offside.factory=d(c)),a.offside.factory.getOffsideInstance(b,c)}}}();"undefined"!=typeof module&&module.exports?module.exports=d.getInstance:a.offside=d.getInstance}(window,document); \ No newline at end of file +!function(a,b,c){"use strict";var d=function(){function d(d){function e(){B.forEach(function(a){m(a,u)}),y||m(b.documentElement,"no-csstransforms3d"),m(A,t)}function f(){if(!a.getComputedStyle)return!1;var d,e=b.createElement("p"),f={webkitTransform:"-webkit-transform",OTransform:"-o-transform",msTransform:"-ms-transform",MozTransform:"-moz-transform",transform:"transform"};b.body.insertBefore(e,null);for(var g in f)e.style[g]!==c&&(e.style[g]="translate3d(1px,1px,1px)",d=a.getComputedStyle(e).getPropertyValue(f[g]));return b.body.removeChild(e),d!==c&&d.length>0&&"none"!==d}function g(a,b,d){var e=q(a!==c?a:".offside");return e!==!1?new h(e[0],b,d):null}function h(a,b,c){var d,e;e={buttonsSelector:"",slidingSide:"left",init:function(){},beforeOpen:function(){},afterOpen:function(){},beforeClose:function(){},afterClose:function(){},beforeDestroy:function(){},afterDestroy:function(){}};for(d in b)e.hasOwnProperty(d)&&(e[d]=b[d]);var f=a,g=q(e.buttonsSelector),h=e.slidingSide,i="offside",j=i+"--"+h,t="is-open",u=s+"--is-open",v=s+"--is-"+h,y=c||0,B=function(){r(z,y)===!1?D():E()},D=function(){e.beforeOpen(),x&&(x=!1,l()),k(),m(A,u),m(A,v),m(f,t),z.push(y),e.afterOpen()},E=function(){var a=r(z,y);a!==!1&&(e.beforeClose(),n(A,u),n(A,v),n(f,t),z.splice(a,1),e.afterClose())},F=function(){k()},G=function(a){a.preventDefault(),B()},H=function(){C&&J(),m(f,i),m(f,j),g.forEach(function(a){o(a,"click",G)}),e.init()},I=function(){e.beforeDestroy(),E(),g.forEach(function(a){p(a,"click",G)}),n(f,i),n(f,j),delete w[y],e.afterDestroy()},J=function(){f||console.error('Offside alert: "offside" selector could not match any element'),g.length||console.error('Offside alert: "buttonsSelector" selector could not match any element')};this.toggle=function(){B()},this.open=function(){D()},this.close=function(){E()},this.closeAll=function(){F()},this.destroy=function(){I()},H()}var i,j,k=function(a){z.length>0&&(isNaN(a)?z.forEach(function(a){w[a].close()}):w[a].close())},l=function(){m(A,v)},m=function(a,b){a.classList?a.classList.add(b):a.className=(a.className+" "+b).trim()},n=function(a,b){a.classList?a.classList.remove(b):a.className=a.className.replace(new RegExp("(^|\\b)"+b.split(" ").join("|")+"(\\b|$)","gi")," ")},o=function(a,b,c){a.addEventListener(b,c)},p=function(a,b,c){a.removeEventListener(b,c)},q=function(a){return a instanceof HTMLElement?[a]:Array.isArray(a)?a:"string"==typeof a&&Array.apply(null,b.querySelectorAll(a))},r=function(a,b){var c=a.indexOf(b);return c>-1&&c};j={slidingElementsSelector:".offside-sliding-element",disableCss3dTransforms:!1,debug:!1};for(i in d)j.hasOwnProperty(i)&&(j[i]=d[i]);var s="offside-js",t=s+"--init",u="offside-sliding-element",v=s+"--interact",w=[],x=!0,y=!j.disableCss3dTransforms&&f(),z=[],A=b.body,B=q(j.slidingElementsSelector),C=j.debug;return e(),{closeOpenOffside:function(){k()},getOffsideInstance:function(a,b){var c=w.length||0,d=g(a,b,c);if(null!==d)return w[c]=d}}}var e={getInstance:function(a,b){return e.getInstance.factory||(e.getInstance.factory=d(b)),e.getInstance.factory.getOffsideInstance(a,b)}};return e}();"undefined"!=typeof module&&module.exports?module.exports=d.getInstance:a.offside=d.getInstance}(window,document); \ No newline at end of file diff --git a/src/offside.js b/src/offside.js index e63f6b4..ea3a9db 100644 --- a/src/offside.js +++ b/src/offside.js @@ -7,16 +7,6 @@ */ ;(function ( window, document, undefined ) { - - /* - * The first time Offside is called, it creates a singleton-factory object - * and place it into "window.offside.factory". - * - * Offside factory serves the following purposes: - * - DOM initialization - * - Centralized Offside instances management and initialization - */ - 'use strict'; // Self-invoking function returning the object which contains @@ -255,7 +245,7 @@ // Offside instance private properties var offside = domEl, // Hello, I'm the Offside instance - offsideButtons = getDomElements( offsideSettings.buttonsSelector ), // Offside toggle buttons + offsideButtons = getDomElements( offsideSettings.buttonsSelector ), // Offside toggle buttons slidingSide = offsideSettings.slidingSide, offsideClass = 'offside', // Class added to Offside instance when initialized offsideSideClass = offsideClass + '--' + slidingSide, // Class added to Offside instance when initialized (eg. offside offside--left) @@ -347,7 +337,7 @@ return id; } */ - + // Set up and initialize a new Offside instance _initOffside = function() { @@ -469,20 +459,30 @@ } // initOffsideFactory() end - return { + var singleton = { // Get the Singleton instance if one exists // or create one if it doesn't getInstance: function ( el, options ) { - if ( !window.offside.factory ) { - window.offside.factory = initOffsideFactory( options ); + /* + * When Offside is called for the first time, + * inject a singleton-factory object + * as a static method in "offside.factory". + * + * Offside factory serves the following purposes: + * - DOM initialization + * - Centralized Offside instances management and initialization + */ + if ( !singleton.getInstance.factory ) { + singleton.getInstance.factory = initOffsideFactory( options ); } - return window.offside.factory.getOffsideInstance( el, options ); + return singleton.getInstance.factory.getOffsideInstance( el, options ); } }; - + + return singleton; })(); // Store in window a reference to the Offside singleton factory @@ -492,4 +492,4 @@ window.offside = offside.getInstance; } -})( window, document ); \ No newline at end of file +})( window, document );