"use strict"; (function(F){ const argsToArray = (a)=>Array.prototype.slice.call(a,0); const isArray = (v)=>v instanceof Array; const dom = { create: function(elemType){ return document.createElement(elemType); }, createElemFactory: function(eType){ return function(){ return document.createElement(eType); }; }, remove: function(e){ if(e.forEach){ e.forEach( (x)=>x.parentNode.removeChild(x) ); }else{ e.parentNode.removeChild(e); } return e; }, clearElement: function f(e){ if(!f.each){ f.each = function(e){ if(e.forEach){ e.forEach((x)=>f(x)); return e; } while(e.firstChild) e.removeChild(e.firstChild); }; } argsToArray(arguments).forEach(f.each); return arguments[0]; }, }; dom.splitClassList = function f(str){ if(!f.rx){ f.rx = /(\s+|\s*,\s*)/; } return str ? str.split(f.rx) : [str]; }; dom.div = dom.createElemFactory('div'); dom.p = dom.createElemFactory('p'); dom.code = dom.createElemFactory('code'); dom.pre = dom.createElemFactory('pre'); dom.header = dom.createElemFactory('header'); dom.footer = dom.createElemFactory('footer'); dom.section = dom.createElemFactory('section'); dom.span = dom.createElemFactory('span'); dom.strong = dom.createElemFactory('strong'); dom.em = dom.createElemFactory('em'); dom.ins = dom.createElemFactory('ins'); dom.del = dom.createElemFactory('del'); dom.label = function(forElem, text){ const rc = document.createElement('label'); if(forElem){ if(forElem instanceof HTMLElement){ forElem = this.attr(forElem, 'id'); } dom.attr(rc, 'for', forElem); } if(text) this.append(rc, text); return rc; }; dom.img = function(src){ const e = this.create('img'); if(src) e.setAttribute('src',src); return e; }; dom.a = function(href,label){ const e = this.create('a'); if(href) e.setAttribute('href',href); if(label) e.appendChild(dom.text(true===label ? href : label)); return e; }; dom.hr = dom.createElemFactory('hr'); dom.br = dom.createElemFactory('br'); dom.text = function(){ return document.createTextNode(argsToArray(arguments).join('')); }; dom.button = function(label,callback){ const b = this.create('button'); if(label) b.appendChild(this.text(label)); if('function' === typeof callback){ b.addEventListener('click', callback, false); } return b; }; dom.textarea = function(){ const rc = this.create('textarea'); let rows, cols, readonly; if(1===arguments.length){ if('boolean'===typeof arguments[0]){ readonly = !!arguments[0]; }else{ rows = arguments[0]; } }else if(arguments.length){ rows = arguments[0]; cols = arguments[1]; readonly = arguments[2]; } if(rows) rc.setAttribute('rows',rows); if(cols) rc.setAttribute('cols', cols); if(readonly) rc.setAttribute('readonly', true); return rc; }; dom.select = dom.createElemFactory('select'); dom.option = function(value,label){ const a = arguments; var sel; if(1==a.length){ if(a[0] instanceof HTMLElement){ sel = a[0]; }else{ value = a[0]; } }else if(2==a.length){ if(a[0] instanceof HTMLElement){ sel = a[0]; value = a[1]; }else{ value = a[0]; label = a[1]; } } else if(3===a.length){ sel = a[0]; value = a[1]; label = a[2]; } const o = this.create('option'); if(undefined !== value){ o.value = value; this.append(o, this.text(label || value)); }else if(undefined !== label){ this.append(o, label); } if(sel) this.append(sel, o); return o; }; dom.h = function(level){ return this.create('h'+level); }; dom.ul = dom.createElemFactory('ul'); dom.li = function(parent){ const li = this.create('li'); if(parent) parent.appendChild(li); return li; }; dom.createElemFactoryWithOptionalParent = function(childType){ return function(parent){ const e = this.create(childType); if(parent) parent.appendChild(e); return e; }; }; dom.table = dom.createElemFactory('table'); dom.thead = dom.createElemFactoryWithOptionalParent('thead'); dom.tbody = dom.createElemFactoryWithOptionalParent('tbody'); dom.tfoot = dom.createElemFactoryWithOptionalParent('tfoot'); dom.tr = dom.createElemFactoryWithOptionalParent('tr'); dom.td = dom.createElemFactoryWithOptionalParent('td'); dom.th = dom.createElemFactoryWithOptionalParent('th'); dom.fieldset = function(legendText){ const fs = this.create('fieldset'); if(legendText){ this.append( fs, (legendText instanceof HTMLElement) ? legendText : this.append(this.legend(legendText)) ); } return fs; }; dom.legend = function(legendText){ const rc = this.create('legend'); if(legendText) this.append(rc, legendText); return rc; }; dom.append = function f(parent){ const a = argsToArray(arguments); a.shift(); for(let i in a) { var e = a[i]; if(isArray(e) || e.forEach){ e.forEach((x)=>f.call(this, parent,x)); continue; } if('string'===typeof e || 'number'===typeof e || 'boolean'===typeof e || e instanceof Error) e = this.text(e); parent.appendChild(e); } return parent; }; dom.input = function(type){ return this.attr(this.create('input'), 'type', type); }; dom.checkbox = function(value, checked){ const rc = this.input('checkbox'); if(1===arguments.length && 'boolean'===typeof value){ checked = !!value; value = undefined; } if(undefined !== value) rc.value = value; if(!!checked) rc.checked = true; return rc; }; dom.radio = function(){ const rc = this.input('radio'); let name, value, checked; if(1===arguments.length && 'boolean'===typeof name){ checked = arguments[0]; name = value = undefined; }else if(2===arguments.length){ name = arguments[0]; if('boolean'===typeof arguments[1]){ checked = arguments[1]; }else{ value = arguments[1]; checked = undefined; } }else if(arguments.length){ name = arguments[0]; value = arguments[1]; checked = arguments[2]; } if(name) this.attr(rc, 'name', name); if(undefined!==value) rc.value = value; if(!!checked) rc.checked = true; return rc; }; const domAddRemoveClass = function f(action,e){ if(!f.rxSPlus){ f.rxSPlus = /\s+/; f.applyAction = function(e,a,v){ if(!e || !v ) return; else if(e.forEach){ e.forEach((E)=>E.classList[a](v)); }else{ e.classList[a](v); } }; } var i = 2, n = arguments.length; for( ; i < n; ++i ){ let c = arguments[i]; if(!c) continue; else if(isArray(c) || ('string'===typeof c && c.indexOf(' ')>=0 && (c = c.split(f.rxSPlus))) || c.forEach ){ c.forEach((k)=>k ? f.applyAction(e, action, k) : false); }else if(c){ f.applyAction(e, action, c); } } return e; }; dom.addClass = function(e,c){ const a = argsToArray(arguments); a.unshift('add'); return domAddRemoveClass.apply(this, a); }; dom.removeClass = function(e,c){ const a = argsToArray(arguments); a.unshift('remove'); return domAddRemoveClass.apply(this, a); }; dom.toggleClass = function f(e,c){ if(e.forEach){ e.forEach((x)=>x.classList.toggle(c)); }else{ e.classList.toggle(c); } return e; }; dom.hasClass = function(e,c){ return (e && e.classList) ? e.classList.contains(c) : false; }; dom.moveTo = function(dest,e){ const n = arguments.length; var i = 1; const self = this; for( ; i < n; ++i ){ e = arguments[i]; this.append(dest, e); } return dest; }; dom.moveChildrenTo = function f(dest,e){ if(!f.mv){ f.mv = function(d,v){ if(d instanceof Array){ d.push(v); if(v.parentNode) v.parentNode.removeChild(v); } else d.appendChild(v); }; } const n = arguments.length; var i = 1; for( ; i < n; ++i ){ e = arguments[i]; if(!e){ console.warn("Achtung: dom.moveChildrenTo() passed a falsy value at argument",i,"of", arguments,arguments[i]); continue; } if(e.forEach){ e.forEach((x)=>f.mv(dest, x)); }else{ while(e.firstChild){ f.mv(dest, e.firstChild); } } } return dest; }; dom.replaceNode = function f(old,nu){ var i = 1, n = arguments.length; ++f.counter; try { for( ; i < n; ++i ){ const e = arguments[i]; if(e.forEach){ e.forEach((x)=>f.call(this,old,e)); continue; } old.parentNode.insertBefore(e, old); } } finally{ --f.counter; } if(!f.counter){ old.parentNode.removeChild(old); } }; dom.replaceNode.counter = 0; dom.attr = function f(e){ if(2===arguments.length) return e.getAttribute(arguments[1]); const a = argsToArray(arguments); if(e.forEach){ e.forEach(function(x){ a[0] = x; f.apply(f,a); }); return e; } a.shift(); while(a.length){ const key = a.shift(), val = a.shift(); if(null===val || undefined===val){ e.removeAttribute(key); }else{ e.setAttribute(key,val); } } return e; }; const enableDisable = function f(enable){ var i = 1, n = arguments.length; for( ; i < n; ++i ){ let e = arguments[i]; if(e.forEach){ e.forEach((x)=>f(enable,x)); }else{ e.disabled = !enable; } } return arguments[1]; }; dom.enable = function(e){ const args = argsToArray(arguments); args.unshift(true); return enableDisable.apply(this,args); }; dom.disable = function(e){ const args = argsToArray(arguments); args.unshift(false); return enableDisable.apply(this,args); }; dom.selectOne = function(x,origin){ var src = origin || document, e = src.querySelector(x); if(!e){ e = new Error("Cannot find DOM element: "+x); console.error(e, src); throw e; } return e; }; dom.flashOnce = function f(e,howLongMs,afterFlashCallback){ if(e.dataset.isBlinking){ return; } if(2===arguments.length && 'function' ===typeof howLongMs){ afterFlashCallback = howLongMs; howLongMs = f.defaultTimeMs; } if(!howLongMs || 'number'!==typeof howLongMs){ howLongMs = f.defaultTimeMs; } e.dataset.isBlinking = true; const transition = e.style.transition; e.style.transition = "opacity "+howLongMs+"ms ease-in-out"; const opacity = e.style.opacity; e.style.opacity = 0; setTimeout(function(){ e.style.transition = transition; e.style.opacity = opacity; delete e.dataset.isBlinking; if(afterFlashCallback) afterFlashCallback(); }, howLongMs); return e; }; dom.flashOnce.defaultTimeMs = 400; dom.flashOnce.eventHandler = (event)=>dom.flashOnce(event.target) dom.flashNTimes = function(e,n,howLongMs,afterFlashCallback){ const args = argsToArray(arguments); args.splice(1,1); if(arguments.length===3 && 'function'===typeof howLongMs){ afterFlashCallback = howLongMs; howLongMs = args[1] = this.flashOnce.defaultTimeMs; }else if(arguments.length<3){ args[1] = this.flashOnce.defaultTimeMs; } n = +n; const self = this; const cb = args[2] = function f(){ if(--n){ setTimeout(()=>self.flashOnce(e, howLongMs, f), howLongMs+(howLongMs*0.1)); }else if(afterFlashCallback){ afterFlashCallback(); } }; this.flashOnce.apply(this, args); return this; }; dom.addClassBriefly = function f(e, className, howLongMs, afterCallback){ if(arguments.length<4 && 'function'===typeof howLongMs){ afterCallback = howLongMs; howLongMs = f.defaultTimeMs; }else if(arguments.length<3 || !+howLongMs){ howLongMs = f.defaultTimeMs; } this.addClass(e, className); setTimeout(function(){ dom.removeClass(e, className); if(afterCallback) afterCallback(); }, howLongMs); return this; }; dom.addClassBriefly.defaultTimeMs = 1000; dom.copyTextToClipboard = function(text){ if( window.clipboardData && window.clipboardData.setData ){ window.clipboardData.setData('Text',text); return true; }else{ const x = document.createElement("textarea"); x.style.position = 'fixed'; x.value = text; document.body.appendChild(x); x.select(); var rc; try{ document.execCommand('copy'); rc = true; }catch(err){ rc = false; }finally{ document.body.removeChild(x); } return rc; } }; dom.copyStyle = function f(e, style){ if(e.forEach){ e.forEach((x)=>f(x, style)); return e; } if(style){ let k; for(k in style){ if(style.hasOwnProperty(k)) e.style[k] = style[k]; } } return e; }; dom.effectiveHeight = function f(e){ if(!e) return 0; if(!f.measure){ f.measure = function callee(e, depth){ if(!e) return; const m = e.getBoundingClientRect(); if(0===depth){ callee.top = m.top; callee.bottom = m.bottom; }else{ callee.top = m.top ? Math.min(callee.top, m.top) : callee.top; callee.bottom = Math.max(callee.bottom, m.bottom); } Array.prototype.forEach.call(e.children,(e)=>callee(e,depth+1)); if(0===depth){ f.extra += callee.bottom - callee.top; } return f.extra; }; } f.extra = 0; f.measure(e,0); return f.extra; }; dom.parseHtml = function(){ let childs, string, tgt; if(1===arguments.length){ string = arguments[0]; }else if(2==arguments.length){ tgt = arguments[0]; string = arguments[1]; } if(string){ const newNode = new DOMParser().parseFromString(string, 'text/html'); childs = newNode.documentElement.querySelector('body'); childs = childs ? Array.prototype.slice.call(childs.childNodes, 0) : []; }else{ childs = []; } return tgt ? this.moveTo(tgt, childs) : childs; }; F.connectPagePreviewers = function f(selector,methodNamespace){ if('string'===typeof selector){ selector = document.querySelectorAll(selector); }else if(!selector.forEach){ selector = [selector]; } if(!methodNamespace){ methodNamespace = F.page; } selector.forEach(function(e){ e.addEventListener( 'click', function(r){ const eTo = '#'===e.dataset.fPreviewTo[0] ? document.querySelector(e.dataset.fPreviewTo) : methodNamespace[e.dataset.fPreviewTo], eFrom = '#'===e.dataset.fPreviewFrom[0] ? document.querySelector(e.dataset.fPreviewFrom) : methodNamespace[e.dataset.fPreviewFrom], asText = +(e.dataset.fPreviewAsText || 0); eTo.textContent = "Fetching preview..."; methodNamespace[e.dataset.fPreviewVia]( (eFrom instanceof Function ? eFrom.call(methodNamespace) : eFrom.value), function(r){ if(eTo instanceof Function) eTo.call(methodNamespace, r||''); else if(!r){ dom.clearElement(eTo); }else if(asText){ eTo.textContent = r; }else{ dom.parseHtml(dom.clearElement(eTo), r); } } ); }, false ); }); return this; }; return F.dom = dom; })(window.fossil);