"use strict"; (function(F){ F.confirmer = function f(elem,opt){ const dbg = opt.debug ? function(){console.debug.apply(console,arguments)} : function(){}; dbg("confirmer opt =",opt); if(!f.Holder){ f.isInput = (e)=>/^(input|textarea)$/i.test(e.nodeName); f.Holder = function(target,opt){ const self = this; this.target = target; this.opt = opt; this.timerID = undefined; this.state = this.states.initial; const isInput = f.isInput(target); const updateText = function(msg){ if(isInput) target.value = msg; else{ const newNode = new DOMParser().parseFromString(msg, 'text/html'); let childs = newNode.documentElement.querySelector('body'); childs = childs ? Array.prototype.slice.call(childs.childNodes, 0) : []; target.innerText = ''; childs.forEach((e)=>target.appendChild(e)); } } const formatCountdown = (txt, number) => txt + " ["+number+"]"; if(opt.pinSize && opt.confirmText){ const digits = (''+(opt.timeout/1000 || opt.ticks)).length; const lblLong = formatCountdown(opt.confirmText, "00000000".substr(0,digits+1)); const w1 = parseInt(target.getBoundingClientRect().width); updateText(lblLong); const w2 = parseInt(target.getBoundingClientRect().width); if(w1 || w2){ target.style.minWidth = target.style.maxWidth = (w1>w2 ? w1 : w2)+"px"; } } updateText(this.opt.initialText); if(this.opt.ticks && !this.opt.ontick){ this.opt.ontick = function(tick){ updateText(formatCountdown(self.opt.confirmText,tick)); }; } this.setClasses(false); this.doTimeout = function() { if(this.timerID){ clearTimeout( this.timerID ); delete this.timerID; } if( this.state != this.states.waiting ) { return; } this.setClasses( false ); this.state = this.states.initial; dbg("Timeout triggered."); if( this.opt.ontick ){ try{this.opt.ontick.call(this.target, 0)} catch(e){dbg("ontick EXCEPTION:",e)} } if( this.opt.ontimeout ) { try{this.opt.ontimeout.call(this.target)} catch(e){dbg("ontimeout EXCEPTION:",e)} } updateText(this.opt.initialText); }; target.addEventListener( 'click', function(){ switch( self.state ) { case( self.states.waiting ): if( undefined !== self.timerID ){ clearTimeout( self.timerID ); delete self.timerID; } self.state = self.states.initial; self.setClasses( false ); dbg("Confirmed"); if( self.opt.ontick ){ try{self.opt.ontick.call(self.target,0)} catch(e){dbg("ontick EXCEPTION:",e)} } if( self.opt.onconfirm ){ try{self.opt.onconfirm.call(self.target)} catch(e){dbg("onconfirm EXCEPTION:",e)} } updateText(self.opt.initialText); break; case( self.states.initial ): if(self.opt.ticks) self.opt.currentTick = self.opt.ticks; self.setClasses( true ); self.state = self.states.waiting; updateText( self.opt.confirmText ); if( self.opt.onactivate ) self.opt.onactivate.call( self.target ); if( self.opt.ontick ) self.opt.ontick.call(self.target, self.opt.currentTick); if(self.opt.timeout){ dbg("Waiting "+self.opt.timeout+"ms on confirmation..."); self.timerID = setTimeout(()=>self.doTimeout(),self.opt.timeout ); }else if(self.opt.ticks){ dbg("Waiting on confirmation for "+self.opt.ticks +" ticks of "+self.opt.ticktime+"ms each..."); self.timerID = setInterval(function(){ if(0===--self.opt.currentTick) self.doTimeout(); else{ try{self.opt.ontick.call(self.target, self.opt.currentTick)} catch(e){dbg("ontick EXCEPTION:",e)} } },self.opt.ticktime); } break; default: break; } }, false ); }; f.Holder.prototype = { states:{initial: 0, waiting: 1}, setClasses: function(activated) { if(activated) { if( this.opt.classWaiting ) { this.target.classList.add( this.opt.classWaiting ); } if( this.opt.classInitial ) { this.target.classList.remove( this.opt.classInitial ); } }else{ if( this.opt.classInitial ) { this.target.classList.add( this.opt.classInitial ); } if( this.opt.classWaiting ) { this.target.classList.remove( this.opt.classWaiting ); } } } }; } opt = F.mergeLastWins(f.defaultOpts,{ initialText: ( f.isInput(elem) ? elem.value : elem.innerHTML ) || "PLEASE SET .initialText" },opt); if(!opt.confirmText){ opt.confirmText = "Confirm: "+opt.initialText; } if(opt.ticks){ delete opt.timeout; opt.ticks = 0 | opt.ticks; if(opt.ticks<=0){ throw new Error("ticks must be >0"); } if(opt.ticktime <= 0) opt.ticktime = 1000; }else{ delete opt.ontick; delete opt.ticks; } new f.Holder(elem,opt); return this; }; F.confirmer.defaultOpts = { timeout:undefined, ticks: 3, ticktime: 998, onconfirm: undefined, ontimeout: undefined, onactivate: undefined, classInitial: '', classWaiting: '', debug: false }; })(window.fossil);