define(function () { function isElement(obj) { //instanceof fails for elements that have been created by another document (iframe case) //in that case we check other properties existing in all element nodes return obj instanceof HTMLElement || ((typeof obj === "object") && (obj.nodeType === 1) && (typeof obj.style === "object") && (typeof obj.ownerDocument === "object")); } let slideUp = (target, duration = 500, callback = null) => { target.style.transitionProperty = 'height, margin, padding'; target.style.transitionDuration = duration + 'ms'; target.style.boxSizing = 'border-box'; target.style.height = target.offsetHeight + 'px'; target.offsetHeight; target.style.overflow = 'hidden'; target.style.height = 0; target.style.paddingTop = 0; target.style.paddingBottom = 0; target.style.marginTop = 0; target.style.marginBottom = 0; window.setTimeout(() => { target.style.display = 'none'; target.style.removeProperty('height'); target.style.removeProperty('padding-top'); target.style.removeProperty('padding-bottom'); target.style.removeProperty('margin-top'); target.style.removeProperty('margin-bottom'); target.style.removeProperty('overflow'); target.style.removeProperty('transition-duration'); target.style.removeProperty('transition-property'); if (callback) { callback(); } }, duration); } let slideDown = (target, duration = 500, callback = null) => { target.style.removeProperty('display'); let display = window.getComputedStyle(target).display; if (display === 'none') display = 'block'; target.style.display = display; let height = target.offsetHeight; target.style.overflow = 'hidden'; target.style.height = 0; target.style.paddingTop = 0; target.style.paddingBottom = 0; target.style.marginTop = 0; target.style.marginBottom = 0; target.offsetHeight; target.style.boxSizing = 'border-box'; target.style.transitionProperty = "height, margin, padding"; target.style.transitionDuration = duration + 'ms'; target.style.height = height + 'px'; target.style.removeProperty('padding-top'); target.style.removeProperty('padding-bottom'); target.style.removeProperty('margin-top'); target.style.removeProperty('margin-bottom'); window.setTimeout(() => { target.style.removeProperty('height'); target.style.removeProperty('overflow'); target.style.removeProperty('transition-duration'); target.style.removeProperty('transition-property'); if (callback) { callback(); } }, duration); } var slideToggle = (target, duration = 500, callback = null) => { if (window.getComputedStyle(target).display === 'none') { return slideDown(target, duration, callback); } else { return slideUp(target, duration, callback); } } function resolveSelector(selector, context) { if (typeof (selector) !== "string") { if (context) { throw 'Context is allowed only when selector is a string.'; } if (Array.isArray(selector)) { return selector; } if (isElement(selector)) { return [selector]; } throw 'Selector can either be a string or an array'; } if (!context) { return document.querySelectorAll(selector); } if (typeof (context) == "string") { return resolveSelector(selector).filter(element => element.matches(selector)); } else if (Array.isArray(context)) { return context.filter(element => element.matches(selector)); } else if (isElement(context)) { return context.querySelectorAll(selector); } else { throw 'Unknown context type: ' + typeof (context) + ". Not a string, array or HTMLElement."; } } var factory = (target, context) => new domHelper(target, context); function domHelper(target, context) { this.elements = Array.from(resolveSelector(target, context)); this.on = function (event, callback) { for (let i = 0; i < this.elements.length; i++) { this.elements[i].addEventListener(event, function (e) { callback.apply(e.target, arguments); }); } return this; } this.parent = function (selector) { if (!selector) { return factory( this.elements.map(e => e.parentElement).filter(e => e) ); } return factory( this.elements.map(element => { do { if (element.parentElement.matches(selector)) { return element.parentElement; } element = element.parentElement; } while (element.parentElement); return null; }).filter(e => e) ); } this.parents = function (selector) { var parents = this.elements.map(e => { var r = []; while (e.parentElement) { r.push(e.parentElement); e = e.parentElement; } return r; }).reduce((acc, curVal) => { return acc.concat(curVal) }).filter(e => e); if (!selector) { return factory(parents); } return factory(selector, parents); } this.find = function (selector) { return factory(this.elements.map(e => { return factory(selector, e).elements; }).reduce((acc, curVal) => { return acc.concat(curVal) })); } this.show = function () { this.each(e => e.style.display = "block"); } this.hide = function () { this.each(e => e.style.display = "none"); } this.innerWidth = function () { var element = this.elements[0]; return parseInt(window.getComputedStyle(element).width); } this.toggle = function () { this.each(e => { if ((e.offsetParent === null)) // hidden { e.style.display = "block"; } else { e.style.display = "none"; } }); } this.each = function (callback) { this.elements.forEach(callback); return this; } this.scroll = function () { this.each(element => element.scroll.apply(element, arguments)); return this; } this.addClass = function (cssClass) { if (!cssClass) { return; } var classes = cssClass.split(' '); this.elements.forEach(element => { classes.forEach(cssClass => { element.classList.add(cssClass); }); }); return this; } this.removeClass = function (cssClass) { if (!cssClass) { return; } var classes = cssClass.split(' '); this.elements.forEach(element => { classes.forEach(cssClass => { element.classList.remove(cssClass); }); }); return this; } this.toggleClass = function (cssClass) { if (!cssClass) { return; } var classes = cssClass.split(' '); this.elements.forEach(element => { classes.forEach(cssClass => { element.classList.toggle(cssClass); }); }); return this; } this.is = function (selector) { return factory(selector, this.elements).elements.length > 0; } this.not = function (exclude) { if (typeof (exclude) == "string") { return factory(this.elements.filter(e => !e.matches(exclude))); } else if (Array.isArray(exclude)) { return factory(this.elements.filter(e => exclude.indexOf(e) == -1)); } else if (isElement(exclude)) { return factory(this.elements.filter(e => e != exclude)); } else if (exclude instanceof domHelper) { return factory(this.elements.filter(e => exclude.elements.indexOf(e) == -1)); } else { throw 'Unknown exclude type: ' + typeof (exclude) + ". Not a string, array or HTMLElement or domHelper."; } } this.get = (index) => this.elements[index]; this.length = this.elements.length; this.siblings = function (selector) { var next = this.next(selector); var prev = this.prev(selector); return factory(prev.elements.concat(next.elements)); } this.next = function (selector) { var siblings = this.elements.map(e => { var r = []; while (e.nextElementSibling) { r.push(e.nextElementSibling); e = e.nextElementSibling; } return r; }).reduce((acc, curVal) => { return acc.concat(curVal) }).filter(e => e); if (!selector) { return factory(siblings); } return factory(selector, siblings); } this.prev = function (selector) { var siblings = this.elements.map(e => { var r = []; while (e.previousElementSibling) { r.push(e.previousElementSibling); e = e.previousElementSibling; } return r; }).reduce((acc, curVal) => { return acc.concat(curVal) }).filter(e => e); if (!selector) { return factory(siblings); } return factory(selector, siblings); } this.index = function () { var items = []; this.prev().each(function (e) { items.push(e); }); items.push(this.get(0)); this.next().each(function (e) { items.push(e); }); return items.indexOf(this.get(0)); } this.slideDown = function (duration, callback) { return this.each(function (e) { slideDown(e, duration, callback); }); } this.slideUp = function (duration, callback) { return this.each(function (e) { slideUp(e, duration, callback); }); } this.slideToggle = function (duration, callback) { return this.each(function (e) { slideToggle(e, duration, callback); }); } this.removeAttr = function (attribute) { this.each(e => e.removeAttribute(attribute)); } this.hasClass = function (cssClass) { if (!cssClass) { return; } return new RegExp('(\\s|^)' + cssClass + '(\\s|$)').test(this.get(0).className); } this.val = function (inputValue) { if (typeof (inputValue) === 'undefined') { return this.elements[0].value; } return this.each(function (e) { e.value = inputValue; }); } this.data = function (attribute, inputValue) { if (typeof (inputValue) === 'undefined') { return this.elements[0].dataset[attribute]; } return this.each(function (e) { e.dataset[attribute] = inputValue; }); } this.text = function (inputValue) { if (typeof (inputValue) === 'undefined') { return this.elements[0].innerText; } return this.each(function (e) { e.innerText = inputValue; }); } this.contains = function (element) { return this.elements.indexOf(element) >= 0; } this.trigger = function (eventName) { if ("createEvent" in document) { var evt = document.createEvent("HTMLEvents"); evt.initEvent(eventName, false, true); return this.each(function (e) { e.dispatchEvent(evt); }); } else { return this.each(function (e) { e.fireEvent("on" + eventName); }); } } } return factory; });