/** * @module MultiSwitches * @version 2.2.1 * @author OXAYAZA {@link https://oxayaza.page.link/github} * @license CC BY-SA 4.0 {@link https://creativecommons.org/licenses/by-sa/4.0/} * @see {@link https://codepen.io/OXAYAZA/pen/eRbYjV} * @see {@link https://oxayaza.page.link/github_mswitches} * @see {@link https://oxayaza.page.link/linkedin} * @description Allows you to use multiple switches to switch class on the target, * itself and other switches linked to the same target. */ function MultiSwitch(options){function Switch(options){if(!(options.node instanceof Element)){throw new Error('Switch element is required')}if(!(options.targets instanceof NodeList||options.targets instanceof Array)&&typeof options.targets!=='string'){throw new Error('Targets must be NodeList, Array or string')}for(var key in Switch.defaults){this[key]=Switch.defaults[key]}for(var _key in options){this[_key]=options[_key]}['targets','scope','isolate'].forEach(function(key){this[key]=Switch.procSelector(this[key])}.bind(this));this.node.multiSwitch=this;this.targets.forEach(function(target){if(!target.multiSwitchTarget)new Target(target);target.multiSwitchTarget.updateGroup({node:this.node,state:this.state,class:this.class})}.bind(this));this.assignHandlers();this.changeState(this.state);return this}Switch.defaults={node:null,state:false,class:'active',event:'click',targets:null,scope:null,isolate:null,handlers:{switch:null,emitter:null,scope:null,isolate:null}};Switch.prototype.assignHandlers=function(){this.handlers.switch=this.changeState.bind(this);this.node.addEventListener(this.event,this.handlers.switch);this.handlers.emitter=function(event){if(event.emitter.multiSwitchTarget.groups[this.class].state!==this.state){this.changeState(event.emitter.multiSwitchTarget.groups[this.class].state)}}.bind(this);this.node.addEventListener('switch:'+this.class,this.handlers.emitter);if(this.scope&&this.scope.length){this.handlers.scope=function(event){if(!this.checkScope(event.target)&&this.state)this.changeState()}.bind(this);document.addEventListener(this.event,this.handlers.scope)}if(this.isolate&&this.isolate.length){this.handlers.isolate=function(event){if(this.checkIsolate(event.target)&&this.state)this.changeState()}.bind(this);document.addEventListener(this.event,this.handlers.isolate)}};Switch.prototype.removeHandlers=function(){if(this.handlers.switch){this.node.removeEventListener(this.event,this.handlers.switch);this.handlers.switch=null}if(this.handlers.emitter){this.node.removeEventListener('switch:'+this.class,this.handlers.emitter);this.handlers.emitter=null}if(this.handlers.scope){document.removeEventListener(this.event,this.handlers.scope);this.handlers.scope=null}if(this.handlers.isolate){document.removeEventListener(this.event,this.handlers.isolate);this.handlers.isolate=null}};Switch.procSelector=function(selector){if(typeof selector==='string')return document.querySelectorAll(selector);return selector};Switch.prototype.changeState=function(state){if(typeof state!=='boolean')this.state=!this.state;else this.state=state;if(this.state)this.node.classList.add(this.class);else this.node.classList.remove(this.class);this.targets.forEach(function(target){var event=new CustomEvent('switch:'+this.class);event.emitter=this.node;target.dispatchEvent(event)}.bind(this))};Switch.prototype.checkScope=function(node){if(this.node.contains(node))return true;for(var i=0;i