diff --git a/CHANGELOG.md b/CHANGELOG.md index c98a3c4..16ebf2b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## CHANGELOG +### Version 4.16.1 *2022-11-03* + ++ simplified internal code to process theme options and removed some obsolete code ++ fix in css file to prevent overflowing title in minimized panel replacement + ### Version 4.16.0 *2022-07-03* + **added** Dialog extension. This extension adds an easy-to-use interface for dialog elements to virtually any jsPanel. It also offers a `modal()` function to create modal dialogs as well as `alert()`, `confirm()` and `prompt()` functions. `jsPanel.dialog` is a Third Party Extension developed and maintained by Michael Daumling. diff --git a/README.md b/README.md index 8da3d3b..233450b 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ NPM license npm version npm downloads -## [jsPanel 4.16.0 released 2022-07-03](#) +## [jsPanel 4.16.1 released 2022-11-03](#) > As of v4.11.0-beta methods `jsPanel.ajax()` and `jsPanel.fetch()` are updated. That also affects options `contentAjax` and `contentFetch`. These updates might break existing code. So please check the docs on https://jspanel.de/ diff --git a/dist/extensions/contextmenu/jspanel.contextmenu.js b/dist/extensions/contextmenu/jspanel.contextmenu.js index 271d655..91c4d36 100644 --- a/dist/extensions/contextmenu/jspanel.contextmenu.js +++ b/dist/extensions/contextmenu/jspanel.contextmenu.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -24,51 +24,43 @@ if (!jsPanel.contextmenu) { }, cmOverflow: function cmOverflow(elmt) { var cltX = elmt.cmEvent.clientX, - cltY = elmt.cmEvent.clientY, - panelW = elmt.offsetWidth, - panelH = elmt.offsetHeight, - corrLeft = window.innerWidth - (cltX + panelW), - corrTop = window.innerHeight - (cltY + panelH); - + cltY = elmt.cmEvent.clientY, + panelW = elmt.offsetWidth, + panelH = elmt.offsetHeight, + corrLeft = window.innerWidth - (cltX + panelW), + corrTop = window.innerHeight - (cltY + panelH); if (corrLeft < 0) { elmt.style.left = cltX + (window.scrollX || window.pageXOffset) - panelW + 'px'; } - if (corrTop < 0) { elmt.style.top = cltY + (window.scrollY || window.pageYOffset) - panelH + 'px'; } }, create: function create() { var _this = this; - var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var evt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'contextmenu'; options.paneltype = 'contextmenu'; var target = options.target; - if (!target) { return false; } - if (typeof target === 'string') { target = document.querySelector(target); } - target.addEventListener(evt, function (e) { - e.preventDefault(); // close all contextmenus first - + e.preventDefault(); + // close all contextmenus first document.querySelectorAll('.jsPanel-contextmenu').forEach(function (item) { item.close(); }); var l = (e.pageX || e.touches[0].pageX) + 'px', - t = (e.pageY || e.touches[0].pageY) + 'px', - opts = options; - + t = (e.pageY || e.touches[0].pageY) + 'px', + opts = options; if (options.config) { opts = Object.assign({}, options.config, options); delete opts.config; } - opts = Object.assign({}, _this.defaults, opts, { position: false, container: 'body' @@ -78,34 +70,31 @@ if (!jsPanel.contextmenu) { position: 'absolute', left: l, top: t - }); // check whether contextmenu is triggered from within a modal panel or panel and if so update z-index + }); + // check whether contextmenu is triggered from within a modal panel or panel and if so update z-index var closestModal = target.closest('.jsPanel-modal'); - if (closestModal) { cm.style.zIndex = closestModal.style.zIndex; } else { var closestPanel = target.closest('.jsPanel'); - if (closestPanel) { closestPanel.front(); } - cm.style.zIndex = jsPanel.zi.next(); - } // save event object as property of cm outer div (needed in checkContextmenuOverflow()) - + } - cm.cmEvent = e; // update left/top values if menu overflows browser viewport + // save event object as property of cm outer div (needed in checkContextmenuOverflow()) + cm.cmEvent = e; + // update left/top values if menu overflows browser viewport jsPanel.contextmenu.cmOverflow(cm); - if (opts.closeOnMouseleave) { cm.addEventListener('mouseleave', function () { cm.close(); }, false); - } // don't close contextmenu on mousedown in contextmenu - - + } + // don't close contextmenu on mousedown in contextmenu jsPanel.pointerdown.forEach(function (evt) { cm.addEventListener(evt, function (e) { e.stopPropagation(); @@ -114,14 +103,16 @@ if (!jsPanel.contextmenu) { }); }, false); } - }; // add overflow check to jsPanel.contentAjax always callback + }; + // add overflow check to jsPanel.contentAjax always callback jsPanel.ajaxAlwaysCallbacks.push(function (xhr, obj) { if (obj && obj.classList && obj.classList.contains('jsPanel-contextmenu')) { jsPanel.contextmenu.cmOverflow(obj); } - }); // close tooltips on pointerdown in document + }); + // close tooltips on pointerdown in document jsPanel.pointerdown.forEach(function (evt) { document.addEventListener(evt, function (e) { document.querySelectorAll('.jsPanel-contextmenu').forEach(function (item) { diff --git a/dist/extensions/datepicker/jspanel.datepicker.js b/dist/extensions/datepicker/jspanel.datepicker.js index bc99826..1d216ad 100644 --- a/dist/extensions/datepicker/jspanel.datepicker.js +++ b/dist/extensions/datepicker/jspanel.datepicker.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -10,18 +10,17 @@ 'use strict'; function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; } - function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } - function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } - /** * requires moment.js < https://momentjs.com/ > to be loaded prior this extension */ + // TODO: - cancelable events dateselect, rangeselect, selectionclear, etc. ?? // - alternative way to select a range, e.g start by Alt+Click end end by another Alt-Click ?? // - make dates not selectable and mark them accordingly ?? // - load list of days to highlight somehow (e.g. holidays) + if (!jsPanel.datepicker) { // add some icons for the datepicker controls jsPanel.icons.chevronLeft = ""; @@ -46,13 +45,12 @@ if (!jsPanel.datepicker) { var wrapper = document.createElement('div'); wrapper.className = 'jsPanel-cal-wrapper'; wrapper.innerHTML = "
".concat(jsPanel.icons.square, "
\n
").concat(jsPanel.icons.chevronLeft, "
\n
\n
").concat(jsPanel.icons.chevronRight, "
\n
").concat(jsPanel.icons.undo, "
\n
\n
\n
\n
\n
\n
\n
\n
"); - for (var i = 0; i < 6; i++) { wrapper.innerHTML += "
"); } - for (var _i = 1; _i < 43; _i++) { - wrapper.innerHTML += "
"); // ${i} is just a counter of days listed in the calendar, not a date value! + wrapper.innerHTML += "
"); + // ${i} is just a counter of days listed in the calendar, not a date value! } return wrapper; @@ -65,24 +63,24 @@ if (!jsPanel.datepicker) { var now = moment(startdate) || moment(datepicker.options.startdate); now.locale(datepicker.options.locale); var month = now.month(), - // returns number 0 to 11 where 0 is January - firstDay = now.date(1).weekday(), - // returns locale aware number 0 to 6 where 0 is either Sunday or Monday - localeData = now.localeData(); // fill selected month incl. year + // returns number 0 to 11 where 0 is January + firstDay = now.date(1).weekday(), + // returns locale aware number 0 to 6 where 0 is either Sunday or Monday + localeData = now.localeData(); + // fill selected month incl. year var monthBox = datepicker.querySelector('.jsPanel-cal-month'); monthBox.innerHTML = now.format('MMMM YYYY'); - monthBox.dataset.date = now.format('YYYY-MM-DD'); // fill day names (Mo, Tu, etc.) considering used locale + monthBox.dataset.date = now.format('YYYY-MM-DD'); + // fill day names (Mo, Tu, etc.) considering used locale var dayNames = datepicker.querySelectorAll('.jsPanel-cal-sub.day-name'), - weekdays = localeData.weekdaysMin(); - + weekdays = localeData.weekdaysMin(); if (localeData.firstDayOfWeek() === 1) { // week starts with Monday for (var i = 0, j = 1; i < 7; i++, j++) { dayNames[i].textContent = weekdays[j]; } - dayNames[6].textContent = weekdays[0]; dayNames[5].classList.add('weekend'); dayNames[6].classList.add('weekend'); @@ -90,18 +88,15 @@ if (!jsPanel.datepicker) { for (var _i2 = 0; _i2 < 7; _i2++) { dayNames[_i2].textContent = weekdays[_i2]; } - dayNames[0].classList.add('weekend'); dayNames[6].classList.add('weekend'); - } // fill dates - + } + // fill dates var firstEntry = now.subtract(++firstDay, 'days'); var days = datepicker.querySelectorAll('.jsPanel-cal-sub.day'); - var _iterator = _createForOfIteratorHelper(days), - _step; - + _step; try { for (_iterator.s(); !(_step = _iterator.n()).done;) { var day = _step.value; @@ -109,20 +104,19 @@ if (!jsPanel.datepicker) { var value = firstEntry.add(1, 'days'); day.textContent = value.format('D'); day.dataset.date = now.format('YYYY-MM-DD'); - if (value.month() !== month) { day.classList.add('notInMonth'); } else if (day.dataset.date === moment().format('YYYY-MM-DD')) { day.classList.add('today'); } - } // fill week numbers + } + // fill week numbers } catch (err) { _iterator.e(err); } finally { _iterator.f(); } - if (datepicker.options.showWeekNumbers) { datepicker.querySelectorAll('.jsPanel-cal-sub.week').forEach(function (week, index) { week.textContent = moment(datepicker.querySelector(".jsPanel-cal-sub.day-".concat((index + 1) * 7)).dataset.date).week(); @@ -133,8 +127,7 @@ if (!jsPanel.datepicker) { // do not empty selectedDays/selectedRange -> selection would be lost when clicking forward/back buttons deselectAllDays: function deselectAllDays(container) { var _iterator2 = _createForOfIteratorHelper(container.querySelectorAll('.jsPanel-cal-sub.day')), - _step2; - + _step2; try { for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { var day = _step2.value; @@ -150,40 +143,33 @@ if (!jsPanel.datepicker) { restoreSelections: function restoreSelections(container) { // restore selections of days var days = container.querySelectorAll('.jsPanel-cal-sub.day'); - var _iterator3 = _createForOfIteratorHelper(days), - _step3; - + _step3; try { for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) { var _day = _step3.value; - if (container.selectedDays.has(_day.dataset.date)) { _day.classList.add('selected'); } - } // restore selection of a range - + } + // restore selection of a range } catch (err) { _iterator3.e(err); } finally { _iterator3.f(); } - if (container.selectedRange.size) { var rangeIterator = container.selectedRange.values(); var rangeArray = rangeIterator.next().value.split('/'); - var _iterator4 = _createForOfIteratorHelper(days), - _step4; - + _step4; try { for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) { var day = _step4.value; var date = day.dataset.date; - if (date >= rangeArray[0] && date <= rangeArray[1]) { - day.classList.add('selected', 'range'); // remove border radius of dates between start and end - + day.classList.add('selected', 'range'); + // remove border radius of dates between start and end if (date === rangeArray[0]) { day.classList.add('remove-border-radius-right'); } else if (date === rangeArray[1]) { @@ -206,32 +192,28 @@ if (!jsPanel.datepicker) { container.selectedDays = new Set(); container.selectedRange = new Set(); var opts = Object.assign({}, this.defaults, options); - var wrapper; // fill container with monthly calendars according to option.months - + var wrapper; + // fill container with monthly calendars according to option.months for (var i = 0; i < opts.months; i++) { wrapper = this.generateHTML(); wrapper.options = opts; - container.append(wrapper); // fill month with data - - this.fillMonth(wrapper, opts.startdate); // increase startdate 1 month for next calendar - + container.append(wrapper); + // fill month with data + this.fillMonth(wrapper, opts.startdate); + // increase startdate 1 month for next calendar opts.startdate = moment(opts.startdate).add(1, 'months'); - } // add handlers for back, forward etc. buttons - + } + // add handlers for back, forward etc. buttons var pickers = container.querySelectorAll('.jsPanel-cal-wrapper'); - var _iterator5 = _createForOfIteratorHelper(pickers), - _step5; - + _step5; try { for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) { var picker = _step5.value; - // clear buttons var _iterator8 = _createForOfIteratorHelper(picker.querySelectorAll('.jsPanel-cal-clear')), - _step8; - + _step8; try { for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) { var clearbtn = _step8.value; @@ -239,40 +221,34 @@ if (!jsPanel.datepicker) { if (opts.onselectionclear && typeof opts.onselectionclear === 'function') { opts.onselectionclear.call(container, container, e); } - if (!e.defaultPrevented) { jsPanel.datepicker.deselectAllDays(container); container.selectedDays.clear(); container.selectedRange.clear(); } }); - } // back buttons - + } + // back buttons } catch (err) { _iterator8.e(err); } finally { _iterator8.f(); } - var _iterator9 = _createForOfIteratorHelper(picker.querySelectorAll('.jsPanel-cal-back')), - _step9; - + _step9; try { for (_iterator9.s(); !(_step9 = _iterator9.n()).done;) { var backbtn = _step9.value; backbtn.addEventListener('click', function () { // get all wrappers and decrease their date var _iterator12 = _createForOfIteratorHelper(pickers), - _step12; - + _step12; try { for (_iterator12.s(); !(_step12 = _iterator12.n()).done;) { var _picker = _step12.value; - var monthshown = _picker.querySelector('.jsPanel-cal-month').dataset.date, - // string like '2020-02-12' - monthwanted = moment(monthshown).subtract(1, 'months').format('YYYY-MM'); - + // string like '2020-02-12' + monthwanted = moment(monthshown).subtract(1, 'months').format('YYYY-MM'); jsPanel.datepicker.fillMonth(_picker, monthwanted); } } catch (err) { @@ -280,37 +256,31 @@ if (!jsPanel.datepicker) { } finally { _iterator12.f(); } - jsPanel.datepicker.deselectAllDays(container); jsPanel.datepicker.restoreSelections(container); }); - } // forward buttons - + } + // forward buttons } catch (err) { _iterator9.e(err); } finally { _iterator9.f(); } - var _iterator10 = _createForOfIteratorHelper(picker.querySelectorAll('.jsPanel-cal-forward')), - _step10; - + _step10; try { for (_iterator10.s(); !(_step10 = _iterator10.n()).done;) { var fwdbtn = _step10.value; fwdbtn.addEventListener('click', function () { // get all wrappers and increase their date var _iterator13 = _createForOfIteratorHelper(pickers), - _step13; - + _step13; try { for (_iterator13.s(); !(_step13 = _iterator13.n()).done;) { var _picker2 = _step13.value; - var monthshown = _picker2.querySelector('.jsPanel-cal-month').dataset.date, - // string like '2020-02-12' - monthwanted = moment(monthshown).add(1, 'months').format('YYYY-MM'); - + // string like '2020-02-12' + monthwanted = moment(monthshown).add(1, 'months').format('YYYY-MM'); jsPanel.datepicker.fillMonth(_picker2, monthwanted); } } catch (err) { @@ -318,41 +288,35 @@ if (!jsPanel.datepicker) { } finally { _iterator13.f(); } - jsPanel.datepicker.deselectAllDays(container); jsPanel.datepicker.restoreSelections(container); }); - } // reset buttons - + } + // reset buttons } catch (err) { _iterator10.e(err); } finally { _iterator10.f(); } - var _iterator11 = _createForOfIteratorHelper(picker.querySelectorAll('.jsPanel-cal-reset')), - _step11; - + _step11; try { for (_iterator11.s(); !(_step11 = _iterator11.n()).done;) { var resetbtn = _step11.value; resetbtn.addEventListener('click', function (e) { // get month shown of clicked picker var picker = e.target.closest('.jsPanel-cal-wrapper'), - counter = 0; - + counter = 0; while (picker.previousSibling) { counter++; picker = picker.previousSibling; - } // counter is now the zero-based position of the clicked picker in the container + } + // counter is now the zero-based position of the clicked picker in the container // get month for first picker in sequence - - - var month = moment().subtract(counter, 'months'); // reset each pickers month - + var month = moment().subtract(counter, 'months'); + // reset each pickers month var _iterator14 = _createForOfIteratorHelper(pickers), - _step14; - + _step14; try { for (_iterator14.s(); !(_step14 = _iterator14.n()).done;) { var _picker3 = _step14.value; @@ -364,7 +328,6 @@ if (!jsPanel.datepicker) { } finally { _iterator14.f(); } - jsPanel.datepicker.deselectAllDays(container); jsPanel.datepicker.restoreSelections(container); }); @@ -375,24 +338,22 @@ if (!jsPanel.datepicker) { _iterator11.f(); } } + /** * CLICK ON A DAY * MEANS SELECTION/DESELECTION OF SINGLE OR MULTIPLE DAYS; NO RANGES */ - } catch (err) { _iterator5.e(err); } finally { _iterator5.f(); } - container.addEventListener('click', function (e) { e.preventDefault(); var target = e.target, - altKey = e.altKey, - ctrlKey = e.ctrlKey, - shiftKey = e.shiftKey; - + altKey = e.altKey, + ctrlKey = e.ctrlKey, + shiftKey = e.shiftKey; if (target.classList.contains('day')) { // check whether day is already selected var selected = target.classList.contains('selected'); @@ -400,17 +361,17 @@ if (!jsPanel.datepicker) { /** * IF NO MODIFIER KEY IS PRESSED */ - if (!ctrlKey && !shiftKey && !altKey) { // unselect all selected days and clear container.selectedDays jsPanel.datepicker.deselectAllDays(container); - container.selectedDays.clear(); // select/unselect day depending on let selected + container.selectedDays.clear(); + // select/unselect day depending on let selected if (selected) { target.classList.remove('selected'); } else { - target.classList.add('selected'); // add selected day to storage - + target.classList.add('selected'); + // add selected day to storage container.selectedDays.add(date); } } else if (!altKey && ctrlKey && !shiftKey) { @@ -418,88 +379,78 @@ if (!jsPanel.datepicker) { * IF CTRL KEY IS PRESSED */ container.selectedRange.clear(); - var _iterator6 = _createForOfIteratorHelper(container.querySelectorAll('.day')), - _step6; - + _step6; try { for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) { var day = _step6.value; - if (day.classList.contains('selected') && day.classList.contains('range')) { day.classList.remove('range', 'selected'); } - } // select/unselect day depending on let selected - + } + // select/unselect day depending on let selected } catch (err) { _iterator6.e(err); } finally { _iterator6.f(); } - if (selected) { - target.classList.remove('selected'); // remove selected day from storage - + target.classList.remove('selected'); + // remove selected day from storage container.selectedDays["delete"](date); } else { - target.classList.add('selected'); // add selected day to storage - + target.classList.add('selected'); + // add selected day to storage container.selectedDays.add(date); } - } // custom callback - + } + // custom callback if (opts.ondateselect && typeof opts.ondateselect === 'function') { opts.ondateselect.call(container, container, date, e); } } }); + /** * POINTERDOWN HANDLER TO STARTING A RANGE SELECTION */ - var rangeSelectionStarted; container.addEventListener('pointerdown', function (e) { e.preventDefault(); var target = e.target, - altKey = e.altKey, - ctrlKey = e.ctrlKey, - shiftKey = e.shiftKey; + altKey = e.altKey, + ctrlKey = e.ctrlKey, + shiftKey = e.shiftKey; var start = e.target.dataset.date, - current = e.target.dataset.date, - range = [start, start]; - + current = e.target.dataset.date, + range = [start, start]; var calcRange = function calcRange(e) { e.preventDefault(); rangeSelectionStarted = true; - if (container.selectedDays.size) { container.selectedDays.clear(); - } // build range array and sort it - - + } + // build range array and sort it if (e.target.classList.contains('day')) { current = e.target.dataset.date; range = [start, current].sort(function (a, b) { return moment(a).unix() - moment(b).unix(); // convert values to number for comparison }); - } // add needed classes to selected range - - + } + // add needed classes to selected range var _iterator7 = _createForOfIteratorHelper(container.querySelectorAll('.day')), - _step7; - + _step7; try { for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) { var day = _step7.value; var date = day.dataset.date; day.classList.remove('remove-border-radius-right', 'remove-border-radius-left'); - if (date < range[0] || date > range[1]) { day.classList.remove('selected', 'range'); } else { - day.classList.add('selected', 'range'); // remove border radius of dates between start and end - + day.classList.add('selected', 'range'); + // remove border radius of dates between start and end if (date === range[0]) { day.classList.add('remove-border-radius-right'); } else if (date === range[1]) { @@ -508,19 +459,19 @@ if (!jsPanel.datepicker) { day.classList.add('remove-border-radius-right', 'remove-border-radius-left'); } } - } // build range string for selectedRange + } + // build range string for selectedRange } catch (err) { _iterator7.e(err); } finally { _iterator7.f(); } - container.selectedRange.clear(); container.selectedRange.add(container.querySelector(".day[data-date=\"".concat(range[0], "\"]")).dataset.date + '/' + container.querySelector(".day[data-date=\"".concat(range[1], "\"]")).dataset.date); - }; // if pointerdown is on a day and Shift key is pressed - + }; + // if pointerdown is on a day and Shift key is pressed if (target.classList.contains('day') && !altKey && !ctrlKey && shiftKey) { container.addEventListener('pointermove', calcRange); container.addEventListener('pointerup', function () { @@ -535,18 +486,16 @@ if (!jsPanel.datepicker) { rangeSelectionStarted = undefined; } } - rangeSelectionStarted = undefined; }); - if (opts.callback) { opts.callback.call(container, container); } - return container; } - }; // jsPanel.datepicker.keyValue is set to the value of the pressed number key while key is down and if key's value is between 1 and 9 + }; + // jsPanel.datepicker.keyValue is set to the value of the pressed number key while key is down and if key's value is between 1 and 9 document.addEventListener('keydown', function (e) { if (e.key.match(/^[2-9]$/)) { jsPanel.datepicker.keyValue = e.key; diff --git a/dist/extensions/datepicker/theme/default.css b/dist/extensions/datepicker/theme/default.css index 2e4f41b..34bf65b 100644 --- a/dist/extensions/datepicker/theme/default.css +++ b/dist/extensions/datepicker/theme/default.css @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/dist/extensions/dialog/jspanel.dialog.css b/dist/extensions/dialog/jspanel.dialog.css index 741ac7f..9a999f9 100644 --- a/dist/extensions/dialog/jspanel.dialog.css +++ b/dist/extensions/dialog/jspanel.dialog.css @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -13,33 +13,21 @@ margin-top: 50px; max-height: calc(90vh - 50px); } - .jsPanel-dialog .jsPanel-content { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + flex-direction: column; overflow: hidden; - /* Add some padding to the dialog content */ + /* Add some padding to the dialog content */ padding: 1rem; } - .jsPanel-dialog .buttonbar { margin-top: 10px; padding-top: 10px; border-top: 1px solid #ccc; width: 100%; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: right; - -ms-flex-pack: right; - justify-content: right; + justify-content: right; } - .jsPanel-dialog .buttonbar button { margin-left: 0.5rem; } @@ -77,19 +65,16 @@ width: 90vw !important; } } - @media (max-width: 991px) { .dialog-lg, .dialog-xl { width: 90vw !important; } } - @media (max-width: 1199px) { .dialog-xl { width: 90vw !important; } } - /* A few button colors */ button.blue, button.info { color: #fff !important; @@ -138,12 +123,12 @@ input:disabled, input[readonly] { } /* Radio buttons and checkboxes, followed by a span */ -input[type="checkbox"], input[type="radio"] { +input[type=checkbox], input[type=radio] { vertical-align: middle; margin: 0 0.5rem 0 0; } -input[type="radio"] { +input[type=radio] { margin-bottom: 2px; } @@ -151,4 +136,5 @@ input:disabled + span { opacity: 0.4; cursor: not-allowed; } -/*# sourceMappingURL=jspanel.dialog.css.map */ \ No newline at end of file + +/*# sourceMappingURL=jspanel.dialog.css.map */ diff --git a/dist/extensions/dialog/jspanel.dialog.js b/dist/extensions/dialog/jspanel.dialog.js index 9b2d811..d3c67d3 100644 --- a/dist/extensions/dialog/jspanel.dialog.js +++ b/dist/extensions/dialog/jspanel.dialog.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/dist/extensions/dialog/jspanel.dialog.min.css b/dist/extensions/dialog/jspanel.dialog.min.css index 0c8fcf9..7dc3ca9 100644 --- a/dist/extensions/dialog/jspanel.dialog.min.css +++ b/dist/extensions/dialog/jspanel.dialog.min.css @@ -1 +1 @@ -.jsPanel-dialog{min-width:400px;margin-top:50px;max-height:calc(90vh - 50px)}.jsPanel-dialog .jsPanel-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;padding:1rem}.jsPanel-dialog .buttonbar{margin-top:10px;padding-top:10px;border-top:1px solid #ccc;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:right;-ms-flex-pack:right;justify-content:right}.jsPanel-dialog .buttonbar button{margin-left:.5rem}.jsPanel-modal.background{opacity:.3!important}.dialog-lg,.dialog-md,.dialog-sm,.dialog-xl{max-height:calc(90vh - 50px);overflow:hidden auto;margin:0 auto}.dialog-sm{width:400px!important}.dialog-md{width:600px!important}.dialog-lg{width:800px!important}.dialog-xl{width:1000px!important}@media (max-width:767px){.dialog-lg,.dialog-md,.dialog-xl{width:90vw!important}}@media (max-width:991px){.dialog-lg,.dialog-xl{width:90vw!important}}@media (max-width:1199px){.dialog-xl{width:90vw!important}}button.blue,button.info{color:#fff!important;background-color:#039be5!important;border-color:#039be5!important}button.default,button.gray,button.secondary{color:#fff;background-color:#b0bec5!important;border-color:#b0bec5!important}button.white{color:#333!important;background-color:#fff!important}button.primary{color:#fff!important;background-color:#01579b!important;border-color:#01579b!important}button.warning,button.yellow{color:#000!important;background-color:#f57f17!important;border-color:#f57f17!important}button.danger,button.red{color:#fff!important;background-color:#dd2c00!important;border-color:#dd2c00!important}button.green,button.success{color:#fff!important;background-color:#2e7d32!important;border-color:#2e7d32!important}input:disabled,input[readonly]{cursor:not-allowed!important;background-color:#eee!important}input[type=checkbox],input[type=radio]{vertical-align:middle;margin:0 .5rem 0 0}input[type=radio]{margin-bottom:2px}input:disabled+span{opacity:.4;cursor:not-allowed} \ No newline at end of file +.jsPanel-dialog{min-width:400px;margin-top:50px;max-height:calc(90vh - 50px)}.jsPanel-dialog .jsPanel-content{display:flex;flex-direction:column;overflow:hidden;padding:1rem}.jsPanel-dialog .buttonbar{margin-top:10px;padding-top:10px;border-top:1px solid #ccc;width:100%;display:flex;justify-content:right}.jsPanel-dialog .buttonbar button{margin-left:.5rem}.jsPanel-modal.background{opacity:.3!important}.dialog-lg,.dialog-md,.dialog-sm,.dialog-xl{max-height:calc(90vh - 50px);overflow:hidden auto;margin:0 auto}.dialog-sm{width:400px!important}.dialog-md{width:600px!important}.dialog-lg{width:800px!important}.dialog-xl{width:1000px!important}@media (max-width:767px){.dialog-lg,.dialog-md,.dialog-xl{width:90vw!important}}@media (max-width:991px){.dialog-lg,.dialog-xl{width:90vw!important}}@media (max-width:1199px){.dialog-xl{width:90vw!important}}button.blue,button.info{color:#fff!important;background-color:#039be5!important;border-color:#039be5!important}button.default,button.gray,button.secondary{color:#fff;background-color:#b0bec5!important;border-color:#b0bec5!important}button.white{color:#333!important;background-color:#fff!important}button.primary{color:#fff!important;background-color:#01579b!important;border-color:#01579b!important}button.warning,button.yellow{color:#000!important;background-color:#f57f17!important;border-color:#f57f17!important}button.danger,button.red{color:#fff!important;background-color:#dd2c00!important;border-color:#dd2c00!important}button.green,button.success{color:#fff!important;background-color:#2e7d32!important;border-color:#2e7d32!important}input:disabled,input[readonly]{cursor:not-allowed!important;background-color:#eee!important}input[type=checkbox],input[type=radio]{vertical-align:middle;margin:0 .5rem 0 0}input[type=radio]{margin-bottom:2px}input:disabled+span{opacity:.4;cursor:not-allowed} \ No newline at end of file diff --git a/dist/extensions/dock/jspanel.dock.js b/dist/extensions/dock/jspanel.dock.js index a5a579d..9f2f04b 100644 --- a/dist/extensions/dock/jspanel.dock.js +++ b/dist/extensions/dock/jspanel.dock.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -23,37 +23,30 @@ if (!jsPanel.dock) { callback: false } }; - var dockPanel = function dockPanel(config) { var master, - slave = this; // this refers to slave panel - + slave = this; // this refers to slave panel this.slaveconfig = Object.assign({}, jsPanel.dock.defaults, config); - if (this.slaveconfig.master && this.slaveconfig.master.nodeType === 1) { master = this.slaveconfig.master; } else { master = document.querySelector(this.slaveconfig.master); } - if (!master) { // if master does not exist show error panel return false if (this.errorReporting) { var err = '◀ COULD NOT DOCK PANEL ►
The configured master panel to does not exist'; jsPanel.errorpanel(err); } - return false; } else { if (!master.slaves) { master.slaves = new Set(); } - if (!master.handlers) { master.handlers = {}; - } // set interactions between master and slaves - - + } + // set interactions between master and slaves if (!master.handlers.fronted) { master.options.onfronted.push(function () { var zI = master.style.zIndex; @@ -64,7 +57,6 @@ if (!jsPanel.dock) { }); master.handlers.fronted = true; } - if (!master.handlers.smallified) { master.options.onsmallified.push(function () { master.slaves.forEach(function (sl) { @@ -74,7 +66,6 @@ if (!jsPanel.dock) { }); master.handlers.smallified = true; } - if (!master.handlers.unsmallified) { master.options.onunsmallified.push(function () { master.slaves.forEach(function (sl) { @@ -84,7 +75,6 @@ if (!jsPanel.dock) { }); master.handlers.unsmallified = true; } - if (!master.handlers.closed) { master.options.onclosed.push(function () { master.slaves.forEach(function (sl) { @@ -94,7 +84,6 @@ if (!jsPanel.dock) { }); master.handlers.closed = true; } - if (!master.handlers.minimized) { master.options.onminimized.push(function () { master.slaves.forEach(function (sl) { @@ -104,52 +93,44 @@ if (!jsPanel.dock) { }); master.handlers.minimized = true; } - if (!master.handlers.maximized) { master.options.onmaximized.push(function () { master.slaves.forEach(function (sl) { sl.normalize(); - if (sl.slaveconfig.linkSlaveHeight) { var height = window.getComputedStyle(master).height; sl.resize({ height: height }); } - if (sl.slaveconfig.linkSlaveWidth) { var width = window.getComputedStyle(master).width; sl.resize({ width: width }); } - sl.reposition(); }); return true; }); master.handlers.maximized = true; } - if (!master.handlers.normalized) { master.options.onnormalized.push(function () { master.slaves.forEach(function (sl) { sl.normalize(); - if (sl.slaveconfig.linkSlaveHeight) { var height = window.getComputedStyle(master).height; sl.resize({ height: height }); } - if (sl.slaveconfig.linkSlaveWidth) { var width = window.getComputedStyle(master).width; sl.resize({ width: width }); } - sl.reposition(); }); return true; @@ -157,7 +138,6 @@ if (!jsPanel.dock) { master.handlers.normalized = true; } } - var position = Object.assign({}, this.slaveconfig.position, { of: master, minLeft: false, @@ -167,41 +147,35 @@ if (!jsPanel.dock) { autoposition: false, modify: false }); - if (!position.my) { position.my = jsPanel.dock.defaults.position.my; } - if (!position.at) { position.at = jsPanel.dock.defaults.position.at; } - slave.options.position = position; ['smallify', 'minimize', 'normalize', 'maximize'].forEach(function (ctrl) { slave.setControlStatus(ctrl, 'remove'); }); - if (this.slaveconfig.linkSlaveHeight) { var height = window.getComputedStyle(master).height; slave.resize({ height: height }); } - if (this.slaveconfig.linkSlaveWidth) { var width = window.getComputedStyle(master).width; slave.resize({ width: width }); - } // position slave - - - slave.reposition(position); // set necessary slave panel options - + } + // position slave + slave.reposition(position); + // set necessary slave panel options slave.dragit('disable'); slave.resizeit('disable'); - slave.options.minimizeTo = false; // remove slave from master.slaves Set when slave is closed - + slave.options.minimizeTo = false; + // remove slave from master.slaves Set when slave is closed slave.options.onclosed.push(function () { master.slaves["delete"](slave); }); @@ -211,29 +185,26 @@ if (!jsPanel.dock) { master.slaves.forEach(function (sl) { sl.style.zIndex = zI; }); - }); // set necessary master options + }); + // set necessary master options master.reposSlave = function () { if (document.querySelector('#' + slave.id)) { slave.reposition(); } }; - if (master.options.dragit) { master.options.dragit.drag.push(master.reposSlave); } - master.resizeSlave = function () { if (document.querySelector('#' + slave.id)) { slave.reposition(); - if (slave.slaveconfig.linkSlaveHeight) { var h = window.getComputedStyle(master).height; slave.resize({ height: h }); } - if (slave.slaveconfig.linkSlaveWidth) { var w = window.getComputedStyle(master).width; slave.resize({ @@ -242,21 +213,16 @@ if (!jsPanel.dock) { } } }; - if (master.options.resizeit) { master.options.resizeit.resize.push(master.resizeSlave); } - master.slaves.add(slave); slave.dockedTo = master.id; - if (this.slaveconfig.callback) { this.slaveconfig.callback.call(slave, master, slave); } - return slave; }; - jsPanel.extend({ dock: dockPanel }); diff --git a/dist/extensions/hint/jspanel.hint.js b/dist/extensions/hint/jspanel.hint.js index 5444949..96c9c3d 100644 --- a/dist/extensions/hint/jspanel.hint.js +++ b/dist/extensions/hint/jspanel.hint.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -23,12 +23,10 @@ if (!jsPanel.hint) { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; options.paneltype = 'hint'; var opts = options; - if (options.config) { opts = Object.assign({}, options.config, options); delete opts.config; } - opts = Object.assign({}, this.defaults, opts); return jsPanel.create(opts, function (hint) { hint.style.zIndex = 9999; diff --git a/dist/extensions/layout/jspanel.layout.js b/dist/extensions/layout/jspanel.layout.js index b0f2ab9..f9493a1 100644 --- a/dist/extensions/layout/jspanel.layout.js +++ b/dist/extensions/layout/jspanel.layout.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -10,7 +10,6 @@ 'use strict'; function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } - if (!jsPanel.layout) { jsPanel.layout = { version: '1.4.1', @@ -40,7 +39,6 @@ if (!jsPanel.layout) { }, getAll: function getAll() { var storagename = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'jspanels'; - if (this.storage[storagename]) { return JSON.parse(this.storage[storagename]); } else { @@ -51,18 +49,15 @@ if (!jsPanel.layout) { var attr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'id'; var storagename = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'jspanels'; var findall = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false; - if (this.storage[storagename]) { var datasets = this.getAll(storagename), - set; // findall true will return an array with all matches or at least an empty array - + set; + // findall true will return an array with all matches or at least an empty array if (findall) { set = []; } - datasets.forEach(function (item) { var type = _typeof(item[attr]); - if (type === 'string' || type === 'number') { if (item[attr] === value) { if (!set) { @@ -100,7 +95,6 @@ if (!jsPanel.layout) { restoreId: function restoreId() { var restoreConfig = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var id, config, storageName; - if (!restoreConfig.id || !restoreConfig.config) { // eslint-disable-next-line no-console console.error('Id or predefined panel configuration is missing!'); @@ -110,9 +104,7 @@ if (!jsPanel.layout) { config = restoreConfig.config; storageName = restoreConfig.storagename ? restoreConfig.storagename : 'jspanels'; } - var storedpanel = this.getDataset(id, 'id', storageName); - if (storedpanel) { var savedConfig = { id: storedpanel.id, @@ -128,8 +120,8 @@ if (!jsPanel.layout) { panel.style.zIndex = savedConfig.zIndex; panel.saveCurrentDimensions(); panel.saveCurrentPosition(); - panel.calcSizeFactors(); // don't put code below in savedConfig.setStatus - + panel.calcSizeFactors(); + // don't put code below in savedConfig.setStatus if (storedpanel.status !== 'normalized') { if (storedpanel.status === 'minimized') { panel.minimize(); @@ -147,7 +139,6 @@ if (!jsPanel.layout) { restore: function restore() { var restoreConfig = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var predefinedConfigs, storageName; - if (!restoreConfig.configs) { // eslint-disable-next-line no-console console.error('Object with predefined panel configurations is missing!'); @@ -156,14 +147,13 @@ if (!jsPanel.layout) { predefinedConfigs = restoreConfig.configs; storageName = restoreConfig.storagename ? restoreConfig.storagename : 'jspanels'; } - if (this.storage[storageName]) { - var storedPanels = this.getAll(storageName); // loop over all panels in storageName - + var storedPanels = this.getAll(storageName); + // loop over all panels in storageName storedPanels.forEach(function (item) { - var pId = item.id; // loop over predefined configs to find config with pId + var pId = item.id; + // loop over predefined configs to find config with pId // this makes it unnecessary that identifiers for a certain config is the same as id in config - for (var conf in predefinedConfigs) { if (Object.prototype.hasOwnProperty.call(predefinedConfigs, conf)) { if (predefinedConfigs[conf].id === pId) { diff --git a/dist/extensions/modal/jspanel.modal.js b/dist/extensions/modal/jspanel.modal.js index 3224900..b7fbb98 100644 --- a/dist/extensions/modal/jspanel.modal.js +++ b/dist/extensions/modal/jspanel.modal.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -14,6 +14,7 @@ * the option.dragit.containment setting of the already open panel. Reason unknown! * Workaround: Set option.dragit.containment to a suitable value on the modal. */ + if (!jsPanel.modal) { jsPanel.modal = { version: '1.2.5', @@ -28,15 +29,13 @@ if (!jsPanel.modal) { }, addBackdrop: function addBackdrop(id) { var modalCount = document.getElementsByClassName('jsPanel-modal-backdrop').length, - mb = document.createElement('div'); + mb = document.createElement('div'); mb.id = 'jsPanel-modal-backdrop-' + id; - if (modalCount === 0) { mb.className = 'jsPanel-modal-backdrop'; } else if (modalCount > 0) { mb.className = 'jsPanel-modal-backdrop jsPanel-modal-backdrop-multi'; } - mb.style.zIndex = this.ziModal.next(); return mb; }, @@ -51,21 +50,17 @@ if (!jsPanel.modal) { create: function create() { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; options.paneltype = 'modal'; - if (!options.id) { options.id = "jsPanel-".concat(jsPanel.idCounter += 1); } else if (typeof options.id === 'function') { options.id = options.id(); } - var opts = options, - backdrop = this.addBackdrop(opts.id); - + backdrop = this.addBackdrop(opts.id); if (options.config) { opts = Object.assign({}, options.config, options); delete opts.config; } - opts = Object.assign({}, this.defaults, opts, { container: 'window' }); @@ -73,27 +68,25 @@ if (!jsPanel.modal) { return jsPanel.create(opts, function (modal) { modal.style.zIndex = jsPanel.modal.ziModal.next(); modal.header.style.cursor = 'default'; - modal.footer.style.cursor = 'default'; // close modal on click in backdrop - + modal.footer.style.cursor = 'default'; + // close modal on click in backdrop if (opts.closeOnBackdrop) { jsPanel.pointerup.forEach(function (evt) { document.getElementById("jsPanel-modal-backdrop-".concat(opts.id)).addEventListener(evt, function () { modal.close(null, true); }); }); - } // remove modal backdrop when modal is closed + } + // remove modal backdrop when modal is closed // callback should be the first item in the onclosed array - - modal.options.onclosed.unshift(function removeModalBackdrop() { - jsPanel.modal.removeBackdrop(opts.id); // must return true in order to have the next callbacks (added via modal config) in the array execute as well - + jsPanel.modal.removeBackdrop(opts.id); + // must return true in order to have the next callbacks (added via modal config) in the array execute as well return true; }); }); } }; - jsPanel.modal.ziModal = function () { var val = jsPanel.ziBase + 10000; return { diff --git a/dist/extensions/tooltip/jspanel.tooltip.js b/dist/extensions/tooltip/jspanel.tooltip.js index e4dd550..23efb9c 100644 --- a/dist/extensions/tooltip/jspanel.tooltip.js +++ b/dist/extensions/tooltip/jspanel.tooltip.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -10,16 +10,15 @@ 'use strict'; function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } - // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent#Polyfill - needed for IE11 (function (window) { try { new MouseEvent('test'); return false; // No need to polyfill - } catch (e) {// Need to polyfill - fall through - } // Polyfills DOM4 MouseEvent - - + } catch (e) { + // Need to polyfill - fall through + } + // Polyfills DOM4 MouseEvent var MouseEvent = function MouseEvent(eventType, params) { params = params || { bubbles: false, @@ -29,11 +28,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope mouseEvent.initMouseEvent(eventType, params.bubbles, params.cancelable, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); return mouseEvent; }; - MouseEvent.prototype = Event.prototype; window.MouseEvent = MouseEvent; -})(window); // ----------------------------------------------------------- - +})(window); +// ----------------------------------------------------------- if (!jsPanel.tooltip) { jsPanel.tooltip = { @@ -54,125 +52,114 @@ if (!jsPanel.tooltip) { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var callback = arguments.length > 1 ? arguments[1] : undefined; options.paneltype = 'tooltip'; - if (!options.id) { options.id = "jsPanel-".concat(jsPanel.idCounter += 1); } else if (typeof options.id === 'function') { options.id = options.id(); } - var target = options.target, - mode = options.mode || 'default', - timer; - + mode = options.mode || 'default', + timer; if (typeof target === 'string') { target = document.querySelector(target); } - if (!target) { try { throw new jsPanel.jsPanelError('TOOLTIP SETUP FAILED!
Either option target is missing in the tooltip configuration or the target does nor exist in the document!'); } catch (e) { jsPanel.error(e); } - return false; - } // don't close tooltip or contextmenu on mousedown in target - + } + // don't close tooltip or contextmenu on mousedown in target jsPanel.pointerdown.forEach(function (evt) { target.addEventListener(evt, function (e) { e.stopPropagation(); }, false); }); var opts = options; - if (options.config) { opts = Object.assign({}, options.config, options); delete opts.config; } - opts = Object.assign({}, jsPanel.tooltip.defaults, opts); opts.position = Object.assign({}, options.position); opts.position.of = options.position.of || target; - target[opts.ttipName] = function () { timer = window.setTimeout(function () { // do nothing if id already exists in document if (document.getElementById(options.id)) { return false; } - jsPanel.create(opts, function (panel) { var tipToClose = panel, - closeTip = function closeTip() { - tipToClose.close(); - target.removeEventListener('mouseleave', closeTip); - panel.removeEventListener('mouseleave', closeTip); - }; // by default tooltip will close when mouse leaves trigger - + closeTip = function closeTip() { + tipToClose.close(); + target.removeEventListener('mouseleave', closeTip); + panel.removeEventListener('mouseleave', closeTip); + }; + // by default tooltip will close when mouse leaves trigger if (mode === 'default') { target.addEventListener('mouseleave', closeTip, false); } else if (mode === 'semisticky') { // close tooltip when mouse leaves tooltip panel.addEventListener('mouseleave', closeTip, false); - } // some more tooltip specifics - - + } + // some more tooltip specifics panel.classList.add('jsPanel-tooltip'); panel.style.overflow = 'visible'; panel.header.style.cursor = 'default'; - panel.footer.style.cursor = 'default'; // check whether tooltip is triggered from within a modal panel or panel and if so update z-index + panel.footer.style.cursor = 'default'; + // check whether tooltip is triggered from within a modal panel or panel and if so update z-index if (target.closest('.jsPanel-modal')) { panel.style.zIndex = target.closest('.jsPanel-modal').style.zIndex; } else { if (target.closest('.jsPanel') && opts.parentPanelFront) { target.closest('.jsPanel').front(); } - panel.style.zIndex = jsPanel.zi.next(); - } // do not use 'click' instead of jsPanel.pointerdown - + } + // do not use 'click' instead of jsPanel.pointerdown jsPanel.pointerdown.forEach(function (evt) { panel.addEventListener(evt, function (e) { e.stopPropagation(); }, false); - }); // add tooltip connector + }); + // add tooltip connector if (opts.connector) { var tipPos = jsPanel.tooltip.relativeTipPos(panel.options.position); - if (tipPos !== 'over') { panel.append(jsPanel.tooltip.addConnector(panel, tipPos)); } } - if (callback) { callback.call(panel, panel); } }); }, opts.delay); }; + target.addEventListener(opts.ttipEvent, target[opts.ttipName], false); - target.addEventListener(opts.ttipEvent, target[opts.ttipName], false); // immediately show tooltip - + // immediately show tooltip if (opts.autoshow) { var event = new MouseEvent('mouseenter'); target.dispatchEvent(event); - } // do not create tooltip if mouse leaves target before delay elapsed - + } + // do not create tooltip if mouse leaves target before delay elapsed target.addEventListener('mouseleave', function () { window.clearTimeout(timer); }, false); }, relativeTipPos: function relativeTipPos(position) { // returns the basic tip.options.position of the tooltip relative to option.tip.options.position.of (top, right, right-bottom etc.) - var relPos; // TODO: relative positions leave out a few positions - + var relPos; + // TODO: relative positions leave out a few positions if (position.my === 'center-bottom' && position.at === 'center-top') { relPos = 'top'; } else if (position.my === 'left-center' && position.at === 'right-center') { @@ -208,17 +195,16 @@ if (!jsPanel.tooltip) { } else { relPos = 'over'; } - return relPos; }, addConnector: function addConnector(tip, relposition) { var left, - top, - connCSS, - connBg, - conn = document.createElement('div'); - conn.className = "jsPanel-connector jsPanel-connector-".concat(relposition); // rest of tooltip positioning is in jspanel.sass - + top, + connCSS, + connBg, + conn = document.createElement('div'); + conn.className = "jsPanel-connector jsPanel-connector-".concat(relposition); + // rest of tooltip positioning is in jspanel.sass if (relposition === 'top' || relposition === 'topleft' || relposition === 'topright') { tip.style.top = "calc(".concat(tip.style.top, " - 12px)"); } else if (relposition === 'right' || relposition === 'righttop' || relposition === 'rightbottom') { @@ -228,13 +214,11 @@ if (!jsPanel.tooltip) { } else if (relposition === 'left' || relposition === 'lefttop' || relposition === 'leftbottom') { tip.style.left = "calc(".concat(tip.style.left, " - 12px)"); } - if (typeof tip.options.connector === 'string') { connBg = tip.options.connector; } else { connBg = window.getComputedStyle(tip).borderBottomColor; } - if (relposition.match(/-/)) { connCSS = { left: left, @@ -243,7 +227,6 @@ if (!jsPanel.tooltip) { }; } else { var styles = window.getComputedStyle(tip); - if (relposition === 'topleft' || relposition === 'topright') { if (relposition === 'topleft') { left = styles.borderBottomLeftRadius; @@ -251,46 +234,37 @@ if (!jsPanel.tooltip) { var corr = 24 + parseInt(styles.borderBottomLeftRadius) + 'px'; left = "calc(100% - ".concat(corr, ")"); } - relposition = 'top'; } else if (relposition === 'bottomleft' || relposition === 'bottomright') { if (relposition === 'bottomleft') { left = styles.borderTopLeftRadius; } else { var _corr = 24 + parseInt(styles.borderTopRightRadius) + 'px'; - left = "calc(100% - ".concat(_corr, ")"); } - relposition = 'bottom'; } else if (relposition === 'lefttop' || relposition === 'leftbottom') { if (relposition === 'lefttop') { top = styles.borderTopRightRadius; } else { var _corr2 = 24 + parseInt(styles.borderBottomRightRadius) + 'px'; - top = "calc(100% - ".concat(_corr2, ")"); } - relposition = 'left'; } else if (relposition === 'righttop' || relposition === 'rightbottom') { if (relposition === 'righttop') { top = styles.borderTopLeftRadius; } else { var _corr3 = 24 + parseInt(styles.borderBottomLeftRadius) + 'px'; - top = "calc(100% - ".concat(_corr3, ")"); } - relposition = 'right'; } - connCSS = _defineProperty({ left: left, top: top }, "border-".concat(relposition, "-color"), connBg); } - jsPanel.setStyle(conn, connCSS); return conn; }, @@ -300,25 +274,22 @@ if (!jsPanel.tooltip) { // switch of connector doesn't work properly without timeout // newposition must be an object // get option.tip.position.of - newposition.of = tip.options.position.of; // reposition tooltip - - tip.reposition(newposition); // ... and add connector again - + newposition.of = tip.options.position.of; + // reposition tooltip + tip.reposition(newposition); + // ... and add connector again if (tip.options.connector) { var connector = tip.querySelector('div.jsPanel-connector'); tip.removeChild(connector); var tipPos = jsPanel.tooltip.relativeTipPos(newposition); - if (tipPos !== 'over') { // relative positions leave out a few positions -> connectors are not added for some positions tip.append(jsPanel.tooltip.addConnector(tip, tipPos)); } } - if (cb) { cb.call(tip, tip); } - return tip; }, 200); }, @@ -329,8 +300,9 @@ if (!jsPanel.tooltip) { var tooltipToRemove = tgt[tip]; tgt.removeEventListener(evt, tooltipToRemove); } - }; // close tooltips on pointerdown in document + }; + // close tooltips on pointerdown in document jsPanel.pointerdown.forEach(function (evt) { document.addEventListener(evt, function (e) { document.querySelectorAll('.jsPanel-tooltip').forEach(function (item) { diff --git a/dist/jspanel.css b/dist/jspanel.css index 2ce6eac..e7ca7d3 100644 --- a/dist/jspanel.css +++ b/dist/jspanel.css @@ -1,44 +1,12 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de * @author of dialog extension: Michael Daumling - michael@terrapinlogo.com * @github https://github.com/Flyer53/jsPanel4.git */ -.default-bg, .secondary-bg { - background-color: #b0bec5; -} - -.primary-bg { - background-color: #01579b; -} - -.info-bg { - background-color: #039be5; -} - -.success-bg { - background-color: #2e7d32; -} - -.warning-bg { - background-color: #f57f17; -} - -.danger-bg { - background-color: #dd2c00; -} - -.light-bg { - background-color: #e0e0e0; -} - -.dark-bg { - background-color: #263238; -} - .jsPanel { border: 0; box-sizing: border-box; @@ -62,7 +30,6 @@ font-weight: normal; display: flex; flex-direction: column; - flex-shrink: 0; line-height: normal; } diff --git a/dist/jspanel.js b/dist/jspanel.js index f0ddbf5..ff53cbc 100644 --- a/dist/jspanel.js +++ b/dist/jspanel.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -10,33 +10,22 @@ 'use strict'; function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } - function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } - function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } - function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } - function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } - function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } - function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } - function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } - function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } - function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } - function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } - // eslint-disable-next-line no-redeclare // noinspection JSVoidFunctionReturnValueUsed // eslint-disable-next-line no-redeclare var jsPanel = { - version: '4.16.0', - date: '2022-07-03 19:05', + version: '4.16.1', + date: '2022-11-03 09:18', ajaxAlwaysCallbacks: [], autopositionSpacing: 4, closeOnEscape: function () { @@ -48,13 +37,13 @@ var jsPanel = { .some(function (item) { if (item.options.closeOnEscape) { if (typeof item.options.closeOnEscape === 'function') { - return item.options.closeOnEscape.call(item, item); // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops + return item.options.closeOnEscape.call(item, item); + // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops } else { item.close(null, true); return true; } } - return false; }); } @@ -134,66 +123,54 @@ var jsPanel = { if (target === undefined || target === null) { throw new TypeError('Cannot convert first argument to object'); } - var to = Object(target); - for (var i = 1; i < arguments.length; i++) { var nextSource = arguments[i]; - if (nextSource === undefined || nextSource === null) { continue; } - nextSource = Object(nextSource); var keysArray = Object.keys(Object(nextSource)); - for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex++) { var nextKey = keysArray[nextIndex]; var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey); - if (desc !== undefined && desc.enumerable) { to[nextKey] = nextSource[nextKey]; } } } - return to; } }); - } // Object.entries() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries - - + } + // Object.entries() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries if (!Object.entries) { Object.entries = function (obj) { + // noinspection ES6ConvertVarToLetConst var ownProps = Object.keys(obj), - i = ownProps.length, - resArray = new Array(i); // preallocate the Array - + i = ownProps.length, + resArray = new Array(i); // preallocate the Array while (i--) { resArray[i] = [ownProps[i], obj[ownProps[i]]]; } - return resArray; }; - } // NodeList.prototype.forEach() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach - - + } + // NodeList.prototype.forEach() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach if (window.NodeList && !NodeList.prototype.forEach) { NodeList.prototype.forEach = function (callback, thisArg) { thisArg = thisArg || window; - for (var i = 0; i < this.length; i++) { callback.call(thisArg, this[i], i, this); } }; - } // .append() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append - - + } + // .append() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append (function (arr) { arr.forEach(function (item) { item.append = item.append || function () { var argArr = Array.prototype.slice.call(arguments), - docFrag = document.createDocumentFragment(); + docFrag = document.createDocumentFragment(); argArr.forEach(function (argItem) { var isNode = argItem instanceof Node; docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem))); @@ -201,31 +178,26 @@ var jsPanel = { this.appendChild(docFrag); }; }); - })([Element.prototype, Document.prototype, DocumentFragment.prototype]); // Element.closest() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest - - + })([Element.prototype, Document.prototype, DocumentFragment.prototype]); + // Element.closest() polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest if (window.Element && !Element.prototype.closest) { // noinspection JSValidateTypes Element.prototype.closest = function (s) { // noinspection JSUnresolvedVariable var matches = (this.document || this.ownerDocument).querySelectorAll(s), - i, - el = this; - + i, + el = this; do { - i = matches.length; // eslint-disable-next-line no-empty - + i = matches.length; + // eslint-disable-next-line no-empty while (--i >= 0 && matches.item(i) !== el) {} } while (i < 0 && (el = el.parentElement)); - return el; }; - } // CustomEvent - https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent - - + } + // CustomEvent - https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent (function () { if (typeof window.CustomEvent === 'function') return false; - function CustomEvent(event, params) { params = params || { bubbles: false, @@ -233,38 +205,35 @@ var jsPanel = { detail: undefined }; var evt = document.createEvent('CustomEvent'); + // noinspection JSDeprecatedSymbols evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); return evt; - } // noinspection JSValidateTypes - - - CustomEvent.prototype = window.Event.prototype; // noinspection JSValidateTypes - + } + // noinspection JSValidateTypes + CustomEvent.prototype = window.Event.prototype; + // noinspection JSValidateTypes window.CustomEvent = CustomEvent; - })(); // String.prototype.endsWith() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith - - + })(); + // String.prototype.endsWith() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith if (!String.prototype.endsWith) { String.prototype.endsWith = function (search, this_len) { if (this_len === undefined || this_len > this.length) { this_len = this.length; } - return this.substring(this_len - search.length, this_len) === search; }; - } // String.prototype.startsWith() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith - - + } + // String.prototype.startsWith() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith if (!String.prototype.startsWith) { Object.defineProperty(String.prototype, 'startsWith', { value: function value(search, rawPos) { + // noinspection ES6ConvertVarToLetConst var pos = rawPos > 0 ? rawPos | 0 : 0; return this.substring(pos, pos + search.length) === search; } }); - } // String.prototype.includes() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes - - + } + // String.prototype.includes() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes if (!String.prototype.includes) { String.prototype.includes = function (search, start) { 'use strict'; @@ -272,21 +241,19 @@ var jsPanel = { if (search instanceof RegExp) { throw TypeError('first argument must not be a RegExp'); } - if (start === undefined) { start = 0; } - return this.indexOf(search, start) !== -1; }; - } // String.prototype repeat() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat - - + } + // String.prototype repeat() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat if (!String.prototype.repeat) { String.prototype.repeat = function (count) { 'use strict'; if (this == null) throw new TypeError('can\'t convert ' + this + ' to object'); + // noinspection ES6ConvertVarToLetConst var str = '' + this; count = +count; if (count != count) count = 0; @@ -295,80 +262,87 @@ var jsPanel = { count = Math.floor(count); if (str.length == 0 || count == 0) return ''; if (str.length * count >= 1 << 28) throw new RangeError('repeat count must not overflow maximum string size'); + // noinspection ES6ConvertVarToLetConst var maxCount = str.length * count; count = Math.floor(Math.log(count) / Math.log(2)); - while (count) { str += str; count--; } - str += str.substring(0, maxCount - str.length); return str; }; - } // Number.isInteger() - - - + } + // Number.isInteger() - Number.isInteger = Number.isInteger || function (value) { return typeof value === 'number' && isFinite(value) && Math.floor(value) === value; - }; // Array.prototype.includes() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes - - + }; + // Array.prototype.includes() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes if (!Array.prototype.includes) { Object.defineProperty(Array.prototype, 'includes', { value: function value(searchElement, fromIndex) { if (this == null) { throw new TypeError('"this" is null or not defined'); - } // 1. Let O be ? ToObject(this value). - - - var o = Object(this); // 2. Let len be ? ToLength(? Get(O, "length")). - - var len = o.length >>> 0; // 3. If len is 0, return false. - + } + // 1. Let O be ? ToObject(this value). + var o = Object(this); + // 2. Let len be ? ToLength(? Get(O, "length")). + var len = o.length >>> 0; + // 3. If len is 0, return false. if (len === 0) { return false; - } // 4. Let n be ? ToInteger(fromIndex). + } + // 4. Let n be ? ToInteger(fromIndex). // (If fromIndex is undefined, this step produces the value 0.) - - - var n = fromIndex | 0; // 5. If n ≥ 0, then + var n = fromIndex | 0; + // 5. If n ≥ 0, then // a. Let k be n. // 6. Else n < 0, // a. Let k be len + n. // b. If k < 0, let k be 0. - var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); - function sameValueZero(x, y) { return x === y || typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y); - } // 7. Repeat, while k < len - - + } + // 7. Repeat, while k < len while (k < len) { // a. Let elementK be the result of ? Get(O, ! ToString(k)). // b. If SameValueZero(searchElement, elementK) is true, return true. if (sameValueZero(o[k], searchElement)) { return true; - } // c. Increase k by 1. - - + } + // c. Increase k by 1. k++; - } // 8. Return false - - + } + // 8. Return false return false; } }); } }(), - themes: ['default', 'primary', 'secondary', 'info', 'success', 'warning', 'danger', 'light', 'dark'], ziBase: 100, colorFilledLight: 0.81, colorFilledDark: 0.08, colorFilled: 0, colorBrightnessThreshold: 0.55, colorNames: { + "default": 'b0bec5', + // Material Design bluegray200 + secondary: 'b0bec5', + primary: '01579b', + // Material Design lightblue900 + info: '039be5', + // Material Design lightblue600 + success: '2e7d32', + // Material Design green800 + warning: 'f57f17', + // Material Design yellow900 + danger: 'dd2c00', + // Material Design deeporangeA700 + light: 'e0e0e0', + // Material Design gray300 + dark: '263238', + // Material Design bluegray900 // https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords aliceblue: 'f0f8ff', antiquewhite: 'faebd7', @@ -518,7 +492,6 @@ var jsPanel = { whitesmoke: 'f5f5f5', yellow: 'ffff00', yellowgreen: '9acd32', - /* Material Design Colors https://material.io/design/color/the-color-system.html#tools-for-picking-colors */ grey50: 'fafafa', grey100: 'f5f5f5', @@ -793,7 +766,30 @@ var jsPanel = { brown600: '6D4C41', brown700: '5D4037', brown800: '4E342E', - brown900: '3E2723' + brown900: '3E2723', + /* Material Design for Bootstrap v4 themes https://mdbootstrap.com/docs/b4/jquery/css/colors/#mdb-colors */ + 'mdb-default': '2BBBAD', + 'mdb-default-dark': '00695c', + 'mdb-primary': '4285F4', + 'mdb-primary-dark': '0d47a1', + 'mdb-secondary': 'aa66cc', + 'mdb-secondary-dark': '9933CC', + 'mdb-danger': 'ff4444', + 'mdb-danger-dark': 'CC0000', + 'mdb-warning': 'ffbb33', + 'mdb-warning-dark': 'FF8800', + 'mdb-success': '00C851', + 'mdb-success-dark': '007E33', + 'mdb-info': '33b5e5', + 'mdb-info-dark': '0099CC', + 'mdb-elegant': '2E2E2E', + 'mdb-elegant-dark': '212121', + 'mdb-stylish': '4B515D', + 'mdb-stylish-dark': '3E4551', + 'mdb-unique': '3F729B', + 'mdb-unique-dark': '1C2331', + 'mdb-special': '37474F', + 'mdb-special-dark': '263238' }, errorReporting: 1, modifier: false, @@ -807,7 +803,6 @@ var jsPanel = { }(), usePointerEvents: function usePointerEvents() { var use = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true; - if (!use) { this.pointerdown = 'ontouchend' in window ? ['touchstart', 'mousedown'] : ['mousedown']; this.pointermove = 'ontouchend' in window ? ['touchmove', 'mousemove'] : ['mousemove']; @@ -823,24 +818,21 @@ var jsPanel = { if (container === 'window') { return document.body; } else if (typeof container === 'string') { - var list = document.querySelectorAll(container); // a returned list is a NodeList - + var list = document.querySelectorAll(container); + // a returned list is a NodeList return list.length && list.length > 0 ? list : false; } else if (container.nodeType === 1) { return container; } else if (container.length) { return container[0]; } - return false; }, pOcontainment: function pOcontainment(arg) { var value = arg; - if (typeof arg === 'function') { value = arg(); } - if (typeof value === 'number') { // value: 20 => value: [20, 20, 20, 20] return [value, value, value, value]; @@ -855,13 +847,11 @@ var jsPanel = { value[3] = value[1]; } } - return value; // assumed to be an array with 4 values }, pOsize: function pOsize(panel, size) { var values = size || this.defaults.contentSize; var parent = panel.parentElement; - if (typeof values === 'string') { var nums = values.trim().split(' '); values = {}; @@ -876,8 +866,7 @@ var jsPanel = { values.width = values.height; } } - - if (String(values.width).match(/^[0-9.]+$/gi)) { + if (String(values.width).match(/^[\d.]+$/gi)) { // if number only values.width += 'px'; } else if (typeof values.width === 'string' && values.width.endsWith('%')) { @@ -885,20 +874,18 @@ var jsPanel = { values.width = window.innerWidth * (parseFloat(values.width) / 100) + 'px'; } else { var prtStyles = window.getComputedStyle(parent), - border = parseFloat(prtStyles.borderLeftWidth) + parseFloat(prtStyles.borderRightWidth); + border = parseFloat(prtStyles.borderLeftWidth) + parseFloat(prtStyles.borderRightWidth); values.width = (parseFloat(prtStyles.width) - border) * (parseFloat(values.width) / 100) + 'px'; } } else if (typeof values.width === 'function') { values.width = values.width.call(panel, panel); - if (typeof values.width === 'number') { values.width += 'px'; - } else if (typeof values.width === 'string' && values.width.match(/^[0-9.]+$/gi)) { + } else if (typeof values.width === 'string' && values.width.match(/^[\d.]+$/gi)) { values.width += 'px'; } } - - if (String(values.height).match(/^[0-9.]+$/gi)) { + if (String(values.height).match(/^[\d.]+$/gi)) { // if number only values.height += 'px'; } else if (typeof values.height === 'string' && values.height.endsWith('%')) { @@ -906,37 +893,33 @@ var jsPanel = { values.height = window.innerHeight * (parseFloat(values.height) / 100) + 'px'; } else { var _prtStyles = window.getComputedStyle(parent), - _border = parseFloat(_prtStyles.borderTopWidth) + parseFloat(_prtStyles.borderBottomWidth); - + _border = parseFloat(_prtStyles.borderTopWidth) + parseFloat(_prtStyles.borderBottomWidth); values.height = (parseFloat(_prtStyles.height) - _border) * (parseFloat(values.height) / 100) + 'px'; } } else if (typeof values.height === 'function') { values.height = values.height.call(panel, panel); - if (typeof values.height === 'number') { values.height += 'px'; - } else if (typeof values.height === 'string' && values.height.match(/^[0-9.]+$/gi)) { + } else if (typeof values.height === 'string' && values.height.match(/^[\d.]+$/gi)) { values.height += 'px'; } } - return values; // return value must be an object {width: xxx, height: xxx} }, pOborder: function pOborder(str) { - var result = []; // remove all unnecessary whitepsace - + var result = []; + // remove all unnecessary whitepsace var border = str.trim().replace(/\s*\(\s*/g, '(') // remove whitespace around opening brackets .replace(/\s*\)/g, ')') // remove whitespace around closing brackets .replace(/\s+/g, ' ') // replace all other whitespace(s) with a single whitespace - .split(' '); // replace css custom props/variables with values - + .split(' '); + // replace css custom props/variables with values border.forEach(function (val, index) { if (val.startsWith('--') || val.startsWith('var')) { border[index] = jsPanel.getCssVariableValue(val); } }); // border is now an array like ['5px', 'solid', 'red'] // check values for type (border width, style or color) and add to result array - border.forEach(function (val) { if (jsPanel.colorNames[val]) { result[2] = '#' + jsPanel.colorNames[val]; @@ -947,33 +930,28 @@ var jsPanel = { } else { result[2] = val; } - }); // set default values if needed - + }); + // set default values if needed if (!result[0]) { result[0] = 'medium'; } - if (!result[1]) { result[1] = 'solid'; } - if (!result[2]) { result[2] = ''; } - return result; }, pOheaderControls: function pOheaderControls(oHdrCtrls) { if (typeof oHdrCtrls === 'string') { var setting = {}, - str = oHdrCtrls.toLowerCase(), - sizeMatch = str.match(/xl|lg|md|sm|xs/), - ctrlMatch = str.match(/closeonly|none/); - + str = oHdrCtrls.toLowerCase(), + sizeMatch = str.match(/xl|lg|md|sm|xs/), + ctrlMatch = str.match(/closeonly|none/); if (sizeMatch) { setting.size = sizeMatch[0]; } - if (ctrlMatch) { setting = Object.assign({}, setting, { maximize: 'remove', @@ -981,12 +959,10 @@ var jsPanel = { minimize: 'remove', smallify: 'remove' }); - if (ctrlMatch[0] === 'none') { setting.close = 'remove'; } } - return Object.assign({}, this.defaults.headerControls, setting); } else { return Object.assign({}, this.defaults.headerControls, oHdrCtrls); @@ -995,44 +971,35 @@ var jsPanel = { pOtheme: function pOtheme(optionTheme) { optionTheme = optionTheme.trim(); var color, - filling = ''; - + filling = ''; if (optionTheme.match(/^(rgb|hsl|var)/)) { // for themes starting with rgb , hsl or var var devide = optionTheme.indexOf(')'); color = optionTheme.slice(0, devide + 1).replace(/\s+/g, ''); - if (color.startsWith('var')) { color = jsPanel.getCssVariableValue(color); } - filling = optionTheme.slice(devide + 1, optionTheme.length).trim(); } else if (optionTheme.match(/^(#|\w|--)/)) { // for themes starting with #, [A-Za-z0-9_] or -- var _devide = optionTheme.indexOf(' '); - if (_devide > 0) { color = optionTheme.slice(0, _devide + 1).replace(/\s+/g, ''); filling = optionTheme.slice(_devide + 1, optionTheme.length).trim(); } else { color = optionTheme; } - if (color.startsWith('--')) { color = jsPanel.getCssVariableValue(color); } } - - if (color.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (color.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { color = '#' + color; } - if (filling.startsWith('fillcolor')) { var _devide2 = filling.indexOf(' '); - filling = filling.slice(_devide2 + 1, filling.length).trim().replace(/\s+/g, ''); - - if (filling.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (filling.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { filling = '#' + filling; } else if (jsPanel.colorNames[filling]) { filling = '#' + jsPanel.colorNames[filling]; @@ -1042,7 +1009,6 @@ var jsPanel = { filling = '#fff'; } } - return { color: color, colors: false, @@ -1052,32 +1018,33 @@ var jsPanel = { // color methods --------------- color: function color(val) { var color = val.toLowerCase(), - r, - g, - b, - h, - s, - l, - match, - channels, - hsl, - result = {}; - var hexPattern = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/gi, - // matches "#123" or "#f05a78" with or without "#" - RGBAPattern = /^rgba?\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3}),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, - // matches rgb/rgba color values, whitespace allowed - HSLAPattern = /^hsla?\(([0-9]{1,3}),([0-9]{1,3}%),([0-9]{1,3}%),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, - namedColors = this.colorNames; // change named color to corresponding hex value - + r, + g, + b, + h, + s, + l, + match, + channels, + hsl, + result = {}; + var hexPattern = /^#?([\da-f]{3}|[\da-f]{6})$/gi, + // matches "#123" or "#f05a78" with or without "#" + RGBAPattern = /^rgba?\((\d{1,3}),(\d{1,3}),(\d{1,3}),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, + // matches rgb/rgba color values, whitespace allowed + HSLAPattern = /^hsla?\((\d{1,3}),(\d{1,3}%),(\d{1,3}%),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, + namedColors = this.colorNames; + + // change named color to corresponding hex value if (namedColors[color]) { color = namedColors[color]; - } // check val for hex color - + } + // check val for hex color if (color.match(hexPattern) !== null) { // '#' remove - color = color.replace('#', ''); // color has either 3 or 6 characters - + color = color.replace('#', ''); + // color has either 3 or 6 characters if (color.length % 2 === 1) { // color has 3 char -> convert to 6 char r = color.slice(0, 1).repeat(2); @@ -1098,11 +1065,11 @@ var jsPanel = { }; result.hex = "#".concat(color); } - hsl = this.rgbToHsl(result.rgb.r, result.rgb.g, result.rgb.b); result.hsl = hsl; result.rgb.css = "rgb(".concat(result.rgb.r, ",").concat(result.rgb.g, ",").concat(result.rgb.b, ")"); - } // check val for rgb/rgba color + } + // check val for rgb/rgba color else if (color.match(RGBAPattern)) { match = RGBAPattern.exec(color); result.rgb = { @@ -1114,7 +1081,8 @@ var jsPanel = { result.hex = this.rgbToHex(match[1], match[2], match[3]); hsl = this.rgbToHsl(match[1], match[2], match[3]); result.hsl = hsl; - } // check val for hsl/hsla color + } + // check val for hsl/hsla color else if (color.match(HSLAPattern)) { match = HSLAPattern.exec(color); h = match[1] / 360; @@ -1134,7 +1102,9 @@ var jsPanel = { s: match[2], l: match[3] }; - } // or return #f5f5f5 + } + + // or return #f5f5f5 else { result.hex = '#f5f5f5'; result.rgb = { @@ -1150,39 +1120,37 @@ var jsPanel = { l: '96%' }; } - return result; }, calcColors: function calcColors(primaryColor) { var threshold = this.colorBrightnessThreshold, - primeColor = this.color(primaryColor), - filledlightColor = this.lighten(primaryColor, this.colorFilledLight), - filledColor = this.darken(primaryColor, this.colorFilled), - fontColorForPrimary = this.perceivedBrightness(primaryColor) <= threshold ? '#ffffff' : '#000000', - fontColorFilledlight = this.perceivedBrightness(filledlightColor) <= threshold ? '#ffffff' : '#000000', - fontColorFilled = this.perceivedBrightness(filledColor) <= threshold ? '#ffffff' : '#000000', - filleddarkColor = this.lighten(primaryColor, this.colorFilledDark), - fontColorFilleddark = this.perceivedBrightness(filleddarkColor) <= threshold ? '#ffffff' : '#000000'; + primeColor = this.color(primaryColor), + filledlightColor = this.lighten(primaryColor, this.colorFilledLight), + filledColor = this.darken(primaryColor, this.colorFilled), + fontColorForPrimary = this.perceivedBrightness(primaryColor) <= threshold ? '#ffffff' : '#000000', + fontColorFilledlight = this.perceivedBrightness(filledlightColor) <= threshold ? '#ffffff' : '#000000', + fontColorFilled = this.perceivedBrightness(filledColor) <= threshold ? '#ffffff' : '#000000', + filleddarkColor = this.lighten(primaryColor, this.colorFilledDark), + fontColorFilleddark = this.perceivedBrightness(filleddarkColor) <= threshold ? '#ffffff' : '#000000'; return [primeColor.hsl.css, filledlightColor, filledColor, fontColorForPrimary, fontColorFilledlight, fontColorFilled, filleddarkColor, fontColorFilleddark]; }, darken: function darken(val, amount) { // amount is value between 0 and 1 var hsl = this.color(val).hsl, - l = parseFloat(hsl.l), - lnew = Math.round(l - l * amount) + '%'; + l = parseFloat(hsl.l), + lnew = Math.round(l - l * amount) + '%'; return "hsl(".concat(hsl.h, ",").concat(hsl.s, ",").concat(lnew, ")"); }, lighten: function lighten(val, amount) { // amount is value between 0 and 1 var hsl = this.color(val).hsl, - l = parseFloat(hsl.l), - lnew = Math.round(l + (100 - l) * amount) + '%'; + l = parseFloat(hsl.l), + lnew = Math.round(l + (100 - l) * amount) + '%'; return "hsl(".concat(hsl.h, ",").concat(hsl.s, ",").concat(lnew, ")"); }, hslToRgb: function hslToRgb(h, s, l) { // h, s and l must be values between 0 and 1 var r, g, b; - if (s === 0) { r = g = b = l; // achromatic } else { @@ -1190,33 +1158,26 @@ var jsPanel = { if (t < 0) { t += 1; } - if (t > 1) { t -= 1; } - if (t < 1 / 6) { return p + (q - p) * 6 * t; } - if (t < 1 / 2) { return q; } - if (t < 2 / 3) { return p + (q - p) * (2 / 3 - t) * 6; } - return p; }; - var q = l < 0.5 ? l * (1 + s) : l + s - l * s, - p = 2 * l - q; + p = 2 * l - q; r = hue2rgb(p, q, h + 1 / 3); g = hue2rgb(p, q, h); b = hue2rgb(p, q, h - 1 / 3); } - return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)]; }, rgbToHsl: function rgbToHsl(r, g, b) { @@ -1224,35 +1185,29 @@ var jsPanel = { g /= 255; b /= 255; var max = Math.max(r, g, b), - min = Math.min(r, g, b), - h, - s, - l = (max + min) / 2; - + min = Math.min(r, g, b), + h, + s, + l = (max + min) / 2; if (max === min) { h = s = 0; // achromatic } else { var d = max - min; s = l > 0.5 ? d / (2 - max - min) : d / (max + min); - switch (max) { case r: h = (g - b) / d + (g < b ? 6 : 0); break; - case g: h = (b - r) / d + 2; break; - case b: h = (r - g) / d + 4; break; } - h /= 6; - } //return [ h, s, l ]; - - + } + //return [ h, s, l ]; h = Math.round(h * 360); s = Math.round(s * 100) + '%'; l = Math.round(l * 100) + '%'; @@ -1265,89 +1220,78 @@ var jsPanel = { }, rgbToHex: function rgbToHex(r, g, b) { var red = Number(r).toString(16), - green = Number(g).toString(16), - blue = Number(b).toString(16); - + green = Number(g).toString(16), + blue = Number(b).toString(16); if (red.length === 1) { red = "0".concat(red); } - if (green.length === 1) { green = "0".concat(green); } - if (blue.length === 1) { blue = "0".concat(blue); } - return "#".concat(red).concat(green).concat(blue); }, perceivedBrightness: function perceivedBrightness(val) { - var rgb = this.color(val).rgb; // return value is in the range 0 - 1 and input rgb values must also be in the range 0 - 1 + var rgb = this.color(val).rgb; + // return value is in the range 0 - 1 and input rgb values must also be in the range 0 - 1 // https://www.w3.org/TR/WCAG20-TECHS/G18.html - return rgb.r / 255 * 0.2126 + rgb.g / 255 * 0.7152 + rgb.b / 255 * 0.0722; }, // positioning methods --------------- pOposition: function pOposition(positionshorthand) { - var result = {}; // remove leading and trailing whitespace and split position shorthand string into array - - var pos = positionshorthand.trim().split(/\s+/); // find autoposition value and assign to result, must be the first item to find and remove + var result = {}; + // remove leading and trailing whitespace and split position shorthand string into array + var pos = positionshorthand.trim().split(/\s+/); + // find autoposition value and assign to result, must be the first item to find and remove var auto = pos.filter(function (item) { return item.match(/^(down|right|up|left)$/i); }); - if (auto.length) { result.autoposition = auto[0]; pos.splice(pos.indexOf(auto[0]), 1); - } // find my and at values and assign to result - + } + // find my and at values and assign to result var my_at = pos.filter(function (item) { return item.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i); }); - if (my_at.length) { result.my = my_at[0]; result.at = my_at[1] || my_at[0]; pos.splice(pos.indexOf(my_at[0]), 1); - if (my_at[1]) { pos.splice(pos.indexOf(my_at[1]), 1); } } else { result.my = 'center'; result.at = 'center'; - } // find offset and assign to result - + } + // find offset and assign to result var offsets = pos.filter(function (item) { return item.match(/^[+-]?\d*\.?\d+[a-z%]*$/i); }); - if (offsets.length) { result.offsetX = offsets[0].match(/^[+-]?\d*\.?\d+$/i) ? "".concat(offsets[0], "px") : offsets[0]; - if (offsets[1]) { result.offsetY = offsets[1].match(/^[+-]?\d*\.?\d+$/i) ? "".concat(offsets[1], "px") : offsets[1]; } else { // noinspection JSSuspiciousNameCombination result.offsetY = result.offsetX; } - pos.splice(pos.indexOf(offsets[0]), 1); - if (offsets[1]) { pos.splice(pos.indexOf(offsets[1]), 1); } - } // last to find and assign is of value and must be all the rest (if there is a rest) - + } + // last to find and assign is of value and must be all the rest (if there is a rest) if (pos.length) { result.of = pos.join(' '); } - return result; }, position: function position(panel, _position) { @@ -1356,70 +1300,75 @@ var jsPanel = { // @position: object // - positioning configuration // - if panel config uses a position shorthand string it must be converted to object before it's passed to this function + // if @position is not set return panel if (!_position) { panel.style.opacity = 1; return panel; - } // merge position defaults with @position - + } + // merge position defaults with @position if (typeof _position === 'string') { _position = Object.assign({}, this.defaults.position, this.pOposition(_position)); } else { _position = Object.assign({}, this.defaults.position, _position); - } // process parameter functions for 'my', 'at', 'of' - // 'offsetX', 'offsetY', 'minLeft', 'maxLeft', 'minTop', 'maxTop' are processed when params are applied - + } + // process parameter functions for 'my', 'at', 'of' + // 'offsetX', 'offsetY', 'minLeft', 'maxLeft', 'minTop', 'maxTop' are processed when params are applied ['my', 'at', 'of'].forEach(function (item) { if (typeof _position[item] === 'function') { _position[item] = _position[item].call(panel, panel); } - }); // panel uses option.container: 'window' position is always fixed + }); + // panel uses option.container: 'window' position is always fixed if (panel.options.container === 'window') { panel.style.position = 'fixed'; - } // normalize param @panel to ensure it's an Element object - + } + // normalize param @panel to ensure it's an Element object if (typeof panel === 'string') { panel = document.querySelector(panel); } else if (Object.getPrototypeOf(panel).jquery) { panel = panel[0]; } // else panel is assumed to be element object - // container is either 'window' or the panel's parent element + // container is either 'window' or the panel's parent element + var container = panel.options.container === 'window' ? 'window' : panel.parentElement; - var container = panel.options.container === 'window' ? 'window' : panel.parentElement; // get base values in order to calculate position deltas + // get base values in order to calculate position deltas // since getBoundingClientRect() calculates values relative to the viewport the parentElement of panel/elmtToPositionAgainst is irrelevant - var panelRect = panel.getBoundingClientRect(), - containerDomRect = panel.parentElement.getBoundingClientRect(), - containerRect = container === 'window' ? { - left: 0, - top: 0, - width: document.documentElement.clientWidth, - height: window.innerHeight - } // fake window.getBoundingClientRect() return value - : //: panel.parentElement.getBoundingClientRect(); // using 'container' instead of 'panel.parentElement' produces an error - // https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes - // due to the infos from above link IE and EDGE (old version not based on Chromium) report an error in strict mode -> line of code above replaced with line below - { - width: containerDomRect.width, - height: containerDomRect.height, - left: containerDomRect.left, - top: containerDomRect.top - }; // calculate scale factors, needed for correct positioning if container is scaled - transform: scale() - // window is never scaled --> scale factors default to 1 + containerDomRect = panel.parentElement.getBoundingClientRect(), + containerRect = container === 'window' ? { + left: 0, + top: 0, + width: document.documentElement.clientWidth, + height: window.innerHeight + } // fake window.getBoundingClientRect() return value + : + //: panel.parentElement.getBoundingClientRect(); // using 'container' instead of 'panel.parentElement' produces an error + // https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes + // due to the infos from above link IE and EDGE (old version not based on Chromium) report an error in strict mode -> line of code above replaced with line below + { + width: containerDomRect.width, + height: containerDomRect.height, + left: containerDomRect.left, + top: containerDomRect.top + }; + // calculate scale factors, needed for correct positioning if container is scaled - transform: scale() + // window is never scaled --> scale factors default to 1 var scaleFactor = container === 'window' ? { x: 1, y: 1 } : { x: containerRect.width / container.offsetWidth, y: containerRect.height / container.offsetHeight - }; // get and apply border width values of container - needed for positioning corrections due to positioning with %-values + }; + // get and apply border width values of container - needed for positioning corrections due to positioning with %-values var containerStyle = container === 'window' ? { borderTopWidth: '0px', borderRightWidth: '0px', @@ -1428,10 +1377,10 @@ var jsPanel = { } // fake getComputedStyle(window) return value : window.getComputedStyle(container); containerRect.width -= (parseFloat(containerStyle.borderLeftWidth) + parseFloat(containerStyle.borderRightWidth)) * scaleFactor.x; - containerRect.height -= (parseFloat(containerStyle.borderTopWidth) + parseFloat(containerStyle.borderBottomWidth)) * scaleFactor.y; // calculate @position.of rect if @position.of is set + containerRect.height -= (parseFloat(containerStyle.borderTopWidth) + parseFloat(containerStyle.borderBottomWidth)) * scaleFactor.y; + // calculate @position.of rect if @position.of is set var positionOfRect; - if (!_position.of) { positionOfRect = containerRect; } else { @@ -1448,14 +1397,14 @@ var jsPanel = { } else { positionOfRect = _position.of.getBoundingClientRect(); } - } // check for scrollbar width values - + } + // check for scrollbar width values var scrollbarwidthsWindow = this.getScrollbarWidth(document.body), - scrollbarwidthsContainer = this.getScrollbarWidth(panel.parentElement); // calc css left for @panel in regard of @position.my and @position.at + scrollbarwidthsContainer = this.getScrollbarWidth(panel.parentElement); + // calc css left for @panel in regard of @position.my and @position.at var left = '0px'; - if (_position.my.startsWith('left-')) { if (_position.at.startsWith('left-')) { if (_position.of) { @@ -1514,18 +1463,16 @@ var jsPanel = { left = positionOfRect.left - containerRect.left - parseFloat(containerStyle.borderLeftWidth) + positionOfRect.width - panelRect.width + 'px'; } else { left = containerRect.width - panelRect.width + 'px'; - } // correction for vertical scrollbar only needed for panels using my: 'right-*' together with at: 'right-*' - - + } + // correction for vertical scrollbar only needed for panels using my: 'right-*' together with at: 'right-*' if (container !== 'window') { left = parseFloat(left) - scrollbarwidthsContainer.y + 'px'; } } - } // calc css top for @panel in regard of @position.my and @position.at - + } + // calc css top for @panel in regard of @position.my and @position.at var top = '0px'; - if (_position.my.endsWith('-top')) { if (_position.at.endsWith('-top')) { if (_position.of) { @@ -1584,9 +1531,8 @@ var jsPanel = { top = positionOfRect.top - containerRect.top - parseFloat(containerStyle.borderTopWidth) - panelRect.height + positionOfRect.height + 'px'; } else { top = containerRect.height - panelRect.height + 'px'; - } // correction for horizontal scrollbar only needed for panels using my: '*-bottom' together with at: '*-bottom' - - + } + // correction for horizontal scrollbar only needed for panels using my: '*-bottom' together with at: '*-bottom' if (container !== 'window') { top = parseFloat(top) - scrollbarwidthsContainer.x + 'px'; } else { @@ -1594,37 +1540,42 @@ var jsPanel = { } } } - panel.style.left = scaleFactor.x === 1 ? left : parseFloat(left) / scaleFactor.x + 'px'; - panel.style.top = scaleFactor.y === 1 ? top : parseFloat(top) / scaleFactor.y + 'px'; // at this point panels are correctly positioned according to the my/at values - - var panelStyle = getComputedStyle(panel); // eslint-disable-next-line no-unused-vars + panel.style.top = scaleFactor.y === 1 ? top : parseFloat(top) / scaleFactor.y + 'px'; + // at this point panels are correctly positioned according to my/at values + var panelStyle = getComputedStyle(panel); + // eslint-disable-next-line no-unused-vars var pos = { left: panelStyle.left, top: panelStyle.top - }; //console.log('pos after applying my/at/of:', pos); - // apply autoposition only if ... + }; + //console.log('pos after applying my/at/of:', pos); + // apply autoposition only if ... if (_position.autoposition && _position.my === _position.at && ['left-top', 'center-top', 'right-top', 'left-bottom', 'center-bottom', 'right-bottom'].indexOf(_position.my) >= 0) { - pos = this.applyPositionAutopos(panel, pos, _position); //console.log('let pos after applying autoposition:', pos); - } // apply position.offsetX and position.offsetY - + pos = this.applyPositionAutopos(panel, pos, _position); + //console.log('let pos after applying autoposition:', pos); + } + // apply position.offsetX and position.offsetY if (_position.offsetX || _position.offsetY) { - pos = this.applyPositionOffset(panel, pos, _position); //console.log('pos after applying offsets:', pos); - } // calculate and apply position.minLeft, position.minTop, position.maxLeft and position.maxTop - + pos = this.applyPositionOffset(panel, pos, _position); + //console.log('pos after applying offsets:', pos); + } + // calculate and apply position.minLeft, position.minTop, position.maxLeft and position.maxTop if (_position.minLeft || _position.minTop || _position.maxLeft || _position.maxTop) { - pos = this.applyPositionMinMax(panel, pos, _position); //console.log('pos after applying minLeft, maxLeft, maxTop, minTop:', pos); - } // apply position.modify - // must be function returning an object with keys left/top, each with valid css length value - + pos = this.applyPositionMinMax(panel, pos, _position); + //console.log('pos after applying minLeft, maxLeft, maxTop, minTop:', pos); + } + // apply position.modify + // must be function returning an object with keys left/top, each with valid css length value if (_position.modify) { // eslint-disable-next-line no-unused-vars - pos = this.applyPositionModify(panel, pos, _position); //console.log('pos after applying modify():', pos); + pos = this.applyPositionModify(panel, pos, _position); + //console.log('pos after applying modify():', pos); } typeof panel.options.opacity === 'number' ? panel.style.opacity = panel.options.opacity : panel.style.opacity = 1; @@ -1633,11 +1584,13 @@ var jsPanel = { applyPositionAutopos: function applyPositionAutopos(panel, pos, position) { // add class with position and autoposition direction var newClass = "".concat(position.my, "-").concat(position.autoposition.toLowerCase()); - panel.classList.add(newClass); // get all panels with same class + panel.classList.add(newClass); + // get all panels with same class var newClassAll = Array.prototype.slice.call(document.querySelectorAll(".".concat(newClass))), - ownIndex = newClassAll.indexOf(panel); // if more than 1 position new panel + ownIndex = newClassAll.indexOf(panel); + // if more than 1 position new panel if (newClassAll.length > 1) { switch (position.autoposition) { case 'down': @@ -1648,7 +1601,6 @@ var jsPanel = { } }); break; - case 'up': newClassAll.forEach(function (item, index) { if (index > 0 && index <= ownIndex) { @@ -1656,7 +1608,6 @@ var jsPanel = { } }); break; - case 'right': // collect widths of all elmts to calc new left position newClassAll.forEach(function (item, index) { @@ -1665,7 +1616,6 @@ var jsPanel = { } }); break; - case 'left': newClassAll.forEach(function (item, index) { if (index > 0 && index <= ownIndex) { @@ -1674,11 +1624,9 @@ var jsPanel = { }); break; } - panel.style.left = pos.left; panel.style.top = pos.top; } - return { left: pos.left, top: pos.top @@ -1690,20 +1638,16 @@ var jsPanel = { if (typeof position[offset] === 'function') { position[offset] = position[offset].call(pos, pos, position); } - if (isNaN(position[offset]) === false) { // if an offset's value type is integer it's interpreted as pixel value position[offset] = "".concat(position[offset], "px"); } // else it's assumed offsets are strings with valid css length values - } else { position[offset] = '0px'; } }); panel.style.left = "calc(".concat(panel.style.left, " + ").concat(position.offsetX, ")"); // offsetX - panel.style.top = "calc(".concat(panel.style.top, " + ").concat(position.offsetY, ")"); // offsetY - var panelStyle = getComputedStyle(panel); return { left: panelStyle.left, @@ -1716,22 +1660,19 @@ var jsPanel = { if (typeof position[val] === 'function') { position[val] = position[val].call(pos, pos, position); } - if (Number.isInteger(position[val]) || position[val].match(/^\d+$/)) { // if val type is integer it's interpreted as pixel value position[val] = "".concat(position[val], "px"); } // else it's assumed val is string with valid css length value - } - }); // process minLeft - + }); + // process minLeft if (position.minLeft) { // apply minLeft value in order to compare with previous left (pos.left) - panel.style.left = position.minLeft; // now get computed css left - + panel.style.left = position.minLeft; + // now get computed css left var left = getComputedStyle(panel).left; // returns string with pixel value // now compare current left (minLeft) with pos.left - if (parseFloat(left) < parseFloat(pos.left)) { // if minLeft is less than pos.left return to pos.left panel.style.left = pos.left; @@ -1739,44 +1680,37 @@ var jsPanel = { // if minLeft is greater than pos.left keep minLeft and reset pos.left to new value pos.left = left; } - } // process minTop - - + } + // process minTop if (position.minTop) { panel.style.top = position.minTop; var top = getComputedStyle(panel).top; - if (parseFloat(top) < parseFloat(pos.top)) { panel.style.top = pos.top; } else { pos.top = top; } - } // process maxLeft - - + } + // process maxLeft if (position.maxLeft) { panel.style.left = position.maxLeft; var _left = getComputedStyle(panel).left; - if (parseFloat(_left) > parseFloat(pos.left)) { panel.style.left = pos.left; } else { pos.left = _left; } - } // process maxTop - - + } + // process maxTop if (position.maxTop) { panel.style.top = position.maxTop; var _top = getComputedStyle(panel).top; - if (parseFloat(_top) > parseFloat(pos.top)) { panel.style.top = pos.top; } else { pos.top = _top; } } - var panelStyle = getComputedStyle(panel); return { left: panelStyle.left, @@ -1789,7 +1723,6 @@ var jsPanel = { panel.style.left = Number.isInteger(modifiedPosition.left) || modifiedPosition.left.match(/^\d+$/) ? "".concat(modifiedPosition.left, "px") : modifiedPosition.left; panel.style.top = Number.isInteger(modifiedPosition.top) || modifiedPosition.top.match(/^\d+$/) ? "".concat(modifiedPosition.top, "px") : modifiedPosition.top; } - var panelStyle = getComputedStyle(panel); return { left: panelStyle.left, @@ -1798,13 +1731,12 @@ var jsPanel = { }, autopositionRemaining: function autopositionRemaining(panel) { var autoPos, - parent = panel.options.container; + parent = panel.options.container; ['left-top-down', 'left-top-right', 'center-top-down', 'right-top-down', 'right-top-left', 'left-bottom-up', 'left-bottom-right', 'center-bottom-up', 'right-bottom-up', 'right-bottom-left'].forEach(function (item) { if (panel.classList.contains(item)) { autoPos = item; } }); - if (autoPos) { var box = parent === 'window' ? document.body : typeof parent === 'string' ? document.querySelector(parent) : parent; box.querySelectorAll(".".concat(autoPos)).forEach(function (item) { @@ -1814,62 +1746,22 @@ var jsPanel = { }, // theming methods ------------------------- getThemeDetails: function getThemeDetails(th) { - var theme = this.pOtheme(th), - builtIn = this.themes.some(function (item) { - return item === theme.color.split(/\s/i)[0]; - }); - - if (builtIn) { - var baseTheme = theme.color.split(/\s/i)[0], - btn = document.createElement('button'); - btn.className = baseTheme + '-bg'; + var theme = this.pOtheme(th); + if (theme.color.startsWith('bootstrap-')) { + // works with bootstrap 3 and 4 + var index = theme.color.indexOf('-'), + btn = document.createElement('button'); + btn.className = 'btn btn' + theme.color.slice(index); document.body.appendChild(btn); theme.color = getComputedStyle(btn).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(btn); // noinspection JSUnusedAssignment - + document.body.removeChild(btn); + // noinspection JSUnusedAssignment btn = undefined; - } else if (theme.color.startsWith('bootstrap-')) { - // works with bootstrap 3 and 4 - var index = theme.color.indexOf('-'), - _btn = document.createElement('button'); - - _btn.className = 'btn btn' + theme.color.slice(index); - document.body.appendChild(_btn); - theme.color = getComputedStyle(_btn).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(_btn); // noinspection JSUnusedAssignment - - _btn = undefined; - } else if (theme.color.startsWith('mdb-')) { - // material design for bootstrap theme - var _index = theme.color.indexOf('-') + 1, - span = document.createElement('span'), - testClass; - - if (theme.color.endsWith('-dark')) { - testClass = theme.color.slice(_index); - testClass = testClass.replace('-dark', '-color-dark'); - } else { - testClass = theme.color.slice(_index) + '-color'; - } - - span.className = testClass; - document.body.appendChild(span); - theme.color = getComputedStyle(span).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(span); // noinspection JSUnusedAssignment - - span = undefined; } - theme.colors = this.calcColors(theme.color); return theme; }, clearTheme: function clearTheme(panel, cb) { - this.themes.forEach(function (value) { - ['panel', "jsPanel-theme-".concat(value), "panel-".concat(value), "".concat(value, "-color")].forEach(function (item) { - return panel.classList.remove(item); - }); - panel.header.classList.remove("jsPanel-theme-".concat(value)); - }); panel.content.classList.remove('jsPanel-content-filled', 'jsPanel-content-filledlight'); panel.header.classList.remove('jsPanel-hdr-light'); panel.header.classList.remove('jsPanel-hdr-dark'); @@ -1888,11 +1780,9 @@ var jsPanel = { Array.prototype.slice.call(panel.controlbar.querySelectorAll('.jsPanel-icon')).concat([panel.headerlogo, panel.headertitle, panel.headertoolbar, panel.content]).forEach(function (item) { return item.style.color = ''; }); - if (cb) { cb.call(panel, panel); } - return panel; }, applyColorTheme: function applyColorTheme(panel, themeDetails) { @@ -1904,18 +1794,16 @@ var jsPanel = { }); panel.querySelectorAll('.jsPanel-controlbar .jsPanel-btn').forEach(function (item) { return item.style.color = themeDetails.colors[3]; - }); // apply border to content only themes 'filled' - + }); + // apply border to content only themes 'filled' if (typeof panel.options.theme === 'string' && themeDetails.filling === 'filled') { panel.content.style.borderTop = themeDetails.colors[3] === '#000000' ? '1px solid rgba(0,0,0,0.15)' : '1px solid rgba(255,255,255,0.15)'; } - if (themeDetails.colors[3] === '#000000') { panel.header.classList.add('jsPanel-hdr-light'); } else { panel.header.classList.add('jsPanel-hdr-dark'); } - if (themeDetails.filling) { switch (themeDetails.filling) { case 'filled': @@ -1924,105 +1812,94 @@ var jsPanel = { color: themeDetails.colors[3] }); break; - case 'filledlight': panel.content.style.backgroundColor = themeDetails.colors[1]; break; - case 'filleddark': this.setStyles(panel.content, { backgroundColor: themeDetails.colors[6], color: themeDetails.colors[7] }); break; - default: panel.content.style.backgroundColor = themeDetails.filling; panel.content.style.color = this.perceivedBrightness(themeDetails.filling) <= this.colorBrightnessThreshold ? '#fff' : '#000'; } } - return panel; }, applyCustomTheme: function applyCustomTheme(panel, theme) { var _this = this; - var defaults = { - bgPanel: '#ffffff', - bgContent: '#fffffff', - bgFooter: '#f5f5f5', - colorHeader: '#000000', - colorContent: '#000000', - colorFooter: '#000000', - border: undefined, - borderRadius: undefined - }, - passedTheme = _typeof(theme) === 'object' ? Object.assign(defaults, theme) : defaults; + bgPanel: '#ffffff', + bgContent: '#ffffff', + bgFooter: '#f5f5f5', + colorHeader: '#000000', + colorContent: '#000000', + colorFooter: '#000000', + border: undefined, + borderRadius: undefined + }, + passedTheme = _typeof(theme) === 'object' ? Object.assign(defaults, theme) : defaults; var bgPanel = passedTheme.bgPanel, - bgContent = passedTheme.bgContent, - colorHeader = passedTheme.colorHeader, - colorContent = passedTheme.colorContent, - bgFooter = passedTheme.bgFooter, - colorFooter = passedTheme.colorFooter; // set background panel/header - + bgContent = passedTheme.bgContent, + colorHeader = passedTheme.colorHeader, + colorContent = passedTheme.colorContent, + bgFooter = passedTheme.bgFooter, + colorFooter = passedTheme.colorFooter; + // set background panel/header if (this.colorNames[bgPanel]) { panel.style.background = '#' + this.colorNames[bgPanel]; } else { - panel.style.background = this.getCssVariableValue(bgPanel); // getCssVariableValue(bgPanel) returns bgPanel unchanged if value does not start with either '--' or 'var' - } // set font color header - - + panel.style.background = this.getCssVariableValue(bgPanel); + // getCssVariableValue(bgPanel) returns bgPanel unchanged if value does not start with either '--' or 'var' + } + // set font color header if (this.colorNames[colorHeader]) { colorHeader = '#' + this.colorNames[colorHeader]; } - ['.jsPanel-headerlogo', '.jsPanel-title', '.jsPanel-hdr-toolbar'].forEach(function (item) { return panel.querySelector(item).style.color = _this.getCssVariableValue(colorHeader); }); panel.querySelectorAll('.jsPanel-controlbar .jsPanel-btn').forEach(function (item) { return item.style.color = _this.getCssVariableValue(colorHeader); - }); // set content background - + }); + // set content background if (this.colorNames[bgContent]) { panel.content.style.background = '#' + this.colorNames[bgContent]; } else { - panel.content.style.background = this.getCssVariableValue(bgContent); // getCssVariableValue(bgContent) returns bgContent unchanged if value does not start with either '--' or 'var' - } // set content font color - - + panel.content.style.background = this.getCssVariableValue(bgContent); + // getCssVariableValue(bgContent) returns bgContent unchanged if value does not start with either '--' or 'var' + } + // set content font color this.colorNames[colorContent] ? panel.content.style.color = '#' + this.colorNames[colorContent] : panel.content.style.color = this.getCssVariableValue(colorContent); // getCssVariableValue(val) returns val unchanged if val does not start with either '--' or 'var' // set border-top for header toolbar and add header class - var pbPanel = this.perceivedBrightness(colorHeader); - if (pbPanel > this.colorBrightnessThreshold) { panel.header.classList.add('jsPanel-hdr-dark'); } else { panel.header.classList.add('jsPanel-hdr-light'); - } // set border-top for content - - + } + // set border-top for content var pbContent = this.perceivedBrightness(colorContent); - pbContent > this.colorBrightnessThreshold ? panel.content.style.borderTop = '1px solid rgba(255,255,255,0.15)' : panel.content.style.borderTop = '1px solid rgba(0,0,0,0.15)'; // set footer background - + pbContent > this.colorBrightnessThreshold ? panel.content.style.borderTop = '1px solid rgba(255,255,255,0.15)' : panel.content.style.borderTop = '1px solid rgba(0,0,0,0.15)'; + // set footer background if (this.colorNames[bgFooter]) { panel.footer.style.background = '#' + this.colorNames[bgFooter]; } else { - panel.footer.style.background = this.getCssVariableValue(bgFooter); // getCssVariableValue(bgFooter) returns bgFooter unchanged if value does not start with either '--' or 'var' - } // set footer font color - - - this.colorNames[colorFooter] ? panel.footer.style.color = '#' + this.colorNames[colorFooter] : panel.footer.style.color = this.getCssVariableValue(colorFooter); // set panel border (option.border does not work for themes using an object) - + panel.footer.style.background = this.getCssVariableValue(bgFooter); + // getCssVariableValue(bgFooter) returns bgFooter unchanged if value does not start with either '--' or 'var' + } + // set footer font color + this.colorNames[colorFooter] ? panel.footer.style.color = '#' + this.colorNames[colorFooter] : panel.footer.style.color = this.getCssVariableValue(colorFooter); + // set panel border (option.border does not work for themes using an object) if (passedTheme.border) { panel.setBorder(passedTheme.border); } - if (passedTheme.borderRadius) { panel.options.borderRadius = undefined; panel.setBorderRadius(passedTheme.borderRadius); } - return panel; }, // methods dealing with css and html ------- @@ -2036,12 +1913,10 @@ var jsPanel = { var v = str.slice(str.indexOf('(') + 1, str.indexOf(')')); return getComputedStyle(document.documentElement).getPropertyValue(v).replace(/\s+/g, ''); } - return str; }, getScrollbarWidth: function getScrollbarWidth() { var elmt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document.body; - if (elmt === document.body) { return { y: window.innerWidth - document.documentElement.clientWidth, @@ -2070,13 +1945,10 @@ var jsPanel = { setStyles: function setStyles(elmt, stylesobject) { for (var _i = 0, _Object$entries = Object.entries(stylesobject); _i < _Object$entries.length; _i++) { var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2), - prop = _Object$entries$_i[0], - value = _Object$entries$_i[1]; - - //elmt.style[prop] = jsPanel.getCssVariableValue(value); + prop = _Object$entries$_i[0], + value = _Object$entries$_i[1]; elmt.style[prop] = typeof value === 'string' ? jsPanel.getCssVariableValue(value) : value; } - return elmt; }, setStyle: function setStyle(elmt, stylesobject) { @@ -2085,7 +1957,6 @@ var jsPanel = { // alias for setStyles() strToHtml: function strToHtml(str) { // TODO: add param to strip script tags from returned DocumentFragment - /* str has to be an HTMLString * returns a DocumentFragment - https://developer.mozilla.org/en-US/docs/Web/API/DocumentFragment * after inserting executes inline script and script tags */ @@ -2102,19 +1973,16 @@ var jsPanel = { while (node.firstChild) { node.removeChild(node.firstChild); } - return node; }, addScript: function addScript(path) { var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'application/javascript'; var cb = arguments.length > 2 ? arguments[2] : undefined; - if (!document.querySelector("script[src=\"".concat(path, "\"]"))) { var script = document.createElement('script'); script.src = path; script.type = type; document.head.appendChild(script); - if (cb) { script.onload = cb; } @@ -2122,8 +1990,8 @@ var jsPanel = { }, ajax: function ajax(ajaxConfig, panel) { var config, - urlParts, - xhr = new XMLHttpRequest(); + urlParts, + xhr = new XMLHttpRequest(); var configDefaults = { method: 'GET', async: true, @@ -2132,11 +2000,9 @@ var jsPanel = { done: function done() { if (panel) { var res = jsPanel.strToHtml(this.responseText); - if (config.urlSelector) { res = res.querySelector(config.urlSelector); } - panel.contentRemove(); panel.content.append(res); } @@ -2144,22 +2010,19 @@ var jsPanel = { autoresize: true, autoreposition: true }; - if (panel && typeof ajaxConfig === 'string') { config = Object.assign({}, configDefaults, { url: ajaxConfig }); } else if (_typeof(ajaxConfig) === 'object' && ajaxConfig.url) { config = Object.assign({}, configDefaults, ajaxConfig); - config.url = ajaxConfig.url; // reset timeout to 0, withCredentials & responseType to false if request is synchronous - + config.url = ajaxConfig.url; + // reset timeout to 0, withCredentials & responseType to false if request is synchronous if (config.async === false) { config.timeout = 0; - if (config.withCredentials) { config.withCredentials = undefined; } - if (config.responseType) { config.responseType = undefined; } @@ -2169,19 +2032,15 @@ var jsPanel = { var err = 'XMLHttpRequest seems to miss the url parameter!'; jsPanel.errorpanel(err); } - return; - } // check url for added selector - - + } + // check url for added selector urlParts = config.url.trim().split(/\s+/); config.url = encodeURI(urlParts[0]); - if (urlParts.length > 1) { urlParts.shift(); config.urlSelector = urlParts.join(' '); } - xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { @@ -2191,19 +2050,18 @@ var jsPanel = { panel ? config.fail.call(xhr, xhr, panel) : config.fail.call(xhr, xhr); } } - if (config.always) { panel ? config.always.call(xhr, xhr, panel) : config.always.call(xhr, xhr); - } // resize and/or reposition panel if either width or height is set to 'auto' - + } + // resize and/or reposition panel if either width or height is set to 'auto' if (panel) { if (config.autoresize || config.autoreposition) { jsPanel.ajaxAutoresizeAutoreposition(panel, config); } - } // allows plugins to add callback functions to the ajax always callback - + } + // allows plugins to add callback functions to the ajax always callback if (jsPanel.ajaxAlwaysCallbacks.length) { jsPanel.ajaxAlwaysCallbacks.forEach(function (item) { panel ? item.call(xhr, xhr, panel) : item.call(xhr, xhr); @@ -2211,33 +2069,26 @@ var jsPanel = { } } }; - xhr.open(config.method, config.url, config.async, config.user, config.pwd); xhr.timeout = config.timeout || 0; - if (config.withCredentials) { xhr.withCredentials = config.withCredentials; } - if (config.responseType) { xhr.responseType = config.responseType; } - if (config.beforeSend) { panel ? config.beforeSend.call(xhr, xhr, panel) : config.beforeSend.call(xhr, xhr); } - config.data ? xhr.send(config.data) : xhr.send(null); }, fetch: function (_fetch) { function fetch(_x, _x2) { return _fetch.apply(this, arguments); } - fetch.toString = function () { return _fetch.toString(); }; - return fetch; }(function (fetchConfig, panel) { var config; @@ -2253,7 +2104,6 @@ var jsPanel = { } } }; - if (panel && typeof fetchConfig === 'string') { config = Object.assign({}, configDefaults, { resource: encodeURI(fetchConfig) @@ -2266,23 +2116,18 @@ var jsPanel = { var err = 'Fetch Request seems to miss the resource parameter!'; jsPanel.errorpanel(err); } - return; } - var fetchInit = config.fetchInit || {}; - if (config.beforeSend) { panel ? config.beforeSend.call(fetchConfig, fetchConfig, panel) : config.beforeSend.call(fetchConfig, fetchConfig); } - fetch(config.resource, fetchInit).then(function (response) { if (response.ok) { return response[config.bodyMethod](); } }).then(function (response) { panel ? config.done.call(response, response, panel) : config.done.call(response, response); - if (panel) { // resize and/or reposition panel if either width or height is set to 'auto' if (config.autoresize || config.autoreposition) { @@ -2293,18 +2138,15 @@ var jsPanel = { }), ajaxAutoresizeAutoreposition: function ajaxAutoresizeAutoreposition(panel, ajaxOrFetchConfig) { var oContentSize = panel.options.contentSize; - if (typeof oContentSize === 'string' && oContentSize.match(/auto/i)) { var parts = oContentSize.split(' '), - sizes = Object.assign({}, { - width: parts[0], - height: parts[1] - }); - + sizes = Object.assign({}, { + width: parts[0], + height: parts[1] + }); if (ajaxOrFetchConfig.autoresize) { panel.resize(sizes); } - if (!panel.classList.contains('jsPanel-contextmenu')) { if (ajaxOrFetchConfig.autoreposition) { panel.reposition(); @@ -2312,11 +2154,9 @@ var jsPanel = { } } else if (_typeof(oContentSize) === 'object' && (oContentSize.width === 'auto' || oContentSize.height === 'auto')) { var _sizes = Object.assign({}, oContentSize); - if (ajaxOrFetchConfig.autoresize) { panel.resize(_sizes); } - if (!panel.classList.contains('jsPanel-contextmenu')) { if (ajaxOrFetchConfig.autoreposition) { panel.reposition(); @@ -2331,13 +2171,11 @@ var jsPanel = { panel.className = 'jsPanel'; panel.style.left = '0'; panel.style.top = '0'; - if (dataAttr) { ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach(function (item) { panel.setAttribute("data-btn".concat(item), 'enabled'); }); } - panel.innerHTML = "
\n
\n
\n
\n
\n
\n
\n \n \n \n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
"); return panel; }, @@ -2349,9 +2187,8 @@ var jsPanel = { }, createSnapArea: function createSnapArea(panel, pos, snapsens) { var el = document.createElement('div'), - parent = panel.parentElement; + parent = panel.parentElement; el.className = "jsPanel-snap-area jsPanel-snap-area-".concat(pos); - if (pos === 'lt' || pos === 'rt' || pos === 'rb' || pos === 'lb') { el.style.width = snapsens + 'px'; el.style.height = snapsens + 'px'; @@ -2360,11 +2197,9 @@ var jsPanel = { } else if (pos === 'lc' || pos === 'rc') { el.style.width = snapsens + 'px'; } - if (parent !== document.body) { el.style.position = 'absolute'; } - if (!document.querySelector(".jsPanel-snap-area.jsPanel-snap-area-".concat(pos))) { panel.parentElement.appendChild(el); } @@ -2399,16 +2234,14 @@ var jsPanel = { var someOrEvery = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'some'; var param = arguments.length > 3 ? arguments[3] : undefined; var param2 = arguments.length > 4 ? arguments[4] : undefined; - // if arg != array make it one if (typeof arg === 'function') { arg = [arg]; - } // some(): execute callbacks until one is found returning a truthy value + } + // some(): execute callbacks until one is found returning a truthy value // every(): execute callbacks until one is found returning a falsy value // truthy values are: '0' (string with single zero), 'false' (string with text false), [] (empty array), {} (empty object), function(){} ("empty" function) // falsy values are: false, 0, '', "", null, undefined, NaN - - if (someOrEvery) { return arg[someOrEvery](function (cb) { return cb.call(panel, panel, param, param2); @@ -2429,7 +2262,6 @@ var jsPanel = { } }; }(); - Array.prototype.slice.call(document.querySelectorAll('.jsPanel-standard')).sort(function (a, b) { return a.style.zIndex - b.style.zIndex; }).forEach(function (panel) { @@ -2463,10 +2295,8 @@ var jsPanel = { // METHOD CREATING THE PANEL --------------------------------------------- create: function create() { var _this2 = this; - var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var cb = arguments.length > 1 ? arguments[1] : undefined; - // initialize z-index generator if (!jsPanel.zi) { jsPanel.zi = function () { @@ -2479,54 +2309,46 @@ var jsPanel = { }; }(); } - if (options.config) { options = Object.assign({}, this.defaults, options.config, options); delete options.config; } else { options = Object.assign({}, this.defaults, options); } - if (!options.id) { options.id = "jsPanel-".concat(jsPanel.idCounter += 1); } else if (typeof options.id === 'function') { options.id = options.id(); } - var p = document.getElementById(options.id); - if (p !== null) { // if a panel with passed id already exists, front it and return false if (p.classList.contains('jsPanel')) { p.front(); } - if (this.errorReporting) { var err = "◀ COULD NOT CREATE NEW JSPANEL ►
An element with the ID ".concat(options.id, " already exists in the document."); jsPanel.errorpanel(err); } - return false; - } // check whether container is valid -> if not return and throw error - - - var panelContainer = this.pOcontainer(options.container); // panelContainer might be a NodeList, so use only first node in list + } + // check whether container is valid -> if not return and throw error + var panelContainer = this.pOcontainer(options.container); + // panelContainer might be a NodeList, so use only first node in list if (_typeof(panelContainer) === 'object' && panelContainer.length && panelContainer.length > 0) { panelContainer = panelContainer[0]; } - if (!panelContainer) { if (this.errorReporting) { var _err = '◀ COULD NOT CREATE NEW JSPANEL ►
The container to append the panel to does not exist'; jsPanel.errorpanel(_err); } - return false; - } // normalize on... callbacks - // these callbacks must be an array of function(s) in order to be able to dynamically add/remove callbacks (for example in extensions) - + } + // normalize on... callbacks + // these callbacks must be an array of function(s) in order to be able to dynamically add/remove callbacks (for example in extensions) ['onbeforeclose', 'onbeforemaximize', 'onbeforeminimize', 'onbeforenormalize', 'onbeforesmallify', 'onbeforeunsmallify', 'onclosed', 'onfronted', 'onmaximized', 'onminimized', 'onnormalized', 'onsmallified', 'onstatuschange', 'onunsmallified'].forEach(function (item) { if (options[item]) { if (typeof options[item] === 'function') { @@ -2536,24 +2358,19 @@ var jsPanel = { options[item] = []; } }); - var self = options.template || this.createPanelTemplate(); // Properties + var self = options.template || this.createPanelTemplate(); + // Properties self.options = options; self.closetimer = undefined; self.status = 'initialized'; self.currentData = {}; self.header = self.querySelector('.jsPanel-hdr'); // complete header section - self.headerbar = self.header.querySelector('.jsPanel-headerbar'); // log, title and controls - self.titlebar = self.header.querySelector('.jsPanel-titlebar'); // div surrounding title div - self.headerlogo = self.headerbar.querySelector('.jsPanel-headerlogo'); // logo only - self.headertitle = self.headerbar.querySelector('.jsPanel-title'); // title div - self.controlbar = self.headerbar.querySelector('.jsPanel-controlbar'); // div surrounding all controls - self.headertoolbar = self.header.querySelector('.jsPanel-hdr-toolbar'); self.content = self.querySelector('.jsPanel-content'); self.footer = self.querySelector('.jsPanel-ftr'); @@ -2561,92 +2378,91 @@ var jsPanel = { self.snapped = false; self.droppableTo = false; self.progressbar = self.autocloseProgressbar = self.querySelector('.jsPanel-progressbar'); // self.autocloseProgressbar kept for compatibility - // Events + // Events var jspanelloaded = new CustomEvent('jspanelloaded', { - detail: options.id, - cancelable: true - }), - jspanelstatuschange = new CustomEvent('jspanelstatuschange', { - detail: options.id, - cancelable: true - }), - jspanelbeforenormalize = new CustomEvent('jspanelbeforenormalize', { - detail: options.id, - cancelable: true - }), - jspanelnormalized = new CustomEvent('jspanelnormalized', { - detail: options.id, - cancelable: true - }), - jspanelbeforemaximize = new CustomEvent('jspanelbeforemaximize', { - detail: options.id, - cancelable: true - }), - jspanelmaximized = new CustomEvent('jspanelmaximized', { - detail: options.id, - cancelable: true - }), - jspanelbeforeminimize = new CustomEvent('jspanelbeforeminimize', { - detail: options.id, - cancelable: true - }), - jspanelminimized = new CustomEvent('jspanelminimized', { - detail: options.id, - cancelable: true - }), - jspanelbeforesmallify = new CustomEvent('jspanelbeforesmallify', { - detail: options.id, - cancelable: true - }), - jspanelsmallified = new CustomEvent('jspanelsmallified', { - detail: options.id, - cancelable: true - }), - jspanelsmallifiedmax = new CustomEvent('jspanelsmallifiedmax', { - detail: options.id, - cancelable: true - }), - jspanelbeforeunsmallify = new CustomEvent('jspanelbeforeunsmallify', { - detail: options.id, - cancelable: true - }), - jspanelfronted = new CustomEvent('jspanelfronted', { - detail: options.id, - cancelable: true - }), - jspanelbeforeclose = new CustomEvent('jspanelbeforeclose', { - detail: options.id, - cancelable: true - }), - jspanelclosed = new CustomEvent('jspanelclosed', { - detail: options.id, - cancelable: true - }), - jspanelcloseduser = new CustomEvent('jspanelcloseduser', { - detail: options.id, - cancelable: true - }); // make panel available as event object property 'panel' - + detail: options.id, + cancelable: true + }), + jspanelstatuschange = new CustomEvent('jspanelstatuschange', { + detail: options.id, + cancelable: true + }), + jspanelbeforenormalize = new CustomEvent('jspanelbeforenormalize', { + detail: options.id, + cancelable: true + }), + jspanelnormalized = new CustomEvent('jspanelnormalized', { + detail: options.id, + cancelable: true + }), + jspanelbeforemaximize = new CustomEvent('jspanelbeforemaximize', { + detail: options.id, + cancelable: true + }), + jspanelmaximized = new CustomEvent('jspanelmaximized', { + detail: options.id, + cancelable: true + }), + jspanelbeforeminimize = new CustomEvent('jspanelbeforeminimize', { + detail: options.id, + cancelable: true + }), + jspanelminimized = new CustomEvent('jspanelminimized', { + detail: options.id, + cancelable: true + }), + jspanelbeforesmallify = new CustomEvent('jspanelbeforesmallify', { + detail: options.id, + cancelable: true + }), + jspanelsmallified = new CustomEvent('jspanelsmallified', { + detail: options.id, + cancelable: true + }), + jspanelsmallifiedmax = new CustomEvent('jspanelsmallifiedmax', { + detail: options.id, + cancelable: true + }), + jspanelbeforeunsmallify = new CustomEvent('jspanelbeforeunsmallify', { + detail: options.id, + cancelable: true + }), + jspanelfronted = new CustomEvent('jspanelfronted', { + detail: options.id, + cancelable: true + }), + jspanelbeforeclose = new CustomEvent('jspanelbeforeclose', { + detail: options.id, + cancelable: true + }), + jspanelclosed = new CustomEvent('jspanelclosed', { + detail: options.id, + cancelable: true + }), + jspanelcloseduser = new CustomEvent('jspanelcloseduser', { + detail: options.id, + cancelable: true + }); + // make panel available as event object property 'panel' [jspanelloaded, jspanelstatuschange, jspanelbeforenormalize, jspanelnormalized, jspanelbeforemaximize, jspanelmaximized, jspanelbeforeminimize, jspanelminimized, jspanelbeforesmallify, jspanelsmallified, jspanelsmallifiedmax, jspanelbeforeunsmallify, jspanelfronted, jspanelbeforeclose].forEach(function (evt) { return evt.panel = self; - }); // controls buttons + }); + // controls buttons var closeBtn = self.querySelector('.jsPanel-btn-close'), - maxBtn = self.querySelector('.jsPanel-btn-maximize'), - normBtn = self.querySelector('.jsPanel-btn-normalize'), - smallBtn = self.querySelector('.jsPanel-btn-smallify'), - minBtn = self.querySelector('.jsPanel-btn-minimize'); - + maxBtn = self.querySelector('.jsPanel-btn-maximize'), + normBtn = self.querySelector('.jsPanel-btn-normalize'), + smallBtn = self.querySelector('.jsPanel-btn-smallify'), + minBtn = self.querySelector('.jsPanel-btn-minimize'); if (closeBtn) { jsPanel.pointerup.forEach(function (item) { closeBtn.addEventListener(item, function (e) { - e.preventDefault(); // disable close for all mouse buttons but left - + e.preventDefault(); + // disable close for all mouse buttons but left if (e.button && e.button > 0) { return false; } - self.close(null, true); // true indicates panel closed by using the close control }); }); @@ -2656,39 +2472,31 @@ var jsPanel = { jsPanel.pointerup.forEach(function (item) { maxBtn.addEventListener(item, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.maximize(); }); }); } - if (normBtn) { jsPanel.pointerup.forEach(function (item) { normBtn.addEventListener(item, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.normalize(); }); }); } - if (smallBtn) { jsPanel.pointerup.forEach(function (item) { smallBtn.addEventListener(item, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - if (self.status === 'normalized' || self.status === 'maximized') { self.smallify(); } else if (self.status === 'smallified' || self.status === 'smallifiedmax') { @@ -2697,71 +2505,60 @@ var jsPanel = { }); }); } - if (minBtn) { jsPanel.pointerup.forEach(function (item) { minBtn.addEventListener(item, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.minimize(); }); }); - } // import extensions (extensions of the individual panel, not the global object jsPanel) - + } + // import extensions (extensions of the individual panel, not the global object jsPanel) var extensions = jsPanel.extensions; - for (var ext in extensions) { if (Object.prototype.hasOwnProperty.call(extensions, ext)) { self[ext] = extensions[ext]; } - } // panel methods - + } + // panel methods self.setBorder = function (val) { var border = jsPanel.pOborder(val); - if (!border[2].length) { border[2] = self.style.backgroundColor; } - border = border.join(' '); self.style.border = border; self.options.border = border; return self; }; - self.setBorderRadius = function (rad) { if (typeof rad === 'string') { if (rad.startsWith('--') || rad.startsWith('var')) { rad = rad.replace(/\s*\(\s*/g, '(') // remove whitespace around opening brackets .replace(/\s*\)/g, ')') // remove whitespace around closing brackets .replace(/\s+/g, ' '); // replace all other whitespace(s) with a single whitespace - rad = jsPanel.getCssVariableValue(rad); } } - if (typeof rad === 'number') { rad += 'px'; } - self.style.borderRadius = rad; - var br = getComputedStyle(self); // set border-radius of either header or content section depending on presence of header - + var br = getComputedStyle(self); + // set border-radius of either header or content section depending on presence of header if (self.options.header) { self.header.style.borderTopLeftRadius = br.borderTopLeftRadius; self.header.style.borderTopRightRadius = br.borderTopRightRadius; } else { self.content.style.borderTopLeftRadius = br.borderTopLeftRadius; self.content.style.borderTopRightRadius = br.borderTopRightRadius; - } // set border-radius of either footer or content section depending on presence of footer - - + } + // set border-radius of either footer or content section depending on presence of footer if (self.options.footerToolbar) { self.footer.style.borderBottomRightRadius = br.borderBottomRightRadius; self.footer.style.borderBottomLeftRadius = br.borderBottomLeftRadius; @@ -2769,24 +2566,19 @@ var jsPanel = { self.content.style.borderBottomRightRadius = br.borderBottomRightRadius; self.content.style.borderBottomLeftRadius = br.borderBottomLeftRadius; } - return self; }; - self.setTheme = function () { var theme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : options.theme; var cb = arguments.length > 1 ? arguments[1] : undefined; // if panel is minimized normalize it for theme change var minimized; - if (self.status === 'minimized') { minimized = true; self.normalize(); - } // first remove all theme related styles - - + } + // first remove all theme related styles jsPanel.clearTheme(self); - if (_typeof(theme) === 'object') { options.border = undefined; jsPanel.applyCustomTheme(self, theme); @@ -2794,43 +2586,32 @@ var jsPanel = { if (theme === 'none') { theme = 'white'; } - var themeDetails = jsPanel.getThemeDetails(theme); jsPanel.applyColorTheme(self, themeDetails); - } // minimize again if panel was minimized prior theme change - - + } + // minimize again if panel was minimized prior theme change if (minimized) { self.minimize(); } - if (cb) { cb.call(self, self); } - return self; }; - self.remove = function (id, closedBy, cb) { // self.remove() is just a helper func used in self.close() self.parentElement.removeChild(self); - if (!document.getElementById(id)) { self.removeMinimizedReplacement(); self.status = 'closed'; - if (closedBy) { document.dispatchEvent(jspanelcloseduser); } - document.dispatchEvent(jspanelclosed); - if (self.options.onclosed) { jsPanel.processCallbacks(self, self.options.onclosed, 'every', closedBy); } - jsPanel.autopositionRemaining(self); - if (cb) { cb.call(id, id); } @@ -2839,33 +2620,26 @@ var jsPanel = { cb.call(self, id, self); } } - window.removeEventListener('resize', self.windowResizeHandler); document.removeEventListener('jspanelresize', self.parentResizeHandler); }; - self.close = function (cb, closedByUser) { // if panel does not exist return if (!self.parentElement) { return; } - if (self.closetimer) { window.clearInterval(self.closetimer); } - document.dispatchEvent(jspanelbeforeclose); self.statusBefore = self.status; - if (self.options.onbeforeclose && self.options.onbeforeclose.length > 0 && !jsPanel.processCallbacks(self, self.options.onbeforeclose, 'some', self.status, closedByUser)) { return self; } - if (self.options.animateOut) { if (self.options.animateIn) { jsPanel.remClass(self, self.options.animateIn); } - jsPanel.setClass(self, self.options.animateOut); self.addEventListener('animationend', function (e) { e.stopPropagation(); @@ -2875,22 +2649,18 @@ var jsPanel = { self.remove(self.id, closedByUser, cb); } }; - self.maximize = function (cb, donotfront) { // Note: do not disable maximize method for already maximized panels -> onContainerResize wouldn't work self.statusBefore = self.status; - if (options.onbeforemaximize && options.onbeforemaximize.length > 0 && !jsPanel.processCallbacks(self, options.onbeforemaximize, 'some', self.statusBefore)) { return self; } - document.dispatchEvent(jspanelbeforemaximize); var parent = self.parentElement, - margins = jsPanel.pOcontainment(options.maximizedMargin); // normalize maximizedMargin + margins = jsPanel.pOcontainment(options.maximizedMargin); // normalize maximizedMargin if (parent === document.body) { // maximize within window - /* When clientHeight is used on the root element (the element), (or on if the document is in quirks mode), the viewport's height (excluding any scrollbar) is returned. This is a special case of clientHeight. @@ -2908,126 +2678,101 @@ var jsPanel = { self.style.left = margins[3] + 'px'; self.style.top = margins[0] + 'px'; } - smallBtn.style.transform = 'unset'; self.removeMinimizedReplacement(); self.status = 'maximized'; self.setControls(['.jsPanel-btn-maximize']); - if (!donotfront) { self.front(); } - document.dispatchEvent(jspanelmaximized); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } - if (cb) { cb.call(self, self, self.statusBefore); } - if (options.onmaximized) { jsPanel.processCallbacks(self, options.onmaximized, 'every', self.statusBefore); } - return self; }; - self.minimize = function (cb) { if (self.status === 'minimized') { return self; } - self.statusBefore = self.status; - if (options.onbeforeminimize && options.onbeforeminimize.length > 0 && !jsPanel.processCallbacks(self, options.onbeforeminimize, 'some', self.statusBefore)) { return self; } + document.dispatchEvent(jspanelbeforeminimize); - document.dispatchEvent(jspanelbeforeminimize); // create container for minimized replacements if not already there - + // create container for minimized replacements if not already there if (!document.getElementById('jsPanel-replacement-container')) { var replacementContainer = document.createElement('div'); replacementContainer.id = 'jsPanel-replacement-container'; document.body.append(replacementContainer); } - self.style.left = '-9999px'; self.status = 'minimized'; document.dispatchEvent(jspanelminimized); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } - if (options.minimizeTo) { var replacement = self.createMinimizedReplacement(), - container, - parent, - list; - + container, + parent, + list; switch (options.minimizeTo) { case 'default': document.getElementById('jsPanel-replacement-container').append(replacement); break; - case 'parentpanel': parent = self.closest('.jsPanel-content').parentElement; list = parent.querySelectorAll('.jsPanel-minimized-box'); container = list[list.length - 1]; container.append(replacement); break; - case 'parent': parent = self.parentElement; container = parent.querySelector('.jsPanel-minimized-container'); - if (!container) { container = document.createElement('div'); container.className = 'jsPanel-minimized-container'; parent.append(container); } - container.append(replacement); break; - default: // all other strings are assumed to be selector strings returning a single element to append the min replacement to document.querySelector(options.minimizeTo).append(replacement); } } - if (cb) { cb.call(self, self, self.statusBefore); } - if (options.onminimized) { jsPanel.processCallbacks(self, options.onminimized, 'every', self.statusBefore); } - return self; }; - self.normalize = function (cb) { if (self.status === 'normalized') { return self; } - - self.statusBefore = self.status; // ensure smallify/unsmallify transition is turned off when resizing begins + self.statusBefore = self.status; + // ensure smallify/unsmallify transition is turned off when resizing begins //self.style.transition = 'unset'; if (options.onbeforenormalize && options.onbeforenormalize.length > 0 && !jsPanel.processCallbacks(self, options.onbeforenormalize, 'some', self.statusBefore)) { return self; } - document.dispatchEvent(jspanelbeforenormalize); self.style.width = self.currentData.width; self.style.height = self.currentData.height; - if (self.snapped) { // if panel is snapped before minimizing restore snapped position self.snap(self.snapped, true); @@ -3035,7 +2780,6 @@ var jsPanel = { self.style.left = self.currentData.left; self.style.top = self.currentData.top; } - smallBtn.style.transform = 'unset'; self.removeMinimizedReplacement(); self.status = 'normalized'; @@ -3043,46 +2787,36 @@ var jsPanel = { self.front(); document.dispatchEvent(jspanelnormalized); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } - if (cb) { cb.call(self, self, self.statusBefore); } - if (options.onnormalized) { jsPanel.processCallbacks(self, options.onnormalized, 'every', self.statusBefore); } - return self; }; - self.smallify = function (cb) { if (self.status === 'smallified' || self.status === 'smallifiedmax') { return self; } - self.statusBefore = self.status; - if (options.onbeforesmallify && options.onbeforesmallify.length > 0 && !jsPanel.processCallbacks(self, options.onbeforesmallify, 'some', self.statusBefore)) { return self; } - document.dispatchEvent(jspanelbeforesmallify); self.style.overflow = 'hidden'; var selfStyles = window.getComputedStyle(self), - selfHeaderHeight = parseFloat(window.getComputedStyle(self.headerbar).height); + selfHeaderHeight = parseFloat(window.getComputedStyle(self.headerbar).height); self.style.height = parseFloat(selfStyles.borderTopWidth) + parseFloat(selfStyles.borderBottomWidth) + selfHeaderHeight + 'px'; smallBtn.style.transform = 'rotate(180deg)'; - if (self.status === 'normalized') { self.setControls(['.jsPanel-btn-normalize']); self.status = 'smallified'; document.dispatchEvent(jspanelsmallified); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } @@ -3091,45 +2825,35 @@ var jsPanel = { self.status = 'smallifiedmax'; document.dispatchEvent(jspanelsmallifiedmax); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } } - var minBoxes = self.querySelectorAll('.jsPanel-minimized-box'); minBoxes[minBoxes.length - 1].style.display = 'none'; - if (cb) { cb.call(self, self, self.statusBefore); } - if (options.onsmallified) { jsPanel.processCallbacks(self, options.onsmallified, 'every', self.statusBefore); } - return self; }; - self.unsmallify = function (cb) { self.statusBefore = self.status; - if (self.status === 'smallified' || self.status === 'smallifiedmax') { if (options.onbeforeunsmallify && options.onbeforeunsmallify.length > 0 && !jsPanel.processCallbacks(self, options.onbeforeunsmallify, 'some', self.statusBefore)) { return self; } - document.dispatchEvent(jspanelbeforeunsmallify); self.style.overflow = 'visible'; self.front(); - if (self.status === 'smallified') { self.style.height = self.currentData.height; self.setControls(['.jsPanel-btn-normalize']); self.status = 'normalized'; document.dispatchEvent(jspanelnormalized); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every', self.statusBefore); } @@ -3138,81 +2862,63 @@ var jsPanel = { } else if (self.status === 'minimized') { self.normalize(); } - smallBtn.style.transform = 'rotate(0deg)'; var minBoxes = self.querySelectorAll('.jsPanel-minimized-box'); minBoxes[minBoxes.length - 1].style.display = 'flex'; - if (cb) { cb.call(self, self, self.statusBefore); } - if (options.onunsmallified) { jsPanel.processCallbacks(self, options.onunsmallified, 'every', self.statusBefore); } } - return self; }; - self.front = function (callback) { var execOnFrontedCallbacks = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - if (self.status === 'minimized') { self.statusBefore === 'maximized' ? self.maximize() : self.normalize(); } else { var newArr = Array.prototype.slice.call(document.querySelectorAll('.jsPanel-standard')).map(function (panel) { return panel.style.zIndex; }); - if (Math.max.apply(Math, _toConsumableArray(newArr)) > self.style.zIndex) { self.style.zIndex = jsPanel.zi.next(); } - jsPanel.resetZi(); } - document.dispatchEvent(jspanelfronted); - if (callback) { callback.call(self, self); } - if (options.onfronted && execOnFrontedCallbacks) { jsPanel.processCallbacks(self, options.onfronted, 'every', self.status); } - return self; }; - self.snap = function (pos) { var alreadySnapped = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; - // store panel size before it snaps, only if not snapped already if (!alreadySnapped) { self.currentData.beforeSnap = { width: self.currentData.width, height: self.currentData.height }; - } // snap panel - - + } + // snap panel if (pos && typeof pos === 'function' && !alreadySnapped) { pos.call(self, self, self.snappableTo); } else if (pos !== false) { var offsets = [0, 0]; - if (self.options.dragit.snap.containment) { if (self.options.dragit.containment) { var containment = jsPanel.pOcontainment(self.options.dragit.containment), - position = self.snappableTo; - + position = self.snappableTo; if (position.startsWith('left')) { offsets[0] = containment[3]; } else if (position.startsWith('right')) { offsets[0] = -containment[1]; } - if (position.endsWith('top')) { offsets[1] = containment[0]; } else if (position.endsWith('bottom')) { @@ -3220,18 +2926,15 @@ var jsPanel = { } } } - self.reposition("".concat(self.snappableTo, " ").concat(offsets[0], " ").concat(offsets[1])); } - if (!alreadySnapped) { self.snapped = self.snappableTo; } }; - self.move = function (target, cb) { var overlaps = self.overlaps(target, 'paddingbox'), - source = self.parentElement; + source = self.parentElement; target.appendChild(self); self.options.container = target; self.style.left = overlaps.left + 'px'; @@ -3239,67 +2942,53 @@ var jsPanel = { self.saveCurrentDimensions(); self.saveCurrentPosition(); self.calcSizeFactors(); // important for option.onContainerResize - if (cb) { cb.call(self, self, target, source); } - return self; }; - self.closeChildpanels = function (cb) { self.getChildpanels().forEach(function (item) { return item.close(); }); - if (cb) { cb.call(self, self); } - return self; }; - self.getChildpanels = function (cb) { var childpanels = self.content.querySelectorAll('.jsPanel'); - if (cb) { childpanels.forEach(function (panel, index, list) { cb.call(panel, panel, index, list); }); } - return childpanels; }; - self.isChildpanel = function (cb) { var pp = self.closest('.jsPanel-content'), - parentpanel = pp ? pp.parentElement : null; - + parentpanel = pp ? pp.parentElement : null; if (cb) { cb.call(self, self, parentpanel); - } // if panel is childpanel of another panel returns parentpanel, otherwise false - - + } + // if panel is childpanel of another panel returns parentpanel, otherwise false return pp ? parentpanel : false; }; - self.contentRemove = function (cb) { jsPanel.emptyNode(self.content); - if (cb) { cb.call(self, self); } - return self; }; - self.createMinimizedReplacement = function () { var tpl = jsPanel.createMinimizedTemplate(), - color = window.getComputedStyle(self.headertitle).color, - selfStyles = window.getComputedStyle(self), - font = options.iconfont, - controlbar = tpl.querySelector('.jsPanel-controlbar'); // if panel background is an image (that includes gradients) instead of a color value + color = window.getComputedStyle(self.headertitle).color, + selfStyles = window.getComputedStyle(self), + font = options.iconfont, + controlbar = tpl.querySelector('.jsPanel-controlbar'); + // if panel background is an image (that includes gradients) instead of a color value if (self.options.header !== 'auto-show-hide') { jsPanel.setStyles(tpl, { backgroundColor: selfStyles.backgroundColor, @@ -3315,7 +3004,6 @@ var jsPanel = { } else { tpl.style.backgroundColor = window.getComputedStyle(self.header).backgroundColor; } - tpl.id = self.id + '-min'; tpl.querySelector('.jsPanel-headerbar').replaceChild(self.headerlogo.cloneNode(true), tpl.querySelector('.jsPanel-headerlogo')); tpl.querySelector('.jsPanel-titlebar').replaceChild(self.headertitle.cloneNode(true), tpl.querySelector('.jsPanel-title')); @@ -3329,86 +3017,74 @@ var jsPanel = { if (self.header.classList.contains(item)) { tpl.querySelector('.jsPanel-hdr').classList.add(item); } - }); // set iconfont + }); + // set iconfont self.setIconfont(font, tpl); - if (self.dataset.btnnormalize === 'enabled') { jsPanel.pointerup.forEach(function (evt) { tpl.querySelector('.jsPanel-btn-normalize').addEventListener(evt, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.normalize(); }); }); } else { controlbar.querySelector('.jsPanel-btn-normalize').style.display = 'none'; } - if (self.dataset.btnmaximize === 'enabled') { jsPanel.pointerup.forEach(function (evt) { tpl.querySelector('.jsPanel-btn-maximize').addEventListener(evt, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.maximize(); }); }); } else { controlbar.querySelector('.jsPanel-btn-maximize').style.display = 'none'; } - if (self.dataset.btnclose === 'enabled') { jsPanel.pointerup.forEach(function (evt) { tpl.querySelector('.jsPanel-btn-close').addEventListener(evt, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - self.close(null, true); }); }); } else { controlbar.querySelector('.jsPanel-btn-close').style.display = 'none'; } - return tpl; }; - self.removeMinimizedReplacement = function () { var elmt = document.getElementById("".concat(self.id, "-min")); - if (elmt) { elmt.parentElement.removeChild(elmt); } }; - self.drag = function () { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var dragstarted, dragElmt, opts; var jspaneldragstart = new CustomEvent('jspaneldragstart', { - detail: self.id - }), - jspaneldrag = new CustomEvent('jspaneldrag', { - detail: self.id - }), - jspaneldragstop = new CustomEvent('jspaneldragstop', { - detail: self.id - }); // make panel available as event object property 'panel' + detail: self.id + }), + jspaneldrag = new CustomEvent('jspaneldrag', { + detail: self.id + }), + jspaneldragstop = new CustomEvent('jspaneldragstop', { + detail: self.id + }); + // make panel available as event object property 'panel' [jspaneldragstart, jspaneldrag, jspaneldragstop].forEach(function (evt) { return evt.panel = self; }); - var camelcase = function camelcase(string) { // 'left-top' converted to 'snapLeftTop' var str = string.split('-'); @@ -3417,7 +3093,6 @@ var jsPanel = { }); return 'snap' + str.join(''); }; - function windowListener(e) { if (e.relatedTarget === null) { jsPanel.pointermove.forEach(function (evt) { @@ -3425,106 +3100,86 @@ var jsPanel = { self.style.opacity = 1; }); } - } // attach handler to each drag handle - - + } + // attach handler to each drag handle var handles = options.handles || jsPanel.defaults.dragit.handles; var cursor = options.cursor || jsPanel.defaults.dragit.cursor; - function pointerUpHandlerDragit(e) { jsPanel.pointermove.forEach(function (e) { return document.removeEventListener(e, dragElmt); }); jsPanel.removeSnapAreas(); - if (dragstarted) { self.style.opacity = 1; dragstarted = undefined; - if (opts.snap) { switch (self.snappableTo) { case 'left-top': self.snap(opts.snap.snapLeftTop); break; - case 'center-top': self.snap(opts.snap.snapCenterTop); break; - case 'right-top': self.snap(opts.snap.snapRightTop); break; - case 'right-center': self.snap(opts.snap.snapRightCenter); break; - case 'right-bottom': self.snap(opts.snap.snapRightBottom); break; - case 'center-bottom': self.snap(opts.snap.snapCenterBottom); break; - case 'left-bottom': self.snap(opts.snap.snapLeftBottom); break; - case 'left-center': self.snap(opts.snap.snapLeftCenter); break; } - if (opts.snap.callback && self.snappableTo && typeof opts.snap.callback === 'function') { opts.snap.callback.call(self, self); - if (opts.snap.repositionOnSnap && opts.snap[camelcase(self.snappableTo)] !== false) { self.repositionOnSnap(self.snappableTo); } } - if (self.snappableTo && opts.snap.repositionOnSnap && opts.snap[camelcase(self.snappableTo)]) { self.repositionOnSnap(self.snappableTo); } - } // opts.drop - - + } + // opts.drop if (self.droppableTo && self.droppableTo) { var sourceContainer = self.parentElement; self.move(self.droppableTo); - if (opts.drop.callback) { opts.drop.callback.call(self, self, self.droppableTo, sourceContainer); } } - document.dispatchEvent(jspaneldragstop); - if (opts.stop.length) { var stopStyles = window.getComputedStyle(self), - paneldata = { - left: parseFloat(stopStyles.left), - top: parseFloat(stopStyles.top), - width: parseFloat(stopStyles.width), - height: parseFloat(stopStyles.height) - }; + paneldata = { + left: parseFloat(stopStyles.left), + top: parseFloat(stopStyles.top), + width: parseFloat(stopStyles.width), + height: parseFloat(stopStyles.height) + }; jsPanel.processCallbacks(self, opts.stop, false, paneldata, e); } - self.saveCurrentPosition(); self.calcSizeFactors(); // important for options onwindowresize/onparentresize } self.controlbar.style.pointerEvents = 'inherit'; - self.content.style.pointerEvents = 'inherit'; // restore other panel's css pointer-events - + self.content.style.pointerEvents = 'inherit'; + // restore other panel's css pointer-events document.querySelectorAll('iframe').forEach(function (frame) { return frame.style.pointerEvents = 'auto'; }); document.removeEventListener(e, pointerUpHandlerDragit); } - self.querySelectorAll(handles).forEach(function (handle) { handle.style.touchAction = 'none'; handle.style.cursor = cursor; @@ -3533,19 +3188,16 @@ var jsPanel = { // disable dragging for all mouse buttons but left if (e.button && e.button > 0) { return false; - } // setup and normalize dragit options - + } + // setup and normalize dragit options opts = Object.assign({}, jsPanel.defaults.dragit, options); - if (opts.disableOnMaximized && self.status === 'maximized') { return false; } - if (opts.containment || opts.containment === 0) { opts.containment = jsPanel.pOcontainment(opts.containment); } - if (opts.grid) { if (Array.isArray(opts.grid)) { if (opts.grid.length === 1) { @@ -3553,79 +3205,74 @@ var jsPanel = { } } } - if (opts.snap) { if (_typeof(opts.snap) === 'object') { opts.snap = Object.assign({}, jsPanel.defaultSnapConfig, opts.snap); } else { opts.snap = jsPanel.defaultSnapConfig; } - } // footer elmts with the class "jsPanel-ftr-btn" don't drag a panel + } + + // footer elmts with the class "jsPanel-ftr-btn" don't drag a panel // do not compare e.target with e.currentTarget because there might be footer elmts supposed to drag the panel // noinspection JSUnresolvedFunction - - if (e.target.closest('.jsPanel-ftr-btn')) { return; } - self.controlbar.style.pointerEvents = 'none'; self.content.style.pointerEvents = 'none'; // without this code handler might not be unbound when content has iframe or object tag // prevents iframes in other panel from interfering with drag action of dragged panel - document.querySelectorAll('iframe').forEach(function (frame) { return frame.style.pointerEvents = 'none'; }); var startStyles = window.getComputedStyle(self), - startLeft = parseFloat(startStyles.left), - startTop = parseFloat(startStyles.top), - startWidth = parseFloat(startStyles.width), - startHeight = parseFloat(startStyles.height), - psx = e.touches ? e.touches[0].clientX : e.clientX, - // pointer x on mousedown (don't use pageX, doesn't work on FF for Android) - psy = e.touches ? e.touches[0].clientY : e.clientY, - // same as above - parent = self.parentElement, - parentRect = parent.getBoundingClientRect(), - parentStyles = window.getComputedStyle(parent), - scaleFactor = self.getScaleFactor(), - startLeftCorrection = 0, - scrollbarwidths = jsPanel.getScrollbarWidth(parent); // function actually dragging the elmt - + startLeft = parseFloat(startStyles.left), + startTop = parseFloat(startStyles.top), + startWidth = parseFloat(startStyles.width), + startHeight = parseFloat(startStyles.height), + psx = e.touches ? e.touches[0].clientX : e.clientX, + // pointer x on mousedown (don't use pageX, doesn't work on FF for Android) + psy = e.touches ? e.touches[0].clientY : e.clientY, + // same as above + parent = self.parentElement, + parentRect = parent.getBoundingClientRect(), + parentStyles = window.getComputedStyle(parent), + scaleFactor = self.getScaleFactor(), + startLeftCorrection = 0, + scrollbarwidths = jsPanel.getScrollbarWidth(parent); + + // function actually dragging the elmt dragElmt = function dragElmt(e) { e.preventDefault(); - if (!dragstarted) { document.dispatchEvent(jspaneldragstart); - self.style.opacity = opts.opacity; // if configured restore panel size to a value before snap and reposition reasonable before drag actually starts - + self.style.opacity = opts.opacity; + // if configured restore panel size to a value before snap and reposition reasonable before drag actually starts if (self.snapped && opts.snap.resizeToPreSnap && self.currentData.beforeSnap) { self.resize(self.currentData.beforeSnap.width + ' ' + self.currentData.beforeSnap.height); self.setControls(['.jsPanel-btn-normalize']); var intermediateStyles = self.getBoundingClientRect(), - delta = psx - (intermediateStyles.left + intermediateStyles.width), - wHalf = intermediateStyles.width / 2; - + delta = psx - (intermediateStyles.left + intermediateStyles.width), + wHalf = intermediateStyles.width / 2; if (delta > -wHalf) { startLeftCorrection = delta + wHalf; } } - self.front(); - self.snapped = false; // panel is maximized on dragstart + self.snapped = false; + // panel is maximized on dragstart if (self.status === 'maximized') { self.setControls(['.jsPanel-btn-normalize']); self.status = 'normalized'; - } // opts.drop - + } + // opts.drop if (opts.drop && opts.drop.dropZones) { //opts.drop.dropZones = opts.drop.dropZones.map(zone => jsPanel.pOcontainer(zone)); var dropzones = opts.drop.dropZones.map(function (zone) { return jsPanel.pOcontainer(zone); }); // -> array where each item is a NodeList - var dropzonelist = []; dropzones.forEach(function (nodelist) { if (nodelist.length) { @@ -3636,15 +3283,15 @@ var jsPanel = { } else { dropzonelist.push(nodelist); } - }); // filter list to have only unique values - + }); + // filter list to have only unique values dropzonelist = dropzonelist.filter(function (value, index, self) { return self.indexOf(value) === index; }); opts.drop.dropZones = dropzonelist; - } // dragstart callback - + } + // dragstart callback if (opts.start.length) { jsPanel.processCallbacks(self, opts.start, false, { left: startLeft, @@ -3654,18 +3301,18 @@ var jsPanel = { }, e); } } - dragstarted = 1; var elmtL, elmtL2, elmtT, elmtT2, elmtR, elmtR2, elmtB, elmtB2, right, bottom; var pmx = e.touches ? e.touches[0].clientX : e.clientX, - // current pointer x while pointer moves (don't use pageX, doesn't work on FF for Android) - pmy = e.touches ? e.touches[0].clientY : e.clientY, - // current pointer y while pointer moves (don't use pageY, doesn't work on FF for Android) - dragStyles = window.getComputedStyle(self), - // get current styles while dragging - overlaps; // EDGE reports "auto" instead of pixel value using getComputedStyle(), so some values need to be calculated different + // current pointer x while pointer moves (don't use pageX, doesn't work on FF for Android) + pmy = e.touches ? e.touches[0].clientY : e.clientY, + // current pointer y while pointer moves (don't use pageY, doesn't work on FF for Android) + dragStyles = window.getComputedStyle(self), + // get current styles while dragging + overlaps; + + // EDGE reports "auto" instead of pixel value using getComputedStyle(), so some values need to be calculated different // this whole block of code could be removed if EDGE not based on Chromium doesn't need to be supported - if (parent === document.body) { var elmtRect = self.getBoundingClientRect(); right = window.innerWidth - parseInt(parentStyles.borderLeftWidth, 10) - parseInt(parentStyles.borderRightWidth, 10) - (elmtRect.left + elmtRect.width); @@ -3673,13 +3320,12 @@ var jsPanel = { } else { right = parseInt(parentStyles.width, 10) - parseInt(parentStyles.borderLeftWidth, 10) - parseInt(parentStyles.borderRightWidth, 10) - (parseInt(dragStyles.left, 10) + parseInt(dragStyles.width, 10)); bottom = parseInt(parentStyles.height, 10) - parseInt(parentStyles.borderTopWidth, 10) - parseInt(parentStyles.borderBottomWidth, 10) - (parseInt(dragStyles.top, 10) + parseInt(dragStyles.height, 10)); - } // -- -- -- - + } + // -- -- -- elmtL = parseFloat(dragStyles.left); elmtT = parseFloat(dragStyles.top); elmtR = right; // replace line with parseFloat(dragStyles.right); if EDGE code block above is removed - elmtB = bottom; // replace line with parseFloat(dragStyles.bottom); if EDGE code block above is removed if (opts.snap) { @@ -3711,81 +3357,77 @@ var jsPanel = { } } } - var lefttopVectorDrag = Math.sqrt(elmtL2 + elmtT2), - leftbottomVectorDrag = Math.sqrt(elmtL2 + elmtB2), - righttopVectorDrag = Math.sqrt(elmtR2 + elmtT2), - rightbottomVectorDrag = Math.sqrt(elmtR2 + elmtB2), - horizontalDeltaDrag = Math.abs(elmtL - elmtR) / 2, - verticalDeltaDrag = Math.abs(elmtT - elmtB) / 2, - leftVectorDrag = Math.sqrt(elmtL2 + Math.pow(verticalDeltaDrag, 2)), - topVectorDrag = Math.sqrt(elmtT2 + Math.pow(horizontalDeltaDrag, 2)), - rightVectorDrag = Math.sqrt(elmtR2 + Math.pow(verticalDeltaDrag, 2)), - bottomVectorDrag = Math.sqrt(elmtB2 + Math.pow(horizontalDeltaDrag, 2)); // prevent selections while dragging - - window.getSelection().removeAllRanges(); // trigger drag permanently while dragging - - document.dispatchEvent(jspaneldrag); // move elmt and apply axis option - + leftbottomVectorDrag = Math.sqrt(elmtL2 + elmtB2), + righttopVectorDrag = Math.sqrt(elmtR2 + elmtT2), + rightbottomVectorDrag = Math.sqrt(elmtR2 + elmtB2), + horizontalDeltaDrag = Math.abs(elmtL - elmtR) / 2, + verticalDeltaDrag = Math.abs(elmtT - elmtB) / 2, + leftVectorDrag = Math.sqrt(elmtL2 + Math.pow(verticalDeltaDrag, 2)), + topVectorDrag = Math.sqrt(elmtT2 + Math.pow(horizontalDeltaDrag, 2)), + rightVectorDrag = Math.sqrt(elmtR2 + Math.pow(verticalDeltaDrag, 2)), + bottomVectorDrag = Math.sqrt(elmtB2 + Math.pow(horizontalDeltaDrag, 2)); + + // prevent selections while dragging + window.getSelection().removeAllRanges(); + + // trigger drag permanently while dragging + document.dispatchEvent(jspaneldrag); + + // move elmt and apply axis option if (!opts.axis || opts.axis === 'x') { self.style.left = startLeft + (pmx - psx) / scaleFactor.x + startLeftCorrection + 'px'; // set new css left of elmt depending on opts.axis } if (!opts.axis || opts.axis === 'y') { self.style.top = startTop + (pmy - psy) / scaleFactor.y + 'px'; // set new css top of elmt depending on opts.axis - } // apply grid option - + } + // apply grid option if (opts.grid) { var grid = opts.grid, - axis = opts.axis; // formula rounds to the nearest multiple of grid + axis = opts.axis; + // formula rounds to the nearest multiple of grid // https://www.webveteran.com/blog/web-coding/javascript-round-to-any-multiple-of-a-specific-number/ - var x = grid[0] * Math.round((startLeft + (pmx - psx)) / grid[0]), - y = grid[1] * Math.round((startTop + (pmy - psy)) / grid[1]); - + y = grid[1] * Math.round((startTop + (pmy - psy)) / grid[1]); if (!axis || axis === 'x') { self.style.left = "".concat(x, "px"); } - if (!axis || axis === 'y') { self.style.top = "".concat(y, "px"); } - } // apply containment option - + } + // apply containment option if (opts.containment || opts.containment === 0) { var containment = opts.containment; - var maxLeft, maxTop; // calc maxLeft and maxTop (minLeft and MinTop is equal to containment setting) - + var maxLeft, maxTop; + // calc maxLeft and maxTop (minLeft and MinTop is equal to containment setting) if (self.options.container === 'window') { maxLeft = window.innerWidth - parseFloat(dragStyles.width) - containment[1] - scrollbarwidths.y; maxTop = window.innerHeight - parseFloat(dragStyles.height) - containment[2] - scrollbarwidths.x; } else { var xCorr = parseFloat(parentStyles.borderLeftWidth) + parseFloat(parentStyles.borderRightWidth), - yCorr = parseFloat(parentStyles.borderTopWidth) + parseFloat(parentStyles.borderBottomWidth); + yCorr = parseFloat(parentStyles.borderTopWidth) + parseFloat(parentStyles.borderBottomWidth); maxLeft = parentRect.width / scaleFactor.x - parseFloat(dragStyles.width) - containment[1] - xCorr - scrollbarwidths.y; maxTop = parentRect.height / scaleFactor.y - parseFloat(dragStyles.height) - containment[2] - yCorr - scrollbarwidths.x; } - if (parseFloat(self.style.left) <= containment[3]) { self.style.left = containment[3] + 'px'; } - if (parseFloat(self.style.top) <= containment[0]) { self.style.top = containment[0] + 'px'; } - if (parseFloat(self.style.left) >= maxLeft) { self.style.left = maxLeft + 'px'; } - if (parseFloat(self.style.top) >= maxTop) { self.style.top = maxTop + 'px'; } - } // callback while dragging - + } + // callback while dragging if (opts.drag.length) { var paneldata = { left: elmtL, @@ -3796,16 +3438,15 @@ var jsPanel = { height: parseFloat(dragStyles.height) }; jsPanel.processCallbacks(self, opts.drag, false, paneldata, e); - } // apply snap options - + } + // apply snap options if (opts.snap) { var snapSens = opts.snap.sensitivity, - topSensAreaLength = parent === document.body ? window.innerWidth / 8 : parentRect.width / 8, - sideSensAreaLength = parent === document.body ? window.innerHeight / 8 : parentRect.height / 8; + topSensAreaLength = parent === document.body ? window.innerWidth / 8 : parentRect.width / 8, + sideSensAreaLength = parent === document.body ? window.innerHeight / 8 : parentRect.height / 8; self.snappableTo = false; jsPanel.removeSnapAreas(); - if (lefttopVectorDrag < snapSens) { if (opts.snap.snapLeftTop !== false) { if (!opts.snap.active || opts.snap.active === 'both') { @@ -3927,54 +3568,52 @@ var jsPanel = { } } } - } // opts.drop - + } + // opts.drop if (opts.drop && opts.drop.dropZones) { // IE doesn't offer document.elementsFromPoint() but document.msElementsFromPoint() var elementsFromPoint = jsPanel.isIE ? 'msElementsFromPoint' : 'elementsFromPoint'; - var elementsFrom = document[elementsFromPoint](e.clientX, e.clientY); // document.msElementsFromPoint() returns a nodeList -> convert to array - + var elementsFrom = document[elementsFromPoint](e.clientX, e.clientY); + // document.msElementsFromPoint() returns a nodeList -> convert to array if (!Array.isArray(elementsFrom)) { elementsFrom = Array.prototype.slice.call(elementsFrom); } - opts.drop.dropZones.forEach(function (zone) { // Array.prototype.includes() needs polyfill in IE if (elementsFrom.includes(zone)) { self.droppableTo = zone; } - }); // do not include following if statement in this.options.dragit.drop.dropZones.forEach !!!! - + }); + // do not include following if statement in this.options.dragit.drop.dropZones.forEach !!!! if (!elementsFrom.includes(self.droppableTo)) { self.droppableTo = false; } } }; - jsPanel.pointermove.forEach(function (e) { return document.addEventListener(e, dragElmt); - }); // remove drag handler when mouse leaves browser window (mouseleave doesn't work) + }); + // remove drag handler when mouse leaves browser window (mouseleave doesn't work) window.addEventListener('mouseout', windowListener, false); }); }); jsPanel.pointerup.forEach(function (event) { document.addEventListener(event, pointerUpHandlerDragit); window.removeEventListener('mouseout', windowListener); - }); // dragit is initialized - now disable if set + }); + // dragit is initialized - now disable if set if (options.disable) { handle.style.pointerEvents = 'none'; } }); return self; }; - self.dragit = function (string) { var dragitOptions = Object.assign({}, jsPanel.defaults.dragit, options.dragit), - handles = self.querySelectorAll(dragitOptions.handles); - + handles = self.querySelectorAll(dragitOptions.handles); if (string === 'disable') { handles.forEach(function (handle) { return handle.style.pointerEvents = 'none'; @@ -3984,42 +3623,39 @@ var jsPanel = { return handle.style.pointerEvents = 'auto'; }); } - return self; }; - self.sizeit = function () { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var jspanelresizestart = new CustomEvent('jspanelresizestart', { - detail: self.id - }), - jspanelresize = new CustomEvent('jspanelresize', { - detail: self.id - }), - jspanelresizestop = new CustomEvent('jspanelresizestop', { - detail: self.id - }); // make panel available as event object property 'panel' - + detail: self.id + }), + jspanelresize = new CustomEvent('jspanelresize', { + detail: self.id + }), + jspanelresizestop = new CustomEvent('jspanelresizestop', { + detail: self.id + }); + // make panel available as event object property 'panel' [jspanelresizestart, jspanelresize, jspanelresizestop].forEach(function (evt) { return evt.panel = self; }); var opts = {}, - resizePanel, - resizestarted, - w, - h, - startWidth, - startHeight; + resizePanel, + resizestarted, + w, + h, + startWidth, + startHeight; opts.handles = options.handles || jsPanel.defaults.resizeit.handles; opts.handles.split(',').forEach(function (item) { var node = document.createElement('DIV'); - node.className = "jsPanel-resizeit-handle jsPanel-resizeit-".concat(item.trim()); //node.style.zIndex = 90; - + node.className = "jsPanel-resizeit-handle jsPanel-resizeit-".concat(item.trim()); + //node.style.zIndex = 90; self.append(node); - }); // cache option aspectRatio of original resizeit configuration (is restored on pointerup) - + }); + // cache option aspectRatio of original resizeit configuration (is restored on pointerup) var cachedOptionAspectRatio = options.aspectRatio ? options.aspectRatio : false; - function windowListener(e) { if (e.relatedTarget === null) { jsPanel.pointermove.forEach(function (evt) { @@ -4027,52 +3663,44 @@ var jsPanel = { }); } } - function pointerUpHandlerResizeit(e) { jsPanel.pointermove.forEach(function (evt) { return document.removeEventListener(evt, resizePanel, false); }); - if (e.target.classList && e.target.classList.contains('jsPanel-resizeit-handle')) { var isLeftChange, - isTopChange, - cl = e.target.className; - + isTopChange, + cl = e.target.className; if (cl.match(/jsPanel-resizeit-nw|jsPanel-resizeit-w|jsPanel-resizeit-sw/i)) { isLeftChange = true; } - if (cl.match(/jsPanel-resizeit-nw|jsPanel-resizeit-n|jsPanel-resizeit-ne/i)) { isTopChange = true; - } // snap panel to grid (doesn't work that well if inside function resizePanel) - + } + // snap panel to grid (doesn't work that well if inside function resizePanel) if (opts.grid && Array.isArray(opts.grid)) { if (opts.grid.length === 1) { opts.grid[1] = opts.grid[0]; } - var cw = parseFloat(self.style.width), - ch = parseFloat(self.style.height), - modW = cw % opts.grid[0], - modH = ch % opts.grid[1], - cx = parseFloat(self.style.left), - cy = parseFloat(self.style.top), - modX = cx % opts.grid[0], - modY = cy % opts.grid[1]; - + ch = parseFloat(self.style.height), + modW = cw % opts.grid[0], + modH = ch % opts.grid[1], + cx = parseFloat(self.style.left), + cy = parseFloat(self.style.top), + modX = cx % opts.grid[0], + modY = cy % opts.grid[1]; if (modW < opts.grid[0] / 2) { self.style.width = cw - modW + 'px'; } else { self.style.width = cw + (opts.grid[0] - modW) + 'px'; } - if (modH < opts.grid[1] / 2) { self.style.height = ch - modH + 'px'; } else { self.style.height = ch + (opts.grid[1] - modH) + 'px'; } - if (isLeftChange) { if (modX < opts.grid[0] / 2) { self.style.left = cx - modX + 'px'; @@ -4080,7 +3708,6 @@ var jsPanel = { self.style.left = cx + (opts.grid[0] - modX) + 'px'; } } - if (isTopChange) { if (modY < opts.grid[1] / 2) { self.style.top = cy - modY + 'px'; @@ -4090,7 +3717,6 @@ var jsPanel = { } } } - if (resizestarted) { self.content.style.pointerEvents = 'inherit'; resizestarted = undefined; @@ -4099,65 +3725,55 @@ var jsPanel = { self.calcSizeFactors(); var smallifyBtn = self.controlbar.querySelector('.jsPanel-btn-smallify'); var elmtRect = self.getBoundingClientRect(); - if (smallifyBtn && elmtRect.height > startHeight + 5) { smallifyBtn.style.transform = 'rotate(0deg)'; } - document.dispatchEvent(jspanelresizestop); - if (opts.stop.length) { var stopStyles = window.getComputedStyle(self), - paneldata = { - left: parseFloat(stopStyles.left), - top: parseFloat(stopStyles.top), - width: parseFloat(stopStyles.width), - height: parseFloat(stopStyles.height) - }; + paneldata = { + left: parseFloat(stopStyles.left), + top: parseFloat(stopStyles.top), + width: parseFloat(stopStyles.width), + height: parseFloat(stopStyles.height) + }; jsPanel.processCallbacks(self, opts.stop, false, paneldata, e); } } - - self.content.style.pointerEvents = 'inherit'; // restore other panel's css pointer-events - + self.content.style.pointerEvents = 'inherit'; + // restore other panel's css pointer-events document.querySelectorAll('iframe').forEach(function (frame) { return frame.style.pointerEvents = 'auto'; - }); // restore option aspectRatio to original configuration - + }); + // restore option aspectRatio to original configuration opts.aspectRatio = cachedOptionAspectRatio; document.removeEventListener(e, pointerUpHandlerResizeit); } - self.querySelectorAll('.jsPanel-resizeit-handle').forEach(function (handle) { handle.style.touchAction = 'none'; jsPanel.pointerdown.forEach(function (event) { handle.addEventListener(event, function (e) { // prevent window scroll while resizing elmt e.preventDefault(); - e.stopPropagation(); // disable resizing for all mouse buttons but left - + e.stopPropagation(); + // disable resizing for all mouse buttons but left if (e.button && e.button > 0) { return false; - } // factor is needed only for the modifier key Shift feature - - - var factor = 1; // setup and normalize resizeit options - + } + // factor is needed only for the modifier key Shift feature + var factor = 1; + // setup and normalize resizeit options opts = Object.assign({}, jsPanel.defaults.resizeit, options); - if (opts.containment || opts.containment === 0) { opts.containment = jsPanel.pOcontainment(opts.containment); - } // legacy line: aspectRatio should be either 'panel' or 'content', not just true - - + } + // legacy line: aspectRatio should be either 'panel' or 'content', not just true if (opts.aspectRatio && opts.aspectRatio === true) { opts.aspectRatio = 'panel'; - } // set aspectRatio according to modifier key - - + } + // set aspectRatio according to modifier key if (jsPanel.modifier) { var modifier = jsPanel.modifier; - if (modifier.altKey) { opts.aspectRatio = 'content'; } else if (modifier.ctrlKey) { @@ -4166,54 +3782,53 @@ var jsPanel = { opts.aspectRatio = false; factor = 2; // does work only with 2 as value } - } // noinspection JSUnresolvedFunction - + } + // noinspection JSUnresolvedFunction var maxWidth = typeof opts.maxWidth === 'function' ? opts.maxWidth() : opts.maxWidth || 10000, - maxHeight = typeof opts.maxHeight === 'function' ? opts.maxHeight() : opts.maxHeight || 10000, - minWidth = typeof opts.minWidth === 'function' ? opts.minWidth() : opts.minWidth, - minHeight = typeof opts.minHeight === 'function' ? opts.minHeight() : opts.minHeight; - self.content.style.pointerEvents = 'none'; // prevents iframes in other panel from interfering with resize action of dragged panel - + maxHeight = typeof opts.maxHeight === 'function' ? opts.maxHeight() : opts.maxHeight || 10000, + minWidth = typeof opts.minWidth === 'function' ? opts.minWidth() : opts.minWidth, + minHeight = typeof opts.minHeight === 'function' ? opts.minHeight() : opts.minHeight; + self.content.style.pointerEvents = 'none'; + // prevents iframes in other panel from interfering with resize action of dragged panel document.querySelectorAll('iframe').forEach(function (frame) { return frame.style.pointerEvents = 'none'; - }); // noinspection JSUnresolvedVariable + }); + // noinspection JSUnresolvedVariable var elmtParent = self.parentElement, - elmtParentTagName = elmtParent.tagName.toLowerCase(), - elmtRect = self.getBoundingClientRect(), - elmtParentRect = elmtParent.getBoundingClientRect(), - elmtParentStyles = window.getComputedStyle(elmtParent, null), - elmtParentBLW = parseInt(elmtParentStyles.borderLeftWidth, 10), - elmtParentBTW = parseInt(elmtParentStyles.borderTopWidth, 10), - elmtParentPosition = elmtParentStyles.getPropertyValue('position'), - startX = e.clientX || e.clientX === 0 || e.touches[0].clientX, - startY = e.clientY || e.clientY === 0 || e.touches[0].clientY, - startRatio = startX / startY, - resizeHandleClassList = e.target.classList, - scaleFactor = self.getScaleFactor(), - aspectRatio = elmtRect.width / elmtRect.height, - elmtContentRect = self.content.getBoundingClientRect(), - aspectRatioContent = elmtContentRect.width / elmtContentRect.height, - hdrHeight = self.header.getBoundingClientRect().height, - // needed in aspectRatio - ftrHeight = self.footer.getBoundingClientRect().height || 0; // needed in aspectRatio - + elmtParentTagName = elmtParent.tagName.toLowerCase(), + elmtRect = self.getBoundingClientRect(), + elmtParentRect = elmtParent.getBoundingClientRect(), + elmtParentStyles = window.getComputedStyle(elmtParent, null), + elmtParentBLW = parseInt(elmtParentStyles.borderLeftWidth, 10), + elmtParentBTW = parseInt(elmtParentStyles.borderTopWidth, 10), + elmtParentPosition = elmtParentStyles.getPropertyValue('position'), + startX = e.clientX || e.clientX === 0 || e.touches[0].clientX, + startY = e.clientY || e.clientY === 0 || e.touches[0].clientY, + startRatio = startX / startY, + resizeHandleClassList = e.target.classList, + scaleFactor = self.getScaleFactor(), + aspectRatio = elmtRect.width / elmtRect.height, + elmtContentRect = self.content.getBoundingClientRect(), + aspectRatioContent = elmtContentRect.width / elmtContentRect.height, + hdrHeight = self.header.getBoundingClientRect().height, + // needed in aspectRatio + ftrHeight = self.footer.getBoundingClientRect().height || 0; // needed in aspectRatio var startLeft = elmtRect.left, - startTop = elmtRect.top, - maxWidthEast = 10000, - maxWidthWest = 10000, - maxHeightSouth = 10000, - maxHeightNorth = 10000; + startTop = elmtRect.top, + maxWidthEast = 10000, + maxWidthWest = 10000, + maxHeightSouth = 10000, + maxHeightNorth = 10000; startWidth = elmtRect.width; startHeight = elmtRect.height; - if (elmtParentTagName !== 'body') { startLeft = elmtRect.left - elmtParentRect.left + elmtParent.scrollLeft; startTop = elmtRect.top - elmtParentRect.top + elmtParent.scrollTop; - } // calc min/max left/top values if containment is set - code from jsDraggable - + } + // calc min/max left/top values if containment is set - code from jsDraggable if (elmtParentTagName === 'body' && opts.containment) { maxWidthEast = document.documentElement.clientWidth - elmtRect.left; maxHeightSouth = document.documentElement.clientHeight - elmtRect.top; @@ -4234,40 +3849,35 @@ var jsPanel = { maxHeightNorth = self.clientHeight + (elmtRect.top - elmtParentRect.top) / scaleFactor.y - elmtParentBTW; } } - } // if original opts.containment is an array - - + } + // if original opts.containment is an array if (opts.containment) { maxWidthWest -= opts.containment[3]; maxHeightNorth -= opts.containment[0]; maxWidthEast -= opts.containment[1]; maxHeightSouth -= opts.containment[2]; - } // calculate corrections for rotated panels - + } + // calculate corrections for rotated panels var computedStyle = window.getComputedStyle(self), - wDif = parseFloat(computedStyle.width) - elmtRect.width, - hDif = parseFloat(computedStyle.height) - elmtRect.height; + wDif = parseFloat(computedStyle.width) - elmtRect.width, + hDif = parseFloat(computedStyle.height) - elmtRect.height; var xDif = parseFloat(computedStyle.left) - elmtRect.left, - yDif = parseFloat(computedStyle.top) - elmtRect.top; - + yDif = parseFloat(computedStyle.top) - elmtRect.top; if (elmtParent !== document.body) { xDif += elmtParentRect.left; yDif += elmtParentRect.top; - } // used in aspectRatio code - - + } + // used in aspectRatio code var borderTopWidth = parseInt(computedStyle.borderTopWidth, 10), - borderRightWidth = parseInt(computedStyle.borderRightWidth, 10), - borderBottomWidth = parseInt(computedStyle.borderBottomWidth, 10), - borderLeftWidth = parseInt(computedStyle.borderLeftWidth, 10); - + borderRightWidth = parseInt(computedStyle.borderRightWidth, 10), + borderBottomWidth = parseInt(computedStyle.borderBottomWidth, 10), + borderLeftWidth = parseInt(computedStyle.borderLeftWidth, 10); resizePanel = function resizePanel(evt) { - evt.preventDefault(); // trigger resizestarted only once per resize - + evt.preventDefault(); + // trigger resizestarted only once per resize if (!resizestarted) { document.dispatchEvent(jspanelresizestart); - if (opts.start.length) { jsPanel.processCallbacks(self, opts.start, false, { width: startWidth, @@ -4276,65 +3886,53 @@ var jsPanel = { top: startTop }, evt); } + self.front(); - self.front(); // if panel is maximized on resize start set status to normalized and swap maximize/normalize buttons - + // if panel is maximized on resize start set status to normalized and swap maximize/normalize buttons if (self.status === 'maximized') { self.status = 'normalized'; - if (self.controlbar.querySelector('.jsPanel-btn-maximize')) { self.setControlStatus('maximize', 'show'); } - if (self.controlbar.querySelector('.jsPanel-btn-normalize')) { self.setControlStatus('normalize', 'hide'); } } - if (elmtRect.height > startHeight + 5) { self.status = 'normalized'; self.setControls(['.jsPanel-btn-normalize']); } } + resizestarted = 1; + // trigger resize permanently while resizing + document.dispatchEvent(jspanelresize); - resizestarted = 1; // trigger resize permanently while resizing - - document.dispatchEvent(jspanelresize); // possibly updated while resizing - + // possibly updated while resizing var eventX = evt.touches ? evt.touches[0].clientX : evt.clientX, - eventY = evt.touches ? evt.touches[0].clientY : evt.clientY, - overlaps; - + eventY = evt.touches ? evt.touches[0].clientY : evt.clientY, + overlaps; if (resizeHandleClassList.contains('jsPanel-resizeit-e')) { //w = startWidth + (eventX - startX) / scaleFactor.x + wDif; w = startWidth + (eventX - startX) * factor / scaleFactor.x + wDif; // needs left adjust, for width and height adjust factor may be either 1 (no adjust) or 2 - if (w >= maxWidthEast) { w = maxWidthEast; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (factor === 2) { // factor works only with value of 2 when adjusting left or top self.style.left = startLeft - (eventX - startX) + 'px'; } - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.height = (w - borderRightWidth - borderLeftWidth) / aspectRatioContent + hdrHeight + ftrHeight + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatioContent + 'px'; @@ -4343,10 +3941,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.height = w / aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatio + 'px'; @@ -4356,32 +3952,24 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-s')) { //h = startHeight + (eventY - startY) / scaleFactor.y + hDif; h = startHeight + (eventY - startY) * factor / scaleFactor.y + hDif; // needs top adjust - if (h >= maxHeightSouth) { h = maxHeightSouth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (factor === 2) { self.style.top = startTop - (eventY - startY) + 'px'; } - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.width = (h - hdrHeight - ftrHeight - borderTopWidth - borderBottomWidth) * aspectRatioContent + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatioContent + 'px'; @@ -4390,10 +3978,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.width = h * aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatio + 'px'; @@ -4403,32 +3989,24 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-w')) { //w = startWidth + (startX - eventX) / scaleFactor.x + wDif; w = startWidth + (startX - eventX) * factor / scaleFactor.x + wDif; // doesn't need left adjust - if (w <= maxWidth && w >= minWidth && w <= maxWidthWest) { self.style.left = startLeft + (eventX - startX) / scaleFactor.x + xDif + 'px'; } - if (w >= maxWidthWest) { w = maxWidthWest; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.height = (w - borderRightWidth - borderLeftWidth) / aspectRatioContent + hdrHeight + ftrHeight + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatioContent + 'px'; @@ -4437,10 +4015,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.height = w / aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatio + 'px'; @@ -4450,32 +4026,24 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-n')) { //h = startHeight + (startY - eventY) / scaleFactor.y + hDif; h = startHeight + (startY - eventY) * factor / scaleFactor.y + hDif; // doesn't need top adjust - if (h <= maxHeight && h >= minHeight && h <= maxHeightNorth) { self.style.top = startTop + (eventY - startY) / scaleFactor.y + yDif + 'px'; } - if (h >= maxHeightNorth) { h = maxHeightNorth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.width = (h - hdrHeight - ftrHeight - borderTopWidth - borderBottomWidth) * aspectRatioContent + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatioContent + 'px'; @@ -4484,10 +4052,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.width = h * aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatio + 'px'; @@ -4497,57 +4063,43 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-se')) { //w = startWidth + (eventX - startX) / scaleFactor.x + wDif; w = startWidth + (eventX - startX) * factor / scaleFactor.x + wDif; // needs left adjust - if (w >= maxWidthEast) { w = maxWidthEast; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (factor === 2) { self.style.left = startLeft - (eventX - startX) + 'px'; } - if (opts.aspectRatio) { self.style.height = w / aspectRatio + 'px'; - } //h = startHeight + (eventY - startY) / scaleFactor.y + hDif; - + } + //h = startHeight + (eventY - startY) / scaleFactor.y + hDif; h = startHeight + (eventY - startY) * factor / scaleFactor.y + hDif; // needs top adjust - if (h >= maxHeightSouth) { h = maxHeightSouth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (factor === 2) { self.style.top = startTop - (eventY - startY) + 'px'; } - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.width = (h - hdrHeight - ftrHeight - borderTopWidth - borderBottomWidth) * aspectRatioContent + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatioContent + 'px'; @@ -4556,10 +4108,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.width = h * aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatio + 'px'; @@ -4569,57 +4119,43 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-sw')) { //h = startHeight + (eventY - startY) / scaleFactor.y + hDif; h = startHeight + (eventY - startY) * factor / scaleFactor.y + hDif; // needs top adjust - if (h >= maxHeightSouth) { h = maxHeightSouth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (factor === 2) { self.style.top = startTop - (eventY - startY) + 'px'; } - if (opts.aspectRatio) { self.style.width = h * aspectRatio + 'px'; - } //w = startWidth + (startX - eventX) / scaleFactor.x + wDif; - + } + //w = startWidth + (startX - eventX) / scaleFactor.x + wDif; w = startWidth + (startX - eventX) * factor / scaleFactor.x + wDif; // doesn't need left adjust - if (w <= maxWidth && w >= minWidth && w <= maxWidthWest) { self.style.left = startLeft + (eventX - startX) / scaleFactor.x + xDif + 'px'; } - if (w >= maxWidthWest) { w = maxWidthWest; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.height = (w - borderRightWidth - borderLeftWidth) / aspectRatioContent + hdrHeight + ftrHeight + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatioContent + 'px'; @@ -4628,10 +4164,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.height = w / aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.bottom <= opts.containment[2]) { self.style.height = maxHeightSouth + 'px'; self.style.width = maxHeightSouth * aspectRatio + 'px'; @@ -4641,56 +4175,41 @@ var jsPanel = { } else if (resizeHandleClassList.contains('jsPanel-resizeit-ne')) { //w = startWidth + (eventX - startX) / scaleFactor.x + wDif; w = startWidth + (eventX - startX) * factor / scaleFactor.x + wDif; // needs left adjust - if (w >= maxWidthEast) { w = maxWidthEast; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (factor === 2) { self.style.left = startLeft - (eventX - startX) + 'px'; } - if (opts.aspectRatio) { self.style.height = w / aspectRatio + 'px'; } - h = startHeight + (startY - eventY) * factor / scaleFactor.y + hDif; // doesn't need top adjust - if (h <= maxHeight && h >= minHeight && h <= maxHeightNorth) { self.style.top = startTop + (eventY - startY) / scaleFactor.y + yDif + 'px'; } - if (h >= maxHeightNorth) { h = maxHeightNorth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.width = (h - hdrHeight - ftrHeight - borderTopWidth - borderBottomWidth) * aspectRatioContent + borderTopWidth + borderBottomWidth + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatioContent + 'px'; @@ -4699,10 +4218,8 @@ var jsPanel = { } else if (opts.aspectRatio === 'panel') { // otherwise the complete panel maintains its aspect ratio self.style.width = h * aspectRatio + 'px'; - if (opts.containment) { overlaps = self.overlaps(elmtParent); - if (overlaps.right <= opts.containment[1]) { self.style.width = maxWidthEast + 'px'; self.style.height = maxWidthEast / aspectRatio + 'px'; @@ -4713,53 +4230,39 @@ var jsPanel = { if (opts.aspectRatio && resizeHandleClassList.contains('jsPanel-resizeit-nw')) { eventX = eventY * startRatio; eventY = eventX / startRatio; - } //w = startWidth + (startX - eventX) / scaleFactor.x + wDif; - - + } + //w = startWidth + (startX - eventX) / scaleFactor.x + wDif; w = startWidth + (startX - eventX) * factor / scaleFactor.x + wDif; // doesn't need left adjust - if (w <= maxWidth && w >= minWidth && w <= maxWidthWest) { self.style.left = startLeft + (eventX - startX) / scaleFactor.x + xDif + 'px'; } - if (w >= maxWidthWest) { w = maxWidthWest; } - if (w >= maxWidth) { w = maxWidth; } - if (w <= minWidth) { w = minWidth; } - self.style.width = w + 'px'; - if (opts.aspectRatio) { self.style.height = w / aspectRatio + 'px'; } - h = startHeight + (startY - eventY) * factor / scaleFactor.y + hDif; // doesn't need top adjust - if (h <= maxHeight && h >= minHeight && h <= maxHeightNorth) { self.style.top = startTop + (eventY - startY) / scaleFactor.y + yDif + 'px'; } - if (h >= maxHeightNorth) { h = maxHeightNorth; } - if (h >= maxHeight) { h = maxHeight; } - if (h <= minHeight) { h = minHeight; } - self.style.height = h + 'px'; - if (opts.aspectRatio === 'content') { // if aspectRatio is true and set to 'content' the panels content section maintains its aspect ratio self.style.width = (h - hdrHeight - ftrHeight - borderTopWidth - borderBottomWidth) * aspectRatioContent + borderTopWidth + borderBottomWidth + 'px'; @@ -4768,46 +4271,46 @@ var jsPanel = { self.style.width = h * aspectRatio + 'px'; } } + window.getSelection().removeAllRanges(); - window.getSelection().removeAllRanges(); // get current position and size values while resizing - + // get current position and size values while resizing var styles = window.getComputedStyle(self), - values = { - left: parseFloat(styles.left), - top: parseFloat(styles.top), - right: parseFloat(styles.right), - bottom: parseFloat(styles.bottom), - width: parseFloat(styles.width), - height: parseFloat(styles.height) - }; // callback while resizing + values = { + left: parseFloat(styles.left), + top: parseFloat(styles.top), + right: parseFloat(styles.right), + bottom: parseFloat(styles.bottom), + width: parseFloat(styles.width), + height: parseFloat(styles.height) + }; + // callback while resizing if (opts.resize.length) { jsPanel.processCallbacks(self, opts.resize, false, values, evt); } }; - jsPanel.pointermove.forEach(function (event) { return document.addEventListener(event, resizePanel, false); - }); // remove resize handler when mouse leaves browser window (mouseleave doesn't work) + }); + // remove resize handler when mouse leaves browser window (mouseleave doesn't work) window.addEventListener('mouseout', windowListener, false); }); }); jsPanel.pointerup.forEach(function (event) { document.addEventListener(event, pointerUpHandlerResizeit); window.removeEventListener('mouseout', windowListener); - }); // resizeit is initialized - now disable if set + }); + // resizeit is initialized - now disable if set if (options.disable) { handle.style.pointerEvents = 'none'; } }); return self; }; - self.resizeit = function (string) { var handles = self.querySelectorAll('.jsPanel-resizeit-handle'); - if (string === 'disable') { handles.forEach(function (handle) { return handle.style.pointerEvents = 'none'; @@ -4817,10 +4320,8 @@ var jsPanel = { return handle.style.pointerEvents = 'auto'; }); } - return self; }; - self.getScaleFactor = function () { var rect = self.getBoundingClientRect(); return { @@ -4828,10 +4329,8 @@ var jsPanel = { y: rect.height / self.offsetHeight }; }; - self.calcSizeFactors = function () { var styles = window.getComputedStyle(self); - if (options.container === 'window') { self.hf = parseFloat(styles.left) / (window.innerWidth - parseFloat(styles.width)); self.vf = parseFloat(styles.top) / (window.innerHeight - parseFloat(styles.height)); @@ -4843,36 +4342,23 @@ var jsPanel = { } } }; - self.saveCurrentDimensions = function () { - var setStyleHeight = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; var normData = window.getComputedStyle(self); self.currentData.width = normData.width; - - if (self.status === 'normalized') { - self.currentData.height = normData.height; - } - - if (setStyleHeight) { - self.style.height = normData.height; - } + self.currentData.height = normData.height; }; - self.saveCurrentPosition = function () { var normData = window.getComputedStyle(self); self.currentData.left = normData.left; self.currentData.top = normData.top; }; - self.reposition = function () { var pos = options.position, - updateCache = true, - callback; - + updateCache = true, + callback; for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) { params[_key] = arguments[_key]; } - params.forEach(function (value) { if (typeof value === 'string' || _typeof(value) === 'object') { pos = value; @@ -4882,67 +4368,57 @@ var jsPanel = { callback = value; } }); - jsPanel.position(self, pos); // check whether self has docked panels -> reposition docked panels as well + jsPanel.position(self, pos); + // check whether self has docked panels -> reposition docked panels as well if (self.slaves && self.slaves.size > 0) { self.slaves.forEach(function (slave) { return slave.reposition(); }); } - if (updateCache) { self.saveCurrentPosition(); } - if (callback) { callback.call(self, self); } - return self; }; - self.repositionOnSnap = function (pos) { var offsetX = '0', - offsetY = '0', - margins = jsPanel.pOcontainment(options.dragit.containment); // calculate offsets - + offsetY = '0', + margins = jsPanel.pOcontainment(options.dragit.containment); + // calculate offsets if (options.dragit.snap.containment) { switch (pos) { case 'left-top': offsetX = margins[3]; offsetY = margins[0]; break; - case 'right-top': offsetX = -margins[1]; offsetY = margins[0]; break; - case 'right-bottom': offsetX = -margins[1]; offsetY = -margins[2]; break; - case 'left-bottom': offsetX = margins[3]; offsetY = -margins[2]; break; - case 'center-top': offsetX = margins[3] / 2 - margins[1] / 2; offsetY = margins[0]; break; - case 'center-bottom': offsetX = margins[3] / 2 - margins[1] / 2; offsetY = -margins[2]; break; - case 'left-center': offsetX = margins[3]; offsetY = margins[0] / 2 - margins[2] / 2; break; - case 'right-center': offsetX = -margins[1]; offsetY = margins[0] / 2 - margins[2] / 2; @@ -4953,38 +4429,33 @@ var jsPanel = { For some reason I could not find the line above does not work (pos and offsets in one string), but only when center-bottom is used with different settings for left/right margin. */ - - jsPanel.position(self, pos); jsPanel.setStyles(self, { left: "calc(".concat(self.style.left, " + ").concat(offsetX, "px)"), top: "calc(".concat(self.style.top, " + ").concat(offsetY, "px)") }); }; - self.overlaps = function (reference, elmtBox, event) { var panelRect = self.getBoundingClientRect(), - parentStyle = getComputedStyle(self.parentElement), - scaleFactor = self.getScaleFactor(), - parentBorderWidth = { - top: 0, - right: 0, - bottom: 0, - left: 0 - }, - referenceRect, - evtX = 0, - evtY = 0, - evtXparent = 0, - evtYparent = 0; - + parentStyle = getComputedStyle(self.parentElement), + scaleFactor = self.getScaleFactor(), + parentBorderWidth = { + top: 0, + right: 0, + bottom: 0, + left: 0 + }, + referenceRect, + evtX = 0, + evtY = 0, + evtXparent = 0, + evtYparent = 0; if (self.options.container !== 'window' && elmtBox === 'paddingbox') { parentBorderWidth.top = parseInt(parentStyle.borderTopWidth, 10) * scaleFactor.y; parentBorderWidth.right = parseInt(parentStyle.borderRightWidth, 10) * scaleFactor.x; parentBorderWidth.bottom = parseInt(parentStyle.borderBottomWidth, 10) * scaleFactor.y; parentBorderWidth.left = parseInt(parentStyle.borderLeftWidth, 10) * scaleFactor.x; } - if (typeof reference === 'string') { if (reference === 'window') { referenceRect = { @@ -5001,17 +4472,15 @@ var jsPanel = { } else { referenceRect = reference.getBoundingClientRect(); } - if (event) { evtX = event.touches ? event.touches[0].clientX : event.clientX; evtY = event.touches ? event.touches[0].clientY : event.clientY; evtXparent = evtX - referenceRect.left; evtYparent = evtY - referenceRect.top; } - var overlapsX = panelRect.left < referenceRect.right && panelRect.right > referenceRect.left, - overlapsY = panelRect.top < referenceRect.bottom && panelRect.bottom > referenceRect.top, - overlaps = overlapsX && overlapsY; + overlapsY = panelRect.top < referenceRect.bottom && panelRect.bottom > referenceRect.top, + overlaps = overlapsX && overlapsY; return { overlaps: overlaps, top: panelRect.top - referenceRect.top - parentBorderWidth.top, @@ -5032,7 +4501,6 @@ var jsPanel = { } }; }; - self.setSize = function () { if (options.panelSize) { var values = jsPanel.pOsize(self, options.panelSize); @@ -5040,30 +4508,24 @@ var jsPanel = { self.style.height = values.height; } else if (options.contentSize) { var _values = jsPanel.pOsize(self, options.contentSize); - self.content.style.width = _values.width; self.content.style.height = _values.height; self.style.width = _values.width; // explicitly assign current width/height to panel - self.content.style.width = '100%'; } - return self; }; - self.resize = function () { var dimensions = window.getComputedStyle(self), - size = { - width: dimensions.width, - height: dimensions.height - }, - updateCache = true, - callback; - + size = { + width: dimensions.width, + height: dimensions.height + }, + updateCache = true, + callback; for (var _len2 = arguments.length, params = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { params[_key2] = arguments[_key2]; } - params.forEach(function (value) { if (typeof value === 'string') { size = value; @@ -5077,48 +4539,41 @@ var jsPanel = { }); var values = jsPanel.pOsize(self, size); self.style.width = values.width; - self.style.height = values.height; // check whether self has docked panels -> reposition docked panels + self.style.height = values.height; + // check whether self has docked panels -> reposition docked panels if (self.slaves && self.slaves.size > 0) { self.slaves.forEach(function (slave) { return slave.reposition(); }); } - if (updateCache) { self.saveCurrentDimensions(); } - self.status = 'normalized'; var smallifyBtn = self.controlbar.querySelector('.jsPanel-btn-smallify'); - if (smallifyBtn) { smallifyBtn.style.transform = 'rotate(0deg)'; } - if (callback) { callback.call(self, self); } - self.calcSizeFactors(); return self; }; - self.windowResizeHandler = function (e) { if (e.target === window) { // see https://bugs.jqueryui.com/ticket/7514 var status = self.status, - onWindowResize = options.onwindowresize, - left, - top; - + onWindowResize = options.onwindowresize, + left, + top; if (status === 'maximized' && onWindowResize) { self.maximize(false, true); } else if (self.snapped && status !== 'minimized') { self.snap(self.snapped, true); } else if (status === 'normalized' || status === 'smallified' || status === 'maximized') { var settingType = _typeof(onWindowResize); - if (settingType === 'boolean') { left = (window.innerWidth - self.offsetWidth) * self.hf; self.style.left = left <= 0 ? 0 : left + 'px'; @@ -5140,9 +4595,8 @@ var jsPanel = { } } else if (status === 'smallifiedmax' && onWindowResize) { self.maximize(false, true).smallify(); - } // check whether self has docked panels -> reposition docked panels as well - - + } + // check whether self has docked panels -> reposition docked panels as well if (self.slaves && self.slaves.size > 0) { self.slaves.forEach(function (slave) { return slave.reposition(); @@ -5150,36 +4604,29 @@ var jsPanel = { } } }; - self.setControls = function (sel, cb) { self.header.querySelectorAll('.jsPanel-btn').forEach(function (item) { var btnClass = item.className.split('-'), - btn = btnClass[btnClass.length - 1]; - + btn = btnClass[btnClass.length - 1]; if (self.getAttribute("data-btn".concat(btn)) !== 'hidden') { item.style.display = 'block'; } }); sel.forEach(function (item) { var btn = self.controlbar.querySelector(item); - if (btn) { btn.style.display = 'none'; } }); - if (cb) { cb.call(self, self); } - return self; }; - self.setControlStatus = function (ctrl) { var action = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'enable'; var cb = arguments.length > 2 ? arguments[2] : undefined; var btn = self.controlbar.querySelector(".jsPanel-btn-".concat(ctrl)); - switch (action) { case 'disable': if (self.getAttribute("data-btn".concat(ctrl)) !== 'removed') { @@ -5188,17 +4635,13 @@ var jsPanel = { btn.style.opacity = 0.4; btn.style.cursor = 'default'; } - break; - case 'hide': if (self.getAttribute("data-btn".concat(ctrl)) !== 'removed') { self.setAttribute("data-btn".concat(ctrl), 'hidden'); btn.style.display = 'none'; } - break; - case 'show': if (self.getAttribute("data-btn".concat(ctrl)) !== 'removed') { self.setAttribute("data-btn".concat(ctrl), 'enabled'); @@ -5207,47 +4650,39 @@ var jsPanel = { btn.style.opacity = 1; btn.style.cursor = 'pointer'; } - break; - case 'enable': if (self.getAttribute("data-btn".concat(ctrl)) !== 'removed') { if (self.getAttribute("data-btn".concat(ctrl)) === 'hidden') { btn.style.display = 'block'; } - self.setAttribute("data-btn".concat(ctrl), 'enabled'); btn.style.pointerEvents = 'auto'; btn.style.opacity = 1; btn.style.cursor = 'pointer'; } - break; - case 'remove': self.controlbar.removeChild(btn); self.setAttribute("data-btn".concat(ctrl), 'removed'); break; } - if (cb) { cb.call(self, self); } - return self; }; - self.setControlSize = function (ctrlSize) { // does not work with Font Awesome webfont (only svg/js) var size = ctrlSize.toLowerCase(), - icons = self.controlbar.querySelectorAll('.jsPanel-btn'); + icons = self.controlbar.querySelectorAll('.jsPanel-btn'); icons.forEach(function (icon) { ['jsPanel-btn-xl', 'jsPanel-btn-lg', 'jsPanel-btn-md', 'jsPanel-btn-sm', 'jsPanel-btn-xs'].forEach(function (item) { return icon.classList.remove(item); }); icon.classList.add("jsPanel-btn-".concat(size)); - }); // adjust font-size of title - + }); + // adjust font-size of title if (size === 'xl') { self.titlebar.style.fontSize = '1.5rem'; } else if (size === 'lg') { @@ -5260,57 +4695,48 @@ var jsPanel = { self.titlebar.style.fontSize = '.8rem'; } }; - self.setHeaderControls = function (cb) { // add custom controls if (self.options.headerControls.add) { var customControls = self.options.headerControls.add; - if (!Array.isArray(customControls)) { // if options.addControls is not an array make it one customControls = [customControls]; } - customControls.forEach(function (ctrl) { return self.addControl(ctrl); }); - } // get all control names including controls added with option.addControls - - + } + // get all control names including controls added with option.addControls var controls = [], - ctrls = self.controlbar.querySelectorAll('.jsPanel-btn'); + ctrls = self.controlbar.querySelectorAll('.jsPanel-btn'); ctrls.forEach(function (ctrl) { - var match = ctrl.className.match(/jsPanel-btn-[a-z0-9]{3,}/i), - ctrlName = match[0].substring(12); + var match = ctrl.className.match(/jsPanel-btn-[a-z\d]{3,}/i), + ctrlName = match[0].substring(12); controls.push(ctrlName); - }); // normalize option headerControls and reset it accordingly - + }); + // normalize option headerControls and reset it accordingly var option = jsPanel.pOheaderControls(options.headerControls); - options.headerControls = option; // set status of controls - + options.headerControls = option; + // set status of controls controls.forEach(function (item) { if (option[item]) { self.setControlStatus(item, option[item]); } - }); // set size of controls - + }); + // set size of controls self.setControlSize(option.size); - if (cb) { cb.call(self, self); } - return self; }; - self.setHeaderLogo = function (logo, cb) { var logos = [self.headerlogo], - minPanel = document.querySelector('#' + self.id + '-min'); - + minPanel = document.querySelector('#' + self.id + '-min'); if (minPanel) { logos.push(minPanel.querySelector('.jsPanel-headerlogo')); } - if (typeof logo === 'string') { if (!logo.startsWith('<')) { // is assumed to be an img url @@ -5331,44 +4757,35 @@ var jsPanel = { jsPanel.emptyNode(item); item.append(logo); }); - } // images must not be draggable, otherwise dragit interactions locks - - + } + // images must not be draggable, otherwise dragit interactions locks self.headerlogo.childNodes.forEach(function (logo) { if (logo.nodeName && logo.nodeName === 'IMG') { logo.setAttribute('draggable', 'false'); } }); - if (cb) { cb.call(self, self); } - return self; }; - self.setHeaderRemove = function (cb) { self.removeChild(self.header); self.content.classList.add('jsPanel-content-noheader'); ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach(function (item) { return self.setAttribute("data-btn".concat(item), 'removed'); }); - if (cb) { cb.call(self, self); } - return self; }; - self.setHeaderTitle = function (hdrTitle, cb) { var titles = [self.headertitle], - minPanel = document.querySelector('#' + self.id + '-min'); - + minPanel = document.querySelector('#' + self.id + '-min'); if (minPanel) { titles.push(minPanel.querySelector('.jsPanel-title')); } - if (typeof hdrTitle === 'string') { titles.forEach(function (item) { return item.innerHTML = hdrTitle; @@ -5385,21 +4802,16 @@ var jsPanel = { item.append(hdrTitle); }); } - if (cb) { cb.call(self, self); } - return self; }; - self.setIconfont = function (font) { var panel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : self; var cb = arguments.length > 2 ? arguments[2] : undefined; - if (font) { var classArray, textArray; - if (font === 'fa' || font === 'far' || font === 'fal' || font === 'fas' || font === 'fad') { classArray = ["".concat(font, " fa-window-close"), "".concat(font, " fa-window-maximize"), "".concat(font, " fa-window-restore"), "".concat(font, " fa-window-minimize"), "".concat(font, " fa-chevron-up")]; } else if (font === 'material-icons') { @@ -5412,33 +4824,27 @@ var jsPanel = { } else { return panel; } - panel.querySelectorAll('.jsPanel-controlbar .jsPanel-btn').forEach(function (item) { return jsPanel.emptyNode(item).innerHTML = ''; }); Array.prototype.slice.call(panel.querySelectorAll('.jsPanel-controlbar .jsPanel-btn > span')).reverse().forEach(function (item, i) { item.className = classArray[i]; - if (font === 'material-icons') { item.textContent = textArray[i]; } }); } - if (cb) { cb.call(panel, panel); } - return panel; }; - self.addToolbar = function (place, tb, cb) { if (place === 'header') { place = self.headertoolbar; } else if (place === 'footer') { place = self.footer; } - if (typeof tb === 'string') { place.innerHTML = tb; } else if (Array.isArray(tb)) { @@ -5451,7 +4857,6 @@ var jsPanel = { }); } else if (typeof tb === 'function') { var tool = tb.call(self, self); - if (typeof tool === 'string') { place.innerHTML = tool; } else { @@ -5460,40 +4865,33 @@ var jsPanel = { } else { place.append(tb); } - place.classList.add('active'); - if (cb) { cb.call(self, self); } - return self; }; - self.addCloseControl = function () { var ctrl = document.createElement('button'), - colorContent = self.content.style.color; + colorContent = self.content.style.color; ctrl.classList.add('jsPanel-addCloseCtrl'); ctrl.innerHTML = jsPanel.icons.close; ctrl.style.color = colorContent; - if (self.options.rtl) { ctrl.classList.add('rtl'); } - self.appendChild(ctrl); jsPanel.pointerup.forEach(function (evt) { ctrl.addEventListener(evt, function (e) { - e.preventDefault(); // disable close for all mouse buttons but left - + e.preventDefault(); + // disable close for all mouse buttons but left if (e.button && e.button > 0) { return false; } - self.close(null, true); }); - }); // pointerdown handler needed to prevent side effect with resize handles - + }); + // pointerdown handler needed to prevent side effect with resize handles jsPanel.pointerdown.forEach(function (evt) { ctrl.addEventListener(evt, function (e) { return e.preventDefault(); @@ -5501,7 +4899,6 @@ var jsPanel = { }); return self; }; - self.addControl = function (obj) { // obj.name - string, the name of the control, results for example in "jsPanel-btn jsPanel-btn-menu" // obj.html - string, the html of the control to add, for example "" @@ -5510,127 +4907,109 @@ var jsPanel = { if (!obj.html) { return self; } - if (!obj.position) { obj.position = 1; } - var count = self.controlbar.querySelectorAll('.jsPanel-btn').length; var control = document.createElement('button'); control.innerHTML = obj.html; control.className = "jsPanel-btn jsPanel-btn-".concat(obj.name, " jsPanel-btn-").concat(options.headerControls.size); control.style.color = self.header.style.color; - if (obj.position > count) { // new control is the first from right (default ltr text-direction) or the first from left (if option rtl is used) self.controlbar.append(control); } else { self.controlbar.insertBefore(control, self.querySelector(".jsPanel-controlbar .jsPanel-btn:nth-child(".concat(obj.position, ")"))); } - var ariaLabel = obj.ariaLabel || obj.name; - if (ariaLabel) { control.setAttribute('aria-label', ariaLabel); } - jsPanel.pointerup.forEach(function (evt) { control.addEventListener(evt, function (e) { e.preventDefault(); - if (e.button && e.button > 0) { return false; } - obj.handler.call(self, self, control); }); }); - if (obj.afterInsert) { obj.afterInsert.call(control, control); } - return self; }; - self.setRtl = function () { [self.header, self.content, self.footer].forEach(function (item) { item.dir = 'rtl'; - if (options.rtl.lang) { item.lang = options.rtl.lang; } }); - }; // option.id - - - self.id = options.id; // option.paneltype classname + }; - self.classList.add('jsPanel-' + options.paneltype); // set z-index and paneltype class + // option.id + self.id = options.id; + // option.paneltype classname + self.classList.add('jsPanel-' + options.paneltype); + // set z-index and paneltype class if (options.paneltype === 'standard') { self.style.zIndex = this.zi.next(); - } // option.container - + } + // option.container panelContainer.append(self); self.front(false, false); // just to ensure iframe code in self.front() works for very first panel as well, second false prevents onfronted callbacks to be executed // option.theme + self.setTheme(options.theme); - self.setTheme(options.theme); // option.boxShadow - + // option.boxShadow if (options.boxShadow) { self.classList.add("jsPanel-depth-".concat(options.boxShadow)); } - /* option.header, option.iconfont, option.headerControls, option.headerLogo, option.headerTitle */ - + /* option.header, option.iconfont, option.headerControls, option.headerLogo, option.headerTitle */ if (options.header) { if (options.headerLogo) { self.setHeaderLogo(options.headerLogo); } - self.setIconfont(options.iconfont); self.setHeaderTitle(options.headerTitle); self.setHeaderControls(); // now handles controls added with option addControls as well - // compatibility code for IE11 due to flex bug - https://caniuse.com/#feat=flexbox + // compatibility code for IE11 due to flex bug - https://caniuse.com/#feat=flexbox if (jsPanel.isIE) { var bars = [self.headerbar, self.controlbar]; - switch (self.options.headerControls.size) { case 'md': bars.forEach(function (bar) { bar.style.height = '34px'; }); break; - case 'xs': bars.forEach(function (bar) { bar.style.height = '26px'; }); break; - case 'sm': bars.forEach(function (bar) { bar.style.height = '30px'; }); break; - case 'lg': bars.forEach(function (bar) { bar.style.height = '38px'; }); break; - case 'xl': bars.forEach(function (bar) { bar.style.height = '42px'; }); break; } - } // end - - - - - - - - - - + } + // end - - - - - - - - - if (options.header === 'auto-show-hide') { var boxShadow = 'jsPanel-depth-' + options.boxShadow; @@ -5651,39 +5030,35 @@ var jsPanel = { } } else { self.setHeaderRemove(); - if (options.addCloseControl) { self.addCloseControl(); } - } // option.headerToolbar - + } + // option.headerToolbar if (options.headerToolbar) { self.addToolbar(self.headertoolbar, options.headerToolbar); - } // option.footerToolbar - - + } + // option.footerToolbar if (options.footerToolbar) { self.addToolbar(self.footer, options.footerToolbar); - } // option.border - + } + // option.border if (options.border) { self.setBorder(options.border); - } // option.borderRadius - - + } + // option.borderRadius if (options.borderRadius) { self.setBorderRadius(options.borderRadius); - } // option.css - add custom css classes to the panel html - + } + // option.css - add custom css classes to the panel html if (options.css) { for (var _i2 = 0, _Object$entries2 = Object.entries(options.css); _i2 < _Object$entries2.length; _i2++) { var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2), - selector = _Object$entries2$_i[0], - classname = _Object$entries2$_i[1]; - + selector = _Object$entries2$_i[0], + classname = _Object$entries2$_i[1]; // option is a string used to build the desired class selector like `.jsPanel-${option}` except for the outermost DIV where option must be simply 'panel' // value is a string with either a single class name or a space separated list of class names like 'classA classB classC' if (selector === 'panel') { @@ -5692,15 +5067,14 @@ var jsPanel = { } else { // handles all other elements within the panel template var elmt = self.querySelector(".jsPanel-".concat(selector)); - if (elmt) { elmt.className += " ".concat(classname); // don't remove space at the beginning of template string } } } - } // option.content - + } + // option.content if (options.content) { if (typeof options.content === 'function') { options.content.call(self, self); @@ -5709,31 +5083,30 @@ var jsPanel = { } else { self.content.append(options.content); } - } // option.contentAjax - + } + // option.contentAjax if (options.contentAjax) { this.ajax(options.contentAjax, self); - } // option.contentFetch - + } + // option.contentFetch if (options.contentFetch) { this.fetch(options.contentFetch, self); - } // option.contentOverflow - + } + // option.contentOverflow if (options.contentOverflow) { var value = options.contentOverflow.split(' '); - if (value.length === 1) { self.content.style.overflow = value[0]; } else if (value.length === 2) { self.content.style.overflowX = value[0]; self.content.style.overflowY = value[1]; } - } // option.autoclose -- should be before option.size - + } + // option.autoclose -- should be before option.size if (options.autoclose) { if (typeof options.autoclose === 'number') { options.autoclose = { @@ -5744,27 +5117,20 @@ var jsPanel = { time: options.autoclose }; } - var autoclose = Object.assign({}, jsPanel.defaultAutocloseConfig, options.autoclose); - if (autoclose.time && typeof autoclose.time === 'number') { autoclose.time += 'ms'; } - var slider = self.progressbar.querySelector('div'); slider.addEventListener('animationend', function (e) { e.stopPropagation(); self.progressbar.classList.remove('active'); self.close(); }); - if (autoclose.progressbar) { self.progressbar.classList.add('active'); - if (autoclose.background) { - if (jsPanel.themes.indexOf(autoclose.background) > -1) { - self.progressbar.classList.add(autoclose.background + '-bg'); - } else if (jsPanel.colorNames[autoclose.background]) { + if (jsPanel.colorNames[autoclose.background]) { self.progressbar.style.background = '#' + jsPanel.colorNames[autoclose.background]; } else { self.progressbar.style.background = autoclose.background; @@ -5775,42 +5141,40 @@ var jsPanel = { } slider.style.animation = "".concat(autoclose.time, " progressbar"); - } // option.rtl - + } + // option.rtl if (options.rtl) { self.setRtl(); - } // option.size -- should be after option.theme - - - self.setSize(); // option.position - - self.status = 'normalized'; // if option.position evaluates to false panel will not be positioned at all + } + // option.size -- should be after option.theme + self.setSize(); + // option.position + self.status = 'normalized'; + // if option.position evaluates to false panel will not be positioned at all if (options.position) { this.position(self, options.position); } else { self.style.opacity = 1; } - document.dispatchEvent(jspanelnormalized); - self.calcSizeFactors(); // option.animateIn + self.calcSizeFactors(); + // option.animateIn if (options.animateIn) { // remove class again on animationend, otherwise opacity doesn't change when panel is dragged self.addEventListener('animationend', function () { _this2.remClass(self, options.animateIn); }); this.setClass(self, options.animateIn); - } // option.dragit AND option.resizeit AND option.syncMargins - + } + // option.dragit AND option.resizeit AND option.syncMargins if (options.syncMargins) { var containment = this.pOcontainment(options.maximizedMargin); - if (options.dragit) { options.dragit.containment = containment; - if (options.dragit.snap === true) { // options.dragit.snap must be object in order to set options.dragit.snap.containment = true; options.dragit.snap = jsPanel.defaultSnapConfig; @@ -5819,12 +5183,10 @@ var jsPanel = { options.dragit.snap.containment = true; } } - if (options.resizeit) { options.resizeit.containment = containment; } } - if (options.dragit) { // callbacks must be an array of function(s) in order to be able to dynamically add/remove callbacks (for example in extensions) ['start', 'drag', 'stop'].forEach(function (item) { @@ -5836,8 +5198,8 @@ var jsPanel = { options.dragit[item] = []; } }); - self.drag(options.dragit); // do not use self.options.dragit.stop.push() !!! - + self.drag(options.dragit); + // do not use self.options.dragit.stop.push() !!! self.addEventListener('jspaneldragstop', function (e) { if (e.panel === self) { self.calcSizeFactors(); @@ -5846,7 +5208,6 @@ var jsPanel = { } else { self.titlebar.style.cursor = 'default'; } - if (options.resizeit) { // callbacks must be an array of function(s) in order to be able to dynamically add/remove callbacks (for example in extensions) ['start', 'resize', 'stop'].forEach(function (item) { @@ -5859,14 +5220,14 @@ var jsPanel = { } }); self.sizeit(options.resizeit); - var startstatus = void 0; // do not use self.options.resizeit.start.push() !!! - + var startstatus = void 0; + // do not use self.options.resizeit.start.push() !!! self.addEventListener('jspanelresizestart', function (e) { if (e.panel === self) { startstatus = self.status; } - }, false); // do not use self.options.resizeit.stop.push() !!! - + }, false); + // do not use self.options.resizeit.stop.push() !!! self.addEventListener('jspanelresizestop', function (e) { if (e.panel === self) { if ((startstatus === 'smallified' || startstatus === 'smallifiedmax' || startstatus === 'maximized') && parseFloat(self.style.height) > parseFloat(window.getComputedStyle(self.header).height)) { @@ -5874,21 +5235,21 @@ var jsPanel = { self.status = 'normalized'; document.dispatchEvent(jspanelnormalized); document.dispatchEvent(jspanelstatuschange); - if (options.onstatuschange) { jsPanel.processCallbacks(self, options.onstatuschange, 'every'); } - self.calcSizeFactors(); } } }, false); - } // initialize self.currentData - must be after options position & size - + } - self.saveCurrentDimensions(true); - self.saveCurrentPosition(); // option.setStatus + // initialize self.currentData - must be after options position & size + //self.saveCurrentDimensions(true); // not clear why 'true' was added here or why this param is needed at all in the method + self.saveCurrentDimensions(); + self.saveCurrentPosition(); + // option.setStatus if (options.setStatus) { if (options.setStatus === 'smallifiedmax') { self.maximize().smallify(); @@ -5898,34 +5259,33 @@ var jsPanel = { // remove last char ('d') from end of string to get function name to call self[options.setStatus.slice(0, -1)](); } - } // front panel on mousedown - + } + // front panel on mousedown this.pointerdown.forEach(function (item) { self.addEventListener(item, function (e) { if (!e.target.closest('.jsPanel-btn-close') && !e.target.closest('.jsPanel-btn-minimize') && options.paneltype === 'standard') { self.front(); } }, false); - }); // option onwindowresize + }); + // option onwindowresize if (options.onwindowresize) { // if container is 'window' if (self.options.container === 'window') { window.addEventListener('resize', self.windowResizeHandler, false); } - } // option onparentresize - + } + // option onparentresize if (options.onparentresize) { var onResize = options.onparentresize, - settingType = _typeof(onResize), - parentPanel = self.isChildpanel(); - + settingType = _typeof(onResize), + parentPanel = self.isChildpanel(); if (parentPanel) { var parentContainer = parentPanel.content; var parentContainerSize = []; - self.parentResizeHandler = function (e) { // if resized panel is the parent panel of the one whose option onContentResize is set to true if (e.panel === parentPanel) { @@ -5933,9 +5293,8 @@ var jsPanel = { parentContainerSize[0] = parentContainer.offsetWidth; parentContainerSize[1] = parentContainer.offsetHeight; var status = self.status, - left, - top; - + left, + top; if (status === 'maximized' && onResize) { self.maximize(); } else if (self.snapped && status !== 'minimized') { @@ -5966,12 +5325,11 @@ var jsPanel = { } } }; - document.addEventListener('jspanelresize', self.parentResizeHandler, false); } - } // global callbacks - + } + // global callbacks if (this.globalCallbacks) { if (Array.isArray(this.globalCallbacks)) { this.globalCallbacks.forEach(function (item) { @@ -5980,9 +5338,9 @@ var jsPanel = { } else { this.globalCallbacks.call(self, self); } - } // option.callback - + } + // option.callback if (options.callback) { if (Array.isArray(options.callback)) { options.callback.forEach(function (item) { @@ -5991,13 +5349,19 @@ var jsPanel = { } else { options.callback.call(self, self); } - } // constructor callback - + } + // constructor callback + // if (cb) {cb.call(self, self);} if (cb) { - cb.call(self, self); + if (Array.isArray(cb)) { + cb.forEach(function (item) { + return item.call(self, self); + }); + } else { + cb.call(self, self); + } } - document.dispatchEvent(jspanelloaded); return self; } diff --git a/dist/jspanel.min.css b/dist/jspanel.min.css index 772841a..5a54bda 100644 --- a/dist/jspanel.min.css +++ b/dist/jspanel.min.css @@ -1 +1 @@ -.default-bg,.secondary-bg{background-color:#b0bec5}.primary-bg{background-color:#01579b}.info-bg{background-color:#039be5}.success-bg{background-color:#2e7d32}.warning-bg{background-color:#f57f17}.danger-bg{background-color:#dd2c00}.light-bg{background-color:#e0e0e0}.dark-bg{background-color:#263238}.jsPanel{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;opacity:0;overflow:visible;position:absolute;z-index:100}.jsPanel-hdr{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;flex-shrink:0;line-height:normal}.jsPanel-content{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;background:#fff;color:#000;font-size:1rem;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1}.jsPanel-content pre{color:inherit}.jsPanel-ftr{flex-direction:row;justify-content:flex-end;flex-wrap:nowrap;align-items:center;display:none;box-sizing:border-box;font-size:1rem;height:auto;background:#f5f5f5;font-weight:400;color:#000;overflow:hidden}.jsPanel-ftr.active{display:flex;flex-shrink:0;margin:0;padding:3px 8px}.jsPanel-hdr.jsPanel-hdr-dark .jsPanel-btn:hover{background-color:rgba(255,255,255,.4)}.jsPanel-hdr.jsPanel-hdr-light .jsPanel-btn:hover{background-color:rgba(0,0,0,.15)}.jsPanel-hdr-toolbar{font-size:1rem}.jsPanel-headerbar{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.jsPanel-headerbar img{vertical-align:middle;max-height:38px}.jsPanel-titlebar{display:flex;align-items:center;font-size:1rem;flex:1 1 0;cursor:move;height:100%;overflow:hidden;user-select:none}.jsPanel-titlebar .jsPanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant:small-caps;font-weight:400;margin:0 5px 0 8px;min-width:0}.jsPanel-titlebar.jsPanel-rtl{flex-direction:row-reverse}.jsPanel-controlbar{display:flex;align-items:center;align-self:start;touch-action:none;margin:3px}.jsPanel-controlbar .jsPanel-btn{cursor:pointer;touch-action:none;border-radius:3px;border:0;padding:0;margin:0;background-color:transparent;box-shadow:none}.jsPanel-controlbar .jsPanel-btn i,.jsPanel-controlbar .jsPanel-btn span,.jsPanel-controlbar .jsPanel-btn svg.jsPanel-icon{vertical-align:middle}.jsPanel-controlbar .jsPanel-btn span.glyphicon{padding:0 2px}.jsPanel-controlbar .jsPanel-btn svg.svg-inline--fa{margin:2px 3px}.jsPanel-controlbar .jsPanel-btn-normalize{display:none}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl svg:not(.svg-inline--fa){width:2rem;height:2rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl .svg-inline--fa{font-size:2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span.material-icons{font-size:2.2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span[class^=fa]{width:auto;height:auto;font-size:2rem;margin:0 4px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg svg:not(.svg-inline--fa){width:1.75rem;height:1.75rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg .svg-inline--fa{font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span.material-icons{font-size:1.9rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span[class^=fa]{width:auto;height:auto;font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md svg:not(.svg-inline--fa){width:1.5rem;height:1.5rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md .svg-inline--fa{font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span.material-icons{font-size:1.6rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span[class^=fa]{width:auto;height:auto;font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm svg:not(.svg-inline--fa){width:1.25rem;height:1.25rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm .svg-inline--fa{font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span.material-icons{font-size:1.3rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span[class^=fa]{width:auto;height:auto;font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs svg:not(.svg-inline--fa){width:1rem;height:1rem;margin:1px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs .svg-inline--fa{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span.material-icons{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span[class^=fa]{width:auto;height:auto;font-size:1rem}.jsPanel-hdr-toolbar{display:none;width:auto;height:auto}.jsPanel-hdr-toolbar.active{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;padding:3px 8px}.jsPanel-titlebar .jsPanel-title[dir=rtl]{margin:0 8px 0 5px}.jsPanel-hdr-toolbar[dir=rtl].active{padding:0 8px 0 8px}.jsPanel-content[dir=rtl]{text-align:right}.jsPanel-ftr[dir=rtl]{flex-direction:row}#jsPanel-replacement-container,.jsPanel-minimized-box,.jsPanel-minimized-container{display:flex;flex-flow:row wrap-reverse;background:transparent none repeat scroll 0 0;bottom:0;height:auto;left:0;position:fixed;width:auto;z-index:9998}.jsPanel-replacement{font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;display:flex;align-items:center;width:200px;height:34px;margin:1px 1px 0 0;z-index:9999}.jsPanel-replacement .jsPanel-hdr{flex-grow:1;min-width:0;padding:0;height:34px;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo{max-width:50%;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo img{max-width:100px;max-height:34px}.jsPanel-replacement .jsPanel-titlebar{cursor:default;min-width:0}.jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize{display:block}.jsPanel-minimized-box,.jsPanel-minimized-container{position:absolute;width:100%;overflow:hidden}.flexOne{display:flex;flex-flow:row wrap}.jsPanel-resizeit-handle{display:block;font-size:.1px;position:absolute;touch-action:none}.jsPanel-resizeit-handle.jsPanel-resizeit-n{cursor:n-resize;height:12px;left:9px;top:-5px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-e{cursor:e-resize;height:calc(100% - 18px);right:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-s{bottom:-9px;cursor:s-resize;height:12px;left:9px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-w{cursor:w-resize;height:calc(100% - 18px);left:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-ne{cursor:ne-resize;height:18px;right:-9px;top:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-se{bottom:-9px;cursor:se-resize;height:18px;right:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-sw{bottom:-9px;cursor:sw-resize;height:18px;left:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-nw{cursor:nw-resize;height:18px;left:-9px;top:-9px;width:18px}.jsPanel-drag-overlay{width:100%;height:100%;position:absolute;left:0;top:0}.jsPanel-error .jsPanel-content{border:0!important;padding-top:0!important;font-size:.9rem;text-align:center}.jsPanel-error .jsPanel-content p{margin:0 0 10px 0}.jsPanel-error .jsPanel-content mark{background:#e6e6fa;border-radius:.33rem;padding:0 8px;font-family:monospace}.jsPanel-error .jsPanel-content .jsPanel-error-content-separator{width:100%;height:1px;background-image:linear-gradient(90deg,#fff 0,#663399 50%,#fff 100%);margin-bottom:10px}.jsPanel-depth-1{box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}.jsPanel-depth-2{box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23)}.jsPanel-depth-3{box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)}.jsPanel-depth-4{box-shadow:0 19px 38px rgba(0,0,0,.3),0 15px 12px rgba(0,0,0,.22)}.jsPanel-depth-5{box-shadow:0 24px 48px rgba(0,0,0,.3),0 20px 14px rgba(0,0,0,.22)}.jsPanel-snap-area{position:fixed;background:#000;opacity:.2;border:1px solid silver;box-shadow:0 14px 28px rgba(0,0,0,.5),0 10px 10px rgba(0,0,0,.5);z-index:9999}.jsPanel-snap-area-lb,.jsPanel-snap-area-lc,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-left-center,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{left:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{left:37.5%}.jsPanel-snap-area-rb,.jsPanel-snap-area-rc,.jsPanel-snap-area-right-bottom,.jsPanel-snap-area-right-center,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{right:0}.jsPanel-snap-area-center-top,.jsPanel-snap-area-ct,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{top:0}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{top:37.5%}.jsPanel-snap-area-cb,.jsPanel-snap-area-center-bottom,.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{bottom:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{width:25%}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{height:25%}.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{border-bottom-right-radius:100%}.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{border-bottom-left-radius:100%}.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{border-top-left-radius:100%}.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom{border-top-right-radius:100%}.jsPanel-connector-left-bottom-corner,.jsPanel-connector-left-top-corner,.jsPanel-connector-right-bottom-corner,.jsPanel-connector-right-top-corner{width:12px;height:12px;position:absolute;border-radius:50%}.jsPanel-connector-left-top-corner{left:calc(100% - 6px);top:calc(100% - 6px)}.jsPanel-connector-right-top-corner{left:-6px;top:calc(100% - 6px)}.jsPanel-connector-right-bottom-corner{left:-6px;top:-6px}.jsPanel-connector-left-bottom-corner{left:calc(100% - 6px);top:-6px}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright,.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop,.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop,.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{width:0;height:0;position:absolute;border:12px solid transparent}.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{top:100%;border-bottom-width:0}.jsPanel-connector-top{left:calc(50% - 12px)}.jsPanel-connector-topleft{left:0}.jsPanel-connector-topright{left:calc(100% - 24px)}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright{top:-12px;border-top-width:0}.jsPanel-connector-bottom{left:calc(50% - 12px)}.jsPanel-connector-bottomleft{left:0}.jsPanel-connector-bottomright{left:calc(100% - 24px)}.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop{left:100%;border-right-width:0}.jsPanel-connector-left{top:calc(50% - 12px)}.jsPanel-connector-lefttop{top:0}.jsPanel-connector-leftbottom{top:calc(100% - 24px)}.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop{left:-12px;border-left-width:0}.jsPanel-connector-right{top:calc(50% - 12px)}.jsPanel-connector-righttop{top:0}.jsPanel-connector-rightbottom{top:calc(100% - 24px)}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.jsPanel-replacement .jsPanel-titlebar{max-width:105px}}@keyframes jsPanelFadeIn{from{opacity:0}to{opacity:1}}.jsPanelFadeIn{opacity:0;animation:jsPanelFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes jsPanelFadeOut{from{opacity:1}to{opacity:0}}.jsPanelFadeOut{animation:jsPanelFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes modalBackdropFadeIn{from{opacity:0}to{opacity:.65}}.jsPanel-modal-backdrop{animation:modalBackdropFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:750ms;background:#000;position:fixed;top:0;left:0;width:100%;height:100%}@keyframes modalBackdropFadeOut{from{opacity:.65}to{opacity:0}}.jsPanel-modal-backdrop-out{animation:modalBackdropFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.4s}.jsPanel-modal-backdrop-multi{background:rgba(0,0,0,.15)}.jsPanel-content .jsPanel-iframe-overlay{position:absolute;top:0;width:100%;height:100%;background:0 0}.jsPanel-addCloseCtrl{position:absolute;top:0;right:0;width:.8rem;height:.8rem;margin:2px;cursor:pointer;line-height:.8rem;padding:0;z-index:100;border:0;background-color:transparent}.jsPanel-addCloseCtrl.rtl{right:unset;left:0}.jsPanel-progressbar{position:relative;width:100%;height:0;overflow:hidden}.jsPanel-progressbar .jsPanel-progressbar-slider{position:absolute;width:0;height:3px;background:#d3d3d3;right:0}.jsPanel-progressbar.active{height:3px}@keyframes progressbar{from{width:0}to{width:100%}}.jsPanel-content.jsPanel-content-noheader{border:none!important}body{-ms-overflow-style:scrollbar} \ No newline at end of file +.jsPanel{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;opacity:0;overflow:visible;position:absolute;z-index:100}.jsPanel-hdr{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;line-height:normal}.jsPanel-content{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;background:#fff;color:#000;font-size:1rem;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1}.jsPanel-content pre{color:inherit}.jsPanel-ftr{flex-direction:row;justify-content:flex-end;flex-wrap:nowrap;align-items:center;display:none;box-sizing:border-box;font-size:1rem;height:auto;background:#f5f5f5;font-weight:400;color:#000;overflow:hidden}.jsPanel-ftr.active{display:flex;flex-shrink:0;margin:0;padding:3px 8px}.jsPanel-hdr.jsPanel-hdr-dark .jsPanel-btn:hover{background-color:rgba(255,255,255,.4)}.jsPanel-hdr.jsPanel-hdr-light .jsPanel-btn:hover{background-color:rgba(0,0,0,.15)}.jsPanel-hdr-toolbar{font-size:1rem}.jsPanel-headerbar{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.jsPanel-headerbar img{vertical-align:middle;max-height:38px}.jsPanel-titlebar{display:flex;align-items:center;font-size:1rem;flex:1 1 0;cursor:move;height:100%;overflow:hidden;user-select:none}.jsPanel-titlebar .jsPanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant:small-caps;font-weight:400;margin:0 5px 0 8px;min-width:0}.jsPanel-titlebar.jsPanel-rtl{flex-direction:row-reverse}.jsPanel-controlbar{display:flex;align-items:center;align-self:start;touch-action:none;margin:3px}.jsPanel-controlbar .jsPanel-btn{cursor:pointer;touch-action:none;border-radius:3px;border:0;padding:0;margin:0;background-color:transparent;box-shadow:none}.jsPanel-controlbar .jsPanel-btn i,.jsPanel-controlbar .jsPanel-btn span,.jsPanel-controlbar .jsPanel-btn svg.jsPanel-icon{vertical-align:middle}.jsPanel-controlbar .jsPanel-btn span.glyphicon{padding:0 2px}.jsPanel-controlbar .jsPanel-btn svg.svg-inline--fa{margin:2px 3px}.jsPanel-controlbar .jsPanel-btn-normalize{display:none}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl svg:not(.svg-inline--fa){width:2rem;height:2rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl .svg-inline--fa{font-size:2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span.material-icons{font-size:2.2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span[class^=fa]{width:auto;height:auto;font-size:2rem;margin:0 4px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg svg:not(.svg-inline--fa){width:1.75rem;height:1.75rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg .svg-inline--fa{font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span.material-icons{font-size:1.9rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span[class^=fa]{width:auto;height:auto;font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md svg:not(.svg-inline--fa){width:1.5rem;height:1.5rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md .svg-inline--fa{font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span.material-icons{font-size:1.6rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span[class^=fa]{width:auto;height:auto;font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm svg:not(.svg-inline--fa){width:1.25rem;height:1.25rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm .svg-inline--fa{font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span.material-icons{font-size:1.3rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span[class^=fa]{width:auto;height:auto;font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs svg:not(.svg-inline--fa){width:1rem;height:1rem;margin:1px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs .svg-inline--fa{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span.material-icons{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span[class^=fa]{width:auto;height:auto;font-size:1rem}.jsPanel-hdr-toolbar{display:none;width:auto;height:auto}.jsPanel-hdr-toolbar.active{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;padding:3px 8px}.jsPanel-titlebar .jsPanel-title[dir=rtl]{margin:0 8px 0 5px}.jsPanel-hdr-toolbar[dir=rtl].active{padding:0 8px 0 8px}.jsPanel-content[dir=rtl]{text-align:right}.jsPanel-ftr[dir=rtl]{flex-direction:row}#jsPanel-replacement-container,.jsPanel-minimized-box,.jsPanel-minimized-container{display:flex;flex-flow:row wrap-reverse;background:transparent none repeat scroll 0 0;bottom:0;height:auto;left:0;position:fixed;width:auto;z-index:9998}.jsPanel-replacement{font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;display:flex;align-items:center;width:200px;height:34px;margin:1px 1px 0 0;z-index:9999}.jsPanel-replacement .jsPanel-hdr{flex-grow:1;min-width:0;padding:0;height:34px;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo{max-width:50%;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo img{max-width:100px;max-height:34px}.jsPanel-replacement .jsPanel-titlebar{cursor:default;min-width:0}.jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize{display:block}.jsPanel-minimized-box,.jsPanel-minimized-container{position:absolute;width:100%;overflow:hidden}.flexOne{display:flex;flex-flow:row wrap}.jsPanel-resizeit-handle{display:block;font-size:.1px;position:absolute;touch-action:none}.jsPanel-resizeit-handle.jsPanel-resizeit-n{cursor:n-resize;height:12px;left:9px;top:-5px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-e{cursor:e-resize;height:calc(100% - 18px);right:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-s{bottom:-9px;cursor:s-resize;height:12px;left:9px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-w{cursor:w-resize;height:calc(100% - 18px);left:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-ne{cursor:ne-resize;height:18px;right:-9px;top:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-se{bottom:-9px;cursor:se-resize;height:18px;right:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-sw{bottom:-9px;cursor:sw-resize;height:18px;left:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-nw{cursor:nw-resize;height:18px;left:-9px;top:-9px;width:18px}.jsPanel-drag-overlay{width:100%;height:100%;position:absolute;left:0;top:0}.jsPanel-error .jsPanel-content{border:0!important;padding-top:0!important;font-size:.9rem;text-align:center}.jsPanel-error .jsPanel-content p{margin:0 0 10px 0}.jsPanel-error .jsPanel-content mark{background:#e6e6fa;border-radius:.33rem;padding:0 8px;font-family:monospace}.jsPanel-error .jsPanel-content .jsPanel-error-content-separator{width:100%;height:1px;background-image:linear-gradient(90deg,#fff 0,#663399 50%,#fff 100%);margin-bottom:10px}.jsPanel-depth-1{box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}.jsPanel-depth-2{box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23)}.jsPanel-depth-3{box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)}.jsPanel-depth-4{box-shadow:0 19px 38px rgba(0,0,0,.3),0 15px 12px rgba(0,0,0,.22)}.jsPanel-depth-5{box-shadow:0 24px 48px rgba(0,0,0,.3),0 20px 14px rgba(0,0,0,.22)}.jsPanel-snap-area{position:fixed;background:#000;opacity:.2;border:1px solid silver;box-shadow:0 14px 28px rgba(0,0,0,.5),0 10px 10px rgba(0,0,0,.5);z-index:9999}.jsPanel-snap-area-lb,.jsPanel-snap-area-lc,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-left-center,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{left:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{left:37.5%}.jsPanel-snap-area-rb,.jsPanel-snap-area-rc,.jsPanel-snap-area-right-bottom,.jsPanel-snap-area-right-center,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{right:0}.jsPanel-snap-area-center-top,.jsPanel-snap-area-ct,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{top:0}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{top:37.5%}.jsPanel-snap-area-cb,.jsPanel-snap-area-center-bottom,.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{bottom:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{width:25%}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{height:25%}.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{border-bottom-right-radius:100%}.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{border-bottom-left-radius:100%}.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{border-top-left-radius:100%}.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom{border-top-right-radius:100%}.jsPanel-connector-left-bottom-corner,.jsPanel-connector-left-top-corner,.jsPanel-connector-right-bottom-corner,.jsPanel-connector-right-top-corner{width:12px;height:12px;position:absolute;border-radius:50%}.jsPanel-connector-left-top-corner{left:calc(100% - 6px);top:calc(100% - 6px)}.jsPanel-connector-right-top-corner{left:-6px;top:calc(100% - 6px)}.jsPanel-connector-right-bottom-corner{left:-6px;top:-6px}.jsPanel-connector-left-bottom-corner{left:calc(100% - 6px);top:-6px}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright,.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop,.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop,.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{width:0;height:0;position:absolute;border:12px solid transparent}.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{top:100%;border-bottom-width:0}.jsPanel-connector-top{left:calc(50% - 12px)}.jsPanel-connector-topleft{left:0}.jsPanel-connector-topright{left:calc(100% - 24px)}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright{top:-12px;border-top-width:0}.jsPanel-connector-bottom{left:calc(50% - 12px)}.jsPanel-connector-bottomleft{left:0}.jsPanel-connector-bottomright{left:calc(100% - 24px)}.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop{left:100%;border-right-width:0}.jsPanel-connector-left{top:calc(50% - 12px)}.jsPanel-connector-lefttop{top:0}.jsPanel-connector-leftbottom{top:calc(100% - 24px)}.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop{left:-12px;border-left-width:0}.jsPanel-connector-right{top:calc(50% - 12px)}.jsPanel-connector-righttop{top:0}.jsPanel-connector-rightbottom{top:calc(100% - 24px)}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.jsPanel-replacement .jsPanel-titlebar{max-width:105px}}@keyframes jsPanelFadeIn{from{opacity:0}to{opacity:1}}.jsPanelFadeIn{opacity:0;animation:jsPanelFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes jsPanelFadeOut{from{opacity:1}to{opacity:0}}.jsPanelFadeOut{animation:jsPanelFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes modalBackdropFadeIn{from{opacity:0}to{opacity:.65}}.jsPanel-modal-backdrop{animation:modalBackdropFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:750ms;background:#000;position:fixed;top:0;left:0;width:100%;height:100%}@keyframes modalBackdropFadeOut{from{opacity:.65}to{opacity:0}}.jsPanel-modal-backdrop-out{animation:modalBackdropFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.4s}.jsPanel-modal-backdrop-multi{background:rgba(0,0,0,.15)}.jsPanel-content .jsPanel-iframe-overlay{position:absolute;top:0;width:100%;height:100%;background:0 0}.jsPanel-addCloseCtrl{position:absolute;top:0;right:0;width:.8rem;height:.8rem;margin:2px;cursor:pointer;line-height:.8rem;padding:0;z-index:100;border:0;background-color:transparent}.jsPanel-addCloseCtrl.rtl{right:unset;left:0}.jsPanel-progressbar{position:relative;width:100%;height:0;overflow:hidden}.jsPanel-progressbar .jsPanel-progressbar-slider{position:absolute;width:0;height:3px;background:#d3d3d3;right:0}.jsPanel-progressbar.active{height:3px}@keyframes progressbar{from{width:0}to{width:100%}}.jsPanel-content.jsPanel-content-noheader{border:none!important}body{-ms-overflow-style:scrollbar} \ No newline at end of file diff --git a/dist/jspanel.min.js b/dist/jspanel.min.js index 1b361fe..70ee360 100644 --- a/dist/jspanel.min.js +++ b/dist/jspanel.min.js @@ -1 +1 @@ -"use strict";function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_unsupportedIterableToArray(e)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _iterableToArray(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function _arrayWithoutHoles(e){if(Array.isArray(e))return _arrayLikeToArray(e)}function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_unsupportedIterableToArray(e,t)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(e,t){if(e){if("string"==typeof e)return _arrayLikeToArray(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(e,t):void 0}}function _arrayLikeToArray(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n',maximize:'',normalize:'',minimize:'',smallify:''},idCounter:0,isIE:document.documentMode||!1,pointerdown:"onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],pointermove:"onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],pointerup:"onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"],polyfills:(Object.assign||Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:function(e){if(null==e)throw new TypeError("Cannot convert first argument to object");for(var t=Object(e),n=1;n=0&&n.item(t)!==o;);}while(t<0&&(o=o.parentElement));return o}),function(){if("function"==typeof window.CustomEvent)return!1;function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};var n=document.createEvent("CustomEvent");return n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),n}e.prototype=window.Event.prototype,window.CustomEvent=e}(),String.prototype.endsWith||(String.prototype.endsWith=function(e,t){return(void 0===t||t>this.length)&&(t=this.length),this.substring(t-e.length,t)===e}),String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{value:function(e,t){var n=t>0?0|t:0;return this.substring(n,n+e.length)===e}}),String.prototype.includes||(String.prototype.includes=function(e,t){if(e instanceof RegExp)throw TypeError("first argument must not be a RegExp");return void 0===t&&(t=0),-1!==this.indexOf(e,t)}),String.prototype.repeat||(String.prototype.repeat=function(e){if(null==this)throw new TypeError("can't convert "+this+" to object");var t=""+this;if((e=+e)!=e&&(e=0),e<0)throw new RangeError("repeat count must be non-negative");if(e==1/0)throw new RangeError("repeat count must be less than infinity");if(e=Math.floor(e),0==t.length||0==e)return"";if(t.length*e>=1<<28)throw new RangeError("repeat count must not overflow maximum string size");var n=t.length*e;for(e=Math.floor(Math.log(e)/Math.log(2));e;)t+=t,e--;return t+=t.substring(0,n-t.length)}),Number.isInteger=Number.isInteger||function(e){return"number"==typeof e&&isFinite(e)&&Math.floor(e)===e},void(Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(e,t){if(null==this)throw new TypeError('"this" is null or not defined');var n=Object(this),o=n.length>>>0;if(0===o)return!1;for(var a,r,i=0|t,s=Math.max(i>=0?i:o-Math.abs(i),0);s0&&void 0!==arguments[0])||arguments[0]?(this.pointerdown="onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"]):(this.pointerdown="ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="ontouchend"in window?["touchend","mouseup"]:["mouseup"])},pOcontainer:function(e){if("window"===e)return document.body;if("string"==typeof e){var t=document.querySelectorAll(e);return!!(t.length&&t.length>0)&&t}return 1===e.nodeType?e:!!e.length&&e[0]},pOcontainment:function(e){var t=e;if("function"==typeof e&&(t=e()),"number"==typeof t)return[t,t,t,t];if(Array.isArray(t)){if(1===t.length)return[t[0],t[0],t[0],t[0]];if(2===t.length)return t.concat(t);3===t.length&&(t[3]=t[1])}return t},pOsize:function(e,t){var n=t||this.defaults.contentSize,o=e.parentElement;if("string"==typeof n){var a=n.trim().split(" ");(n={}).width=a[0],2===a.length?n.height=a[1]:n.height=a[0]}else n.width&&!n.height?n.height=n.width:n.height&&!n.width&&(n.width=n.height);if(String(n.width).match(/^[0-9.]+$/gi))n.width+="px";else if("string"==typeof n.width&&n.width.endsWith("%"))if(o===document.body)n.width=window.innerWidth*(parseFloat(n.width)/100)+"px";else{var r=window.getComputedStyle(o),i=parseFloat(r.borderLeftWidth)+parseFloat(r.borderRightWidth);n.width=(parseFloat(r.width)-i)*(parseFloat(n.width)/100)+"px"}else"function"==typeof n.width&&(n.width=n.width.call(e,e),"number"==typeof n.width?n.width+="px":"string"==typeof n.width&&n.width.match(/^[0-9.]+$/gi)&&(n.width+="px"));if(String(n.height).match(/^[0-9.]+$/gi))n.height+="px";else if("string"==typeof n.height&&n.height.endsWith("%"))if(o===document.body)n.height=window.innerHeight*(parseFloat(n.height)/100)+"px";else{var s=window.getComputedStyle(o),l=parseFloat(s.borderTopWidth)+parseFloat(s.borderBottomWidth);n.height=(parseFloat(s.height)-l)*(parseFloat(n.height)/100)+"px"}else"function"==typeof n.height&&(n.height=n.height.call(e,e),"number"==typeof n.height?n.height+="px":"string"==typeof n.height&&n.height.match(/^[0-9.]+$/gi)&&(n.height+="px"));return n},pOborder:function(e){var t=[],n=e.trim().replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," ").split(" ");return n.forEach(function(e,t){(e.startsWith("--")||e.startsWith("var"))&&(n[t]=jsPanel.getCssVariableValue(e))}),n.forEach(function(e){jsPanel.colorNames[e]?t[2]="#"+jsPanel.colorNames[e]:e.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)?t[1]=e:e.match(/(thin|medium|thick)|(\d*\.?\d*(cap|ch|em|ex|ic|lh|rem|rlh|vh|vw|vmax|vmin|vb|vi|px|cm|mm|Q|in|pc|pt))/)?t[0]=e:t[2]=e}),t[0]||(t[0]="medium"),t[1]||(t[1]="solid"),t[2]||(t[2]=""),t},pOheaderControls:function(e){if("string"==typeof e){var t={},n=e.toLowerCase(),o=n.match(/xl|lg|md|sm|xs/),a=n.match(/closeonly|none/);return o&&(t.size=o[0]),a&&(t=Object.assign({},t,{maximize:"remove",normalize:"remove",minimize:"remove",smallify:"remove"}),"none"===a[0]&&(t.close="remove")),Object.assign({},this.defaults.headerControls,t)}return Object.assign({},this.defaults.headerControls,e)},pOtheme:function(e){var t,n="";if((e=e.trim()).match(/^(rgb|hsl|var)/)){var o=e.indexOf(")");(t=e.slice(0,o+1).replace(/\s+/g,"")).startsWith("var")&&(t=jsPanel.getCssVariableValue(t)),n=e.slice(o+1,e.length).trim()}else if(e.match(/^(#|\w|--)/)){var a=e.indexOf(" ");a>0?(t=e.slice(0,a+1).replace(/\s+/g,""),n=e.slice(a+1,e.length).trim()):t=e,t.startsWith("--")&&(t=jsPanel.getCssVariableValue(t))}if(t.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)&&(t="#"+t),n.startsWith("fillcolor")){var r=n.indexOf(" ");n=(n=n.slice(r+1,n.length).trim().replace(/\s+/g,"")).match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)?"#"+n:jsPanel.colorNames[n]?"#"+jsPanel.colorNames[n]:n.match(/^(--|var)/)?jsPanel.getCssVariableValue(n):"#fff"}return{color:t,colors:!1,filling:n}},color:function(e){var t,n,o,a,r,i,s,l,c,d=e.toLowerCase(),p={},h=/^rgba?\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3}),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi,u=/^hsla?\(([0-9]{1,3}),([0-9]{1,3}%),([0-9]{1,3}%),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi,f=this.colorNames;return f[d]&&(d=f[d]),null!==d.match(/^#?([0-9a-f]{3}|[0-9a-f]{6})$/gi)?(d=d.replace("#",""),d.length%2==1?(t=d.slice(0,1).repeat(2),n=d.slice(1,2).repeat(2),o=d.slice(2,3).repeat(2),p.rgb={r:parseInt(t,16),g:parseInt(n,16),b:parseInt(o,16)},p.hex="#".concat(t).concat(n).concat(o)):(p.rgb={r:parseInt(d.slice(0,2),16),g:parseInt(d.slice(2,4),16),b:parseInt(d.slice(4,6),16)},p.hex="#".concat(d)),c=this.rgbToHsl(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl=c,p.rgb.css="rgb(".concat(p.rgb.r,",").concat(p.rgb.g,",").concat(p.rgb.b,")")):d.match(h)?(s=h.exec(d),p.rgb={css:d,r:s[1],g:s[2],b:s[3]},p.hex=this.rgbToHex(s[1],s[2],s[3]),c=this.rgbToHsl(s[1],s[2],s[3]),p.hsl=c):d.match(u)?(a=(s=u.exec(d))[1]/360,r=s[2].slice(0,s[2].length-1)/100,i=s[3].slice(0,s[3].length-1)/100,l=this.hslToRgb(a,r,i),p.rgb={css:"rgb(".concat(l[0],",").concat(l[1],",").concat(l[2],")"),r:l[0],g:l[1],b:l[2]},p.hex=this.rgbToHex(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl={css:"hsl(".concat(s[1],",").concat(s[2],",").concat(s[3],")"),h:s[1],s:s[2],l:s[3]}):(p.hex="#f5f5f5",p.rgb={css:"rgb(245,245,245)",r:245,g:245,b:245},p.hsl={css:"hsl(0,0%,96%)",h:0,s:"0%",l:"96%"}),p},calcColors:function(e){var t=this.colorBrightnessThreshold,n=this.color(e),o=this.lighten(e,this.colorFilledLight),a=this.darken(e,this.colorFilled),r=this.perceivedBrightness(e)<=t?"#ffffff":"#000000",i=this.perceivedBrightness(o)<=t?"#ffffff":"#000000",s=this.perceivedBrightness(a)<=t?"#ffffff":"#000000",l=this.lighten(e,this.colorFilledDark),c=this.perceivedBrightness(l)<=t?"#ffffff":"#000000";return[n.hsl.css,o,a,r,i,s,l,c]},darken:function(e,t){var n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o-o*t)+"%";return"hsl(".concat(n.h,",").concat(n.s,",").concat(a,")")},lighten:function(e,t){var n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o+(100-o)*t)+"%";return"hsl(".concat(n.h,",").concat(n.s,",").concat(a,")")},hslToRgb:function(e,t,n){var o,a,r;if(0===t)o=a=r=n;else{var i=function(e,t,n){return n<0&&(n+=1),n>1&&(n-=1),n<1/6?e+6*(t-e)*n:n<.5?t:n<2/3?e+(t-e)*(2/3-n)*6:e},s=n<.5?n*(1+t):n+t-n*t,l=2*n-s;o=i(l,s,e+1/3),a=i(l,s,e),r=i(l,s,e-1/3)}return[Math.round(255*o),Math.round(255*a),Math.round(255*r)]},rgbToHsl:function(e,t,n){e/=255,t/=255,n/=255;var o,a,r=Math.max(e,t,n),i=Math.min(e,t,n),s=(r+i)/2;if(r===i)o=a=0;else{var l=r-i;switch(a=s>.5?l/(2-r-i):l/(r+i),r){case e:o=(t-n)/l+(t=0&&(f=this.applyPositionAutopos(e,f,t)),(t.offsetX||t.offsetY)&&(f=this.applyPositionOffset(e,f,t)),(t.minLeft||t.minTop||t.maxLeft||t.maxTop)&&(f=this.applyPositionMinMax(e,f,t)),t.modify&&(f=this.applyPositionModify(e,f,t)),"number"==typeof e.options.opacity?e.style.opacity=e.options.opacity:e.style.opacity=1,e},applyPositionAutopos:function(e,t,n){var o="".concat(n.my,"-").concat(n.autoposition.toLowerCase());e.classList.add(o);var a=Array.prototype.slice.call(document.querySelectorAll(".".concat(o))),r=a.indexOf(e);if(a.length>1){switch(n.autoposition){case"down":a.forEach(function(e,n){n>0&&n<=r&&(t.top=parseFloat(t.top)+a[--n].getBoundingClientRect().height+jsPanel.autopositionSpacing+"px")});break;case"up":a.forEach(function(e,n){n>0&&n<=r&&(t.top=parseFloat(t.top)-a[--n].getBoundingClientRect().height-jsPanel.autopositionSpacing+"px")});break;case"right":a.forEach(function(e,n){n>0&&n<=r&&(t.left=parseFloat(t.left)+a[--n].getBoundingClientRect().width+jsPanel.autopositionSpacing+"px")});break;case"left":a.forEach(function(e,n){n>0&&n<=r&&(t.left=parseFloat(t.left)-a[--n].getBoundingClientRect().width-jsPanel.autopositionSpacing+"px")})}e.style.left=t.left,e.style.top=t.top}return{left:t.left,top:t.top}},applyPositionOffset:function(e,t,n){["offsetX","offsetY"].forEach(function(e){n[e]?("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),!1===isNaN(n[e])&&(n[e]="".concat(n[e],"px"))):n[e]="0px"}),e.style.left="calc(".concat(e.style.left," + ").concat(n.offsetX,")"),e.style.top="calc(".concat(e.style.top," + ").concat(n.offsetY,")");var o=getComputedStyle(e);return{left:o.left,top:o.top}},applyPositionMinMax:function(e,t,n){if(["minLeft","minTop","maxLeft","maxTop"].forEach(function(e){n[e]&&("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),(Number.isInteger(n[e])||n[e].match(/^\d+$/))&&(n[e]="".concat(n[e],"px")))}),n.minLeft){e.style.left=n.minLeft;var o=getComputedStyle(e).left;parseFloat(o)parseFloat(t.left)?e.style.left=t.left:t.left=r}if(n.maxTop){e.style.top=n.maxTop;var i=getComputedStyle(e).top;parseFloat(i)>parseFloat(t.top)?e.style.top=t.top:t.top=i}var s=getComputedStyle(e);return{left:s.left,top:s.top}},applyPositionModify:function(e,t,n){if(n.modify&&"function"==typeof n.modify){var o=n.modify.call(t,t,n);e.style.left=Number.isInteger(o.left)||o.left.match(/^\d+$/)?"".concat(o.left,"px"):o.left,e.style.top=Number.isInteger(o.top)||o.top.match(/^\d+$/)?"".concat(o.top,"px"):o.top}var a=getComputedStyle(e);return{left:a.left,top:a.top}},autopositionRemaining:function(e){var t,n=e.options.container;(["left-top-down","left-top-right","center-top-down","right-top-down","right-top-left","left-bottom-up","left-bottom-right","center-bottom-up","right-bottom-up","right-bottom-left"].forEach(function(n){e.classList.contains(n)&&(t=n)}),t)&&("window"===n?document.body:"string"==typeof n?document.querySelector(n):n).querySelectorAll(".".concat(t)).forEach(function(e){return e.reposition()})},getThemeDetails:function(e){var t=this.pOtheme(e);if(this.themes.some(function(e){return e===t.color.split(/\s/i)[0]})){var n=t.color.split(/\s/i)[0],o=document.createElement("button");o.className=n+"-bg",document.body.appendChild(o),t.color=getComputedStyle(o).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(o),o=void 0}else if(t.color.startsWith("bootstrap-")){var a=t.color.indexOf("-"),r=document.createElement("button");r.className="btn btn"+t.color.slice(a),document.body.appendChild(r),t.color=getComputedStyle(r).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(r),r=void 0}else if(t.color.startsWith("mdb-")){var i,s=t.color.indexOf("-")+1,l=document.createElement("span");i=t.color.endsWith("-dark")?(i=t.color.slice(s)).replace("-dark","-color-dark"):t.color.slice(s)+"-color",l.className=i,document.body.appendChild(l),t.color=getComputedStyle(l).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(l),l=void 0}return t.colors=this.calcColors(t.color),t},clearTheme:function(e,t){return this.themes.forEach(function(t){["panel","jsPanel-theme-".concat(t),"panel-".concat(t),"".concat(t,"-color")].forEach(function(t){return e.classList.remove(t)}),e.header.classList.remove("jsPanel-theme-".concat(t))}),e.content.classList.remove("jsPanel-content-filled","jsPanel-content-filledlight"),e.header.classList.remove("jsPanel-hdr-light"),e.header.classList.remove("jsPanel-hdr-dark"),e.style.backgroundColor="",this.setStyles(e.headertoolbar,{boxShadow:"",width:"",marginLeft:"",borderTopColor:"transparent"}),this.setStyles(e.content,{background:"",borderTopColor:"transparent"}),e.header.style.background="",Array.prototype.slice.call(e.controlbar.querySelectorAll(".jsPanel-icon")).concat([e.headerlogo,e.headertitle,e.headertoolbar,e.content]).forEach(function(e){return e.style.color=""}),t&&t.call(e,e),e},applyColorTheme:function(e,t){if(e.style.backgroundColor=t.colors[0],e.header.style.backgroundColor=t.colors[0],e.header.style.color=t.colors[3],[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(function(n){return e.querySelector(n).style.color=t.colors[3]}),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return e.style.color=t.colors[3]}),"string"==typeof e.options.theme&&"filled"===t.filling&&(e.content.style.borderTop="#000000"===t.colors[3]?"1px solid rgba(0,0,0,0.15)":"1px solid rgba(255,255,255,0.15)"),"#000000"===t.colors[3]?e.header.classList.add("jsPanel-hdr-light"):e.header.classList.add("jsPanel-hdr-dark"),t.filling)switch(t.filling){case"filled":this.setStyles(e.content,{backgroundColor:t.colors[2],color:t.colors[3]});break;case"filledlight":e.content.style.backgroundColor=t.colors[1];break;case"filleddark":this.setStyles(e.content,{backgroundColor:t.colors[6],color:t.colors[7]});break;default:e.content.style.backgroundColor=t.filling,e.content.style.color=this.perceivedBrightness(t.filling)<=this.colorBrightnessThreshold?"#fff":"#000"}return e},applyCustomTheme:function(e,t){var n=this,o={bgPanel:"#ffffff",bgContent:"#fffffff",bgFooter:"#f5f5f5",colorHeader:"#000000",colorContent:"#000000",colorFooter:"#000000",border:void 0,borderRadius:void 0},a="object"===_typeof(t)?Object.assign(o,t):o,r=a.bgPanel,i=a.bgContent,s=a.colorHeader,l=a.colorContent,c=a.bgFooter,d=a.colorFooter;return this.colorNames[r]?e.style.background="#"+this.colorNames[r]:e.style.background=this.getCssVariableValue(r),this.colorNames[s]&&(s="#"+this.colorNames[s]),[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(function(t){return e.querySelector(t).style.color=n.getCssVariableValue(s)}),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return e.style.color=n.getCssVariableValue(s)}),this.colorNames[i]?e.content.style.background="#"+this.colorNames[i]:e.content.style.background=this.getCssVariableValue(i),this.colorNames[l]?e.content.style.color="#"+this.colorNames[l]:e.content.style.color=this.getCssVariableValue(l),this.perceivedBrightness(s)>this.colorBrightnessThreshold?e.header.classList.add("jsPanel-hdr-dark"):e.header.classList.add("jsPanel-hdr-light"),this.perceivedBrightness(l)>this.colorBrightnessThreshold?e.content.style.borderTop="1px solid rgba(255,255,255,0.15)":e.content.style.borderTop="1px solid rgba(0,0,0,0.15)",this.colorNames[c]?e.footer.style.background="#"+this.colorNames[c]:e.footer.style.background=this.getCssVariableValue(c),this.colorNames[d]?e.footer.style.color="#"+this.colorNames[d]:e.footer.style.color=this.getCssVariableValue(d),a.border&&e.setBorder(a.border),a.borderRadius&&(e.options.borderRadius=void 0,e.setBorderRadius(a.borderRadius)),e},getCssVariableValue:function(e){if(e.startsWith("--"))return getComputedStyle(document.documentElement).getPropertyValue(e).replace(/\s+/g,"");if(e.startsWith("var")){var t=e.slice(e.indexOf("(")+1,e.indexOf(")"));return getComputedStyle(document.documentElement).getPropertyValue(t).replace(/\s+/g,"")}return e},getScrollbarWidth:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:document.body;if(e===document.body)return{y:window.innerWidth-document.documentElement.clientWidth,x:window.innerHeight-document.documentElement.clientHeight};var t=getComputedStyle(e);return{y:e.offsetWidth-e.clientWidth-parseFloat(t.borderRightWidth)-parseFloat(t.borderLeftWidth),x:e.offsetHeight-e.clientHeight-parseFloat(t.borderBottomWidth)-parseFloat(t.borderTopWidth)}},remClass:function(e,t){return t.trim().split(/\s+/).forEach(function(t){return e.classList.remove(t)}),e},setClass:function(e,t){return t.trim().split(/\s+/).forEach(function(t){return e.classList.add(t)}),e},setStyles:function(e,t){for(var n=0,o=Object.entries(t);n1&&void 0!==arguments[1]?arguments[1]:"application/javascript",n=arguments.length>2?arguments[2]:void 0;if(!document.querySelector('script[src="'.concat(e,'"]'))){var o=document.createElement("script");o.src=e,o.type=t,document.head.appendChild(o),n&&(o.onload=n)}},ajax:function(e,t){var n,o,a=new XMLHttpRequest,r={method:"GET",async:!0,user:"",pwd:"",done:function(){if(t){var e=jsPanel.strToHtml(this.responseText);n.urlSelector&&(e=e.querySelector(n.urlSelector)),t.contentRemove(),t.content.append(e)}},autoresize:!0,autoreposition:!0};if(t&&"string"==typeof e)n=Object.assign({},r,{url:e});else{if("object"!==_typeof(e)||!e.url){if(this.errorReporting){jsPanel.errorpanel("XMLHttpRequest seems to miss the url parameter!")}return}(n=Object.assign({},r,e)).url=e.url,!1===n.async&&(n.timeout=0,n.withCredentials&&(n.withCredentials=void 0),n.responseType&&(n.responseType=void 0))}o=n.url.trim().split(/\s+/),n.url=encodeURI(o[0]),o.length>1&&(o.shift(),n.urlSelector=o.join(" ")),a.onreadystatechange=function(){4===a.readyState&&(200===a.status?t?n.done.call(a,a,t):n.done.call(a,a):n.fail&&(t?n.fail.call(a,a,t):n.fail.call(a,a)),n.always&&(t?n.always.call(a,a,t):n.always.call(a,a)),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n),jsPanel.ajaxAlwaysCallbacks.length&&jsPanel.ajaxAlwaysCallbacks.forEach(function(e){t?e.call(a,a,t):e.call(a,a)}))},a.open(n.method,n.url,n.async,n.user,n.pwd),a.timeout=n.timeout||0,n.withCredentials&&(a.withCredentials=n.withCredentials),n.responseType&&(a.responseType=n.responseType),n.beforeSend&&(t?n.beforeSend.call(a,a,t):n.beforeSend.call(a,a)),n.data?a.send(n.data):a.send(null)},fetch:function(e){function t(t,n){return e.apply(this,arguments)}return t.toString=function(){return e.toString()},t}(function(e,t){var n,o={bodyMethod:"text",autoresize:!0,autoreposition:!0,done:function(e,t){if(t){var n=jsPanel.strToHtml(e);t.contentRemove(),t.content.append(n)}}};if(t&&"string"==typeof e)n=Object.assign({},o,{resource:encodeURI(e)});else{if("object"!==_typeof(e)||!e.resource){if(this.errorReporting){jsPanel.errorpanel("Fetch Request seems to miss the resource parameter!")}return}(n=Object.assign({},o,e)).resource=encodeURI(e.resource)}var a=n.fetchInit||{};n.beforeSend&&(t?n.beforeSend.call(e,e,t):n.beforeSend.call(e,e)),fetch(n.resource,a).then(function(e){if(e.ok)return e[n.bodyMethod]()}).then(function(e){t?n.done.call(e,e,t):n.done.call(e,e),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n)})}),ajaxAutoresizeAutoreposition:function(e,t){var n=e.options.contentSize;if("string"==typeof n&&n.match(/auto/i)){var o=n.split(" "),a=Object.assign({},{width:o[0],height:o[1]});t.autoresize&&e.resize(a),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}else if("object"===_typeof(n)&&("auto"===n.width||"auto"===n.height)){var r=Object.assign({},n);t.autoresize&&e.resize(r),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}},createPanelTemplate:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=document.createElement("div");return t.className="jsPanel",t.style.left="0",t.style.top="0",e&&["close","maximize","normalize","minimize","smallify"].forEach(function(e){t.setAttribute("data-btn".concat(e),"enabled")}),t.innerHTML='
\n
\n \n
\n
\n
\n
\n \n \n \n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
'),t},createMinimizedTemplate:function(){var e=document.createElement("div");return e.className="jsPanel-replacement",e.innerHTML='
\n
\n \n
\n
\n
\n
\n \n \n \n
\n
\n
"),e},createSnapArea:function(e,t,n){var o=document.createElement("div"),a=e.parentElement;o.className="jsPanel-snap-area jsPanel-snap-area-".concat(t),"lt"===t||"rt"===t||"rb"===t||"lb"===t?(o.style.width=n+"px",o.style.height=n+"px"):"ct"===t||"cb"===t?o.style.height=n+"px":"lc"!==t&&"rc"!==t||(o.style.width=n+"px"),a!==document.body&&(o.style.position="absolute"),document.querySelector(".jsPanel-snap-area.jsPanel-snap-area-".concat(t))||e.parentElement.appendChild(o)},removeSnapAreas:function(){document.querySelectorAll(".jsPanel-snap-area").forEach(function(e){return e.parentElement.removeChild(e)})},extend:function(e){if("[object Object]"===Object.prototype.toString.call(e))for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&(this.extensions[t]=e[t])},getPanels:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){return this.classList.contains("jsPanel-standard")};return Array.prototype.slice.call(document.querySelectorAll(".jsPanel")).filter(function(t){return e.call(t,t)}).sort(function(e,t){return t.style.zIndex-e.style.zIndex})},processCallbacks:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"some",o=arguments.length>3?arguments[3]:void 0,a=arguments.length>4?arguments[4]:void 0;if("function"==typeof t&&(t=[t]),n)return t[n](function(t){return t.call(e,e,o,a)});t.forEach(function(t){return t.call(e,e,o,a)})},resetZi:function(){this.zi=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:jsPanel.ziBase;return{next:function(){return e++}}}(),Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).sort(function(e,t){return e.style.zIndex-t.style.zIndex}).forEach(function(e){return e.style.zIndex=jsPanel.zi.next()})},errorpanel:function(e){this.create({paneltype:"error",dragit:!1,resizeit:!1,theme:{bgPanel:"white",bgContent:"white",colorHeader:"rebeccapurple",colorContent:"#333333",border:"2px solid rebeccapurple"},borderRadius:".33rem",headerControls:"closeonly xs",headerTitle:"⚠ jsPanel Error",contentSize:{width:"50%",height:"auto"},position:"center-top 0 5 down",animateIn:"jsPanelFadeIn",content:'

'.concat(e,"

")})},create:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=arguments.length>1?arguments[1]:void 0;jsPanel.zi||(jsPanel.zi=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:jsPanel.ziBase;return{next:function(){return e++}}}()),t.config?delete(t=Object.assign({},this.defaults,t.config,t)).config:t=Object.assign({},this.defaults,t),t.id?"function"==typeof t.id&&(t.id=t.id()):t.id="jsPanel-".concat(jsPanel.idCounter+=1);var o=document.getElementById(t.id);if(null!==o){if(o.classList.contains("jsPanel")&&o.front(),this.errorReporting){var a="◀ COULD NOT CREATE NEW JSPANEL ►
An element with the ID ".concat(t.id," already exists in the document.");jsPanel.errorpanel(a)}return!1}var r=this.pOcontainer(t.container);if("object"===_typeof(r)&&r.length&&r.length>0&&(r=r[0]),!r){if(this.errorReporting){jsPanel.errorpanel("◀ COULD NOT CREATE NEW JSPANEL ►
The container to append the panel to does not exist")}return!1}["onbeforeclose","onbeforemaximize","onbeforeminimize","onbeforenormalize","onbeforesmallify","onbeforeunsmallify","onclosed","onfronted","onmaximized","onminimized","onnormalized","onsmallified","onstatuschange","onunsmallified"].forEach(function(e){t[e]?"function"==typeof t[e]&&(t[e]=[t[e]]):t[e]=[]});var i=t.template||this.createPanelTemplate();i.options=t,i.closetimer=void 0,i.status="initialized",i.currentData={},i.header=i.querySelector(".jsPanel-hdr"),i.headerbar=i.header.querySelector(".jsPanel-headerbar"),i.titlebar=i.header.querySelector(".jsPanel-titlebar"),i.headerlogo=i.headerbar.querySelector(".jsPanel-headerlogo"),i.headertitle=i.headerbar.querySelector(".jsPanel-title"),i.controlbar=i.headerbar.querySelector(".jsPanel-controlbar"),i.headertoolbar=i.header.querySelector(".jsPanel-hdr-toolbar"),i.content=i.querySelector(".jsPanel-content"),i.footer=i.querySelector(".jsPanel-ftr"),i.snappableTo=!1,i.snapped=!1,i.droppableTo=!1,i.progressbar=i.autocloseProgressbar=i.querySelector(".jsPanel-progressbar");var s=new CustomEvent("jspanelloaded",{detail:t.id,cancelable:!0}),l=new CustomEvent("jspanelstatuschange",{detail:t.id,cancelable:!0}),c=new CustomEvent("jspanelbeforenormalize",{detail:t.id,cancelable:!0}),d=new CustomEvent("jspanelnormalized",{detail:t.id,cancelable:!0}),p=new CustomEvent("jspanelbeforemaximize",{detail:t.id,cancelable:!0}),h=new CustomEvent("jspanelmaximized",{detail:t.id,cancelable:!0}),u=new CustomEvent("jspanelbeforeminimize",{detail:t.id,cancelable:!0}),f=new CustomEvent("jspanelminimized",{detail:t.id,cancelable:!0}),m=new CustomEvent("jspanelbeforesmallify",{detail:t.id,cancelable:!0}),g=new CustomEvent("jspanelsmallified",{detail:t.id,cancelable:!0}),b=new CustomEvent("jspanelsmallifiedmax",{detail:t.id,cancelable:!0}),y=new CustomEvent("jspanelbeforeunsmallify",{detail:t.id,cancelable:!0}),v=new CustomEvent("jspanelfronted",{detail:t.id,cancelable:!0}),w=new CustomEvent("jspanelbeforeclose",{detail:t.id,cancelable:!0}),j=new CustomEvent("jspanelclosed",{detail:t.id,cancelable:!0}),E=new CustomEvent("jspanelcloseduser",{detail:t.id,cancelable:!0});[s,l,c,d,p,h,u,f,m,g,b,y,v,w].forEach(function(e){return e.panel=i});var x=i.querySelector(".jsPanel-btn-close"),C=i.querySelector(".jsPanel-btn-maximize"),P=i.querySelector(".jsPanel-btn-normalize"),F=i.querySelector(".jsPanel-btn-smallify"),z=i.querySelector(".jsPanel-btn-minimize");x&&jsPanel.pointerup.forEach(function(e){x.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}),C&&jsPanel.pointerup.forEach(function(e){C.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.maximize()})}),P&&jsPanel.pointerup.forEach(function(e){P.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.normalize()})}),F&&jsPanel.pointerup.forEach(function(e){F.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;"normalized"===i.status||"maximized"===i.status?i.smallify():"smallified"!==i.status&&"smallifiedmax"!==i.status||i.unsmallify()})}),z&&jsPanel.pointerup.forEach(function(e){z.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.minimize()})});var S=jsPanel.extensions;for(var A in S)Object.prototype.hasOwnProperty.call(S,A)&&(i[A]=S[A]);if(i.setBorder=function(e){var t=jsPanel.pOborder(e);return t[2].length||(t[2]=i.style.backgroundColor),t=t.join(" "),i.style.border=t,i.options.border=t,i},i.setBorderRadius=function(e){"string"==typeof e&&(e.startsWith("--")||e.startsWith("var"))&&(e=e.replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," "),e=jsPanel.getCssVariableValue(e)),"number"==typeof e&&(e+="px"),i.style.borderRadius=e;var t=getComputedStyle(i);return i.options.header?(i.header.style.borderTopLeftRadius=t.borderTopLeftRadius,i.header.style.borderTopRightRadius=t.borderTopRightRadius):(i.content.style.borderTopLeftRadius=t.borderTopLeftRadius,i.content.style.borderTopRightRadius=t.borderTopRightRadius),i.options.footerToolbar?(i.footer.style.borderBottomRightRadius=t.borderBottomRightRadius,i.footer.style.borderBottomLeftRadius=t.borderBottomLeftRadius):(i.content.style.borderBottomRightRadius=t.borderBottomRightRadius,i.content.style.borderBottomLeftRadius=t.borderBottomLeftRadius),i},i.setTheme=function(){var e,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:t.theme,o=arguments.length>1?arguments[1]:void 0;if("minimized"===i.status&&(e=!0,i.normalize()),jsPanel.clearTheme(i),"object"===_typeof(n))t.border=void 0,jsPanel.applyCustomTheme(i,n);else if("string"==typeof n){"none"===n&&(n="white");var a=jsPanel.getThemeDetails(n);jsPanel.applyColorTheme(i,a)}return e&&i.minimize(),o&&o.call(i,i),i},i.remove=function(e,t,n){i.parentElement.removeChild(i),document.getElementById(e)?n&&n.call(i,e,i):(i.removeMinimizedReplacement(),i.status="closed",t&&document.dispatchEvent(E),document.dispatchEvent(j),i.options.onclosed&&jsPanel.processCallbacks(i,i.options.onclosed,"every",t),jsPanel.autopositionRemaining(i),n&&n.call(e,e)),window.removeEventListener("resize",i.windowResizeHandler),document.removeEventListener("jspanelresize",i.parentResizeHandler)},i.close=function(e,t){if(i.parentElement){if(i.closetimer&&window.clearInterval(i.closetimer),document.dispatchEvent(w),i.statusBefore=i.status,i.options.onbeforeclose&&i.options.onbeforeclose.length>0&&!jsPanel.processCallbacks(i,i.options.onbeforeclose,"some",i.status,t))return i;i.options.animateOut?(i.options.animateIn&&jsPanel.remClass(i,i.options.animateIn),jsPanel.setClass(i,i.options.animateOut),i.addEventListener("animationend",function(n){n.stopPropagation(),i.remove(i.id,t,e)})):i.remove(i.id,t,e)}},i.maximize=function(e,n){if(i.statusBefore=i.status,t.onbeforemaximize&&t.onbeforemaximize.length>0&&!jsPanel.processCallbacks(i,t.onbeforemaximize,"some",i.statusBefore))return i;document.dispatchEvent(p);var o=i.parentElement,a=jsPanel.pOcontainment(t.maximizedMargin);return o===document.body?(i.style.width=document.documentElement.clientWidth-a[1]-a[3]+"px",i.style.height=document.documentElement.clientHeight-a[0]-a[2]+"px",i.style.left=a[3]+"px",i.style.top=a[0]+"px"):(i.style.width=o.clientWidth-a[1]-a[3]+"px",i.style.height=o.clientHeight-a[0]-a[2]+"px",i.style.left=a[3]+"px",i.style.top=a[0]+"px"),F.style.transform="unset",i.removeMinimizedReplacement(),i.status="maximized",i.setControls([".jsPanel-btn-maximize"]),n||i.front(),document.dispatchEvent(h),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),e&&e.call(i,i,i.statusBefore),t.onmaximized&&jsPanel.processCallbacks(i,t.onmaximized,"every",i.statusBefore),i},i.minimize=function(e){if("minimized"===i.status)return i;if(i.statusBefore=i.status,t.onbeforeminimize&&t.onbeforeminimize.length>0&&!jsPanel.processCallbacks(i,t.onbeforeminimize,"some",i.statusBefore))return i;if(document.dispatchEvent(u),!document.getElementById("jsPanel-replacement-container")){var n=document.createElement("div");n.id="jsPanel-replacement-container",document.body.append(n)}if(i.style.left="-9999px",i.status="minimized",document.dispatchEvent(f),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),t.minimizeTo){var o,a,r,s=i.createMinimizedReplacement();switch(t.minimizeTo){case"default":document.getElementById("jsPanel-replacement-container").append(s);break;case"parentpanel":(o=(r=(a=i.closest(".jsPanel-content").parentElement).querySelectorAll(".jsPanel-minimized-box"))[r.length-1]).append(s);break;case"parent":(o=(a=i.parentElement).querySelector(".jsPanel-minimized-container"))||((o=document.createElement("div")).className="jsPanel-minimized-container",a.append(o)),o.append(s);break;default:document.querySelector(t.minimizeTo).append(s)}}return e&&e.call(i,i,i.statusBefore),t.onminimized&&jsPanel.processCallbacks(i,t.onminimized,"every",i.statusBefore),i},i.normalize=function(e){return"normalized"===i.status?i:(i.statusBefore=i.status,t.onbeforenormalize&&t.onbeforenormalize.length>0&&!jsPanel.processCallbacks(i,t.onbeforenormalize,"some",i.statusBefore)?i:(document.dispatchEvent(c),i.style.width=i.currentData.width,i.style.height=i.currentData.height,i.snapped?i.snap(i.snapped,!0):(i.style.left=i.currentData.left,i.style.top=i.currentData.top),F.style.transform="unset",i.removeMinimizedReplacement(),i.status="normalized",i.setControls([".jsPanel-btn-normalize"]),i.front(),document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),e&&e.call(i,i,i.statusBefore),t.onnormalized&&jsPanel.processCallbacks(i,t.onnormalized,"every",i.statusBefore),i))},i.smallify=function(e){if("smallified"===i.status||"smallifiedmax"===i.status)return i;if(i.statusBefore=i.status,t.onbeforesmallify&&t.onbeforesmallify.length>0&&!jsPanel.processCallbacks(i,t.onbeforesmallify,"some",i.statusBefore))return i;document.dispatchEvent(m),i.style.overflow="hidden";var n=window.getComputedStyle(i),o=parseFloat(window.getComputedStyle(i.headerbar).height);i.style.height=parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth)+o+"px",F.style.transform="rotate(180deg)","normalized"===i.status?(i.setControls([".jsPanel-btn-normalize"]),i.status="smallified",document.dispatchEvent(g),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore)):"maximized"===i.status&&(i.setControls([".jsPanel-btn-maximize"]),i.status="smallifiedmax",document.dispatchEvent(b),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore));var a=i.querySelectorAll(".jsPanel-minimized-box");return a[a.length-1].style.display="none",e&&e.call(i,i,i.statusBefore),t.onsmallified&&jsPanel.processCallbacks(i,t.onsmallified,"every",i.statusBefore),i},i.unsmallify=function(e){if(i.statusBefore=i.status,"smallified"===i.status||"smallifiedmax"===i.status){if(t.onbeforeunsmallify&&t.onbeforeunsmallify.length>0&&!jsPanel.processCallbacks(i,t.onbeforeunsmallify,"some",i.statusBefore))return i;document.dispatchEvent(y),i.style.overflow="visible",i.front(),"smallified"===i.status?(i.style.height=i.currentData.height,i.setControls([".jsPanel-btn-normalize"]),i.status="normalized",document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore)):"smallifiedmax"===i.status?i.maximize():"minimized"===i.status&&i.normalize(),F.style.transform="rotate(0deg)";var n=i.querySelectorAll(".jsPanel-minimized-box");n[n.length-1].style.display="flex",e&&e.call(i,i,i.statusBefore),t.onunsmallified&&jsPanel.processCallbacks(i,t.onunsmallified,"every",i.statusBefore)}return i},i.front=function(e){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if("minimized"===i.status)"maximized"===i.statusBefore?i.maximize():i.normalize();else{var o=Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).map(function(e){return e.style.zIndex});Math.max.apply(Math,_toConsumableArray(o))>i.style.zIndex&&(i.style.zIndex=jsPanel.zi.next()),jsPanel.resetZi()}return document.dispatchEvent(v),e&&e.call(i,i),t.onfronted&&n&&jsPanel.processCallbacks(i,t.onfronted,"every",i.status),i},i.snap=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(t||(i.currentData.beforeSnap={width:i.currentData.width,height:i.currentData.height}),e&&"function"==typeof e&&!t)e.call(i,i,i.snappableTo);else if(!1!==e){var n=[0,0];if(i.options.dragit.snap.containment&&i.options.dragit.containment){var o=jsPanel.pOcontainment(i.options.dragit.containment),a=i.snappableTo;a.startsWith("left")?n[0]=o[3]:a.startsWith("right")&&(n[0]=-o[1]),a.endsWith("top")?n[1]=o[0]:a.endsWith("bottom")&&(n[1]=-o[2])}i.reposition("".concat(i.snappableTo," ").concat(n[0]," ").concat(n[1]))}t||(i.snapped=i.snappableTo)},i.move=function(e,t){var n=i.overlaps(e,"paddingbox"),o=i.parentElement;return e.appendChild(i),i.options.container=e,i.style.left=n.left+"px",i.style.top=n.top+"px",i.saveCurrentDimensions(),i.saveCurrentPosition(),i.calcSizeFactors(),t&&t.call(i,i,e,o),i},i.closeChildpanels=function(e){return i.getChildpanels().forEach(function(e){return e.close()}),e&&e.call(i,i),i},i.getChildpanels=function(e){var t=i.content.querySelectorAll(".jsPanel");return e&&t.forEach(function(t,n,o){e.call(t,t,n,o)}),t},i.isChildpanel=function(e){var t=i.closest(".jsPanel-content"),n=t?t.parentElement:null;return e&&e.call(i,i,n),!!t&&n},i.contentRemove=function(e){return jsPanel.emptyNode(i.content),e&&e.call(i,i),i},i.createMinimizedReplacement=function(){var e=jsPanel.createMinimizedTemplate(),n=window.getComputedStyle(i.headertitle).color,o=window.getComputedStyle(i),a=t.iconfont,r=e.querySelector(".jsPanel-controlbar");return"auto-show-hide"!==i.options.header?jsPanel.setStyles(e,{backgroundColor:o.backgroundColor,backgroundPositionX:o.backgroundPositionX,backgroundPositionY:o.backgroundPositionY,backgroundRepeat:o.backgroundRepeat,backgroundAttachment:o.backgroundAttachment,backgroundImage:o.backgroundImage,backgroundSize:o.backgroundSize,backgroundOrigin:o.backgroundOrigin,backgroundClip:o.backgroundClip}):e.style.backgroundColor=window.getComputedStyle(i.header).backgroundColor,e.id=i.id+"-min",e.querySelector(".jsPanel-headerbar").replaceChild(i.headerlogo.cloneNode(!0),e.querySelector(".jsPanel-headerlogo")),e.querySelector(".jsPanel-titlebar").replaceChild(i.headertitle.cloneNode(!0),e.querySelector(".jsPanel-title")),e.querySelector(".jsPanel-titlebar").setAttribute("title",i.headertitle.textContent),e.querySelector(".jsPanel-title").style.color=n,r.style.color=n,r.querySelectorAll("button").forEach(function(e){return e.style.color=n}),["jsPanel-hdr-dark","jsPanel-hdr-light"].forEach(function(t){i.header.classList.contains(t)&&e.querySelector(".jsPanel-hdr").classList.add(t)}),i.setIconfont(a,e),"enabled"===i.dataset.btnnormalize?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-normalize").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.normalize()})}):r.querySelector(".jsPanel-btn-normalize").style.display="none","enabled"===i.dataset.btnmaximize?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-maximize").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.maximize()})}):r.querySelector(".jsPanel-btn-maximize").style.display="none","enabled"===i.dataset.btnclose?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-close").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}):r.querySelector(".jsPanel-btn-close").style.display="none",e},i.removeMinimizedReplacement=function(){var e=document.getElementById("".concat(i.id,"-min"));e&&e.parentElement.removeChild(e)},i.drag=function(){var e,t,n,o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},a=new CustomEvent("jspaneldragstart",{detail:i.id}),r=new CustomEvent("jspaneldrag",{detail:i.id}),s=new CustomEvent("jspaneldragstop",{detail:i.id});[a,r,s].forEach(function(e){return e.panel=i});var l=function(e){var t=e.split("-");return t.forEach(function(e,n){t[n]=e.charAt(0).toUpperCase()+e.slice(1)}),"snap"+t.join("")};function c(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(function(e){document.removeEventListener(e,t,!1),i.style.opacity=1})}var d=o.handles||jsPanel.defaults.dragit.handles,p=o.cursor||jsPanel.defaults.dragit.cursor;function h(o){if(jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,t)}),jsPanel.removeSnapAreas(),e){if(i.style.opacity=1,e=void 0,n.snap){switch(i.snappableTo){case"left-top":i.snap(n.snap.snapLeftTop);break;case"center-top":i.snap(n.snap.snapCenterTop);break;case"right-top":i.snap(n.snap.snapRightTop);break;case"right-center":i.snap(n.snap.snapRightCenter);break;case"right-bottom":i.snap(n.snap.snapRightBottom);break;case"center-bottom":i.snap(n.snap.snapCenterBottom);break;case"left-bottom":i.snap(n.snap.snapLeftBottom);break;case"left-center":i.snap(n.snap.snapLeftCenter)}n.snap.callback&&i.snappableTo&&"function"==typeof n.snap.callback&&(n.snap.callback.call(i,i),n.snap.repositionOnSnap&&!1!==n.snap[l(i.snappableTo)]&&i.repositionOnSnap(i.snappableTo)),i.snappableTo&&n.snap.repositionOnSnap&&n.snap[l(i.snappableTo)]&&i.repositionOnSnap(i.snappableTo)}if(i.droppableTo&&i.droppableTo){var a=i.parentElement;i.move(i.droppableTo),n.drop.callback&&n.drop.callback.call(i,i,i.droppableTo,a)}if(document.dispatchEvent(s),n.stop.length){var r=window.getComputedStyle(i),c={left:parseFloat(r.left),top:parseFloat(r.top),width:parseFloat(r.width),height:parseFloat(r.height)};jsPanel.processCallbacks(i,n.stop,!1,c,o)}i.saveCurrentPosition(),i.calcSizeFactors()}i.controlbar.style.pointerEvents="inherit",i.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="auto"}),document.removeEventListener(o,h)}return i.querySelectorAll(d).forEach(function(s){s.style.touchAction="none",s.style.cursor=p,jsPanel.pointerdown.forEach(function(l){s.addEventListener(l,function(s){if(s.button&&s.button>0)return!1;if((n=Object.assign({},jsPanel.defaults.dragit,o)).disableOnMaximized&&"maximized"===i.status)return!1;if((n.containment||0===n.containment)&&(n.containment=jsPanel.pOcontainment(n.containment)),n.grid&&Array.isArray(n.grid)&&1===n.grid.length&&(n.grid[1]=n.grid[0]),n.snap&&("object"===_typeof(n.snap)?n.snap=Object.assign({},jsPanel.defaultSnapConfig,n.snap):n.snap=jsPanel.defaultSnapConfig),!s.target.closest(".jsPanel-ftr-btn")){i.controlbar.style.pointerEvents="none",i.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="none"});var l=window.getComputedStyle(i),d=parseFloat(l.left),p=parseFloat(l.top),h=parseFloat(l.width),u=parseFloat(l.height),f=s.touches?s.touches[0].clientX:s.clientX,m=s.touches?s.touches[0].clientY:s.clientY,g=i.parentElement,b=g.getBoundingClientRect(),y=window.getComputedStyle(g),v=i.getScaleFactor(),w=0,j=jsPanel.getScrollbarWidth(g);t=function(t){if(t.preventDefault(),!e){if(document.dispatchEvent(a),i.style.opacity=n.opacity,i.snapped&&n.snap.resizeToPreSnap&&i.currentData.beforeSnap){i.resize(i.currentData.beforeSnap.width+" "+i.currentData.beforeSnap.height),i.setControls([".jsPanel-btn-normalize"]);var o=i.getBoundingClientRect(),s=f-(o.left+o.width),l=o.width/2;s>-l&&(w=s+l)}if(i.front(),i.snapped=!1,"maximized"===i.status&&(i.setControls([".jsPanel-btn-normalize"]),i.status="normalized"),n.drop&&n.drop.dropZones){var c=n.drop.dropZones.map(function(e){return jsPanel.pOcontainer(e)}),E=[];c.forEach(function(e){e.length?e.forEach(function(e){E.push(e)}):E.push(e)}),E=E.filter(function(e,t,n){return n.indexOf(e)===t}),n.drop.dropZones=E}n.start.length&&jsPanel.processCallbacks(i,n.start,!1,{left:d,top:p,width:h,height:u},t)}var x,C,P,F,z,S,A,k,B,T;e=1;var L,R=t.touches?t.touches[0].clientX:t.clientX,W=t.touches?t.touches[0].clientY:t.clientY,D=window.getComputedStyle(i);if(g===document.body){var O=i.getBoundingClientRect();B=window.innerWidth-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(O.left+O.width),T=window.innerHeight-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(O.top+O.height)}else B=parseInt(y.width,10)-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(parseInt(D.left,10)+parseInt(D.width,10)),T=parseInt(y.height,10)-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(parseInt(D.top,10)+parseInt(D.height,10));x=parseFloat(D.left),P=parseFloat(D.top),z=B,A=T,n.snap&&("panel"===n.snap.trigger?(C=Math.pow(x,2),F=Math.pow(P,2),S=Math.pow(z,2),k=Math.pow(A,2)):"pointer"===n.snap.trigger&&("window"===i.options.container?(x=R,P=W,z=window.innerWidth-R,A=window.innerHeight-W,C=Math.pow(R,2),F=Math.pow(P,2),S=Math.pow(z,2),k=Math.pow(A,2)):(x=(L=i.overlaps(g,"paddingbox",t)).pointer.left,P=L.pointer.top,z=L.pointer.right,A=L.pointer.bottom,C=Math.pow(L.pointer.left,2),F=Math.pow(L.pointer.top,2),S=Math.pow(L.pointer.right,2),k=Math.pow(L.pointer.bottom,2))));var q=Math.sqrt(C+F),M=Math.sqrt(C+k),I=Math.sqrt(S+F),H=Math.sqrt(S+k),N=Math.abs(x-z)/2,V=Math.abs(P-A)/2,_=Math.sqrt(C+Math.pow(V,2)),X=Math.sqrt(F+Math.pow(N,2)),Y=Math.sqrt(S+Math.pow(V,2)),$=Math.sqrt(k+Math.pow(N,2));if(window.getSelection().removeAllRanges(),document.dispatchEvent(r),n.axis&&"x"!==n.axis||(i.style.left=d+(R-f)/v.x+w+"px"),n.axis&&"y"!==n.axis||(i.style.top=p+(W-m)/v.y+"px"),n.grid){var U=n.grid,Z=n.axis,K=U[0]*Math.round((d+(R-f))/U[0]),G=U[1]*Math.round((p+(W-m))/U[1]);Z&&"x"!==Z||(i.style.left="".concat(K,"px")),Z&&"y"!==Z||(i.style.top="".concat(G,"px"))}if(n.containment||0===n.containment){var J,Q,ee=n.containment;if("window"===i.options.container)J=window.innerWidth-parseFloat(D.width)-ee[1]-j.y,Q=window.innerHeight-parseFloat(D.height)-ee[2]-j.x;else{var te=parseFloat(y.borderLeftWidth)+parseFloat(y.borderRightWidth),ne=parseFloat(y.borderTopWidth)+parseFloat(y.borderBottomWidth);J=b.width/v.x-parseFloat(D.width)-ee[1]-te-j.y,Q=b.height/v.y-parseFloat(D.height)-ee[2]-ne-j.x}parseFloat(i.style.left)<=ee[3]&&(i.style.left=ee[3]+"px"),parseFloat(i.style.top)<=ee[0]&&(i.style.top=ee[0]+"px"),parseFloat(i.style.left)>=J&&(i.style.left=J+"px"),parseFloat(i.style.top)>=Q&&(i.style.top=Q+"px")}if(n.drag.length){var oe={left:x,top:P,right:z,bottom:A,width:parseFloat(D.width),height:parseFloat(D.height)};jsPanel.processCallbacks(i,n.drag,!1,oe,t)}if(n.snap){var ae=n.snap.sensitivity,re=g===document.body?window.innerWidth/8:b.width/8,ie=g===document.body?window.innerHeight/8:b.height/8;i.snappableTo=!1,jsPanel.removeSnapAreas(),q0&&L.pointer.top>0?(i.snappableTo="left-top",jsPanel.createSnapArea(i,"lt",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-top",jsPanel.createSnapArea(i,"lt",ae))):M0&&L.pointer.bottom>0?(i.snappableTo="left-bottom",jsPanel.createSnapArea(i,"lb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-bottom",jsPanel.createSnapArea(i,"lb",ae))):I0&&L.pointer.top>0?(i.snappableTo="right-top",jsPanel.createSnapArea(i,"rt",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-top",jsPanel.createSnapArea(i,"rt",ae))):H0&&L.pointer.bottom>0?(i.snappableTo="right-bottom",jsPanel.createSnapArea(i,"rb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-bottom",jsPanel.createSnapArea(i,"rb",ae))):P0?(i.snappableTo="center-top",jsPanel.createSnapArea(i,"ct",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="center-top",jsPanel.createSnapArea(i,"ct",ae))):x0?(i.snappableTo="left-center",jsPanel.createSnapArea(i,"lc",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-center",jsPanel.createSnapArea(i,"lc",ae))):z0?(i.snappableTo="right-center",jsPanel.createSnapArea(i,"rc",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-center",jsPanel.createSnapArea(i,"rc",ae))):A0?(i.snappableTo="center-bottom",jsPanel.createSnapArea(i,"cb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="center-bottom",jsPanel.createSnapArea(i,"cb",ae)))}if(n.drop&&n.drop.dropZones){var se=jsPanel.isIE?"msElementsFromPoint":"elementsFromPoint",le=document[se](t.clientX,t.clientY);Array.isArray(le)||(le=Array.prototype.slice.call(le)),n.drop.dropZones.forEach(function(e){le.includes(e)&&(i.droppableTo=e)}),le.includes(i.droppableTo)||(i.droppableTo=!1)}},jsPanel.pointermove.forEach(function(e){return document.addEventListener(e,t)}),window.addEventListener("mouseout",c,!1)}})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,h),window.removeEventListener("mouseout",c)}),o.disable&&(s.style.pointerEvents="none")}),i},i.dragit=function(e){var n=Object.assign({},jsPanel.defaults.dragit,t.dragit),o=i.querySelectorAll(n.handles);return"disable"===e?o.forEach(function(e){return e.style.pointerEvents="none"}):o.forEach(function(e){return e.style.pointerEvents="auto"}),i},i.sizeit=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=new CustomEvent("jspanelresizestart",{detail:i.id}),n=new CustomEvent("jspanelresize",{detail:i.id}),o=new CustomEvent("jspanelresizestop",{detail:i.id});[t,n,o].forEach(function(e){return e.panel=i});var a,r,s,l,c,d,p={};p.handles=e.handles||jsPanel.defaults.resizeit.handles,p.handles.split(",").forEach(function(e){var t=document.createElement("DIV");t.className="jsPanel-resizeit-handle jsPanel-resizeit-".concat(e.trim()),i.append(t)});var h=!!e.aspectRatio&&e.aspectRatio;function u(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,a,!1)})}function f(e){if(jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,a,!1)}),e.target.classList&&e.target.classList.contains("jsPanel-resizeit-handle")){var t,n,s=e.target.className;if(s.match(/jsPanel-resizeit-nw|jsPanel-resizeit-w|jsPanel-resizeit-sw/i)&&(t=!0),s.match(/jsPanel-resizeit-nw|jsPanel-resizeit-n|jsPanel-resizeit-ne/i)&&(n=!0),p.grid&&Array.isArray(p.grid)){1===p.grid.length&&(p.grid[1]=p.grid[0]);var l=parseFloat(i.style.width),c=parseFloat(i.style.height),u=l%p.grid[0],m=c%p.grid[1],g=parseFloat(i.style.left),b=parseFloat(i.style.top),y=g%p.grid[0],v=b%p.grid[1];ud+5&&(w.style.transform="rotate(0deg)"),document.dispatchEvent(o),p.stop.length){var E=window.getComputedStyle(i),x={left:parseFloat(E.left),top:parseFloat(E.top),width:parseFloat(E.width),height:parseFloat(E.height)};jsPanel.processCallbacks(i,p.stop,!1,x,e)}}i.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="auto"}),p.aspectRatio=h,document.removeEventListener(e,f)}return i.querySelectorAll(".jsPanel-resizeit-handle").forEach(function(o){o.style.touchAction="none",jsPanel.pointerdown.forEach(function(h){o.addEventListener(h,function(o){if(o.preventDefault(),o.stopPropagation(),o.button&&o.button>0)return!1;var h=1;if(((p=Object.assign({},jsPanel.defaults.resizeit,e)).containment||0===p.containment)&&(p.containment=jsPanel.pOcontainment(p.containment)),p.aspectRatio&&!0===p.aspectRatio&&(p.aspectRatio="panel"),jsPanel.modifier){var f=jsPanel.modifier;f.altKey?p.aspectRatio="content":f.ctrlKey?p.aspectRatio="panel":f.shiftKey&&(p.aspectRatio=!1,h=2)}var m="function"==typeof p.maxWidth?p.maxWidth():p.maxWidth||1e4,g="function"==typeof p.maxHeight?p.maxHeight():p.maxHeight||1e4,b="function"==typeof p.minWidth?p.minWidth():p.minWidth,y="function"==typeof p.minHeight?p.minHeight():p.minHeight;i.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="none"});var v=i.parentElement,w=v.tagName.toLowerCase(),j=i.getBoundingClientRect(),E=v.getBoundingClientRect(),x=window.getComputedStyle(v,null),C=parseInt(x.borderLeftWidth,10),P=parseInt(x.borderTopWidth,10),F=x.getPropertyValue("position"),z=o.clientX||0===o.clientX||o.touches[0].clientX,S=o.clientY||0===o.clientY||o.touches[0].clientY,A=z/S,k=o.target.classList,B=i.getScaleFactor(),T=j.width/j.height,L=i.content.getBoundingClientRect(),R=L.width/L.height,W=i.header.getBoundingClientRect().height,D=i.footer.getBoundingClientRect().height||0,O=j.left,q=j.top,M=1e4,I=1e4,H=1e4,N=1e4;c=j.width,d=j.height,"body"!==w&&(O=j.left-E.left+v.scrollLeft,q=j.top-E.top+v.scrollTop),"body"===w&&p.containment?(M=document.documentElement.clientWidth-j.left,H=document.documentElement.clientHeight-j.top,I=j.width+j.left,N=j.height+j.top):p.containment&&("static"===F?(M=E.width-j.left+C,H=E.height+E.top-j.top+P,I=j.width+(j.left-E.left)-C,N=j.height+(j.top-E.top)-P):(M=v.clientWidth-(j.left-E.left)/B.x+C,H=v.clientHeight-(j.top-E.top)/B.y+P,I=(j.width+j.left-E.left)/B.x-C,N=i.clientHeight+(j.top-E.top)/B.y-P)),p.containment&&(I-=p.containment[3],N-=p.containment[0],M-=p.containment[1],H-=p.containment[2]);var V=window.getComputedStyle(i),_=parseFloat(V.width)-j.width,X=parseFloat(V.height)-j.height,Y=parseFloat(V.left)-j.left,$=parseFloat(V.top)-j.top;v!==document.body&&(Y+=E.left,$+=E.top);var U=parseInt(V.borderTopWidth,10),Z=parseInt(V.borderRightWidth,10),K=parseInt(V.borderBottomWidth,10),G=parseInt(V.borderLeftWidth,10);a=function(e){e.preventDefault(),r||(document.dispatchEvent(t),p.start.length&&jsPanel.processCallbacks(i,p.start,!1,{width:c,height:d,left:O,top:q},e),i.front(),"maximized"===i.status&&(i.status="normalized",i.controlbar.querySelector(".jsPanel-btn-maximize")&&i.setControlStatus("maximize","show"),i.controlbar.querySelector(".jsPanel-btn-normalize")&&i.setControlStatus("normalize","hide")),j.height>d+5&&(i.status="normalized",i.setControls([".jsPanel-btn-normalize"]))),r=1,document.dispatchEvent(n);var o=e.touches?e.touches[0].clientX:e.clientX,a=e.touches?e.touches[0].clientY:e.clientY;k.contains("jsPanel-resizeit-e")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),"content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-s")?((l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),"content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-w")?((s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px","content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-n")?((l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-se")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),"content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-sw")?((l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),p.aspectRatio&&(i.style.width=l*T+"px"),(s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px","content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-ne")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-nw")&&(p.aspectRatio&&k.contains("jsPanel-resizeit-nw")&&(a=(o=a*A)/A),(s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?i.style.width=(l-W-D-U-K)*R+U+K+"px":"panel"===p.aspectRatio&&(i.style.width=l*T+"px")),window.getSelection().removeAllRanges();var u=window.getComputedStyle(i),f={left:parseFloat(u.left),top:parseFloat(u.top),right:parseFloat(u.right),bottom:parseFloat(u.bottom),width:parseFloat(u.width),height:parseFloat(u.height)};p.resize.length&&jsPanel.processCallbacks(i,p.resize,!1,f,e)},jsPanel.pointermove.forEach(function(e){return document.addEventListener(e,a,!1)}),window.addEventListener("mouseout",u,!1)})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,f),window.removeEventListener("mouseout",u)}),e.disable&&(o.style.pointerEvents="none")}),i},i.resizeit=function(e){var t=i.querySelectorAll(".jsPanel-resizeit-handle");return"disable"===e?t.forEach(function(e){return e.style.pointerEvents="none"}):t.forEach(function(e){return e.style.pointerEvents="auto"}),i},i.getScaleFactor=function(){var e=i.getBoundingClientRect();return{x:e.width/i.offsetWidth,y:e.height/i.offsetHeight}},i.calcSizeFactors=function(){var e=window.getComputedStyle(i);if("window"===t.container)i.hf=parseFloat(e.left)/(window.innerWidth-parseFloat(e.width)),i.vf=parseFloat(e.top)/(window.innerHeight-parseFloat(e.height));else if(i.parentElement){var n=i.parentElement.getBoundingClientRect();i.hf=parseFloat(e.left)/(n.width-parseFloat(e.width)),i.vf=parseFloat(e.top)/(n.height-parseFloat(e.height))}},i.saveCurrentDimensions=function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=window.getComputedStyle(i);i.currentData.width=t.width,"normalized"===i.status&&(i.currentData.height=t.height),e&&(i.style.height=t.height)},i.saveCurrentPosition=function(){var e=window.getComputedStyle(i);i.currentData.left=e.left,i.currentData.top=e.top},i.reposition=function(){for(var e,n=t.position,o=!0,a=arguments.length,r=new Array(a),s=0;s0&&i.slaves.forEach(function(e){return e.reposition()}),o&&i.saveCurrentPosition(),e&&e.call(i,i),i},i.repositionOnSnap=function(e){var n="0",o="0",a=jsPanel.pOcontainment(t.dragit.containment);if(t.dragit.snap.containment)switch(e){case"left-top":n=a[3],o=a[0];break;case"right-top":n=-a[1],o=a[0];break;case"right-bottom":n=-a[1],o=-a[2];break;case"left-bottom":n=a[3],o=-a[2];break;case"center-top":n=a[3]/2-a[1]/2,o=a[0];break;case"center-bottom":n=a[3]/2-a[1]/2,o=-a[2];break;case"left-center":n=a[3],o=a[0]/2-a[2]/2;break;case"right-center":n=-a[1],o=a[0]/2-a[2]/2}jsPanel.position(i,e),jsPanel.setStyles(i,{left:"calc(".concat(i.style.left," + ").concat(n,"px)"),top:"calc(".concat(i.style.top," + ").concat(o,"px)")})},i.overlaps=function(e,t,n){var o,a=i.getBoundingClientRect(),r=getComputedStyle(i.parentElement),s=i.getScaleFactor(),l={top:0,right:0,bottom:0,left:0},c=0,d=0,p=0,h=0;"window"!==i.options.container&&"paddingbox"===t&&(l.top=parseInt(r.borderTopWidth,10)*s.y,l.right=parseInt(r.borderRightWidth,10)*s.x,l.bottom=parseInt(r.borderBottomWidth,10)*s.y,l.left=parseInt(r.borderLeftWidth,10)*s.x),o="string"==typeof e?"window"===e?{left:0,top:0,right:window.innerWidth,bottom:window.innerHeight}:"parent"===e?i.parentElement.getBoundingClientRect():document.querySelector(e).getBoundingClientRect():e.getBoundingClientRect(),n&&(c=n.touches?n.touches[0].clientX:n.clientX,d=n.touches?n.touches[0].clientY:n.clientY,p=c-o.left,h=d-o.top);var u=a.lefto.left,f=a.topo.top;return{overlaps:u&&f,top:a.top-o.top-l.top,right:o.right-a.right-l.right,bottom:o.bottom-a.bottom-l.bottom,left:a.left-o.left-l.left,parentBorderWidth:l,panelRect:a,referenceRect:o,pointer:{clientX:c,clientY:d,left:p-l.left,top:h-l.top,right:o.width-p-l.right,bottom:o.height-h-l.bottom}}},i.setSize=function(){if(t.panelSize){var e=jsPanel.pOsize(i,t.panelSize);i.style.width=e.width,i.style.height=e.height}else if(t.contentSize){var n=jsPanel.pOsize(i,t.contentSize);i.content.style.width=n.width,i.content.style.height=n.height,i.style.width=n.width,i.content.style.width="100%"}return i},i.resize=function(){for(var e,t=window.getComputedStyle(i),n={width:t.width,height:t.height},o=!0,a=arguments.length,r=new Array(a),s=0;s0&&i.slaves.forEach(function(e){return e.reposition()}),o&&i.saveCurrentDimensions(),i.status="normalized";var c=i.controlbar.querySelector(".jsPanel-btn-smallify");return c&&(c.style.transform="rotate(0deg)"),e&&e.call(i,i),i.calcSizeFactors(),i},i.windowResizeHandler=function(e){if(e.target===window){var n,o,a=i.status,r=t.onwindowresize;if("maximized"===a&&r)i.maximize(!1,!0);else if(i.snapped&&"minimized"!==a)i.snap(i.snapped,!0);else if("normalized"===a||"smallified"===a||"maximized"===a){var s=_typeof(r);"boolean"===s?(n=(window.innerWidth-i.offsetWidth)*i.hf,i.style.left=n<=0?0:n+"px",o=(window.innerHeight-i.offsetHeight)*i.vf,i.style.top=o<=0?0:o+"px"):"function"===s?r.call(i,e,i):"object"===s&&(!0===r.preset?(n=(window.innerWidth-i.offsetWidth)*i.hf,i.style.left=n<=0?0:n+"px",o=(window.innerHeight-i.offsetHeight)*i.vf,i.style.top=o<=0?0:o+"px",r.callback.call(i,e,i)):r.callback.call(i,e,i))}else"smallifiedmax"===a&&r&&i.maximize(!1,!0).smallify();i.slaves&&i.slaves.size>0&&i.slaves.forEach(function(e){return e.reposition()})}},i.setControls=function(e,t){return i.header.querySelectorAll(".jsPanel-btn").forEach(function(e){var t=e.className.split("-"),n=t[t.length-1];"hidden"!==i.getAttribute("data-btn".concat(n))&&(e.style.display="block")}),e.forEach(function(e){var t=i.controlbar.querySelector(e);t&&(t.style.display="none")}),t&&t.call(i,i),i},i.setControlStatus=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"enable",n=arguments.length>2?arguments[2]:void 0,o=i.controlbar.querySelector(".jsPanel-btn-".concat(e));switch(t){case"disable":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"disabled"),o.style.pointerEvents="none",o.style.opacity=.4,o.style.cursor="default");break;case"hide":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"hidden"),o.style.display="none");break;case"show":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"enabled"),o.style.display="block",o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"enable":"removed"!==i.getAttribute("data-btn".concat(e))&&("hidden"===i.getAttribute("data-btn".concat(e))&&(o.style.display="block"),i.setAttribute("data-btn".concat(e),"enabled"),o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"remove":i.controlbar.removeChild(o),i.setAttribute("data-btn".concat(e),"removed")}return n&&n.call(i,i),i},i.setControlSize=function(e){var t=e.toLowerCase();i.controlbar.querySelectorAll(".jsPanel-btn").forEach(function(e){["jsPanel-btn-xl","jsPanel-btn-lg","jsPanel-btn-md","jsPanel-btn-sm","jsPanel-btn-xs"].forEach(function(t){return e.classList.remove(t)}),e.classList.add("jsPanel-btn-".concat(t))}),"xl"===t?i.titlebar.style.fontSize="1.5rem":"lg"===t?i.titlebar.style.fontSize="1.25rem":"md"===t?i.titlebar.style.fontSize="1.05rem":"sm"===t?i.titlebar.style.fontSize=".9rem":"xs"===t&&(i.titlebar.style.fontSize=".8rem")},i.setHeaderControls=function(e){if(i.options.headerControls.add){var n=i.options.headerControls.add;Array.isArray(n)||(n=[n]),n.forEach(function(e){return i.addControl(e)})}var o=[];i.controlbar.querySelectorAll(".jsPanel-btn").forEach(function(e){var t=e.className.match(/jsPanel-btn-[a-z0-9]{3,}/i)[0].substring(12);o.push(t)});var a=jsPanel.pOheaderControls(t.headerControls);return t.headerControls=a,o.forEach(function(e){a[e]&&i.setControlStatus(e,a[e])}),i.setControlSize(a.size),e&&e.call(i,i),i},i.setHeaderLogo=function(e,t){var n=[i.headerlogo],o=document.querySelector("#"+i.id+"-min");return o&&n.push(o.querySelector(".jsPanel-headerlogo")),"string"==typeof e?e.startsWith("<")?n.forEach(function(t){return t.innerHTML=e}):n.forEach(function(t){jsPanel.emptyNode(t);var n=document.createElement("img");n.src=e,t.append(n)}):n.forEach(function(t){jsPanel.emptyNode(t),t.append(e)}),i.headerlogo.childNodes.forEach(function(e){e.nodeName&&"IMG"===e.nodeName&&e.setAttribute("draggable","false")}),t&&t.call(i,i),i},i.setHeaderRemove=function(e){return i.removeChild(i.header),i.content.classList.add("jsPanel-content-noheader"),["close","maximize","normalize","minimize","smallify"].forEach(function(e){return i.setAttribute("data-btn".concat(e),"removed")}),e&&e.call(i,i),i},i.setHeaderTitle=function(e,t){var n=[i.headertitle],o=document.querySelector("#"+i.id+"-min");return o&&n.push(o.querySelector(".jsPanel-title")),"string"==typeof e?n.forEach(function(t){return t.innerHTML=e}):"function"==typeof e?n.forEach(function(t){jsPanel.emptyNode(t),t.innerHTML=e()}):n.forEach(function(t){jsPanel.emptyNode(t),t.append(e)}),t&&t.call(i,i),i},i.setIconfont=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:i,n=arguments.length>2?arguments[2]:void 0;if(e){var o,a;if("fa"===e||"far"===e||"fal"===e||"fas"===e||"fad"===e)o=["".concat(e," fa-window-close"),"".concat(e," fa-window-maximize"),"".concat(e," fa-window-restore"),"".concat(e," fa-window-minimize"),"".concat(e," fa-chevron-up")];else if("material-icons"===e)o=[e,e,e,e,e,e],a=["close","fullscreen","fullscreen_exit","call_received","expand_less"];else if(Array.isArray(e))o=["custom-control-icon ".concat(e[4]),"custom-control-icon ".concat(e[3]),"custom-control-icon ".concat(e[2]),"custom-control-icon ".concat(e[1]),"custom-control-icon ".concat(e[0])];else{if("bootstrap"!==e&&"glyphicon"!==e)return t;o=["glyphicon glyphicon-remove","glyphicon glyphicon-fullscreen","glyphicon glyphicon-resize-full","glyphicon glyphicon-minus","glyphicon glyphicon-chevron-up"]}t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return jsPanel.emptyNode(e).innerHTML=""}),Array.prototype.slice.call(t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn > span")).reverse().forEach(function(t,n){t.className=o[n],"material-icons"===e&&(t.textContent=a[n])})}return n&&n.call(t,t),t},i.addToolbar=function(e,t,n){if("header"===e?e=i.headertoolbar:"footer"===e&&(e=i.footer),"string"==typeof t)e.innerHTML=t;else if(Array.isArray(t))t.forEach(function(t){"string"==typeof t?e.innerHTML+=t:e.append(t)});else if("function"==typeof t){var o=t.call(i,i);"string"==typeof o?e.innerHTML=o:e.append(o)}else e.append(t);return e.classList.add("active"),n&&n.call(i,i),i},i.addCloseControl=function(){var e=document.createElement("button"),t=i.content.style.color;return e.classList.add("jsPanel-addCloseCtrl"),e.innerHTML=jsPanel.icons.close,e.style.color=t,i.options.rtl&&e.classList.add("rtl"),i.appendChild(e),jsPanel.pointerup.forEach(function(t){e.addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}),jsPanel.pointerdown.forEach(function(t){e.addEventListener(t,function(e){return e.preventDefault()})}),i},i.addControl=function(e){if(!e.html)return i;e.position||(e.position=1);var n=i.controlbar.querySelectorAll(".jsPanel-btn").length,o=document.createElement("button");o.innerHTML=e.html,o.className="jsPanel-btn jsPanel-btn-".concat(e.name," jsPanel-btn-").concat(t.headerControls.size),o.style.color=i.header.style.color,e.position>n?i.controlbar.append(o):i.controlbar.insertBefore(o,i.querySelector(".jsPanel-controlbar .jsPanel-btn:nth-child(".concat(e.position,")")));var a=e.ariaLabel||e.name;return a&&o.setAttribute("aria-label",a),jsPanel.pointerup.forEach(function(t){o.addEventListener(t,function(t){if(t.preventDefault(),t.button&&t.button>0)return!1;e.handler.call(i,i,o)})}),e.afterInsert&&e.afterInsert.call(o,o),i},i.setRtl=function(){[i.header,i.content,i.footer].forEach(function(e){e.dir="rtl",t.rtl.lang&&(e.lang=t.rtl.lang)})},i.id=t.id,i.classList.add("jsPanel-"+t.paneltype),"standard"===t.paneltype&&(i.style.zIndex=this.zi.next()),r.append(i),i.front(!1,!1),i.setTheme(t.theme),t.boxShadow&&i.classList.add("jsPanel-depth-".concat(t.boxShadow)),t.header){if(t.headerLogo&&i.setHeaderLogo(t.headerLogo),i.setIconfont(t.iconfont),i.setHeaderTitle(t.headerTitle),i.setHeaderControls(),jsPanel.isIE){var k=[i.headerbar,i.controlbar];switch(i.options.headerControls.size){case"md":k.forEach(function(e){e.style.height="34px"});break;case"xs":k.forEach(function(e){e.style.height="26px"});break;case"sm":k.forEach(function(e){e.style.height="30px"});break;case"lg":k.forEach(function(e){e.style.height="38px"});break;case"xl":k.forEach(function(e){e.style.height="42px"})}}if("auto-show-hide"===t.header){var B="jsPanel-depth-"+t.boxShadow;i.header.style.opacity=0,i.style.backgroundColor="transparent",this.remClass(i,B),this.setClass(i.content,B),i.header.addEventListener("mouseenter",function(){i.header.style.opacity=1,jsPanel.setClass(i,B),jsPanel.remClass(i.content,B)}),i.header.addEventListener("mouseleave",function(){i.header.style.opacity=0,jsPanel.remClass(i,B),jsPanel.setClass(i.content,B)})}}else i.setHeaderRemove(),t.addCloseControl&&i.addCloseControl();if(t.headerToolbar&&i.addToolbar(i.headertoolbar,t.headerToolbar),t.footerToolbar&&i.addToolbar(i.footer,t.footerToolbar),t.border&&i.setBorder(t.border),t.borderRadius&&i.setBorderRadius(t.borderRadius),t.css)for(var T=0,L=Object.entries(t.css);T-1?i.progressbar.classList.add(M.background+"-bg"):jsPanel.colorNames[M.background]?i.progressbar.style.background="#"+jsPanel.colorNames[M.background]:i.progressbar.style.background=M.background:i.progressbar.classList.add("success-bg")),I.style.animation="".concat(M.time," progressbar")}if(t.rtl&&i.setRtl(),i.setSize(),i.status="normalized",t.position?this.position(i,t.position):i.style.opacity=1,document.dispatchEvent(d),i.calcSizeFactors(),t.animateIn&&(i.addEventListener("animationend",function(){e.remClass(i,t.animateIn)}),this.setClass(i,t.animateIn)),t.syncMargins){var H=this.pOcontainment(t.maximizedMargin);t.dragit&&(t.dragit.containment=H,!0===t.dragit.snap?(t.dragit.snap=jsPanel.defaultSnapConfig,t.dragit.snap.containment=!0):t.dragit.snap&&(t.dragit.snap.containment=!0)),t.resizeit&&(t.resizeit.containment=H)}if(t.dragit?(["start","drag","stop"].forEach(function(e){t.dragit[e]?"function"==typeof t.dragit[e]&&(t.dragit[e]=[t.dragit[e]]):t.dragit[e]=[]}),i.drag(t.dragit),i.addEventListener("jspaneldragstop",function(e){e.panel===i&&i.calcSizeFactors()},!1)):i.titlebar.style.cursor="default",t.resizeit){["start","resize","stop"].forEach(function(e){t.resizeit[e]?"function"==typeof t.resizeit[e]&&(t.resizeit[e]=[t.resizeit[e]]):t.resizeit[e]=[]}),i.sizeit(t.resizeit);var N=void 0;i.addEventListener("jspanelresizestart",function(e){e.panel===i&&(N=i.status)},!1),i.addEventListener("jspanelresizestop",function(e){e.panel===i&&("smallified"===N||"smallifiedmax"===N||"maximized"===N)&&parseFloat(i.style.height)>parseFloat(window.getComputedStyle(i.header).height)&&(i.setControls([".jsPanel-btn-normalize"]),i.status="normalized",document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every"),i.calcSizeFactors())},!1)}if(i.saveCurrentDimensions(!0),i.saveCurrentPosition(),t.setStatus&&("smallifiedmax"===t.setStatus?i.maximize().smallify():"smallified"===t.setStatus?i.smallify():i[t.setStatus.slice(0,-1)]()),this.pointerdown.forEach(function(e){i.addEventListener(e,function(e){e.target.closest(".jsPanel-btn-close")||e.target.closest(".jsPanel-btn-minimize")||"standard"!==t.paneltype||i.front()},!1)}),t.onwindowresize&&"window"===i.options.container&&window.addEventListener("resize",i.windowResizeHandler,!1),t.onparentresize){var V=t.onparentresize,_=_typeof(V),X=i.isChildpanel();if(X){var Y=X.content,$=[];i.parentResizeHandler=function(e){if(e.panel===X){$[0]=Y.offsetWidth,$[1]=Y.offsetHeight;var t,n,o=i.status;"maximized"===o&&V?i.maximize():i.snapped&&"minimized"!==o?i.snap(i.snapped,!0):"normalized"===o||"smallified"===o||"maximized"===o?"function"===_?V.call(i,i,{width:$[0],height:$[1]}):"object"===_&&!0===V.preset?(t=($[0]-i.offsetWidth)*i.hf,i.style.left=t<=0?0:t+"px",n=($[1]-i.offsetHeight)*i.vf,i.style.top=n<=0?0:n+"px",V.callback.call(i,i,{width:$[0],height:$[1]})):"boolean"===_&&(t=($[0]-i.offsetWidth)*i.hf,i.style.left=t<=0?0:t+"px",n=($[1]-i.offsetHeight)*i.vf,i.style.top=n<=0?0:n+"px"):"smallifiedmax"===o&&V&&i.maximize().smallify()}},document.addEventListener("jspanelresize",i.parentResizeHandler,!1)}}return this.globalCallbacks&&(Array.isArray(this.globalCallbacks)?this.globalCallbacks.forEach(function(e){return e.call(i,i)}):this.globalCallbacks.call(i,i)),t.callback&&(Array.isArray(t.callback)?t.callback.forEach(function(e){return e.call(i,i)}):t.callback.call(i,i)),n&&n.call(i,i),document.dispatchEvent(s),i}};"undefined"!=typeof module&&(module.exports=jsPanel); \ No newline at end of file +"use strict";function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_unsupportedIterableToArray(e)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _iterableToArray(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function _arrayWithoutHoles(e){if(Array.isArray(e))return _arrayLikeToArray(e)}function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_unsupportedIterableToArray(e,t)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(e,t){if(e){if("string"==typeof e)return _arrayLikeToArray(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(e,t):void 0}}function _arrayLikeToArray(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n',maximize:'',normalize:'',minimize:'',smallify:''},idCounter:0,isIE:document.documentMode||!1,pointerdown:"onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],pointermove:"onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],pointerup:"onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"],polyfills:(Object.assign||Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:function(e){if(null==e)throw new TypeError("Cannot convert first argument to object");for(var t=Object(e),n=1;n=0&&n.item(t)!==o;);}while(t<0&&(o=o.parentElement));return o}),function(){if("function"==typeof window.CustomEvent)return!1;function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};var n=document.createEvent("CustomEvent");return n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),n}e.prototype=window.Event.prototype,window.CustomEvent=e}(),String.prototype.endsWith||(String.prototype.endsWith=function(e,t){return(void 0===t||t>this.length)&&(t=this.length),this.substring(t-e.length,t)===e}),String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{value:function(e,t){var n=t>0?0|t:0;return this.substring(n,n+e.length)===e}}),String.prototype.includes||(String.prototype.includes=function(e,t){if(e instanceof RegExp)throw TypeError("first argument must not be a RegExp");return void 0===t&&(t=0),-1!==this.indexOf(e,t)}),String.prototype.repeat||(String.prototype.repeat=function(e){if(null==this)throw new TypeError("can't convert "+this+" to object");var t=""+this;if((e=+e)!=e&&(e=0),e<0)throw new RangeError("repeat count must be non-negative");if(e==1/0)throw new RangeError("repeat count must be less than infinity");if(e=Math.floor(e),0==t.length||0==e)return"";if(t.length*e>=1<<28)throw new RangeError("repeat count must not overflow maximum string size");var n=t.length*e;for(e=Math.floor(Math.log(e)/Math.log(2));e;)t+=t,e--;return t+=t.substring(0,n-t.length)}),Number.isInteger=Number.isInteger||function(e){return"number"==typeof e&&isFinite(e)&&Math.floor(e)===e},void(Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(e,t){if(null==this)throw new TypeError('"this" is null or not defined');var n=Object(this),o=n.length>>>0;if(0===o)return!1;for(var a,r,i=0|t,s=Math.max(i>=0?i:o-Math.abs(i),0);s0&&void 0!==arguments[0])||arguments[0]?(this.pointerdown="onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"]):(this.pointerdown="ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="ontouchend"in window?["touchend","mouseup"]:["mouseup"])},pOcontainer:function(e){if("window"===e)return document.body;if("string"==typeof e){var t=document.querySelectorAll(e);return!!(t.length&&t.length>0)&&t}return 1===e.nodeType?e:!!e.length&&e[0]},pOcontainment:function(e){var t=e;if("function"==typeof e&&(t=e()),"number"==typeof t)return[t,t,t,t];if(Array.isArray(t)){if(1===t.length)return[t[0],t[0],t[0],t[0]];if(2===t.length)return t.concat(t);3===t.length&&(t[3]=t[1])}return t},pOsize:function(e,t){var n=t||this.defaults.contentSize,o=e.parentElement;if("string"==typeof n){var a=n.trim().split(" ");(n={}).width=a[0],2===a.length?n.height=a[1]:n.height=a[0]}else n.width&&!n.height?n.height=n.width:n.height&&!n.width&&(n.width=n.height);if(String(n.width).match(/^[\d.]+$/gi))n.width+="px";else if("string"==typeof n.width&&n.width.endsWith("%"))if(o===document.body)n.width=window.innerWidth*(parseFloat(n.width)/100)+"px";else{var r=window.getComputedStyle(o),i=parseFloat(r.borderLeftWidth)+parseFloat(r.borderRightWidth);n.width=(parseFloat(r.width)-i)*(parseFloat(n.width)/100)+"px"}else"function"==typeof n.width&&(n.width=n.width.call(e,e),"number"==typeof n.width?n.width+="px":"string"==typeof n.width&&n.width.match(/^[\d.]+$/gi)&&(n.width+="px"));if(String(n.height).match(/^[\d.]+$/gi))n.height+="px";else if("string"==typeof n.height&&n.height.endsWith("%"))if(o===document.body)n.height=window.innerHeight*(parseFloat(n.height)/100)+"px";else{var s=window.getComputedStyle(o),l=parseFloat(s.borderTopWidth)+parseFloat(s.borderBottomWidth);n.height=(parseFloat(s.height)-l)*(parseFloat(n.height)/100)+"px"}else"function"==typeof n.height&&(n.height=n.height.call(e,e),"number"==typeof n.height?n.height+="px":"string"==typeof n.height&&n.height.match(/^[\d.]+$/gi)&&(n.height+="px"));return n},pOborder:function(e){var t=[],n=e.trim().replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," ").split(" ");return n.forEach(function(e,t){(e.startsWith("--")||e.startsWith("var"))&&(n[t]=jsPanel.getCssVariableValue(e))}),n.forEach(function(e){jsPanel.colorNames[e]?t[2]="#"+jsPanel.colorNames[e]:e.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)?t[1]=e:e.match(/(thin|medium|thick)|(\d*\.?\d*(cap|ch|em|ex|ic|lh|rem|rlh|vh|vw|vmax|vmin|vb|vi|px|cm|mm|Q|in|pc|pt))/)?t[0]=e:t[2]=e}),t[0]||(t[0]="medium"),t[1]||(t[1]="solid"),t[2]||(t[2]=""),t},pOheaderControls:function(e){if("string"==typeof e){var t={},n=e.toLowerCase(),o=n.match(/xl|lg|md|sm|xs/),a=n.match(/closeonly|none/);return o&&(t.size=o[0]),a&&(t=Object.assign({},t,{maximize:"remove",normalize:"remove",minimize:"remove",smallify:"remove"}),"none"===a[0]&&(t.close="remove")),Object.assign({},this.defaults.headerControls,t)}return Object.assign({},this.defaults.headerControls,e)},pOtheme:function(e){var t,n="";if((e=e.trim()).match(/^(rgb|hsl|var)/)){var o=e.indexOf(")");(t=e.slice(0,o+1).replace(/\s+/g,"")).startsWith("var")&&(t=jsPanel.getCssVariableValue(t)),n=e.slice(o+1,e.length).trim()}else if(e.match(/^(#|\w|--)/)){var a=e.indexOf(" ");a>0?(t=e.slice(0,a+1).replace(/\s+/g,""),n=e.slice(a+1,e.length).trim()):t=e,t.startsWith("--")&&(t=jsPanel.getCssVariableValue(t))}if(t.match(/^([\da-f]{3}|[\da-f]{6})$/gi)&&(t="#"+t),n.startsWith("fillcolor")){var r=n.indexOf(" ");n=(n=n.slice(r+1,n.length).trim().replace(/\s+/g,"")).match(/^([\da-f]{3}|[\da-f]{6})$/gi)?"#"+n:jsPanel.colorNames[n]?"#"+jsPanel.colorNames[n]:n.match(/^(--|var)/)?jsPanel.getCssVariableValue(n):"#fff"}return{color:t,colors:!1,filling:n}},color:function(e){var t,n,o,a,r,i,s,l,c,d=e.toLowerCase(),p={},h=/^rgba?\((\d{1,3}),(\d{1,3}),(\d{1,3}),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi,u=/^hsla?\((\d{1,3}),(\d{1,3}%),(\d{1,3}%),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi,f=this.colorNames;return f[d]&&(d=f[d]),null!==d.match(/^#?([\da-f]{3}|[\da-f]{6})$/gi)?(d=d.replace("#",""),d.length%2==1?(t=d.slice(0,1).repeat(2),n=d.slice(1,2).repeat(2),o=d.slice(2,3).repeat(2),p.rgb={r:parseInt(t,16),g:parseInt(n,16),b:parseInt(o,16)},p.hex="#".concat(t).concat(n).concat(o)):(p.rgb={r:parseInt(d.slice(0,2),16),g:parseInt(d.slice(2,4),16),b:parseInt(d.slice(4,6),16)},p.hex="#".concat(d)),c=this.rgbToHsl(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl=c,p.rgb.css="rgb(".concat(p.rgb.r,",").concat(p.rgb.g,",").concat(p.rgb.b,")")):d.match(h)?(s=h.exec(d),p.rgb={css:d,r:s[1],g:s[2],b:s[3]},p.hex=this.rgbToHex(s[1],s[2],s[3]),c=this.rgbToHsl(s[1],s[2],s[3]),p.hsl=c):d.match(u)?(a=(s=u.exec(d))[1]/360,r=s[2].slice(0,s[2].length-1)/100,i=s[3].slice(0,s[3].length-1)/100,l=this.hslToRgb(a,r,i),p.rgb={css:"rgb(".concat(l[0],",").concat(l[1],",").concat(l[2],")"),r:l[0],g:l[1],b:l[2]},p.hex=this.rgbToHex(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl={css:"hsl(".concat(s[1],",").concat(s[2],",").concat(s[3],")"),h:s[1],s:s[2],l:s[3]}):(p.hex="#f5f5f5",p.rgb={css:"rgb(245,245,245)",r:245,g:245,b:245},p.hsl={css:"hsl(0,0%,96%)",h:0,s:"0%",l:"96%"}),p},calcColors:function(e){var t=this.colorBrightnessThreshold,n=this.color(e),o=this.lighten(e,this.colorFilledLight),a=this.darken(e,this.colorFilled),r=this.perceivedBrightness(e)<=t?"#ffffff":"#000000",i=this.perceivedBrightness(o)<=t?"#ffffff":"#000000",s=this.perceivedBrightness(a)<=t?"#ffffff":"#000000",l=this.lighten(e,this.colorFilledDark),c=this.perceivedBrightness(l)<=t?"#ffffff":"#000000";return[n.hsl.css,o,a,r,i,s,l,c]},darken:function(e,t){var n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o-o*t)+"%";return"hsl(".concat(n.h,",").concat(n.s,",").concat(a,")")},lighten:function(e,t){var n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o+(100-o)*t)+"%";return"hsl(".concat(n.h,",").concat(n.s,",").concat(a,")")},hslToRgb:function(e,t,n){var o,a,r;if(0===t)o=a=r=n;else{var i=function(e,t,n){return n<0&&(n+=1),n>1&&(n-=1),n<1/6?e+6*(t-e)*n:n<.5?t:n<2/3?e+(t-e)*(2/3-n)*6:e},s=n<.5?n*(1+t):n+t-n*t,l=2*n-s;o=i(l,s,e+1/3),a=i(l,s,e),r=i(l,s,e-1/3)}return[Math.round(255*o),Math.round(255*a),Math.round(255*r)]},rgbToHsl:function(e,t,n){e/=255,t/=255,n/=255;var o,a,r=Math.max(e,t,n),i=Math.min(e,t,n),s=(r+i)/2;if(r===i)o=a=0;else{var l=r-i;switch(a=s>.5?l/(2-r-i):l/(r+i),r){case e:o=(t-n)/l+(t=0&&(f=this.applyPositionAutopos(e,f,t)),(t.offsetX||t.offsetY)&&(f=this.applyPositionOffset(e,f,t)),(t.minLeft||t.minTop||t.maxLeft||t.maxTop)&&(f=this.applyPositionMinMax(e,f,t)),t.modify&&(f=this.applyPositionModify(e,f,t)),"number"==typeof e.options.opacity?e.style.opacity=e.options.opacity:e.style.opacity=1,e},applyPositionAutopos:function(e,t,n){var o="".concat(n.my,"-").concat(n.autoposition.toLowerCase());e.classList.add(o);var a=Array.prototype.slice.call(document.querySelectorAll(".".concat(o))),r=a.indexOf(e);if(a.length>1){switch(n.autoposition){case"down":a.forEach(function(e,n){n>0&&n<=r&&(t.top=parseFloat(t.top)+a[--n].getBoundingClientRect().height+jsPanel.autopositionSpacing+"px")});break;case"up":a.forEach(function(e,n){n>0&&n<=r&&(t.top=parseFloat(t.top)-a[--n].getBoundingClientRect().height-jsPanel.autopositionSpacing+"px")});break;case"right":a.forEach(function(e,n){n>0&&n<=r&&(t.left=parseFloat(t.left)+a[--n].getBoundingClientRect().width+jsPanel.autopositionSpacing+"px")});break;case"left":a.forEach(function(e,n){n>0&&n<=r&&(t.left=parseFloat(t.left)-a[--n].getBoundingClientRect().width-jsPanel.autopositionSpacing+"px")})}e.style.left=t.left,e.style.top=t.top}return{left:t.left,top:t.top}},applyPositionOffset:function(e,t,n){["offsetX","offsetY"].forEach(function(e){n[e]?("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),!1===isNaN(n[e])&&(n[e]="".concat(n[e],"px"))):n[e]="0px"}),e.style.left="calc(".concat(e.style.left," + ").concat(n.offsetX,")"),e.style.top="calc(".concat(e.style.top," + ").concat(n.offsetY,")");var o=getComputedStyle(e);return{left:o.left,top:o.top}},applyPositionMinMax:function(e,t,n){if(["minLeft","minTop","maxLeft","maxTop"].forEach(function(e){n[e]&&("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),(Number.isInteger(n[e])||n[e].match(/^\d+$/))&&(n[e]="".concat(n[e],"px")))}),n.minLeft){e.style.left=n.minLeft;var o=getComputedStyle(e).left;parseFloat(o)parseFloat(t.left)?e.style.left=t.left:t.left=r}if(n.maxTop){e.style.top=n.maxTop;var i=getComputedStyle(e).top;parseFloat(i)>parseFloat(t.top)?e.style.top=t.top:t.top=i}var s=getComputedStyle(e);return{left:s.left,top:s.top}},applyPositionModify:function(e,t,n){if(n.modify&&"function"==typeof n.modify){var o=n.modify.call(t,t,n);e.style.left=Number.isInteger(o.left)||o.left.match(/^\d+$/)?"".concat(o.left,"px"):o.left,e.style.top=Number.isInteger(o.top)||o.top.match(/^\d+$/)?"".concat(o.top,"px"):o.top}var a=getComputedStyle(e);return{left:a.left,top:a.top}},autopositionRemaining:function(e){var t,n=e.options.container;(["left-top-down","left-top-right","center-top-down","right-top-down","right-top-left","left-bottom-up","left-bottom-right","center-bottom-up","right-bottom-up","right-bottom-left"].forEach(function(n){e.classList.contains(n)&&(t=n)}),t)&&("window"===n?document.body:"string"==typeof n?document.querySelector(n):n).querySelectorAll(".".concat(t)).forEach(function(e){return e.reposition()})},getThemeDetails:function(e){var t=this.pOtheme(e);if(t.color.startsWith("bootstrap-")){var n=t.color.indexOf("-"),o=document.createElement("button");o.className="btn btn"+t.color.slice(n),document.body.appendChild(o),t.color=getComputedStyle(o).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(o),o=void 0}return t.colors=this.calcColors(t.color),t},clearTheme:function(e,t){return e.content.classList.remove("jsPanel-content-filled","jsPanel-content-filledlight"),e.header.classList.remove("jsPanel-hdr-light"),e.header.classList.remove("jsPanel-hdr-dark"),e.style.backgroundColor="",this.setStyles(e.headertoolbar,{boxShadow:"",width:"",marginLeft:"",borderTopColor:"transparent"}),this.setStyles(e.content,{background:"",borderTopColor:"transparent"}),e.header.style.background="",Array.prototype.slice.call(e.controlbar.querySelectorAll(".jsPanel-icon")).concat([e.headerlogo,e.headertitle,e.headertoolbar,e.content]).forEach(function(e){return e.style.color=""}),t&&t.call(e,e),e},applyColorTheme:function(e,t){if(e.style.backgroundColor=t.colors[0],e.header.style.backgroundColor=t.colors[0],e.header.style.color=t.colors[3],[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(function(n){return e.querySelector(n).style.color=t.colors[3]}),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return e.style.color=t.colors[3]}),"string"==typeof e.options.theme&&"filled"===t.filling&&(e.content.style.borderTop="#000000"===t.colors[3]?"1px solid rgba(0,0,0,0.15)":"1px solid rgba(255,255,255,0.15)"),"#000000"===t.colors[3]?e.header.classList.add("jsPanel-hdr-light"):e.header.classList.add("jsPanel-hdr-dark"),t.filling)switch(t.filling){case"filled":this.setStyles(e.content,{backgroundColor:t.colors[2],color:t.colors[3]});break;case"filledlight":e.content.style.backgroundColor=t.colors[1];break;case"filleddark":this.setStyles(e.content,{backgroundColor:t.colors[6],color:t.colors[7]});break;default:e.content.style.backgroundColor=t.filling,e.content.style.color=this.perceivedBrightness(t.filling)<=this.colorBrightnessThreshold?"#fff":"#000"}return e},applyCustomTheme:function(e,t){var n=this,o={bgPanel:"#ffffff",bgContent:"#ffffff",bgFooter:"#f5f5f5",colorHeader:"#000000",colorContent:"#000000",colorFooter:"#000000",border:void 0,borderRadius:void 0},a="object"===_typeof(t)?Object.assign(o,t):o,r=a.bgPanel,i=a.bgContent,s=a.colorHeader,l=a.colorContent,c=a.bgFooter,d=a.colorFooter;return this.colorNames[r]?e.style.background="#"+this.colorNames[r]:e.style.background=this.getCssVariableValue(r),this.colorNames[s]&&(s="#"+this.colorNames[s]),[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(function(t){return e.querySelector(t).style.color=n.getCssVariableValue(s)}),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return e.style.color=n.getCssVariableValue(s)}),this.colorNames[i]?e.content.style.background="#"+this.colorNames[i]:e.content.style.background=this.getCssVariableValue(i),this.colorNames[l]?e.content.style.color="#"+this.colorNames[l]:e.content.style.color=this.getCssVariableValue(l),this.perceivedBrightness(s)>this.colorBrightnessThreshold?e.header.classList.add("jsPanel-hdr-dark"):e.header.classList.add("jsPanel-hdr-light"),this.perceivedBrightness(l)>this.colorBrightnessThreshold?e.content.style.borderTop="1px solid rgba(255,255,255,0.15)":e.content.style.borderTop="1px solid rgba(0,0,0,0.15)",this.colorNames[c]?e.footer.style.background="#"+this.colorNames[c]:e.footer.style.background=this.getCssVariableValue(c),this.colorNames[d]?e.footer.style.color="#"+this.colorNames[d]:e.footer.style.color=this.getCssVariableValue(d),a.border&&e.setBorder(a.border),a.borderRadius&&(e.options.borderRadius=void 0,e.setBorderRadius(a.borderRadius)),e},getCssVariableValue:function(e){if(e.startsWith("--"))return getComputedStyle(document.documentElement).getPropertyValue(e).replace(/\s+/g,"");if(e.startsWith("var")){var t=e.slice(e.indexOf("(")+1,e.indexOf(")"));return getComputedStyle(document.documentElement).getPropertyValue(t).replace(/\s+/g,"")}return e},getScrollbarWidth:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:document.body;if(e===document.body)return{y:window.innerWidth-document.documentElement.clientWidth,x:window.innerHeight-document.documentElement.clientHeight};var t=getComputedStyle(e);return{y:e.offsetWidth-e.clientWidth-parseFloat(t.borderRightWidth)-parseFloat(t.borderLeftWidth),x:e.offsetHeight-e.clientHeight-parseFloat(t.borderBottomWidth)-parseFloat(t.borderTopWidth)}},remClass:function(e,t){return t.trim().split(/\s+/).forEach(function(t){return e.classList.remove(t)}),e},setClass:function(e,t){return t.trim().split(/\s+/).forEach(function(t){return e.classList.add(t)}),e},setStyles:function(e,t){for(var n=0,o=Object.entries(t);n1&&void 0!==arguments[1]?arguments[1]:"application/javascript",n=arguments.length>2?arguments[2]:void 0;if(!document.querySelector('script[src="'.concat(e,'"]'))){var o=document.createElement("script");o.src=e,o.type=t,document.head.appendChild(o),n&&(o.onload=n)}},ajax:function(e,t){var n,o,a=new XMLHttpRequest,r={method:"GET",async:!0,user:"",pwd:"",done:function(){if(t){var e=jsPanel.strToHtml(this.responseText);n.urlSelector&&(e=e.querySelector(n.urlSelector)),t.contentRemove(),t.content.append(e)}},autoresize:!0,autoreposition:!0};if(t&&"string"==typeof e)n=Object.assign({},r,{url:e});else{if("object"!==_typeof(e)||!e.url){if(this.errorReporting){jsPanel.errorpanel("XMLHttpRequest seems to miss the url parameter!")}return}(n=Object.assign({},r,e)).url=e.url,!1===n.async&&(n.timeout=0,n.withCredentials&&(n.withCredentials=void 0),n.responseType&&(n.responseType=void 0))}o=n.url.trim().split(/\s+/),n.url=encodeURI(o[0]),o.length>1&&(o.shift(),n.urlSelector=o.join(" ")),a.onreadystatechange=function(){4===a.readyState&&(200===a.status?t?n.done.call(a,a,t):n.done.call(a,a):n.fail&&(t?n.fail.call(a,a,t):n.fail.call(a,a)),n.always&&(t?n.always.call(a,a,t):n.always.call(a,a)),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n),jsPanel.ajaxAlwaysCallbacks.length&&jsPanel.ajaxAlwaysCallbacks.forEach(function(e){t?e.call(a,a,t):e.call(a,a)}))},a.open(n.method,n.url,n.async,n.user,n.pwd),a.timeout=n.timeout||0,n.withCredentials&&(a.withCredentials=n.withCredentials),n.responseType&&(a.responseType=n.responseType),n.beforeSend&&(t?n.beforeSend.call(a,a,t):n.beforeSend.call(a,a)),n.data?a.send(n.data):a.send(null)},fetch:function(e){function t(t,n){return e.apply(this,arguments)}return t.toString=function(){return e.toString()},t}(function(e,t){var n,o={bodyMethod:"text",autoresize:!0,autoreposition:!0,done:function(e,t){if(t){var n=jsPanel.strToHtml(e);t.contentRemove(),t.content.append(n)}}};if(t&&"string"==typeof e)n=Object.assign({},o,{resource:encodeURI(e)});else{if("object"!==_typeof(e)||!e.resource){if(this.errorReporting){jsPanel.errorpanel("Fetch Request seems to miss the resource parameter!")}return}(n=Object.assign({},o,e)).resource=encodeURI(e.resource)}var a=n.fetchInit||{};n.beforeSend&&(t?n.beforeSend.call(e,e,t):n.beforeSend.call(e,e)),fetch(n.resource,a).then(function(e){if(e.ok)return e[n.bodyMethod]()}).then(function(e){t?n.done.call(e,e,t):n.done.call(e,e),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n)})}),ajaxAutoresizeAutoreposition:function(e,t){var n=e.options.contentSize;if("string"==typeof n&&n.match(/auto/i)){var o=n.split(" "),a=Object.assign({},{width:o[0],height:o[1]});t.autoresize&&e.resize(a),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}else if("object"===_typeof(n)&&("auto"===n.width||"auto"===n.height)){var r=Object.assign({},n);t.autoresize&&e.resize(r),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}},createPanelTemplate:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=document.createElement("div");return t.className="jsPanel",t.style.left="0",t.style.top="0",e&&["close","maximize","normalize","minimize","smallify"].forEach(function(e){t.setAttribute("data-btn".concat(e),"enabled")}),t.innerHTML='
\n
\n \n
\n
\n
\n
\n \n \n \n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
'),t},createMinimizedTemplate:function(){var e=document.createElement("div");return e.className="jsPanel-replacement",e.innerHTML='
\n
\n \n
\n
\n
\n
\n \n \n \n
\n
\n
"),e},createSnapArea:function(e,t,n){var o=document.createElement("div"),a=e.parentElement;o.className="jsPanel-snap-area jsPanel-snap-area-".concat(t),"lt"===t||"rt"===t||"rb"===t||"lb"===t?(o.style.width=n+"px",o.style.height=n+"px"):"ct"===t||"cb"===t?o.style.height=n+"px":"lc"!==t&&"rc"!==t||(o.style.width=n+"px"),a!==document.body&&(o.style.position="absolute"),document.querySelector(".jsPanel-snap-area.jsPanel-snap-area-".concat(t))||e.parentElement.appendChild(o)},removeSnapAreas:function(){document.querySelectorAll(".jsPanel-snap-area").forEach(function(e){return e.parentElement.removeChild(e)})},extend:function(e){if("[object Object]"===Object.prototype.toString.call(e))for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&(this.extensions[t]=e[t])},getPanels:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){return this.classList.contains("jsPanel-standard")};return Array.prototype.slice.call(document.querySelectorAll(".jsPanel")).filter(function(t){return e.call(t,t)}).sort(function(e,t){return t.style.zIndex-e.style.zIndex})},processCallbacks:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"some",o=arguments.length>3?arguments[3]:void 0,a=arguments.length>4?arguments[4]:void 0;if("function"==typeof t&&(t=[t]),n)return t[n](function(t){return t.call(e,e,o,a)});t.forEach(function(t){return t.call(e,e,o,a)})},resetZi:function(){this.zi=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:jsPanel.ziBase;return{next:function(){return e++}}}(),Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).sort(function(e,t){return e.style.zIndex-t.style.zIndex}).forEach(function(e){return e.style.zIndex=jsPanel.zi.next()})},errorpanel:function(e){this.create({paneltype:"error",dragit:!1,resizeit:!1,theme:{bgPanel:"white",bgContent:"white",colorHeader:"rebeccapurple",colorContent:"#333333",border:"2px solid rebeccapurple"},borderRadius:".33rem",headerControls:"closeonly xs",headerTitle:"⚠ jsPanel Error",contentSize:{width:"50%",height:"auto"},position:"center-top 0 5 down",animateIn:"jsPanelFadeIn",content:'

'.concat(e,"

")})},create:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=arguments.length>1?arguments[1]:void 0;jsPanel.zi||(jsPanel.zi=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:jsPanel.ziBase;return{next:function(){return e++}}}()),t.config?delete(t=Object.assign({},this.defaults,t.config,t)).config:t=Object.assign({},this.defaults,t),t.id?"function"==typeof t.id&&(t.id=t.id()):t.id="jsPanel-".concat(jsPanel.idCounter+=1);var o=document.getElementById(t.id);if(null!==o){if(o.classList.contains("jsPanel")&&o.front(),this.errorReporting){var a="◀ COULD NOT CREATE NEW JSPANEL ►
An element with the ID ".concat(t.id," already exists in the document.");jsPanel.errorpanel(a)}return!1}var r=this.pOcontainer(t.container);if("object"===_typeof(r)&&r.length&&r.length>0&&(r=r[0]),!r){if(this.errorReporting){jsPanel.errorpanel("◀ COULD NOT CREATE NEW JSPANEL ►
The container to append the panel to does not exist")}return!1}["onbeforeclose","onbeforemaximize","onbeforeminimize","onbeforenormalize","onbeforesmallify","onbeforeunsmallify","onclosed","onfronted","onmaximized","onminimized","onnormalized","onsmallified","onstatuschange","onunsmallified"].forEach(function(e){t[e]?"function"==typeof t[e]&&(t[e]=[t[e]]):t[e]=[]});var i=t.template||this.createPanelTemplate();i.options=t,i.closetimer=void 0,i.status="initialized",i.currentData={},i.header=i.querySelector(".jsPanel-hdr"),i.headerbar=i.header.querySelector(".jsPanel-headerbar"),i.titlebar=i.header.querySelector(".jsPanel-titlebar"),i.headerlogo=i.headerbar.querySelector(".jsPanel-headerlogo"),i.headertitle=i.headerbar.querySelector(".jsPanel-title"),i.controlbar=i.headerbar.querySelector(".jsPanel-controlbar"),i.headertoolbar=i.header.querySelector(".jsPanel-hdr-toolbar"),i.content=i.querySelector(".jsPanel-content"),i.footer=i.querySelector(".jsPanel-ftr"),i.snappableTo=!1,i.snapped=!1,i.droppableTo=!1,i.progressbar=i.autocloseProgressbar=i.querySelector(".jsPanel-progressbar");var s=new CustomEvent("jspanelloaded",{detail:t.id,cancelable:!0}),l=new CustomEvent("jspanelstatuschange",{detail:t.id,cancelable:!0}),c=new CustomEvent("jspanelbeforenormalize",{detail:t.id,cancelable:!0}),d=new CustomEvent("jspanelnormalized",{detail:t.id,cancelable:!0}),p=new CustomEvent("jspanelbeforemaximize",{detail:t.id,cancelable:!0}),h=new CustomEvent("jspanelmaximized",{detail:t.id,cancelable:!0}),u=new CustomEvent("jspanelbeforeminimize",{detail:t.id,cancelable:!0}),f=new CustomEvent("jspanelminimized",{detail:t.id,cancelable:!0}),m=new CustomEvent("jspanelbeforesmallify",{detail:t.id,cancelable:!0}),g=new CustomEvent("jspanelsmallified",{detail:t.id,cancelable:!0}),b=new CustomEvent("jspanelsmallifiedmax",{detail:t.id,cancelable:!0}),y=new CustomEvent("jspanelbeforeunsmallify",{detail:t.id,cancelable:!0}),v=new CustomEvent("jspanelfronted",{detail:t.id,cancelable:!0}),w=new CustomEvent("jspanelbeforeclose",{detail:t.id,cancelable:!0}),j=new CustomEvent("jspanelclosed",{detail:t.id,cancelable:!0}),E=new CustomEvent("jspanelcloseduser",{detail:t.id,cancelable:!0});[s,l,c,d,p,h,u,f,m,g,b,y,v,w].forEach(function(e){return e.panel=i});var x=i.querySelector(".jsPanel-btn-close"),C=i.querySelector(".jsPanel-btn-maximize"),P=i.querySelector(".jsPanel-btn-normalize"),F=i.querySelector(".jsPanel-btn-smallify"),z=i.querySelector(".jsPanel-btn-minimize");x&&jsPanel.pointerup.forEach(function(e){x.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}),C&&jsPanel.pointerup.forEach(function(e){C.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.maximize()})}),P&&jsPanel.pointerup.forEach(function(e){P.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.normalize()})}),F&&jsPanel.pointerup.forEach(function(e){F.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;"normalized"===i.status||"maximized"===i.status?i.smallify():"smallified"!==i.status&&"smallifiedmax"!==i.status||i.unsmallify()})}),z&&jsPanel.pointerup.forEach(function(e){z.addEventListener(e,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.minimize()})});var S=jsPanel.extensions;for(var A in S)Object.prototype.hasOwnProperty.call(S,A)&&(i[A]=S[A]);if(i.setBorder=function(e){var t=jsPanel.pOborder(e);return t[2].length||(t[2]=i.style.backgroundColor),t=t.join(" "),i.style.border=t,i.options.border=t,i},i.setBorderRadius=function(e){"string"==typeof e&&(e.startsWith("--")||e.startsWith("var"))&&(e=e.replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," "),e=jsPanel.getCssVariableValue(e)),"number"==typeof e&&(e+="px"),i.style.borderRadius=e;var t=getComputedStyle(i);return i.options.header?(i.header.style.borderTopLeftRadius=t.borderTopLeftRadius,i.header.style.borderTopRightRadius=t.borderTopRightRadius):(i.content.style.borderTopLeftRadius=t.borderTopLeftRadius,i.content.style.borderTopRightRadius=t.borderTopRightRadius),i.options.footerToolbar?(i.footer.style.borderBottomRightRadius=t.borderBottomRightRadius,i.footer.style.borderBottomLeftRadius=t.borderBottomLeftRadius):(i.content.style.borderBottomRightRadius=t.borderBottomRightRadius,i.content.style.borderBottomLeftRadius=t.borderBottomLeftRadius),i},i.setTheme=function(){var e,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:t.theme,o=arguments.length>1?arguments[1]:void 0;if("minimized"===i.status&&(e=!0,i.normalize()),jsPanel.clearTheme(i),"object"===_typeof(n))t.border=void 0,jsPanel.applyCustomTheme(i,n);else if("string"==typeof n){"none"===n&&(n="white");var a=jsPanel.getThemeDetails(n);jsPanel.applyColorTheme(i,a)}return e&&i.minimize(),o&&o.call(i,i),i},i.remove=function(e,t,n){i.parentElement.removeChild(i),document.getElementById(e)?n&&n.call(i,e,i):(i.removeMinimizedReplacement(),i.status="closed",t&&document.dispatchEvent(E),document.dispatchEvent(j),i.options.onclosed&&jsPanel.processCallbacks(i,i.options.onclosed,"every",t),jsPanel.autopositionRemaining(i),n&&n.call(e,e)),window.removeEventListener("resize",i.windowResizeHandler),document.removeEventListener("jspanelresize",i.parentResizeHandler)},i.close=function(e,t){if(i.parentElement){if(i.closetimer&&window.clearInterval(i.closetimer),document.dispatchEvent(w),i.statusBefore=i.status,i.options.onbeforeclose&&i.options.onbeforeclose.length>0&&!jsPanel.processCallbacks(i,i.options.onbeforeclose,"some",i.status,t))return i;i.options.animateOut?(i.options.animateIn&&jsPanel.remClass(i,i.options.animateIn),jsPanel.setClass(i,i.options.animateOut),i.addEventListener("animationend",function(n){n.stopPropagation(),i.remove(i.id,t,e)})):i.remove(i.id,t,e)}},i.maximize=function(e,n){if(i.statusBefore=i.status,t.onbeforemaximize&&t.onbeforemaximize.length>0&&!jsPanel.processCallbacks(i,t.onbeforemaximize,"some",i.statusBefore))return i;document.dispatchEvent(p);var o=i.parentElement,a=jsPanel.pOcontainment(t.maximizedMargin);return o===document.body?(i.style.width=document.documentElement.clientWidth-a[1]-a[3]+"px",i.style.height=document.documentElement.clientHeight-a[0]-a[2]+"px",i.style.left=a[3]+"px",i.style.top=a[0]+"px"):(i.style.width=o.clientWidth-a[1]-a[3]+"px",i.style.height=o.clientHeight-a[0]-a[2]+"px",i.style.left=a[3]+"px",i.style.top=a[0]+"px"),F.style.transform="unset",i.removeMinimizedReplacement(),i.status="maximized",i.setControls([".jsPanel-btn-maximize"]),n||i.front(),document.dispatchEvent(h),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),e&&e.call(i,i,i.statusBefore),t.onmaximized&&jsPanel.processCallbacks(i,t.onmaximized,"every",i.statusBefore),i},i.minimize=function(e){if("minimized"===i.status)return i;if(i.statusBefore=i.status,t.onbeforeminimize&&t.onbeforeminimize.length>0&&!jsPanel.processCallbacks(i,t.onbeforeminimize,"some",i.statusBefore))return i;if(document.dispatchEvent(u),!document.getElementById("jsPanel-replacement-container")){var n=document.createElement("div");n.id="jsPanel-replacement-container",document.body.append(n)}if(i.style.left="-9999px",i.status="minimized",document.dispatchEvent(f),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),t.minimizeTo){var o,a,r,s=i.createMinimizedReplacement();switch(t.minimizeTo){case"default":document.getElementById("jsPanel-replacement-container").append(s);break;case"parentpanel":(o=(r=(a=i.closest(".jsPanel-content").parentElement).querySelectorAll(".jsPanel-minimized-box"))[r.length-1]).append(s);break;case"parent":(o=(a=i.parentElement).querySelector(".jsPanel-minimized-container"))||((o=document.createElement("div")).className="jsPanel-minimized-container",a.append(o)),o.append(s);break;default:document.querySelector(t.minimizeTo).append(s)}}return e&&e.call(i,i,i.statusBefore),t.onminimized&&jsPanel.processCallbacks(i,t.onminimized,"every",i.statusBefore),i},i.normalize=function(e){return"normalized"===i.status?i:(i.statusBefore=i.status,t.onbeforenormalize&&t.onbeforenormalize.length>0&&!jsPanel.processCallbacks(i,t.onbeforenormalize,"some",i.statusBefore)?i:(document.dispatchEvent(c),i.style.width=i.currentData.width,i.style.height=i.currentData.height,i.snapped?i.snap(i.snapped,!0):(i.style.left=i.currentData.left,i.style.top=i.currentData.top),F.style.transform="unset",i.removeMinimizedReplacement(),i.status="normalized",i.setControls([".jsPanel-btn-normalize"]),i.front(),document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore),e&&e.call(i,i,i.statusBefore),t.onnormalized&&jsPanel.processCallbacks(i,t.onnormalized,"every",i.statusBefore),i))},i.smallify=function(e){if("smallified"===i.status||"smallifiedmax"===i.status)return i;if(i.statusBefore=i.status,t.onbeforesmallify&&t.onbeforesmallify.length>0&&!jsPanel.processCallbacks(i,t.onbeforesmallify,"some",i.statusBefore))return i;document.dispatchEvent(m),i.style.overflow="hidden";var n=window.getComputedStyle(i),o=parseFloat(window.getComputedStyle(i.headerbar).height);i.style.height=parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth)+o+"px",F.style.transform="rotate(180deg)","normalized"===i.status?(i.setControls([".jsPanel-btn-normalize"]),i.status="smallified",document.dispatchEvent(g),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore)):"maximized"===i.status&&(i.setControls([".jsPanel-btn-maximize"]),i.status="smallifiedmax",document.dispatchEvent(b),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore));var a=i.querySelectorAll(".jsPanel-minimized-box");return a[a.length-1].style.display="none",e&&e.call(i,i,i.statusBefore),t.onsmallified&&jsPanel.processCallbacks(i,t.onsmallified,"every",i.statusBefore),i},i.unsmallify=function(e){if(i.statusBefore=i.status,"smallified"===i.status||"smallifiedmax"===i.status){if(t.onbeforeunsmallify&&t.onbeforeunsmallify.length>0&&!jsPanel.processCallbacks(i,t.onbeforeunsmallify,"some",i.statusBefore))return i;document.dispatchEvent(y),i.style.overflow="visible",i.front(),"smallified"===i.status?(i.style.height=i.currentData.height,i.setControls([".jsPanel-btn-normalize"]),i.status="normalized",document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every",i.statusBefore)):"smallifiedmax"===i.status?i.maximize():"minimized"===i.status&&i.normalize(),F.style.transform="rotate(0deg)";var n=i.querySelectorAll(".jsPanel-minimized-box");n[n.length-1].style.display="flex",e&&e.call(i,i,i.statusBefore),t.onunsmallified&&jsPanel.processCallbacks(i,t.onunsmallified,"every",i.statusBefore)}return i},i.front=function(e){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if("minimized"===i.status)"maximized"===i.statusBefore?i.maximize():i.normalize();else{var o=Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).map(function(e){return e.style.zIndex});Math.max.apply(Math,_toConsumableArray(o))>i.style.zIndex&&(i.style.zIndex=jsPanel.zi.next()),jsPanel.resetZi()}return document.dispatchEvent(v),e&&e.call(i,i),t.onfronted&&n&&jsPanel.processCallbacks(i,t.onfronted,"every",i.status),i},i.snap=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(t||(i.currentData.beforeSnap={width:i.currentData.width,height:i.currentData.height}),e&&"function"==typeof e&&!t)e.call(i,i,i.snappableTo);else if(!1!==e){var n=[0,0];if(i.options.dragit.snap.containment&&i.options.dragit.containment){var o=jsPanel.pOcontainment(i.options.dragit.containment),a=i.snappableTo;a.startsWith("left")?n[0]=o[3]:a.startsWith("right")&&(n[0]=-o[1]),a.endsWith("top")?n[1]=o[0]:a.endsWith("bottom")&&(n[1]=-o[2])}i.reposition("".concat(i.snappableTo," ").concat(n[0]," ").concat(n[1]))}t||(i.snapped=i.snappableTo)},i.move=function(e,t){var n=i.overlaps(e,"paddingbox"),o=i.parentElement;return e.appendChild(i),i.options.container=e,i.style.left=n.left+"px",i.style.top=n.top+"px",i.saveCurrentDimensions(),i.saveCurrentPosition(),i.calcSizeFactors(),t&&t.call(i,i,e,o),i},i.closeChildpanels=function(e){return i.getChildpanels().forEach(function(e){return e.close()}),e&&e.call(i,i),i},i.getChildpanels=function(e){var t=i.content.querySelectorAll(".jsPanel");return e&&t.forEach(function(t,n,o){e.call(t,t,n,o)}),t},i.isChildpanel=function(e){var t=i.closest(".jsPanel-content"),n=t?t.parentElement:null;return e&&e.call(i,i,n),!!t&&n},i.contentRemove=function(e){return jsPanel.emptyNode(i.content),e&&e.call(i,i),i},i.createMinimizedReplacement=function(){var e=jsPanel.createMinimizedTemplate(),n=window.getComputedStyle(i.headertitle).color,o=window.getComputedStyle(i),a=t.iconfont,r=e.querySelector(".jsPanel-controlbar");return"auto-show-hide"!==i.options.header?jsPanel.setStyles(e,{backgroundColor:o.backgroundColor,backgroundPositionX:o.backgroundPositionX,backgroundPositionY:o.backgroundPositionY,backgroundRepeat:o.backgroundRepeat,backgroundAttachment:o.backgroundAttachment,backgroundImage:o.backgroundImage,backgroundSize:o.backgroundSize,backgroundOrigin:o.backgroundOrigin,backgroundClip:o.backgroundClip}):e.style.backgroundColor=window.getComputedStyle(i.header).backgroundColor,e.id=i.id+"-min",e.querySelector(".jsPanel-headerbar").replaceChild(i.headerlogo.cloneNode(!0),e.querySelector(".jsPanel-headerlogo")),e.querySelector(".jsPanel-titlebar").replaceChild(i.headertitle.cloneNode(!0),e.querySelector(".jsPanel-title")),e.querySelector(".jsPanel-titlebar").setAttribute("title",i.headertitle.textContent),e.querySelector(".jsPanel-title").style.color=n,r.style.color=n,r.querySelectorAll("button").forEach(function(e){return e.style.color=n}),["jsPanel-hdr-dark","jsPanel-hdr-light"].forEach(function(t){i.header.classList.contains(t)&&e.querySelector(".jsPanel-hdr").classList.add(t)}),i.setIconfont(a,e),"enabled"===i.dataset.btnnormalize?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-normalize").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.normalize()})}):r.querySelector(".jsPanel-btn-normalize").style.display="none","enabled"===i.dataset.btnmaximize?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-maximize").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.maximize()})}):r.querySelector(".jsPanel-btn-maximize").style.display="none","enabled"===i.dataset.btnclose?jsPanel.pointerup.forEach(function(t){e.querySelector(".jsPanel-btn-close").addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}):r.querySelector(".jsPanel-btn-close").style.display="none",e},i.removeMinimizedReplacement=function(){var e=document.getElementById("".concat(i.id,"-min"));e&&e.parentElement.removeChild(e)},i.drag=function(){var e,t,n,o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},a=new CustomEvent("jspaneldragstart",{detail:i.id}),r=new CustomEvent("jspaneldrag",{detail:i.id}),s=new CustomEvent("jspaneldragstop",{detail:i.id});[a,r,s].forEach(function(e){return e.panel=i});var l=function(e){var t=e.split("-");return t.forEach(function(e,n){t[n]=e.charAt(0).toUpperCase()+e.slice(1)}),"snap"+t.join("")};function c(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(function(e){document.removeEventListener(e,t,!1),i.style.opacity=1})}var d=o.handles||jsPanel.defaults.dragit.handles,p=o.cursor||jsPanel.defaults.dragit.cursor;function h(o){if(jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,t)}),jsPanel.removeSnapAreas(),e){if(i.style.opacity=1,e=void 0,n.snap){switch(i.snappableTo){case"left-top":i.snap(n.snap.snapLeftTop);break;case"center-top":i.snap(n.snap.snapCenterTop);break;case"right-top":i.snap(n.snap.snapRightTop);break;case"right-center":i.snap(n.snap.snapRightCenter);break;case"right-bottom":i.snap(n.snap.snapRightBottom);break;case"center-bottom":i.snap(n.snap.snapCenterBottom);break;case"left-bottom":i.snap(n.snap.snapLeftBottom);break;case"left-center":i.snap(n.snap.snapLeftCenter)}n.snap.callback&&i.snappableTo&&"function"==typeof n.snap.callback&&(n.snap.callback.call(i,i),n.snap.repositionOnSnap&&!1!==n.snap[l(i.snappableTo)]&&i.repositionOnSnap(i.snappableTo)),i.snappableTo&&n.snap.repositionOnSnap&&n.snap[l(i.snappableTo)]&&i.repositionOnSnap(i.snappableTo)}if(i.droppableTo&&i.droppableTo){var a=i.parentElement;i.move(i.droppableTo),n.drop.callback&&n.drop.callback.call(i,i,i.droppableTo,a)}if(document.dispatchEvent(s),n.stop.length){var r=window.getComputedStyle(i),c={left:parseFloat(r.left),top:parseFloat(r.top),width:parseFloat(r.width),height:parseFloat(r.height)};jsPanel.processCallbacks(i,n.stop,!1,c,o)}i.saveCurrentPosition(),i.calcSizeFactors()}i.controlbar.style.pointerEvents="inherit",i.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="auto"}),document.removeEventListener(o,h)}return i.querySelectorAll(d).forEach(function(s){s.style.touchAction="none",s.style.cursor=p,jsPanel.pointerdown.forEach(function(l){s.addEventListener(l,function(s){if(s.button&&s.button>0)return!1;if((n=Object.assign({},jsPanel.defaults.dragit,o)).disableOnMaximized&&"maximized"===i.status)return!1;if((n.containment||0===n.containment)&&(n.containment=jsPanel.pOcontainment(n.containment)),n.grid&&Array.isArray(n.grid)&&1===n.grid.length&&(n.grid[1]=n.grid[0]),n.snap&&("object"===_typeof(n.snap)?n.snap=Object.assign({},jsPanel.defaultSnapConfig,n.snap):n.snap=jsPanel.defaultSnapConfig),!s.target.closest(".jsPanel-ftr-btn")){i.controlbar.style.pointerEvents="none",i.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="none"});var l=window.getComputedStyle(i),d=parseFloat(l.left),p=parseFloat(l.top),h=parseFloat(l.width),u=parseFloat(l.height),f=s.touches?s.touches[0].clientX:s.clientX,m=s.touches?s.touches[0].clientY:s.clientY,g=i.parentElement,b=g.getBoundingClientRect(),y=window.getComputedStyle(g),v=i.getScaleFactor(),w=0,j=jsPanel.getScrollbarWidth(g);t=function(t){if(t.preventDefault(),!e){if(document.dispatchEvent(a),i.style.opacity=n.opacity,i.snapped&&n.snap.resizeToPreSnap&&i.currentData.beforeSnap){i.resize(i.currentData.beforeSnap.width+" "+i.currentData.beforeSnap.height),i.setControls([".jsPanel-btn-normalize"]);var o=i.getBoundingClientRect(),s=f-(o.left+o.width),l=o.width/2;s>-l&&(w=s+l)}if(i.front(),i.snapped=!1,"maximized"===i.status&&(i.setControls([".jsPanel-btn-normalize"]),i.status="normalized"),n.drop&&n.drop.dropZones){var c=n.drop.dropZones.map(function(e){return jsPanel.pOcontainer(e)}),E=[];c.forEach(function(e){e.length?e.forEach(function(e){E.push(e)}):E.push(e)}),E=E.filter(function(e,t,n){return n.indexOf(e)===t}),n.drop.dropZones=E}n.start.length&&jsPanel.processCallbacks(i,n.start,!1,{left:d,top:p,width:h,height:u},t)}var x,C,P,F,z,S,A,k,B,T;e=1;var L,R=t.touches?t.touches[0].clientX:t.clientX,W=t.touches?t.touches[0].clientY:t.clientY,D=window.getComputedStyle(i);if(g===document.body){var O=i.getBoundingClientRect();B=window.innerWidth-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(O.left+O.width),T=window.innerHeight-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(O.top+O.height)}else B=parseInt(y.width,10)-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(parseInt(D.left,10)+parseInt(D.width,10)),T=parseInt(y.height,10)-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(parseInt(D.top,10)+parseInt(D.height,10));x=parseFloat(D.left),P=parseFloat(D.top),z=B,A=T,n.snap&&("panel"===n.snap.trigger?(C=Math.pow(x,2),F=Math.pow(P,2),S=Math.pow(z,2),k=Math.pow(A,2)):"pointer"===n.snap.trigger&&("window"===i.options.container?(x=R,P=W,z=window.innerWidth-R,A=window.innerHeight-W,C=Math.pow(R,2),F=Math.pow(P,2),S=Math.pow(z,2),k=Math.pow(A,2)):(x=(L=i.overlaps(g,"paddingbox",t)).pointer.left,P=L.pointer.top,z=L.pointer.right,A=L.pointer.bottom,C=Math.pow(L.pointer.left,2),F=Math.pow(L.pointer.top,2),S=Math.pow(L.pointer.right,2),k=Math.pow(L.pointer.bottom,2))));var q=Math.sqrt(C+F),M=Math.sqrt(C+k),I=Math.sqrt(S+F),H=Math.sqrt(S+k),N=Math.abs(x-z)/2,V=Math.abs(P-A)/2,_=Math.sqrt(C+Math.pow(V,2)),X=Math.sqrt(F+Math.pow(N,2)),Y=Math.sqrt(S+Math.pow(V,2)),$=Math.sqrt(k+Math.pow(N,2));if(window.getSelection().removeAllRanges(),document.dispatchEvent(r),n.axis&&"x"!==n.axis||(i.style.left=d+(R-f)/v.x+w+"px"),n.axis&&"y"!==n.axis||(i.style.top=p+(W-m)/v.y+"px"),n.grid){var U=n.grid,Z=n.axis,K=U[0]*Math.round((d+(R-f))/U[0]),G=U[1]*Math.round((p+(W-m))/U[1]);Z&&"x"!==Z||(i.style.left="".concat(K,"px")),Z&&"y"!==Z||(i.style.top="".concat(G,"px"))}if(n.containment||0===n.containment){var J,Q,ee=n.containment;if("window"===i.options.container)J=window.innerWidth-parseFloat(D.width)-ee[1]-j.y,Q=window.innerHeight-parseFloat(D.height)-ee[2]-j.x;else{var te=parseFloat(y.borderLeftWidth)+parseFloat(y.borderRightWidth),ne=parseFloat(y.borderTopWidth)+parseFloat(y.borderBottomWidth);J=b.width/v.x-parseFloat(D.width)-ee[1]-te-j.y,Q=b.height/v.y-parseFloat(D.height)-ee[2]-ne-j.x}parseFloat(i.style.left)<=ee[3]&&(i.style.left=ee[3]+"px"),parseFloat(i.style.top)<=ee[0]&&(i.style.top=ee[0]+"px"),parseFloat(i.style.left)>=J&&(i.style.left=J+"px"),parseFloat(i.style.top)>=Q&&(i.style.top=Q+"px")}if(n.drag.length){var oe={left:x,top:P,right:z,bottom:A,width:parseFloat(D.width),height:parseFloat(D.height)};jsPanel.processCallbacks(i,n.drag,!1,oe,t)}if(n.snap){var ae=n.snap.sensitivity,re=g===document.body?window.innerWidth/8:b.width/8,ie=g===document.body?window.innerHeight/8:b.height/8;i.snappableTo=!1,jsPanel.removeSnapAreas(),q0&&L.pointer.top>0?(i.snappableTo="left-top",jsPanel.createSnapArea(i,"lt",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-top",jsPanel.createSnapArea(i,"lt",ae))):M0&&L.pointer.bottom>0?(i.snappableTo="left-bottom",jsPanel.createSnapArea(i,"lb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-bottom",jsPanel.createSnapArea(i,"lb",ae))):I0&&L.pointer.top>0?(i.snappableTo="right-top",jsPanel.createSnapArea(i,"rt",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-top",jsPanel.createSnapArea(i,"rt",ae))):H0&&L.pointer.bottom>0?(i.snappableTo="right-bottom",jsPanel.createSnapArea(i,"rb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-bottom",jsPanel.createSnapArea(i,"rb",ae))):P0?(i.snappableTo="center-top",jsPanel.createSnapArea(i,"ct",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="center-top",jsPanel.createSnapArea(i,"ct",ae))):x0?(i.snappableTo="left-center",jsPanel.createSnapArea(i,"lc",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="left-center",jsPanel.createSnapArea(i,"lc",ae))):z0?(i.snappableTo="right-center",jsPanel.createSnapArea(i,"rc",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="right-center",jsPanel.createSnapArea(i,"rc",ae))):A0?(i.snappableTo="center-bottom",jsPanel.createSnapArea(i,"cb",ae)):(i.snappableTo=!1,jsPanel.removeSnapAreas())):(i.snappableTo="center-bottom",jsPanel.createSnapArea(i,"cb",ae)))}if(n.drop&&n.drop.dropZones){var se=jsPanel.isIE?"msElementsFromPoint":"elementsFromPoint",le=document[se](t.clientX,t.clientY);Array.isArray(le)||(le=Array.prototype.slice.call(le)),n.drop.dropZones.forEach(function(e){le.includes(e)&&(i.droppableTo=e)}),le.includes(i.droppableTo)||(i.droppableTo=!1)}},jsPanel.pointermove.forEach(function(e){return document.addEventListener(e,t)}),window.addEventListener("mouseout",c,!1)}})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,h),window.removeEventListener("mouseout",c)}),o.disable&&(s.style.pointerEvents="none")}),i},i.dragit=function(e){var n=Object.assign({},jsPanel.defaults.dragit,t.dragit),o=i.querySelectorAll(n.handles);return"disable"===e?o.forEach(function(e){return e.style.pointerEvents="none"}):o.forEach(function(e){return e.style.pointerEvents="auto"}),i},i.sizeit=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=new CustomEvent("jspanelresizestart",{detail:i.id}),n=new CustomEvent("jspanelresize",{detail:i.id}),o=new CustomEvent("jspanelresizestop",{detail:i.id});[t,n,o].forEach(function(e){return e.panel=i});var a,r,s,l,c,d,p={};p.handles=e.handles||jsPanel.defaults.resizeit.handles,p.handles.split(",").forEach(function(e){var t=document.createElement("DIV");t.className="jsPanel-resizeit-handle jsPanel-resizeit-".concat(e.trim()),i.append(t)});var h=!!e.aspectRatio&&e.aspectRatio;function u(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,a,!1)})}function f(e){if(jsPanel.pointermove.forEach(function(e){return document.removeEventListener(e,a,!1)}),e.target.classList&&e.target.classList.contains("jsPanel-resizeit-handle")){var t,n,s=e.target.className;if(s.match(/jsPanel-resizeit-nw|jsPanel-resizeit-w|jsPanel-resizeit-sw/i)&&(t=!0),s.match(/jsPanel-resizeit-nw|jsPanel-resizeit-n|jsPanel-resizeit-ne/i)&&(n=!0),p.grid&&Array.isArray(p.grid)){1===p.grid.length&&(p.grid[1]=p.grid[0]);var l=parseFloat(i.style.width),c=parseFloat(i.style.height),u=l%p.grid[0],m=c%p.grid[1],g=parseFloat(i.style.left),b=parseFloat(i.style.top),y=g%p.grid[0],v=b%p.grid[1];ud+5&&(w.style.transform="rotate(0deg)"),document.dispatchEvent(o),p.stop.length){var E=window.getComputedStyle(i),x={left:parseFloat(E.left),top:parseFloat(E.top),width:parseFloat(E.width),height:parseFloat(E.height)};jsPanel.processCallbacks(i,p.stop,!1,x,e)}}i.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="auto"}),p.aspectRatio=h,document.removeEventListener(e,f)}return i.querySelectorAll(".jsPanel-resizeit-handle").forEach(function(o){o.style.touchAction="none",jsPanel.pointerdown.forEach(function(h){o.addEventListener(h,function(o){if(o.preventDefault(),o.stopPropagation(),o.button&&o.button>0)return!1;var h=1;if(((p=Object.assign({},jsPanel.defaults.resizeit,e)).containment||0===p.containment)&&(p.containment=jsPanel.pOcontainment(p.containment)),p.aspectRatio&&!0===p.aspectRatio&&(p.aspectRatio="panel"),jsPanel.modifier){var f=jsPanel.modifier;f.altKey?p.aspectRatio="content":f.ctrlKey?p.aspectRatio="panel":f.shiftKey&&(p.aspectRatio=!1,h=2)}var m="function"==typeof p.maxWidth?p.maxWidth():p.maxWidth||1e4,g="function"==typeof p.maxHeight?p.maxHeight():p.maxHeight||1e4,b="function"==typeof p.minWidth?p.minWidth():p.minWidth,y="function"==typeof p.minHeight?p.minHeight():p.minHeight;i.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(function(e){return e.style.pointerEvents="none"});var v=i.parentElement,w=v.tagName.toLowerCase(),j=i.getBoundingClientRect(),E=v.getBoundingClientRect(),x=window.getComputedStyle(v,null),C=parseInt(x.borderLeftWidth,10),P=parseInt(x.borderTopWidth,10),F=x.getPropertyValue("position"),z=o.clientX||0===o.clientX||o.touches[0].clientX,S=o.clientY||0===o.clientY||o.touches[0].clientY,A=z/S,k=o.target.classList,B=i.getScaleFactor(),T=j.width/j.height,L=i.content.getBoundingClientRect(),R=L.width/L.height,W=i.header.getBoundingClientRect().height,D=i.footer.getBoundingClientRect().height||0,O=j.left,q=j.top,M=1e4,I=1e4,H=1e4,N=1e4;c=j.width,d=j.height,"body"!==w&&(O=j.left-E.left+v.scrollLeft,q=j.top-E.top+v.scrollTop),"body"===w&&p.containment?(M=document.documentElement.clientWidth-j.left,H=document.documentElement.clientHeight-j.top,I=j.width+j.left,N=j.height+j.top):p.containment&&("static"===F?(M=E.width-j.left+C,H=E.height+E.top-j.top+P,I=j.width+(j.left-E.left)-C,N=j.height+(j.top-E.top)-P):(M=v.clientWidth-(j.left-E.left)/B.x+C,H=v.clientHeight-(j.top-E.top)/B.y+P,I=(j.width+j.left-E.left)/B.x-C,N=i.clientHeight+(j.top-E.top)/B.y-P)),p.containment&&(I-=p.containment[3],N-=p.containment[0],M-=p.containment[1],H-=p.containment[2]);var V=window.getComputedStyle(i),_=parseFloat(V.width)-j.width,X=parseFloat(V.height)-j.height,Y=parseFloat(V.left)-j.left,$=parseFloat(V.top)-j.top;v!==document.body&&(Y+=E.left,$+=E.top);var U=parseInt(V.borderTopWidth,10),Z=parseInt(V.borderRightWidth,10),K=parseInt(V.borderBottomWidth,10),G=parseInt(V.borderLeftWidth,10);a=function(e){e.preventDefault(),r||(document.dispatchEvent(t),p.start.length&&jsPanel.processCallbacks(i,p.start,!1,{width:c,height:d,left:O,top:q},e),i.front(),"maximized"===i.status&&(i.status="normalized",i.controlbar.querySelector(".jsPanel-btn-maximize")&&i.setControlStatus("maximize","show"),i.controlbar.querySelector(".jsPanel-btn-normalize")&&i.setControlStatus("normalize","hide")),j.height>d+5&&(i.status="normalized",i.setControls([".jsPanel-btn-normalize"]))),r=1,document.dispatchEvent(n);var o=e.touches?e.touches[0].clientX:e.clientX,a=e.touches?e.touches[0].clientY:e.clientY;k.contains("jsPanel-resizeit-e")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),"content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-s")?((l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),"content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-w")?((s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px","content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-n")?((l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-se")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),"content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-sw")?((l=d+(a-S)*h/B.y+X)>=H&&(l=H),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px",2===h&&(i.style.top=q-(a-S)+"px"),p.aspectRatio&&(i.style.width=l*T+"px"),(s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px","content"===p.aspectRatio?(i.style.height=(s-Z-G)/R+W+D+U+K+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*R+"px")):"panel"===p.aspectRatio&&(i.style.height=s/T+"px",p.containment&&i.overlaps(v).bottom<=p.containment[2]&&(i.style.height=H+"px",i.style.width=H*T+"px"))):k.contains("jsPanel-resizeit-ne")?((s=c+(o-z)*h/B.x+_)>=M&&(s=M),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",2===h&&(i.style.left=O-(o-z)+"px"),p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?(i.style.width=(l-W-D-U-K)*R+U+K+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/R+"px")):"panel"===p.aspectRatio&&(i.style.width=l*T+"px",p.containment&&i.overlaps(v).right<=p.containment[1]&&(i.style.width=M+"px",i.style.height=M/T+"px"))):k.contains("jsPanel-resizeit-nw")&&(p.aspectRatio&&k.contains("jsPanel-resizeit-nw")&&(a=(o=a*A)/A),(s=c+(z-o)*h/B.x+_)<=m&&s>=b&&s<=I&&(i.style.left=O+(o-z)/B.x+Y+"px"),s>=I&&(s=I),s>=m&&(s=m),s<=b&&(s=b),i.style.width=s+"px",p.aspectRatio&&(i.style.height=s/T+"px"),(l=d+(S-a)*h/B.y+X)<=g&&l>=y&&l<=N&&(i.style.top=q+(a-S)/B.y+$+"px"),l>=N&&(l=N),l>=g&&(l=g),l<=y&&(l=y),i.style.height=l+"px","content"===p.aspectRatio?i.style.width=(l-W-D-U-K)*R+U+K+"px":"panel"===p.aspectRatio&&(i.style.width=l*T+"px")),window.getSelection().removeAllRanges();var u=window.getComputedStyle(i),f={left:parseFloat(u.left),top:parseFloat(u.top),right:parseFloat(u.right),bottom:parseFloat(u.bottom),width:parseFloat(u.width),height:parseFloat(u.height)};p.resize.length&&jsPanel.processCallbacks(i,p.resize,!1,f,e)},jsPanel.pointermove.forEach(function(e){return document.addEventListener(e,a,!1)}),window.addEventListener("mouseout",u,!1)})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,f),window.removeEventListener("mouseout",u)}),e.disable&&(o.style.pointerEvents="none")}),i},i.resizeit=function(e){var t=i.querySelectorAll(".jsPanel-resizeit-handle");return"disable"===e?t.forEach(function(e){return e.style.pointerEvents="none"}):t.forEach(function(e){return e.style.pointerEvents="auto"}),i},i.getScaleFactor=function(){var e=i.getBoundingClientRect();return{x:e.width/i.offsetWidth,y:e.height/i.offsetHeight}},i.calcSizeFactors=function(){var e=window.getComputedStyle(i);if("window"===t.container)i.hf=parseFloat(e.left)/(window.innerWidth-parseFloat(e.width)),i.vf=parseFloat(e.top)/(window.innerHeight-parseFloat(e.height));else if(i.parentElement){var n=i.parentElement.getBoundingClientRect();i.hf=parseFloat(e.left)/(n.width-parseFloat(e.width)),i.vf=parseFloat(e.top)/(n.height-parseFloat(e.height))}},i.saveCurrentDimensions=function(){var e=window.getComputedStyle(i);i.currentData.width=e.width,i.currentData.height=e.height},i.saveCurrentPosition=function(){var e=window.getComputedStyle(i);i.currentData.left=e.left,i.currentData.top=e.top},i.reposition=function(){for(var e,n=t.position,o=!0,a=arguments.length,r=new Array(a),s=0;s0&&i.slaves.forEach(function(e){return e.reposition()}),o&&i.saveCurrentPosition(),e&&e.call(i,i),i},i.repositionOnSnap=function(e){var n="0",o="0",a=jsPanel.pOcontainment(t.dragit.containment);if(t.dragit.snap.containment)switch(e){case"left-top":n=a[3],o=a[0];break;case"right-top":n=-a[1],o=a[0];break;case"right-bottom":n=-a[1],o=-a[2];break;case"left-bottom":n=a[3],o=-a[2];break;case"center-top":n=a[3]/2-a[1]/2,o=a[0];break;case"center-bottom":n=a[3]/2-a[1]/2,o=-a[2];break;case"left-center":n=a[3],o=a[0]/2-a[2]/2;break;case"right-center":n=-a[1],o=a[0]/2-a[2]/2}jsPanel.position(i,e),jsPanel.setStyles(i,{left:"calc(".concat(i.style.left," + ").concat(n,"px)"),top:"calc(".concat(i.style.top," + ").concat(o,"px)")})},i.overlaps=function(e,t,n){var o,a=i.getBoundingClientRect(),r=getComputedStyle(i.parentElement),s=i.getScaleFactor(),l={top:0,right:0,bottom:0,left:0},c=0,d=0,p=0,h=0;"window"!==i.options.container&&"paddingbox"===t&&(l.top=parseInt(r.borderTopWidth,10)*s.y,l.right=parseInt(r.borderRightWidth,10)*s.x,l.bottom=parseInt(r.borderBottomWidth,10)*s.y,l.left=parseInt(r.borderLeftWidth,10)*s.x),o="string"==typeof e?"window"===e?{left:0,top:0,right:window.innerWidth,bottom:window.innerHeight}:"parent"===e?i.parentElement.getBoundingClientRect():document.querySelector(e).getBoundingClientRect():e.getBoundingClientRect(),n&&(c=n.touches?n.touches[0].clientX:n.clientX,d=n.touches?n.touches[0].clientY:n.clientY,p=c-o.left,h=d-o.top);var u=a.lefto.left,f=a.topo.top;return{overlaps:u&&f,top:a.top-o.top-l.top,right:o.right-a.right-l.right,bottom:o.bottom-a.bottom-l.bottom,left:a.left-o.left-l.left,parentBorderWidth:l,panelRect:a,referenceRect:o,pointer:{clientX:c,clientY:d,left:p-l.left,top:h-l.top,right:o.width-p-l.right,bottom:o.height-h-l.bottom}}},i.setSize=function(){if(t.panelSize){var e=jsPanel.pOsize(i,t.panelSize);i.style.width=e.width,i.style.height=e.height}else if(t.contentSize){var n=jsPanel.pOsize(i,t.contentSize);i.content.style.width=n.width,i.content.style.height=n.height,i.style.width=n.width,i.content.style.width="100%"}return i},i.resize=function(){for(var e,t=window.getComputedStyle(i),n={width:t.width,height:t.height},o=!0,a=arguments.length,r=new Array(a),s=0;s0&&i.slaves.forEach(function(e){return e.reposition()}),o&&i.saveCurrentDimensions(),i.status="normalized";var c=i.controlbar.querySelector(".jsPanel-btn-smallify");return c&&(c.style.transform="rotate(0deg)"),e&&e.call(i,i),i.calcSizeFactors(),i},i.windowResizeHandler=function(e){if(e.target===window){var n,o,a=i.status,r=t.onwindowresize;if("maximized"===a&&r)i.maximize(!1,!0);else if(i.snapped&&"minimized"!==a)i.snap(i.snapped,!0);else if("normalized"===a||"smallified"===a||"maximized"===a){var s=_typeof(r);"boolean"===s?(n=(window.innerWidth-i.offsetWidth)*i.hf,i.style.left=n<=0?0:n+"px",o=(window.innerHeight-i.offsetHeight)*i.vf,i.style.top=o<=0?0:o+"px"):"function"===s?r.call(i,e,i):"object"===s&&(!0===r.preset?(n=(window.innerWidth-i.offsetWidth)*i.hf,i.style.left=n<=0?0:n+"px",o=(window.innerHeight-i.offsetHeight)*i.vf,i.style.top=o<=0?0:o+"px",r.callback.call(i,e,i)):r.callback.call(i,e,i))}else"smallifiedmax"===a&&r&&i.maximize(!1,!0).smallify();i.slaves&&i.slaves.size>0&&i.slaves.forEach(function(e){return e.reposition()})}},i.setControls=function(e,t){return i.header.querySelectorAll(".jsPanel-btn").forEach(function(e){var t=e.className.split("-"),n=t[t.length-1];"hidden"!==i.getAttribute("data-btn".concat(n))&&(e.style.display="block")}),e.forEach(function(e){var t=i.controlbar.querySelector(e);t&&(t.style.display="none")}),t&&t.call(i,i),i},i.setControlStatus=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"enable",n=arguments.length>2?arguments[2]:void 0,o=i.controlbar.querySelector(".jsPanel-btn-".concat(e));switch(t){case"disable":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"disabled"),o.style.pointerEvents="none",o.style.opacity=.4,o.style.cursor="default");break;case"hide":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"hidden"),o.style.display="none");break;case"show":"removed"!==i.getAttribute("data-btn".concat(e))&&(i.setAttribute("data-btn".concat(e),"enabled"),o.style.display="block",o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"enable":"removed"!==i.getAttribute("data-btn".concat(e))&&("hidden"===i.getAttribute("data-btn".concat(e))&&(o.style.display="block"),i.setAttribute("data-btn".concat(e),"enabled"),o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"remove":i.controlbar.removeChild(o),i.setAttribute("data-btn".concat(e),"removed")}return n&&n.call(i,i),i},i.setControlSize=function(e){var t=e.toLowerCase();i.controlbar.querySelectorAll(".jsPanel-btn").forEach(function(e){["jsPanel-btn-xl","jsPanel-btn-lg","jsPanel-btn-md","jsPanel-btn-sm","jsPanel-btn-xs"].forEach(function(t){return e.classList.remove(t)}),e.classList.add("jsPanel-btn-".concat(t))}),"xl"===t?i.titlebar.style.fontSize="1.5rem":"lg"===t?i.titlebar.style.fontSize="1.25rem":"md"===t?i.titlebar.style.fontSize="1.05rem":"sm"===t?i.titlebar.style.fontSize=".9rem":"xs"===t&&(i.titlebar.style.fontSize=".8rem")},i.setHeaderControls=function(e){if(i.options.headerControls.add){var n=i.options.headerControls.add;Array.isArray(n)||(n=[n]),n.forEach(function(e){return i.addControl(e)})}var o=[];i.controlbar.querySelectorAll(".jsPanel-btn").forEach(function(e){var t=e.className.match(/jsPanel-btn-[a-z\d]{3,}/i)[0].substring(12);o.push(t)});var a=jsPanel.pOheaderControls(t.headerControls);return t.headerControls=a,o.forEach(function(e){a[e]&&i.setControlStatus(e,a[e])}),i.setControlSize(a.size),e&&e.call(i,i),i},i.setHeaderLogo=function(e,t){var n=[i.headerlogo],o=document.querySelector("#"+i.id+"-min");return o&&n.push(o.querySelector(".jsPanel-headerlogo")),"string"==typeof e?e.startsWith("<")?n.forEach(function(t){return t.innerHTML=e}):n.forEach(function(t){jsPanel.emptyNode(t);var n=document.createElement("img");n.src=e,t.append(n)}):n.forEach(function(t){jsPanel.emptyNode(t),t.append(e)}),i.headerlogo.childNodes.forEach(function(e){e.nodeName&&"IMG"===e.nodeName&&e.setAttribute("draggable","false")}),t&&t.call(i,i),i},i.setHeaderRemove=function(e){return i.removeChild(i.header),i.content.classList.add("jsPanel-content-noheader"),["close","maximize","normalize","minimize","smallify"].forEach(function(e){return i.setAttribute("data-btn".concat(e),"removed")}),e&&e.call(i,i),i},i.setHeaderTitle=function(e,t){var n=[i.headertitle],o=document.querySelector("#"+i.id+"-min");return o&&n.push(o.querySelector(".jsPanel-title")),"string"==typeof e?n.forEach(function(t){return t.innerHTML=e}):"function"==typeof e?n.forEach(function(t){jsPanel.emptyNode(t),t.innerHTML=e()}):n.forEach(function(t){jsPanel.emptyNode(t),t.append(e)}),t&&t.call(i,i),i},i.setIconfont=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:i,n=arguments.length>2?arguments[2]:void 0;if(e){var o,a;if("fa"===e||"far"===e||"fal"===e||"fas"===e||"fad"===e)o=["".concat(e," fa-window-close"),"".concat(e," fa-window-maximize"),"".concat(e," fa-window-restore"),"".concat(e," fa-window-minimize"),"".concat(e," fa-chevron-up")];else if("material-icons"===e)o=[e,e,e,e,e,e],a=["close","fullscreen","fullscreen_exit","call_received","expand_less"];else if(Array.isArray(e))o=["custom-control-icon ".concat(e[4]),"custom-control-icon ".concat(e[3]),"custom-control-icon ".concat(e[2]),"custom-control-icon ".concat(e[1]),"custom-control-icon ".concat(e[0])];else{if("bootstrap"!==e&&"glyphicon"!==e)return t;o=["glyphicon glyphicon-remove","glyphicon glyphicon-fullscreen","glyphicon glyphicon-resize-full","glyphicon glyphicon-minus","glyphicon glyphicon-chevron-up"]}t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(function(e){return jsPanel.emptyNode(e).innerHTML=""}),Array.prototype.slice.call(t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn > span")).reverse().forEach(function(t,n){t.className=o[n],"material-icons"===e&&(t.textContent=a[n])})}return n&&n.call(t,t),t},i.addToolbar=function(e,t,n){if("header"===e?e=i.headertoolbar:"footer"===e&&(e=i.footer),"string"==typeof t)e.innerHTML=t;else if(Array.isArray(t))t.forEach(function(t){"string"==typeof t?e.innerHTML+=t:e.append(t)});else if("function"==typeof t){var o=t.call(i,i);"string"==typeof o?e.innerHTML=o:e.append(o)}else e.append(t);return e.classList.add("active"),n&&n.call(i,i),i},i.addCloseControl=function(){var e=document.createElement("button"),t=i.content.style.color;return e.classList.add("jsPanel-addCloseCtrl"),e.innerHTML=jsPanel.icons.close,e.style.color=t,i.options.rtl&&e.classList.add("rtl"),i.appendChild(e),jsPanel.pointerup.forEach(function(t){e.addEventListener(t,function(e){if(e.preventDefault(),e.button&&e.button>0)return!1;i.close(null,!0)})}),jsPanel.pointerdown.forEach(function(t){e.addEventListener(t,function(e){return e.preventDefault()})}),i},i.addControl=function(e){if(!e.html)return i;e.position||(e.position=1);var n=i.controlbar.querySelectorAll(".jsPanel-btn").length,o=document.createElement("button");o.innerHTML=e.html,o.className="jsPanel-btn jsPanel-btn-".concat(e.name," jsPanel-btn-").concat(t.headerControls.size),o.style.color=i.header.style.color,e.position>n?i.controlbar.append(o):i.controlbar.insertBefore(o,i.querySelector(".jsPanel-controlbar .jsPanel-btn:nth-child(".concat(e.position,")")));var a=e.ariaLabel||e.name;return a&&o.setAttribute("aria-label",a),jsPanel.pointerup.forEach(function(t){o.addEventListener(t,function(t){if(t.preventDefault(),t.button&&t.button>0)return!1;e.handler.call(i,i,o)})}),e.afterInsert&&e.afterInsert.call(o,o),i},i.setRtl=function(){[i.header,i.content,i.footer].forEach(function(e){e.dir="rtl",t.rtl.lang&&(e.lang=t.rtl.lang)})},i.id=t.id,i.classList.add("jsPanel-"+t.paneltype),"standard"===t.paneltype&&(i.style.zIndex=this.zi.next()),r.append(i),i.front(!1,!1),i.setTheme(t.theme),t.boxShadow&&i.classList.add("jsPanel-depth-".concat(t.boxShadow)),t.header){if(t.headerLogo&&i.setHeaderLogo(t.headerLogo),i.setIconfont(t.iconfont),i.setHeaderTitle(t.headerTitle),i.setHeaderControls(),jsPanel.isIE){var k=[i.headerbar,i.controlbar];switch(i.options.headerControls.size){case"md":k.forEach(function(e){e.style.height="34px"});break;case"xs":k.forEach(function(e){e.style.height="26px"});break;case"sm":k.forEach(function(e){e.style.height="30px"});break;case"lg":k.forEach(function(e){e.style.height="38px"});break;case"xl":k.forEach(function(e){e.style.height="42px"})}}if("auto-show-hide"===t.header){var B="jsPanel-depth-"+t.boxShadow;i.header.style.opacity=0,i.style.backgroundColor="transparent",this.remClass(i,B),this.setClass(i.content,B),i.header.addEventListener("mouseenter",function(){i.header.style.opacity=1,jsPanel.setClass(i,B),jsPanel.remClass(i.content,B)}),i.header.addEventListener("mouseleave",function(){i.header.style.opacity=0,jsPanel.remClass(i,B),jsPanel.setClass(i.content,B)})}}else i.setHeaderRemove(),t.addCloseControl&&i.addCloseControl();if(t.headerToolbar&&i.addToolbar(i.headertoolbar,t.headerToolbar),t.footerToolbar&&i.addToolbar(i.footer,t.footerToolbar),t.border&&i.setBorder(t.border),t.borderRadius&&i.setBorderRadius(t.borderRadius),t.css)for(var T=0,L=Object.entries(t.css);TparseFloat(window.getComputedStyle(i.header).height)&&(i.setControls([".jsPanel-btn-normalize"]),i.status="normalized",document.dispatchEvent(d),document.dispatchEvent(l),t.onstatuschange&&jsPanel.processCallbacks(i,t.onstatuschange,"every"),i.calcSizeFactors())},!1)}if(i.saveCurrentDimensions(),i.saveCurrentPosition(),t.setStatus&&("smallifiedmax"===t.setStatus?i.maximize().smallify():"smallified"===t.setStatus?i.smallify():i[t.setStatus.slice(0,-1)]()),this.pointerdown.forEach(function(e){i.addEventListener(e,function(e){e.target.closest(".jsPanel-btn-close")||e.target.closest(".jsPanel-btn-minimize")||"standard"!==t.paneltype||i.front()},!1)}),t.onwindowresize&&"window"===i.options.container&&window.addEventListener("resize",i.windowResizeHandler,!1),t.onparentresize){var V=t.onparentresize,_=_typeof(V),X=i.isChildpanel();if(X){var Y=X.content,$=[];i.parentResizeHandler=function(e){if(e.panel===X){$[0]=Y.offsetWidth,$[1]=Y.offsetHeight;var t,n,o=i.status;"maximized"===o&&V?i.maximize():i.snapped&&"minimized"!==o?i.snap(i.snapped,!0):"normalized"===o||"smallified"===o||"maximized"===o?"function"===_?V.call(i,i,{width:$[0],height:$[1]}):"object"===_&&!0===V.preset?(t=($[0]-i.offsetWidth)*i.hf,i.style.left=t<=0?0:t+"px",n=($[1]-i.offsetHeight)*i.vf,i.style.top=n<=0?0:n+"px",V.callback.call(i,i,{width:$[0],height:$[1]})):"boolean"===_&&(t=($[0]-i.offsetWidth)*i.hf,i.style.left=t<=0?0:t+"px",n=($[1]-i.offsetHeight)*i.vf,i.style.top=n<=0?0:n+"px"):"smallifiedmax"===o&&V&&i.maximize().smallify()}},document.addEventListener("jspanelresize",i.parentResizeHandler,!1)}}return this.globalCallbacks&&(Array.isArray(this.globalCallbacks)?this.globalCallbacks.forEach(function(e){return e.call(i,i)}):this.globalCallbacks.call(i,i)),t.callback&&(Array.isArray(t.callback)?t.callback.forEach(function(e){return e.call(i,i)}):t.callback.call(i,i)),n&&(Array.isArray(n)?n.forEach(function(e){return e.call(i,i)}):n.call(i,i)),document.dispatchEvent(s),i}};"undefined"!=typeof module&&(module.exports=jsPanel); \ No newline at end of file diff --git a/es6module/extensions/contextmenu/jspanel.contextmenu.js b/es6module/extensions/contextmenu/jspanel.contextmenu.js index a87654e..af7f346 100644 --- a/es6module/extensions/contextmenu/jspanel.contextmenu.js +++ b/es6module/extensions/contextmenu/jspanel.contextmenu.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/datepicker/jspanel.datepicker.js b/es6module/extensions/datepicker/jspanel.datepicker.js index ace08ec..ebb64b9 100644 --- a/es6module/extensions/datepicker/jspanel.datepicker.js +++ b/es6module/extensions/datepicker/jspanel.datepicker.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/datepicker/theme/default.css b/es6module/extensions/datepicker/theme/default.css index 2e4f41b..34bf65b 100644 --- a/es6module/extensions/datepicker/theme/default.css +++ b/es6module/extensions/datepicker/theme/default.css @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/dialog/jspanel.dialog.css b/es6module/extensions/dialog/jspanel.dialog.css index 741ac7f..9a999f9 100644 --- a/es6module/extensions/dialog/jspanel.dialog.css +++ b/es6module/extensions/dialog/jspanel.dialog.css @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -13,33 +13,21 @@ margin-top: 50px; max-height: calc(90vh - 50px); } - .jsPanel-dialog .jsPanel-content { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + flex-direction: column; overflow: hidden; - /* Add some padding to the dialog content */ + /* Add some padding to the dialog content */ padding: 1rem; } - .jsPanel-dialog .buttonbar { margin-top: 10px; padding-top: 10px; border-top: 1px solid #ccc; width: 100%; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: right; - -ms-flex-pack: right; - justify-content: right; + justify-content: right; } - .jsPanel-dialog .buttonbar button { margin-left: 0.5rem; } @@ -77,19 +65,16 @@ width: 90vw !important; } } - @media (max-width: 991px) { .dialog-lg, .dialog-xl { width: 90vw !important; } } - @media (max-width: 1199px) { .dialog-xl { width: 90vw !important; } } - /* A few button colors */ button.blue, button.info { color: #fff !important; @@ -138,12 +123,12 @@ input:disabled, input[readonly] { } /* Radio buttons and checkboxes, followed by a span */ -input[type="checkbox"], input[type="radio"] { +input[type=checkbox], input[type=radio] { vertical-align: middle; margin: 0 0.5rem 0 0; } -input[type="radio"] { +input[type=radio] { margin-bottom: 2px; } @@ -151,4 +136,5 @@ input:disabled + span { opacity: 0.4; cursor: not-allowed; } -/*# sourceMappingURL=jspanel.dialog.css.map */ \ No newline at end of file + +/*# sourceMappingURL=jspanel.dialog.css.map */ diff --git a/es6module/extensions/dialog/jspanel.dialog.js b/es6module/extensions/dialog/jspanel.dialog.js index d7ad126..3fed810 100644 --- a/es6module/extensions/dialog/jspanel.dialog.js +++ b/es6module/extensions/dialog/jspanel.dialog.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/dialog/jspanel.dialog.min.css b/es6module/extensions/dialog/jspanel.dialog.min.css index 0c8fcf9..7dc3ca9 100644 --- a/es6module/extensions/dialog/jspanel.dialog.min.css +++ b/es6module/extensions/dialog/jspanel.dialog.min.css @@ -1 +1 @@ -.jsPanel-dialog{min-width:400px;margin-top:50px;max-height:calc(90vh - 50px)}.jsPanel-dialog .jsPanel-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;padding:1rem}.jsPanel-dialog .buttonbar{margin-top:10px;padding-top:10px;border-top:1px solid #ccc;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:right;-ms-flex-pack:right;justify-content:right}.jsPanel-dialog .buttonbar button{margin-left:.5rem}.jsPanel-modal.background{opacity:.3!important}.dialog-lg,.dialog-md,.dialog-sm,.dialog-xl{max-height:calc(90vh - 50px);overflow:hidden auto;margin:0 auto}.dialog-sm{width:400px!important}.dialog-md{width:600px!important}.dialog-lg{width:800px!important}.dialog-xl{width:1000px!important}@media (max-width:767px){.dialog-lg,.dialog-md,.dialog-xl{width:90vw!important}}@media (max-width:991px){.dialog-lg,.dialog-xl{width:90vw!important}}@media (max-width:1199px){.dialog-xl{width:90vw!important}}button.blue,button.info{color:#fff!important;background-color:#039be5!important;border-color:#039be5!important}button.default,button.gray,button.secondary{color:#fff;background-color:#b0bec5!important;border-color:#b0bec5!important}button.white{color:#333!important;background-color:#fff!important}button.primary{color:#fff!important;background-color:#01579b!important;border-color:#01579b!important}button.warning,button.yellow{color:#000!important;background-color:#f57f17!important;border-color:#f57f17!important}button.danger,button.red{color:#fff!important;background-color:#dd2c00!important;border-color:#dd2c00!important}button.green,button.success{color:#fff!important;background-color:#2e7d32!important;border-color:#2e7d32!important}input:disabled,input[readonly]{cursor:not-allowed!important;background-color:#eee!important}input[type=checkbox],input[type=radio]{vertical-align:middle;margin:0 .5rem 0 0}input[type=radio]{margin-bottom:2px}input:disabled+span{opacity:.4;cursor:not-allowed} \ No newline at end of file +.jsPanel-dialog{min-width:400px;margin-top:50px;max-height:calc(90vh - 50px)}.jsPanel-dialog .jsPanel-content{display:flex;flex-direction:column;overflow:hidden;padding:1rem}.jsPanel-dialog .buttonbar{margin-top:10px;padding-top:10px;border-top:1px solid #ccc;width:100%;display:flex;justify-content:right}.jsPanel-dialog .buttonbar button{margin-left:.5rem}.jsPanel-modal.background{opacity:.3!important}.dialog-lg,.dialog-md,.dialog-sm,.dialog-xl{max-height:calc(90vh - 50px);overflow:hidden auto;margin:0 auto}.dialog-sm{width:400px!important}.dialog-md{width:600px!important}.dialog-lg{width:800px!important}.dialog-xl{width:1000px!important}@media (max-width:767px){.dialog-lg,.dialog-md,.dialog-xl{width:90vw!important}}@media (max-width:991px){.dialog-lg,.dialog-xl{width:90vw!important}}@media (max-width:1199px){.dialog-xl{width:90vw!important}}button.blue,button.info{color:#fff!important;background-color:#039be5!important;border-color:#039be5!important}button.default,button.gray,button.secondary{color:#fff;background-color:#b0bec5!important;border-color:#b0bec5!important}button.white{color:#333!important;background-color:#fff!important}button.primary{color:#fff!important;background-color:#01579b!important;border-color:#01579b!important}button.warning,button.yellow{color:#000!important;background-color:#f57f17!important;border-color:#f57f17!important}button.danger,button.red{color:#fff!important;background-color:#dd2c00!important;border-color:#dd2c00!important}button.green,button.success{color:#fff!important;background-color:#2e7d32!important;border-color:#2e7d32!important}input:disabled,input[readonly]{cursor:not-allowed!important;background-color:#eee!important}input[type=checkbox],input[type=radio]{vertical-align:middle;margin:0 .5rem 0 0}input[type=radio]{margin-bottom:2px}input:disabled+span{opacity:.4;cursor:not-allowed} \ No newline at end of file diff --git a/es6module/extensions/dock/jspanel.dock.js b/es6module/extensions/dock/jspanel.dock.js index 5e3349d..42f96a5 100644 --- a/es6module/extensions/dock/jspanel.dock.js +++ b/es6module/extensions/dock/jspanel.dock.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/hint/jspanel.hint.js b/es6module/extensions/hint/jspanel.hint.js index a685c77..a5d7d62 100644 --- a/es6module/extensions/hint/jspanel.hint.js +++ b/es6module/extensions/hint/jspanel.hint.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/layout/jspanel.layout.js b/es6module/extensions/layout/jspanel.layout.js index bf16004..e7ff88d 100644 --- a/es6module/extensions/layout/jspanel.layout.js +++ b/es6module/extensions/layout/jspanel.layout.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/modal/jspanel.modal.js b/es6module/extensions/modal/jspanel.modal.js index dc015d9..9cf48aa 100644 --- a/es6module/extensions/modal/jspanel.modal.js +++ b/es6module/extensions/modal/jspanel.modal.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/extensions/tooltip/jspanel.tooltip.js b/es6module/extensions/tooltip/jspanel.tooltip.js index 7a1b592..ddf38c2 100644 --- a/es6module/extensions/tooltip/jspanel.tooltip.js +++ b/es6module/extensions/tooltip/jspanel.tooltip.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de diff --git a/es6module/jspanel.css b/es6module/jspanel.css index 2ce6eac..e7ca7d3 100644 --- a/es6module/jspanel.css +++ b/es6module/jspanel.css @@ -1,44 +1,12 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de * @author of dialog extension: Michael Daumling - michael@terrapinlogo.com * @github https://github.com/Flyer53/jsPanel4.git */ -.default-bg, .secondary-bg { - background-color: #b0bec5; -} - -.primary-bg { - background-color: #01579b; -} - -.info-bg { - background-color: #039be5; -} - -.success-bg { - background-color: #2e7d32; -} - -.warning-bg { - background-color: #f57f17; -} - -.danger-bg { - background-color: #dd2c00; -} - -.light-bg { - background-color: #e0e0e0; -} - -.dark-bg { - background-color: #263238; -} - .jsPanel { border: 0; box-sizing: border-box; @@ -62,7 +30,6 @@ font-weight: normal; display: flex; flex-direction: column; - flex-shrink: 0; line-height: normal; } diff --git a/es6module/jspanel.js b/es6module/jspanel.js index f6cc355..8ae2499 100644 --- a/es6module/jspanel.js +++ b/es6module/jspanel.js @@ -1,6 +1,6 @@ /** * jsPanel - A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu - * @version v4.16.0 + * @version v4.16.1 * @homepage https://jspanel.de/ * @license MIT * @author Stefan Sträßer - info@jspanel.de @@ -12,33 +12,29 @@ export // eslint-disable-next-line no-redeclare // noinspection JSVoidFunctionReturnValueUsed // eslint-disable-next-line no-redeclare let jsPanel = { - version: '4.16.0', - date: '2022-07-03 19:05', + version: '4.16.1', + date: '2022-11-03 09:18', ajaxAlwaysCallbacks: [], autopositionSpacing: 4, closeOnEscape: (() => { - document.addEventListener( - 'keydown', - (e) => { - if (e.key === 'Escape' || e.code === 'Escape' || e.key === 'Esc') { - jsPanel - .getPanels(panel => panel.classList.contains('jsPanel')) // Array is sorted by z-index (the highest first) - .some(item => { - if (item.options.closeOnEscape) { - if (typeof item.options.closeOnEscape === 'function') { - return item.options.closeOnEscape.call(item, item); - // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops - } else { - item.close(null, true); - return true; - } + document.addEventListener('keydown', e => { + if (e.key === 'Escape' || e.code === 'Escape' || e.key === 'Esc') { + jsPanel + .getPanels(panel => panel.classList.contains('jsPanel')) // Array is sorted by z-index (the highest first) + .some(item => { + if (item.options.closeOnEscape) { + if (typeof item.options.closeOnEscape === 'function') { + return item.options.closeOnEscape.call(item, item); + // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops + } else { + item.close(null, true); + return true; } - return false; - }); - } - }, - false - ); + } + return false; + }); + } + }, false); })(), defaults: { boxShadow: 3, @@ -52,12 +48,12 @@ let jsPanel = { }, header: true, headerTitle: 'jsPanel', - headerControls: { size: 'md' }, // must be an object + headerControls: {size: 'md'}, // must be an object iconfont: undefined, maximizedMargin: 0, minimizeTo: 'default', paneltype: 'standard', - position: { my: 'center', at: 'center' }, // default position.of MUST NOT be set with new positioning engine + position: {my: 'center', at: 'center'}, // default position.of MUST NOT be set with new positioning engine resizeit: { handles: 'n, e, s, w, ne, se, sw, nw', minWidth: 128, @@ -65,7 +61,7 @@ let jsPanel = { }, theme: 'default' }, - defaultAutocloseConfig: { time: '8s', progressbar: true }, + defaultAutocloseConfig: {time: '8s', progressbar: true}, defaultSnapConfig: { sensitivity: 70, trigger: 'panel', @@ -120,6 +116,7 @@ let jsPanel = { // Object.entries() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries if (!Object.entries) { Object.entries = function( obj ){ + // noinspection ES6ConvertVarToLetConst var ownProps = Object.keys( obj ), i = ownProps.length, resArray = new Array(i); // preallocate the Array @@ -180,6 +177,7 @@ let jsPanel = { detail: undefined, }; let evt = document.createEvent('CustomEvent'); + // noinspection JSDeprecatedSymbols evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); return evt; } @@ -201,6 +199,7 @@ let jsPanel = { if (!String.prototype.startsWith) { Object.defineProperty(String.prototype, 'startsWith', { value: function(search, rawPos) { + // noinspection ES6ConvertVarToLetConst var pos = rawPos > 0 ? rawPos|0 : 0; return this.substring(pos, pos + search.length) === search; } @@ -223,6 +222,7 @@ let jsPanel = { 'use strict'; if (this == null) throw new TypeError('can\'t convert ' + this + ' to object'); + // noinspection ES6ConvertVarToLetConst var str = '' + this; count = +count; if (count != count) @@ -236,6 +236,7 @@ let jsPanel = { return ''; if (str.length * count >= 1 << 28) throw new RangeError('repeat count must not overflow maximum string size'); + // noinspection ES6ConvertVarToLetConst var maxCount = str.length * count; count = Math.floor(Math.log(count) / Math.log(2)); while (count) { @@ -295,13 +296,21 @@ let jsPanel = { }); } })(), - themes: ['default', 'primary', 'secondary', 'info', 'success', 'warning', 'danger', 'light', 'dark'], ziBase: 100, colorFilledLight: 0.81, colorFilledDark: 0.08, colorFilled: 0, colorBrightnessThreshold: 0.55, colorNames: { + default: 'b0bec5', // Material Design bluegray200 + secondary: 'b0bec5', + primary: '01579b', // Material Design lightblue900 + info: '039be5', // Material Design lightblue600 + success: '2e7d32', // Material Design green800 + warning: 'f57f17', // Material Design yellow900 + danger: 'dd2c00', // Material Design deeporangeA700 + light: 'e0e0e0', // Material Design gray300 + dark: '263238', // Material Design bluegray900 // https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords aliceblue: 'f0f8ff', antiquewhite: 'faebd7', @@ -726,6 +735,18 @@ let jsPanel = { brown700: '5D4037', brown800: '4E342E', brown900: '3E2723', + /* Material Design for Bootstrap v4 themes https://mdbootstrap.com/docs/b4/jquery/css/colors/#mdb-colors */ + 'mdb-default': '2BBBAD', 'mdb-default-dark': '00695c', + 'mdb-primary': '4285F4', 'mdb-primary-dark': '0d47a1', + 'mdb-secondary': 'aa66cc', 'mdb-secondary-dark': '9933CC', + 'mdb-danger': 'ff4444', 'mdb-danger-dark': 'CC0000', + 'mdb-warning': 'ffbb33', 'mdb-warning-dark': 'FF8800', + 'mdb-success': '00C851', 'mdb-success-dark': '007E33', + 'mdb-info': '33b5e5', 'mdb-info-dark': '0099CC', + 'mdb-elegant': '2E2E2E', 'mdb-elegant-dark': '212121', + 'mdb-stylish': '4B515D', 'mdb-stylish-dark': '3E4551', + 'mdb-unique': '3F729B', 'mdb-unique-dark': '1C2331', + 'mdb-special': '37474F', 'mdb-special-dark': '263238' }, errorReporting: 1, modifier: false, @@ -800,7 +821,7 @@ let jsPanel = { } } - if (String(values.width).match(/^[0-9.]+$/gi)) { + if (String(values.width).match(/^[\d.]+$/gi)) { // if number only values.width += 'px'; } else if (typeof values.width === 'string' && values.width.endsWith('%')) { @@ -815,12 +836,12 @@ let jsPanel = { values.width = values.width.call(panel, panel); if (typeof values.width === 'number') { values.width += 'px'; - } else if (typeof values.width === 'string' && values.width.match(/^[0-9.]+$/gi)) { + } else if (typeof values.width === 'string' && values.width.match(/^[\d.]+$/gi)) { values.width += 'px'; } } - if (String(values.height).match(/^[0-9.]+$/gi)) { + if (String(values.height).match(/^[\d.]+$/gi)) { // if number only values.height += 'px'; } else if (typeof values.height === 'string' && values.height.endsWith('%')) { @@ -835,7 +856,7 @@ let jsPanel = { values.height = values.height.call(panel, panel); if (typeof values.height === 'number') { values.height += 'px'; - } else if (typeof values.height === 'string' && values.height.match(/^[0-9.]+$/gi)) { + } else if (typeof values.height === 'string' && values.height.match(/^[\d.]+$/gi)) { values.height += 'px'; } } @@ -850,13 +871,13 @@ let jsPanel = { .replace(/\s+/g, ' ') // replace all other whitespace(s) with a single whitespace .split(' '); // replace css custom props/variables with values - border.forEach( (val, index) => { + border.forEach((val, index) => { if(val.startsWith('--') || val.startsWith('var')) { border[index] = jsPanel.getCssVariableValue(val); } }); // border is now an array like ['5px', 'solid', 'red'] // check values for type (border width, style or color) and add to result array - border.forEach( (val) => { + border.forEach(val => { if (jsPanel.colorNames[val]) { result[2] = '#' + jsPanel.colorNames[val]; } else if (val.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)) { @@ -923,13 +944,13 @@ let jsPanel = { color = jsPanel.getCssVariableValue(color); } } - if (color.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (color.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { color = '#' + color; } if (filling.startsWith('fillcolor')) { let devide = filling.indexOf(' '); filling = filling.slice(devide + 1, filling.length).trim().replace(/\s+/g, ''); - if (filling.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (filling.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { filling = '#' + filling; } else if (jsPanel.colorNames[filling]) { filling = '#' + jsPanel.colorNames[filling]; @@ -955,9 +976,9 @@ let jsPanel = { channels, hsl, result = {}; - const hexPattern = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/gi, // matches "#123" or "#f05a78" with or without "#" - RGBAPattern = /^rgba?\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3}),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, // matches rgb/rgba color values, whitespace allowed - HSLAPattern = /^hsla?\(([0-9]{1,3}),([0-9]{1,3}%),([0-9]{1,3}%),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, + const hexPattern = /^#?([\da-f]{3}|[\da-f]{6})$/gi, // matches "#123" or "#f05a78" with or without "#" + RGBAPattern = /^rgba?\((\d{1,3}),(\d{1,3}),(\d{1,3}),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, // matches rgb/rgba color values, whitespace allowed + HSLAPattern = /^hsla?\((\d{1,3}),(\d{1,3}%),(\d{1,3}%),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, namedColors = this.colorNames; // change named color to corresponding hex value @@ -1177,9 +1198,7 @@ let jsPanel = { } // find my and at values and assign to result - let my_at = pos.filter((item) => { - return item.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i); - }); + let my_at = pos.filter(item => item.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i)); if (my_at.length) { result.my = my_at[0]; result.at = my_at[1] || my_at[0]; @@ -1237,7 +1256,7 @@ let jsPanel = { // process parameter functions for 'my', 'at', 'of' // 'offsetX', 'offsetY', 'minLeft', 'maxLeft', 'minTop', 'maxTop' are processed when params are applied - ['my', 'at', 'of'].forEach((item) => { + ['my', 'at', 'of'].forEach(item => { if (typeof position[item] === 'function') { position[item] = position[item].call(panel, panel); } @@ -1284,7 +1303,7 @@ let jsPanel = { // window is never scaled --> scale factors default to 1 const scaleFactor = container === 'window' - ? { x: 1, y: 1 } + ? {x: 1, y: 1} : { x: containerRect.width / container.offsetWidth, y: containerRect.height / container.offsetHeight, @@ -1515,7 +1534,7 @@ let jsPanel = { } panel.style.left = scaleFactor.x === 1 ? left : parseFloat(left) / scaleFactor.x + 'px'; panel.style.top = scaleFactor.y === 1 ? top : parseFloat(top) / scaleFactor.y + 'px'; - // at this point panels are correctly positioned according to the my/at values + // at this point panels are correctly positioned according to my/at values let panelStyle = getComputedStyle(panel); // eslint-disable-next-line no-unused-vars @@ -1605,7 +1624,7 @@ let jsPanel = { return { left: pos.left, top: pos.top }; }, applyPositionOffset(panel, pos, position) { - ['offsetX', 'offsetY'].forEach((offset) => { + ['offsetX', 'offsetY'].forEach(offset => { if (position[offset]) { if (typeof position[offset] === 'function') { position[offset] = position[offset].call(pos, pos, position); @@ -1624,7 +1643,7 @@ let jsPanel = { return { left: panelStyle.left, top: panelStyle.top }; }, applyPositionMinMax(panel, pos, position) { - ['minLeft', 'minTop', 'maxLeft', 'maxTop'].forEach((val) => { + ['minLeft', 'minTop', 'maxLeft', 'maxTop'].forEach(val => { if (position[val]) { if (typeof position[val] === 'function') { position[val] = position[val].call(pos, pos, position); @@ -1723,18 +1742,8 @@ let jsPanel = { // theming methods ------------------------- getThemeDetails(th) { - const theme = this.pOtheme(th), - builtIn = this.themes.some(item => item === theme.color.split(/\s/i)[0]); - if (builtIn) { - let baseTheme = theme.color.split(/\s/i)[0], - btn = document.createElement('button'); - btn.className = baseTheme + '-bg'; - document.body.appendChild(btn); - theme.color = getComputedStyle(btn).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(btn); - // noinspection JSUnusedAssignment - btn = undefined; - } else if (theme.color.startsWith('bootstrap-')) { + const theme = this.pOtheme(th); + if (theme.color.startsWith('bootstrap-')) { // works with bootstrap 3 and 4 let index = theme.color.indexOf('-'), btn = document.createElement('button'); @@ -1744,32 +1753,11 @@ let jsPanel = { document.body.removeChild(btn); // noinspection JSUnusedAssignment btn = undefined; - } else if (theme.color.startsWith('mdb-')) { - // material design for bootstrap theme - let index = theme.color.indexOf('-') + 1, - span = document.createElement('span'), - testClass; - if (theme.color.endsWith('-dark')) { - testClass = theme.color.slice(index); - testClass = testClass.replace('-dark', '-color-dark'); - } else { - testClass = theme.color.slice(index) + '-color'; - } - span.className = testClass; - document.body.appendChild(span); - theme.color = getComputedStyle(span).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(span); - // noinspection JSUnusedAssignment - span = undefined; } theme.colors = this.calcColors(theme.color); return theme; }, clearTheme(panel, cb) { - this.themes.forEach(value => { - ['panel', `jsPanel-theme-${value}`, `panel-${value}`, `${value}-color`].forEach(item => panel.classList.remove(item)); - panel.header.classList.remove(`jsPanel-theme-${value}`); - }); panel.content.classList.remove('jsPanel-content-filled', 'jsPanel-content-filledlight'); panel.header.classList.remove('jsPanel-hdr-light'); panel.header.classList.remove('jsPanel-hdr-dark'); @@ -1838,7 +1826,7 @@ let jsPanel = { applyCustomTheme(panel, theme) { let defaults = { bgPanel: '#ffffff', - bgContent: '#fffffff', + bgContent: '#ffffff', bgFooter: '#f5f5f5', colorHeader: '#000000', colorContent: '#000000', @@ -1954,7 +1942,6 @@ let jsPanel = { }, setStyles(elmt, stylesobject) { for (const [prop, value] of Object.entries(stylesobject)) { - //elmt.style[prop] = jsPanel.getCssVariableValue(value); elmt.style[prop] = typeof value === 'string' ? jsPanel.getCssVariableValue(value) : value; } return elmt; @@ -2073,7 +2060,7 @@ let jsPanel = { // allows plugins to add callback functions to the ajax always callback if (jsPanel.ajaxAlwaysCallbacks.length) { - jsPanel.ajaxAlwaysCallbacks.forEach((item) => { + jsPanel.ajaxAlwaysCallbacks.forEach(item => { panel ? item.call(xhr, xhr, panel) : item.call(xhr, xhr); }); } @@ -2129,12 +2116,12 @@ let jsPanel = { } fetch(config.resource, fetchInit) - .then((response) => { + .then(response => { if (response.ok) { return response[config.bodyMethod](); } }) - .then((response) => { + .then(response => { panel ? config.done.call(response, response, panel) : config.done.call(response, response); if (panel) { // resize and/or reposition panel if either width or height is set to 'auto' @@ -2177,7 +2164,7 @@ let jsPanel = { panel.style.left = '0'; panel.style.top = '0'; if (dataAttr) { - ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach((item) => { + ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach(item => { panel.setAttribute(`data-btn${item}`, 'enabled'); }); } @@ -2687,7 +2674,7 @@ let jsPanel = { jsPanel.remClass(self, self.options.animateIn); } jsPanel.setClass(self, self.options.animateOut); - self.addEventListener('animationend', (e) => { + self.addEventListener('animationend', e => { e.stopPropagation(); self.remove(self.id, closedByUser, cb); }); @@ -3700,7 +3687,7 @@ let jsPanel = { if (!Array.isArray(elementsFrom)) { elementsFrom = Array.prototype.slice.call(elementsFrom); } - opts.drop.dropZones.forEach((zone) => { + opts.drop.dropZones.forEach(zone => { // Array.prototype.includes() needs polyfill in IE if (elementsFrom.includes(zone)) { self.droppableTo = zone; @@ -4501,15 +4488,10 @@ let jsPanel = { } } }; - self.saveCurrentDimensions = (setStyleHeight = false) => { + self.saveCurrentDimensions = () => { const normData = window.getComputedStyle(self); self.currentData.width = normData.width; - if (self.status === 'normalized') { - self.currentData.height = normData.height; - } - if (setStyleHeight) { - self.style.height = normData.height; - } + self.currentData.height = normData.height; }; self.saveCurrentPosition = () => { const normData = window.getComputedStyle(self); @@ -4860,7 +4842,7 @@ let jsPanel = { let controls = [], ctrls = self.controlbar.querySelectorAll('.jsPanel-btn'); ctrls.forEach(ctrl => { - let match = ctrl.className.match(/jsPanel-btn-[a-z0-9]{3,}/i), + let match = ctrl.className.match(/jsPanel-btn-[a-z\d]{3,}/i), ctrlName = match[0].substring(12); controls.push(ctrlName); }); @@ -5148,27 +5130,27 @@ let jsPanel = { let bars = [self.headerbar, self.controlbar]; switch (self.options.headerControls.size) { case 'md': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '34px'; }); break; case 'xs': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '26px'; }); break; case 'sm': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '30px'; }); break; case 'lg': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '38px'; }); break; case 'xl': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '42px'; }); break; @@ -5288,9 +5270,7 @@ let jsPanel = { if (autoclose.progressbar) { self.progressbar.classList.add('active'); if (autoclose.background) { - if (jsPanel.themes.indexOf(autoclose.background) > -1) { - self.progressbar.classList.add(autoclose.background + '-bg'); - } else if (jsPanel.colorNames[autoclose.background]) { + if (jsPanel.colorNames[autoclose.background]) { self.progressbar.style.background = '#' + jsPanel.colorNames[autoclose.background]; } else { self.progressbar.style.background = autoclose.background; @@ -5360,15 +5340,9 @@ let jsPanel = { }); self.drag(options.dragit); // do not use self.options.dragit.stop.push() !!! - self.addEventListener( - 'jspaneldragstop', - e => { - if (e.panel === self) { - self.calcSizeFactors(); - } - }, - false - ); + self.addEventListener('jspaneldragstop', e => { + if (e.panel === self) {self.calcSizeFactors();} + }, false); } else { self.titlebar.style.cursor = 'default'; } @@ -5387,15 +5361,9 @@ let jsPanel = { self.sizeit(options.resizeit); let startstatus = void 0; // do not use self.options.resizeit.start.push() !!! - self.addEventListener( - 'jspanelresizestart', - e => { - if (e.panel === self) { - startstatus = self.status; - } - }, - false - ); + self.addEventListener('jspanelresizestart', e => { + if (e.panel === self) {startstatus = self.status;} + }, false); // do not use self.options.resizeit.stop.push() !!! self.addEventListener( 'jspanelresizestop', @@ -5421,7 +5389,8 @@ let jsPanel = { } // initialize self.currentData - must be after options position & size - self.saveCurrentDimensions(true); + //self.saveCurrentDimensions(true); // not clear why 'true' was added here or why this param is needed at all in the method + self.saveCurrentDimensions(); self.saveCurrentPosition(); // option.setStatus @@ -5527,8 +5496,13 @@ let jsPanel = { } // constructor callback + // if (cb) {cb.call(self, self);} if (cb) { - cb.call(self, self); + if (Array.isArray(cb)) { + cb.forEach(item => item.call(self, self)); + } else { + cb.call(self, self); + } } document.dispatchEvent(jspanelloaded); diff --git a/es6module/jspanel.min.css b/es6module/jspanel.min.css index 772841a..5a54bda 100644 --- a/es6module/jspanel.min.css +++ b/es6module/jspanel.min.css @@ -1 +1 @@ -.default-bg,.secondary-bg{background-color:#b0bec5}.primary-bg{background-color:#01579b}.info-bg{background-color:#039be5}.success-bg{background-color:#2e7d32}.warning-bg{background-color:#f57f17}.danger-bg{background-color:#dd2c00}.light-bg{background-color:#e0e0e0}.dark-bg{background-color:#263238}.jsPanel{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;opacity:0;overflow:visible;position:absolute;z-index:100}.jsPanel-hdr{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;flex-shrink:0;line-height:normal}.jsPanel-content{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;background:#fff;color:#000;font-size:1rem;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1}.jsPanel-content pre{color:inherit}.jsPanel-ftr{flex-direction:row;justify-content:flex-end;flex-wrap:nowrap;align-items:center;display:none;box-sizing:border-box;font-size:1rem;height:auto;background:#f5f5f5;font-weight:400;color:#000;overflow:hidden}.jsPanel-ftr.active{display:flex;flex-shrink:0;margin:0;padding:3px 8px}.jsPanel-hdr.jsPanel-hdr-dark .jsPanel-btn:hover{background-color:rgba(255,255,255,.4)}.jsPanel-hdr.jsPanel-hdr-light .jsPanel-btn:hover{background-color:rgba(0,0,0,.15)}.jsPanel-hdr-toolbar{font-size:1rem}.jsPanel-headerbar{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.jsPanel-headerbar img{vertical-align:middle;max-height:38px}.jsPanel-titlebar{display:flex;align-items:center;font-size:1rem;flex:1 1 0;cursor:move;height:100%;overflow:hidden;user-select:none}.jsPanel-titlebar .jsPanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant:small-caps;font-weight:400;margin:0 5px 0 8px;min-width:0}.jsPanel-titlebar.jsPanel-rtl{flex-direction:row-reverse}.jsPanel-controlbar{display:flex;align-items:center;align-self:start;touch-action:none;margin:3px}.jsPanel-controlbar .jsPanel-btn{cursor:pointer;touch-action:none;border-radius:3px;border:0;padding:0;margin:0;background-color:transparent;box-shadow:none}.jsPanel-controlbar .jsPanel-btn i,.jsPanel-controlbar .jsPanel-btn span,.jsPanel-controlbar .jsPanel-btn svg.jsPanel-icon{vertical-align:middle}.jsPanel-controlbar .jsPanel-btn span.glyphicon{padding:0 2px}.jsPanel-controlbar .jsPanel-btn svg.svg-inline--fa{margin:2px 3px}.jsPanel-controlbar .jsPanel-btn-normalize{display:none}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl svg:not(.svg-inline--fa){width:2rem;height:2rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl .svg-inline--fa{font-size:2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span.material-icons{font-size:2.2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span[class^=fa]{width:auto;height:auto;font-size:2rem;margin:0 4px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg svg:not(.svg-inline--fa){width:1.75rem;height:1.75rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg .svg-inline--fa{font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span.material-icons{font-size:1.9rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span[class^=fa]{width:auto;height:auto;font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md svg:not(.svg-inline--fa){width:1.5rem;height:1.5rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md .svg-inline--fa{font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span.material-icons{font-size:1.6rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span[class^=fa]{width:auto;height:auto;font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm svg:not(.svg-inline--fa){width:1.25rem;height:1.25rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm .svg-inline--fa{font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span.material-icons{font-size:1.3rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span[class^=fa]{width:auto;height:auto;font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs svg:not(.svg-inline--fa){width:1rem;height:1rem;margin:1px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs .svg-inline--fa{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span.material-icons{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span[class^=fa]{width:auto;height:auto;font-size:1rem}.jsPanel-hdr-toolbar{display:none;width:auto;height:auto}.jsPanel-hdr-toolbar.active{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;padding:3px 8px}.jsPanel-titlebar .jsPanel-title[dir=rtl]{margin:0 8px 0 5px}.jsPanel-hdr-toolbar[dir=rtl].active{padding:0 8px 0 8px}.jsPanel-content[dir=rtl]{text-align:right}.jsPanel-ftr[dir=rtl]{flex-direction:row}#jsPanel-replacement-container,.jsPanel-minimized-box,.jsPanel-minimized-container{display:flex;flex-flow:row wrap-reverse;background:transparent none repeat scroll 0 0;bottom:0;height:auto;left:0;position:fixed;width:auto;z-index:9998}.jsPanel-replacement{font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;display:flex;align-items:center;width:200px;height:34px;margin:1px 1px 0 0;z-index:9999}.jsPanel-replacement .jsPanel-hdr{flex-grow:1;min-width:0;padding:0;height:34px;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo{max-width:50%;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo img{max-width:100px;max-height:34px}.jsPanel-replacement .jsPanel-titlebar{cursor:default;min-width:0}.jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize{display:block}.jsPanel-minimized-box,.jsPanel-minimized-container{position:absolute;width:100%;overflow:hidden}.flexOne{display:flex;flex-flow:row wrap}.jsPanel-resizeit-handle{display:block;font-size:.1px;position:absolute;touch-action:none}.jsPanel-resizeit-handle.jsPanel-resizeit-n{cursor:n-resize;height:12px;left:9px;top:-5px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-e{cursor:e-resize;height:calc(100% - 18px);right:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-s{bottom:-9px;cursor:s-resize;height:12px;left:9px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-w{cursor:w-resize;height:calc(100% - 18px);left:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-ne{cursor:ne-resize;height:18px;right:-9px;top:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-se{bottom:-9px;cursor:se-resize;height:18px;right:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-sw{bottom:-9px;cursor:sw-resize;height:18px;left:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-nw{cursor:nw-resize;height:18px;left:-9px;top:-9px;width:18px}.jsPanel-drag-overlay{width:100%;height:100%;position:absolute;left:0;top:0}.jsPanel-error .jsPanel-content{border:0!important;padding-top:0!important;font-size:.9rem;text-align:center}.jsPanel-error .jsPanel-content p{margin:0 0 10px 0}.jsPanel-error .jsPanel-content mark{background:#e6e6fa;border-radius:.33rem;padding:0 8px;font-family:monospace}.jsPanel-error .jsPanel-content .jsPanel-error-content-separator{width:100%;height:1px;background-image:linear-gradient(90deg,#fff 0,#663399 50%,#fff 100%);margin-bottom:10px}.jsPanel-depth-1{box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}.jsPanel-depth-2{box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23)}.jsPanel-depth-3{box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)}.jsPanel-depth-4{box-shadow:0 19px 38px rgba(0,0,0,.3),0 15px 12px rgba(0,0,0,.22)}.jsPanel-depth-5{box-shadow:0 24px 48px rgba(0,0,0,.3),0 20px 14px rgba(0,0,0,.22)}.jsPanel-snap-area{position:fixed;background:#000;opacity:.2;border:1px solid silver;box-shadow:0 14px 28px rgba(0,0,0,.5),0 10px 10px rgba(0,0,0,.5);z-index:9999}.jsPanel-snap-area-lb,.jsPanel-snap-area-lc,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-left-center,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{left:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{left:37.5%}.jsPanel-snap-area-rb,.jsPanel-snap-area-rc,.jsPanel-snap-area-right-bottom,.jsPanel-snap-area-right-center,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{right:0}.jsPanel-snap-area-center-top,.jsPanel-snap-area-ct,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{top:0}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{top:37.5%}.jsPanel-snap-area-cb,.jsPanel-snap-area-center-bottom,.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{bottom:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{width:25%}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{height:25%}.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{border-bottom-right-radius:100%}.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{border-bottom-left-radius:100%}.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{border-top-left-radius:100%}.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom{border-top-right-radius:100%}.jsPanel-connector-left-bottom-corner,.jsPanel-connector-left-top-corner,.jsPanel-connector-right-bottom-corner,.jsPanel-connector-right-top-corner{width:12px;height:12px;position:absolute;border-radius:50%}.jsPanel-connector-left-top-corner{left:calc(100% - 6px);top:calc(100% - 6px)}.jsPanel-connector-right-top-corner{left:-6px;top:calc(100% - 6px)}.jsPanel-connector-right-bottom-corner{left:-6px;top:-6px}.jsPanel-connector-left-bottom-corner{left:calc(100% - 6px);top:-6px}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright,.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop,.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop,.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{width:0;height:0;position:absolute;border:12px solid transparent}.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{top:100%;border-bottom-width:0}.jsPanel-connector-top{left:calc(50% - 12px)}.jsPanel-connector-topleft{left:0}.jsPanel-connector-topright{left:calc(100% - 24px)}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright{top:-12px;border-top-width:0}.jsPanel-connector-bottom{left:calc(50% - 12px)}.jsPanel-connector-bottomleft{left:0}.jsPanel-connector-bottomright{left:calc(100% - 24px)}.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop{left:100%;border-right-width:0}.jsPanel-connector-left{top:calc(50% - 12px)}.jsPanel-connector-lefttop{top:0}.jsPanel-connector-leftbottom{top:calc(100% - 24px)}.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop{left:-12px;border-left-width:0}.jsPanel-connector-right{top:calc(50% - 12px)}.jsPanel-connector-righttop{top:0}.jsPanel-connector-rightbottom{top:calc(100% - 24px)}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.jsPanel-replacement .jsPanel-titlebar{max-width:105px}}@keyframes jsPanelFadeIn{from{opacity:0}to{opacity:1}}.jsPanelFadeIn{opacity:0;animation:jsPanelFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes jsPanelFadeOut{from{opacity:1}to{opacity:0}}.jsPanelFadeOut{animation:jsPanelFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes modalBackdropFadeIn{from{opacity:0}to{opacity:.65}}.jsPanel-modal-backdrop{animation:modalBackdropFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:750ms;background:#000;position:fixed;top:0;left:0;width:100%;height:100%}@keyframes modalBackdropFadeOut{from{opacity:.65}to{opacity:0}}.jsPanel-modal-backdrop-out{animation:modalBackdropFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.4s}.jsPanel-modal-backdrop-multi{background:rgba(0,0,0,.15)}.jsPanel-content .jsPanel-iframe-overlay{position:absolute;top:0;width:100%;height:100%;background:0 0}.jsPanel-addCloseCtrl{position:absolute;top:0;right:0;width:.8rem;height:.8rem;margin:2px;cursor:pointer;line-height:.8rem;padding:0;z-index:100;border:0;background-color:transparent}.jsPanel-addCloseCtrl.rtl{right:unset;left:0}.jsPanel-progressbar{position:relative;width:100%;height:0;overflow:hidden}.jsPanel-progressbar .jsPanel-progressbar-slider{position:absolute;width:0;height:3px;background:#d3d3d3;right:0}.jsPanel-progressbar.active{height:3px}@keyframes progressbar{from{width:0}to{width:100%}}.jsPanel-content.jsPanel-content-noheader{border:none!important}body{-ms-overflow-style:scrollbar} \ No newline at end of file +.jsPanel{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;opacity:0;overflow:visible;position:absolute;z-index:100}.jsPanel-hdr{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;display:flex;flex-direction:column;line-height:normal}.jsPanel-content{border:0;box-sizing:border-box;vertical-align:baseline;font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;font-weight:400;background:#fff;color:#000;font-size:1rem;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1}.jsPanel-content pre{color:inherit}.jsPanel-ftr{flex-direction:row;justify-content:flex-end;flex-wrap:nowrap;align-items:center;display:none;box-sizing:border-box;font-size:1rem;height:auto;background:#f5f5f5;font-weight:400;color:#000;overflow:hidden}.jsPanel-ftr.active{display:flex;flex-shrink:0;margin:0;padding:3px 8px}.jsPanel-hdr.jsPanel-hdr-dark .jsPanel-btn:hover{background-color:rgba(255,255,255,.4)}.jsPanel-hdr.jsPanel-hdr-light .jsPanel-btn:hover{background-color:rgba(0,0,0,.15)}.jsPanel-hdr-toolbar{font-size:1rem}.jsPanel-headerbar{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.jsPanel-headerbar img{vertical-align:middle;max-height:38px}.jsPanel-titlebar{display:flex;align-items:center;font-size:1rem;flex:1 1 0;cursor:move;height:100%;overflow:hidden;user-select:none}.jsPanel-titlebar .jsPanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant:small-caps;font-weight:400;margin:0 5px 0 8px;min-width:0}.jsPanel-titlebar.jsPanel-rtl{flex-direction:row-reverse}.jsPanel-controlbar{display:flex;align-items:center;align-self:start;touch-action:none;margin:3px}.jsPanel-controlbar .jsPanel-btn{cursor:pointer;touch-action:none;border-radius:3px;border:0;padding:0;margin:0;background-color:transparent;box-shadow:none}.jsPanel-controlbar .jsPanel-btn i,.jsPanel-controlbar .jsPanel-btn span,.jsPanel-controlbar .jsPanel-btn svg.jsPanel-icon{vertical-align:middle}.jsPanel-controlbar .jsPanel-btn span.glyphicon{padding:0 2px}.jsPanel-controlbar .jsPanel-btn svg.svg-inline--fa{margin:2px 3px}.jsPanel-controlbar .jsPanel-btn-normalize{display:none}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl svg:not(.svg-inline--fa){width:2rem;height:2rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl .svg-inline--fa{font-size:2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span.material-icons{font-size:2.2rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xl span[class^=fa]{width:auto;height:auto;font-size:2rem;margin:0 4px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg svg:not(.svg-inline--fa){width:1.75rem;height:1.75rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg .svg-inline--fa{font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span.material-icons{font-size:1.9rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-lg span[class^=fa]{width:auto;height:auto;font-size:1.75rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md svg:not(.svg-inline--fa){width:1.5rem;height:1.5rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md .svg-inline--fa{font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span.material-icons{font-size:1.6rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span[class^=fa]{width:auto;height:auto;font-size:1.5rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm svg:not(.svg-inline--fa){width:1.25rem;height:1.25rem;margin:2px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm .svg-inline--fa{font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span.material-icons{font-size:1.3rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-sm span[class^=fa]{width:auto;height:auto;font-size:1.25rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span:not(.material-icons),.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs svg:not(.svg-inline--fa){width:1rem;height:1rem;margin:1px 3px}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs .svg-inline--fa{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span.material-icons{font-size:1rem}.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-xs span[class^=fa]{width:auto;height:auto;font-size:1rem}.jsPanel-hdr-toolbar{display:none;width:auto;height:auto}.jsPanel-hdr-toolbar.active{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;padding:3px 8px}.jsPanel-titlebar .jsPanel-title[dir=rtl]{margin:0 8px 0 5px}.jsPanel-hdr-toolbar[dir=rtl].active{padding:0 8px 0 8px}.jsPanel-content[dir=rtl]{text-align:right}.jsPanel-ftr[dir=rtl]{flex-direction:row}#jsPanel-replacement-container,.jsPanel-minimized-box,.jsPanel-minimized-container{display:flex;flex-flow:row wrap-reverse;background:transparent none repeat scroll 0 0;bottom:0;height:auto;left:0;position:fixed;width:auto;z-index:9998}.jsPanel-replacement{font-family:Roboto,"Open Sans",Lato,"Helvetica Neue",Arial,sans-serif;display:flex;align-items:center;width:200px;height:34px;margin:1px 1px 0 0;z-index:9999}.jsPanel-replacement .jsPanel-hdr{flex-grow:1;min-width:0;padding:0;height:34px;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo{max-width:50%;overflow:hidden}.jsPanel-replacement .jsPanel-hdr .jsPanel-headerlogo img{max-width:100px;max-height:34px}.jsPanel-replacement .jsPanel-titlebar{cursor:default;min-width:0}.jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize{display:block}.jsPanel-minimized-box,.jsPanel-minimized-container{position:absolute;width:100%;overflow:hidden}.flexOne{display:flex;flex-flow:row wrap}.jsPanel-resizeit-handle{display:block;font-size:.1px;position:absolute;touch-action:none}.jsPanel-resizeit-handle.jsPanel-resizeit-n{cursor:n-resize;height:12px;left:9px;top:-5px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-e{cursor:e-resize;height:calc(100% - 18px);right:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-s{bottom:-9px;cursor:s-resize;height:12px;left:9px;width:calc(100% - 18px)}.jsPanel-resizeit-handle.jsPanel-resizeit-w{cursor:w-resize;height:calc(100% - 18px);left:-9px;top:9px;width:12px}.jsPanel-resizeit-handle.jsPanel-resizeit-ne{cursor:ne-resize;height:18px;right:-9px;top:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-se{bottom:-9px;cursor:se-resize;height:18px;right:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-sw{bottom:-9px;cursor:sw-resize;height:18px;left:-9px;width:18px}.jsPanel-resizeit-handle.jsPanel-resizeit-nw{cursor:nw-resize;height:18px;left:-9px;top:-9px;width:18px}.jsPanel-drag-overlay{width:100%;height:100%;position:absolute;left:0;top:0}.jsPanel-error .jsPanel-content{border:0!important;padding-top:0!important;font-size:.9rem;text-align:center}.jsPanel-error .jsPanel-content p{margin:0 0 10px 0}.jsPanel-error .jsPanel-content mark{background:#e6e6fa;border-radius:.33rem;padding:0 8px;font-family:monospace}.jsPanel-error .jsPanel-content .jsPanel-error-content-separator{width:100%;height:1px;background-image:linear-gradient(90deg,#fff 0,#663399 50%,#fff 100%);margin-bottom:10px}.jsPanel-depth-1{box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}.jsPanel-depth-2{box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23)}.jsPanel-depth-3{box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)}.jsPanel-depth-4{box-shadow:0 19px 38px rgba(0,0,0,.3),0 15px 12px rgba(0,0,0,.22)}.jsPanel-depth-5{box-shadow:0 24px 48px rgba(0,0,0,.3),0 20px 14px rgba(0,0,0,.22)}.jsPanel-snap-area{position:fixed;background:#000;opacity:.2;border:1px solid silver;box-shadow:0 14px 28px rgba(0,0,0,.5),0 10px 10px rgba(0,0,0,.5);z-index:9999}.jsPanel-snap-area-lb,.jsPanel-snap-area-lc,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-left-center,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{left:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{left:37.5%}.jsPanel-snap-area-rb,.jsPanel-snap-area-rc,.jsPanel-snap-area-right-bottom,.jsPanel-snap-area-right-center,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{right:0}.jsPanel-snap-area-center-top,.jsPanel-snap-area-ct,.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt,.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{top:0}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{top:37.5%}.jsPanel-snap-area-cb,.jsPanel-snap-area-center-bottom,.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom,.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{bottom:0}.jsPanel-snap-area-cb,.jsPanel-snap-area-ct{width:25%}.jsPanel-snap-area-lc,.jsPanel-snap-area-rc{height:25%}.jsPanel-snap-area-left-top,.jsPanel-snap-area-lt{border-bottom-right-radius:100%}.jsPanel-snap-area-right-top,.jsPanel-snap-area-rt{border-bottom-left-radius:100%}.jsPanel-snap-area-rb,.jsPanel-snap-area-right-bottom{border-top-left-radius:100%}.jsPanel-snap-area-lb,.jsPanel-snap-area-left-bottom{border-top-right-radius:100%}.jsPanel-connector-left-bottom-corner,.jsPanel-connector-left-top-corner,.jsPanel-connector-right-bottom-corner,.jsPanel-connector-right-top-corner{width:12px;height:12px;position:absolute;border-radius:50%}.jsPanel-connector-left-top-corner{left:calc(100% - 6px);top:calc(100% - 6px)}.jsPanel-connector-right-top-corner{left:-6px;top:calc(100% - 6px)}.jsPanel-connector-right-bottom-corner{left:-6px;top:-6px}.jsPanel-connector-left-bottom-corner{left:calc(100% - 6px);top:-6px}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright,.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop,.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop,.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{width:0;height:0;position:absolute;border:12px solid transparent}.jsPanel-connector-top,.jsPanel-connector-topleft,.jsPanel-connector-topright{top:100%;border-bottom-width:0}.jsPanel-connector-top{left:calc(50% - 12px)}.jsPanel-connector-topleft{left:0}.jsPanel-connector-topright{left:calc(100% - 24px)}.jsPanel-connector-bottom,.jsPanel-connector-bottomleft,.jsPanel-connector-bottomright{top:-12px;border-top-width:0}.jsPanel-connector-bottom{left:calc(50% - 12px)}.jsPanel-connector-bottomleft{left:0}.jsPanel-connector-bottomright{left:calc(100% - 24px)}.jsPanel-connector-left,.jsPanel-connector-leftbottom,.jsPanel-connector-lefttop{left:100%;border-right-width:0}.jsPanel-connector-left{top:calc(50% - 12px)}.jsPanel-connector-lefttop{top:0}.jsPanel-connector-leftbottom{top:calc(100% - 24px)}.jsPanel-connector-right,.jsPanel-connector-rightbottom,.jsPanel-connector-righttop{left:-12px;border-left-width:0}.jsPanel-connector-right{top:calc(50% - 12px)}.jsPanel-connector-righttop{top:0}.jsPanel-connector-rightbottom{top:calc(100% - 24px)}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.jsPanel-replacement .jsPanel-titlebar{max-width:105px}}@keyframes jsPanelFadeIn{from{opacity:0}to{opacity:1}}.jsPanelFadeIn{opacity:0;animation:jsPanelFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes jsPanelFadeOut{from{opacity:1}to{opacity:0}}.jsPanelFadeOut{animation:jsPanelFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.6s}@keyframes modalBackdropFadeIn{from{opacity:0}to{opacity:.65}}.jsPanel-modal-backdrop{animation:modalBackdropFadeIn ease-in 1;animation-fill-mode:forwards;animation-duration:750ms;background:#000;position:fixed;top:0;left:0;width:100%;height:100%}@keyframes modalBackdropFadeOut{from{opacity:.65}to{opacity:0}}.jsPanel-modal-backdrop-out{animation:modalBackdropFadeOut ease-in 1;animation-fill-mode:forwards;animation-duration:.4s}.jsPanel-modal-backdrop-multi{background:rgba(0,0,0,.15)}.jsPanel-content .jsPanel-iframe-overlay{position:absolute;top:0;width:100%;height:100%;background:0 0}.jsPanel-addCloseCtrl{position:absolute;top:0;right:0;width:.8rem;height:.8rem;margin:2px;cursor:pointer;line-height:.8rem;padding:0;z-index:100;border:0;background-color:transparent}.jsPanel-addCloseCtrl.rtl{right:unset;left:0}.jsPanel-progressbar{position:relative;width:100%;height:0;overflow:hidden}.jsPanel-progressbar .jsPanel-progressbar-slider{position:absolute;width:0;height:3px;background:#d3d3d3;right:0}.jsPanel-progressbar.active{height:3px}@keyframes progressbar{from{width:0}to{width:100%}}.jsPanel-content.jsPanel-content-noheader{border:none!important}body{-ms-overflow-style:scrollbar} \ No newline at end of file diff --git a/es6module/jspanel.min.js b/es6module/jspanel.min.js index 34ff03d..8142bfd 100644 --- a/es6module/jspanel.min.js +++ b/es6module/jspanel.min.js @@ -1 +1 @@ -export let jsPanel={version:"4.16.0",date:"2022-07-03 19:05",ajaxAlwaysCallbacks:[],autopositionSpacing:4,closeOnEscape:void document.addEventListener("keydown",e=>{"Escape"!==e.key&&"Escape"!==e.code&&"Esc"!==e.key||jsPanel.getPanels(e=>e.classList.contains("jsPanel")).some(e=>!!e.options.closeOnEscape&&("function"==typeof e.options.closeOnEscape?e.options.closeOnEscape.call(e,e):(e.close(null,!0),!0)))},!1),defaults:{boxShadow:3,container:"window",contentSize:{width:"400px",height:"200px"},dragit:{cursor:"move",handles:".jsPanel-headerlogo, .jsPanel-titlebar, .jsPanel-ftr",opacity:.8,disableOnMaximized:!0},header:!0,headerTitle:"jsPanel",headerControls:{size:"md"},iconfont:void 0,maximizedMargin:0,minimizeTo:"default",paneltype:"standard",position:{my:"center",at:"center"},resizeit:{handles:"n, e, s, w, ne, se, sw, nw",minWidth:128,minHeight:38},theme:"default"},defaultAutocloseConfig:{time:"8s",progressbar:!0},defaultSnapConfig:{sensitivity:70,trigger:"panel",active:"both"},extensions:{},globalCallbacks:!1,icons:{close:'',maximize:'',normalize:'',minimize:'',smallify:''},idCounter:0,isIE:(()=>document.documentMode||!1)(),pointerdown:"onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],pointermove:"onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],pointerup:"onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"],polyfills:(Object.assign||Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:function(e){if(null==e)throw new TypeError("Cannot convert first argument to object");let t=Object(e);for(let e=1;e=0&&o.item(t)!==n;);}while(t<0&&(n=n.parentElement));return n}),function(){if("function"==typeof window.CustomEvent)return!1;function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};let o=document.createEvent("CustomEvent");return o.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),o}e.prototype=window.Event.prototype,window.CustomEvent=e}(),String.prototype.endsWith||(String.prototype.endsWith=function(e,t){return(void 0===t||t>this.length)&&(t=this.length),this.substring(t-e.length,t)===e}),String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{value:function(e,t){var o=t>0?0|t:0;return this.substring(o,o+e.length)===e}}),String.prototype.includes||(String.prototype.includes=function(e,t){"use strict";if(e instanceof RegExp)throw TypeError("first argument must not be a RegExp");return void 0===t&&(t=0),-1!==this.indexOf(e,t)}),String.prototype.repeat||(String.prototype.repeat=function(e){"use strict";if(null==this)throw new TypeError("can't convert "+this+" to object");var t=""+this;if((e=+e)!=e&&(e=0),e<0)throw new RangeError("repeat count must be non-negative");if(e==1/0)throw new RangeError("repeat count must be less than infinity");if(e=Math.floor(e),0==t.length||0==e)return"";if(t.length*e>=1<<28)throw new RangeError("repeat count must not overflow maximum string size");var o=t.length*e;for(e=Math.floor(Math.log(e)/Math.log(2));e;)t+=t,e--;return t+=t.substring(0,o-t.length)}),Number.isInteger=Number.isInteger||function(e){return"number"==typeof e&&isFinite(e)&&Math.floor(e)===e},void(Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(e,t){if(null==this)throw new TypeError('"this" is null or not defined');let o=Object(this),n=o.length>>>0;if(0===n)return!1;let a=0|t,s=Math.max(a>=0?a:n-Math.abs(a),0);for(;sjsPanel.modifier=e),void document.addEventListener("keyup",()=>jsPanel.modifier=!1)),usePointerEvents(e=!0){e?(this.pointerdown="onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"]):(this.pointerdown="ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="ontouchend"in window?["touchend","mouseup"]:["mouseup"])},pOcontainer(e){if("window"===e)return document.body;if("string"==typeof e){let t=document.querySelectorAll(e);return!!(t.length&&t.length>0)&&t}return 1===e.nodeType?e:!!e.length&&e[0]},pOcontainment(e){let t=e;if("function"==typeof e&&(t=e()),"number"==typeof t)return[t,t,t,t];if(Array.isArray(t)){if(1===t.length)return[t[0],t[0],t[0],t[0]];if(2===t.length)return t.concat(t);3===t.length&&(t[3]=t[1])}return t},pOsize(e,t){let o=t||this.defaults.contentSize;const n=e.parentElement;if("string"==typeof o){const e=o.trim().split(" ");(o={}).width=e[0],2===e.length?o.height=e[1]:o.height=e[0]}else o.width&&!o.height?o.height=o.width:o.height&&!o.width&&(o.width=o.height);if(String(o.width).match(/^[0-9.]+$/gi))o.width+="px";else if("string"==typeof o.width&&o.width.endsWith("%"))if(n===document.body)o.width=window.innerWidth*(parseFloat(o.width)/100)+"px";else{const e=window.getComputedStyle(n),t=parseFloat(e.borderLeftWidth)+parseFloat(e.borderRightWidth);o.width=(parseFloat(e.width)-t)*(parseFloat(o.width)/100)+"px"}else"function"==typeof o.width&&(o.width=o.width.call(e,e),"number"==typeof o.width?o.width+="px":"string"==typeof o.width&&o.width.match(/^[0-9.]+$/gi)&&(o.width+="px"));if(String(o.height).match(/^[0-9.]+$/gi))o.height+="px";else if("string"==typeof o.height&&o.height.endsWith("%"))if(n===document.body)o.height=window.innerHeight*(parseFloat(o.height)/100)+"px";else{const e=window.getComputedStyle(n),t=parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth);o.height=(parseFloat(e.height)-t)*(parseFloat(o.height)/100)+"px"}else"function"==typeof o.height&&(o.height=o.height.call(e,e),"number"==typeof o.height?o.height+="px":"string"==typeof o.height&&o.height.match(/^[0-9.]+$/gi)&&(o.height+="px"));return o},pOborder(e){let t=[],o=e.trim().replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," ").split(" ");return o.forEach((e,t)=>{(e.startsWith("--")||e.startsWith("var"))&&(o[t]=jsPanel.getCssVariableValue(e))}),o.forEach(e=>{jsPanel.colorNames[e]?t[2]="#"+jsPanel.colorNames[e]:e.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)?t[1]=e:e.match(/(thin|medium|thick)|(\d*\.?\d*(cap|ch|em|ex|ic|lh|rem|rlh|vh|vw|vmax|vmin|vb|vi|px|cm|mm|Q|in|pc|pt))/)?t[0]=e:t[2]=e}),t[0]||(t[0]="medium"),t[1]||(t[1]="solid"),t[2]||(t[2]=""),t},pOheaderControls(e){if("string"==typeof e){let t={},o=e.toLowerCase(),n=o.match(/xl|lg|md|sm|xs/),a=o.match(/closeonly|none/);return n&&(t.size=n[0]),a&&(t=Object.assign({},t,{maximize:"remove",normalize:"remove",minimize:"remove",smallify:"remove"}),"none"===a[0]&&(t.close="remove")),Object.assign({},this.defaults.headerControls,t)}return Object.assign({},this.defaults.headerControls,e)},pOtheme(e){let t,o="";if((e=e.trim()).match(/^(rgb|hsl|var)/)){let n=e.indexOf(")");(t=e.slice(0,n+1).replace(/\s+/g,"")).startsWith("var")&&(t=jsPanel.getCssVariableValue(t)),o=e.slice(n+1,e.length).trim()}else if(e.match(/^(#|\w|--)/)){let n=e.indexOf(" ");n>0?(t=e.slice(0,n+1).replace(/\s+/g,""),o=e.slice(n+1,e.length).trim()):t=e,t.startsWith("--")&&(t=jsPanel.getCssVariableValue(t))}if(t.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)&&(t="#"+t),o.startsWith("fillcolor")){let e=o.indexOf(" ");o=(o=o.slice(e+1,o.length).trim().replace(/\s+/g,"")).match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)?"#"+o:jsPanel.colorNames[o]?"#"+jsPanel.colorNames[o]:o.match(/^(--|var)/)?jsPanel.getCssVariableValue(o):"#fff"}return{color:t,colors:!1,filling:o}},color(e){let t,o,n,a,s,r,l,i,c,d=e.toLowerCase(),p={};const h=/^rgba?\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3}),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi,f=/^hsla?\(([0-9]{1,3}),([0-9]{1,3}%),([0-9]{1,3}%),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi,u=this.colorNames;return u[d]&&(d=u[d]),null!==d.match(/^#?([0-9a-f]{3}|[0-9a-f]{6})$/gi)?((d=d.replace("#","")).length%2==1?(t=d.slice(0,1).repeat(2),o=d.slice(1,2).repeat(2),n=d.slice(2,3).repeat(2),p.rgb={r:parseInt(t,16),g:parseInt(o,16),b:parseInt(n,16)},p.hex=`#${t}${o}${n}`):(p.rgb={r:parseInt(d.slice(0,2),16),g:parseInt(d.slice(2,4),16),b:parseInt(d.slice(4,6),16)},p.hex=`#${d}`),c=this.rgbToHsl(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl=c,p.rgb.css=`rgb(${p.rgb.r},${p.rgb.g},${p.rgb.b})`):d.match(h)?(l=h.exec(d),p.rgb={css:d,r:l[1],g:l[2],b:l[3]},p.hex=this.rgbToHex(l[1],l[2],l[3]),c=this.rgbToHsl(l[1],l[2],l[3]),p.hsl=c):d.match(f)?(a=(l=f.exec(d))[1]/360,s=l[2].slice(0,l[2].length-1)/100,r=l[3].slice(0,l[3].length-1)/100,i=this.hslToRgb(a,s,r),p.rgb={css:`rgb(${i[0]},${i[1]},${i[2]})`,r:i[0],g:i[1],b:i[2]},p.hex=this.rgbToHex(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl={css:`hsl(${l[1]},${l[2]},${l[3]})`,h:l[1],s:l[2],l:l[3]}):(p.hex="#f5f5f5",p.rgb={css:"rgb(245,245,245)",r:245,g:245,b:245},p.hsl={css:"hsl(0,0%,96%)",h:0,s:"0%",l:"96%"}),p},calcColors(e){const t=this.colorBrightnessThreshold,o=this.color(e),n=this.lighten(e,this.colorFilledLight),a=this.darken(e,this.colorFilled),s=this.perceivedBrightness(e)<=t?"#ffffff":"#000000",r=this.perceivedBrightness(n)<=t?"#ffffff":"#000000",l=this.perceivedBrightness(a)<=t?"#ffffff":"#000000",i=this.lighten(e,this.colorFilledDark),c=this.perceivedBrightness(i)<=t?"#ffffff":"#000000";return[o.hsl.css,n,a,s,r,l,i,c]},darken(e,t){const o=this.color(e).hsl,n=parseFloat(o.l),a=Math.round(n-n*t)+"%";return`hsl(${o.h},${o.s},${a})`},lighten(e,t){const o=this.color(e).hsl,n=parseFloat(o.l),a=Math.round(n+(100-n)*t)+"%";return`hsl(${o.h},${o.s},${a})`},hslToRgb(e,t,o){let n,a,s;if(0===t)n=a=s=o;else{let r=(e,t,o)=>(o<0&&(o+=1),o>1&&(o-=1),o<1/6?e+6*(t-e)*o:o<.5?t:o<2/3?e+(t-e)*(2/3-o)*6:e),l=o<.5?o*(1+t):o+t-o*t,i=2*o-l;n=r(i,l,e+1/3),a=r(i,l,e),s=r(i,l,e-1/3)}return[Math.round(255*n),Math.round(255*a),Math.round(255*s)]},rgbToHsl(e,t,o){e/=255,t/=255,o/=255;let n,a,s=Math.max(e,t,o),r=Math.min(e,t,o),l=(s+r)/2;if(s===r)n=a=0;else{let i=s-r;switch(a=l>.5?i/(2-s-r):i/(s+r),s){case e:n=(t-o)/i+(te.match(/^(down|right|up|left)$/i));n.length&&(t.autoposition=n[0],o.splice(o.indexOf(n[0]),1));let a=o.filter(e=>e.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i));a.length?(t.my=a[0],t.at=a[1]||a[0],o.splice(o.indexOf(a[0]),1),a[1]&&o.splice(o.indexOf(a[1]),1)):(t.my="center",t.at="center");let s=o.filter(e=>e.match(/^[+-]?\d*\.?\d+[a-z%]*$/i));return s.length&&(t.offsetX=s[0].match(/^[+-]?\d*\.?\d+$/i)?`${s[0]}px`:s[0],s[1]?t.offsetY=s[1].match(/^[+-]?\d*\.?\d+$/i)?`${s[1]}px`:s[1]:t.offsetY=t.offsetX,o.splice(o.indexOf(s[0]),1),s[1]&&o.splice(o.indexOf(s[1]),1)),o.length&&(t.of=o.join(" ")),t},position(e,t){if(!t)return e.style.opacity=1,e;t="string"==typeof t?Object.assign({},this.defaults.position,this.pOposition(t)):Object.assign({},this.defaults.position,t),["my","at","of"].forEach(o=>{"function"==typeof t[o]&&(t[o]=t[o].call(e,e))}),"window"===e.options.container&&(e.style.position="fixed"),"string"==typeof e?e=document.querySelector(e):Object.getPrototypeOf(e).jquery&&(e=e[0]);const o="window"===e.options.container?"window":e.parentElement,n=e.getBoundingClientRect(),a=e.parentElement.getBoundingClientRect(),s="window"===o?{left:0,top:0,width:document.documentElement.clientWidth,height:window.innerHeight}:{width:a.width,height:a.height,left:a.left,top:a.top},r="window"===o?{x:1,y:1}:{x:s.width/o.offsetWidth,y:s.height/o.offsetHeight},l="window"===o?{borderTopWidth:"0px",borderRightWidth:"0px",borderBottomWidth:"0px",borderLeftWidth:"0px"}:window.getComputedStyle(o);let i;s.width-=(parseFloat(l.borderLeftWidth)+parseFloat(l.borderRightWidth))*r.x,s.height-=(parseFloat(l.borderTopWidth)+parseFloat(l.borderBottomWidth))*r.y,i=t.of?"string"==typeof t.of?"window"===t.of?{borderTopWidth:"0px",borderRightWidth:"0px",borderBottomWidth:"0px",borderLeftWidth:"0px"}:document.querySelector(t.of).getBoundingClientRect():Object.getPrototypeOf(t.of).jquery?t.of[0].getBoundingClientRect():t.of.getBoundingClientRect():s;let c=this.getScrollbarWidth(document.body),d=this.getScrollbarWidth(e.parentElement),p="0px";t.my.startsWith("left-")?t.at.startsWith("left-")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)+"px":"0px":t.at.startsWith("center")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)+i.width/2+"px":s.width/2+"px":t.at.startsWith("right-")&&(p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)+i.width+"px":s.width+"px"):t.my.startsWith("center")?t.at.startsWith("left-")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)-n.width/2+"px":-n.width/2+"px":t.at.startsWith("center")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)-(n.width-i.width)/2+"px":s.width/2-n.width/2+"px":t.at.startsWith("right-")&&(p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)+(i.width-n.width/2)+"px":s.width-n.width/2+"px"):t.my.startsWith("right-")&&(t.at.startsWith("left-")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)-n.width+"px":-n.width+"px":t.at.startsWith("center")?p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)-n.width+i.width/2+"px":s.width/2-n.width+"px":t.at.startsWith("right-")&&(p=t.of?i.left-s.left-parseFloat(l.borderLeftWidth)+i.width-n.width+"px":s.width-n.width+"px","window"!==o&&(p=parseFloat(p)-d.y+"px")));let h="0px";t.my.endsWith("-top")?t.at.endsWith("-top")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)+"px":"0px":t.at.endsWith("center")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)+i.height/2+"px":s.height/2+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)+i.height+"px":s.height+"px"):t.my.endsWith("center")?t.at.endsWith("-top")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height/2+"px":-n.height/2+"px":t.at.endsWith("center")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height/2+i.height/2+"px":s.height/2-n.height/2+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height/2+i.height+"px":s.height-n.height/2+"px"):t.my.endsWith("-bottom")&&(t.at.endsWith("-top")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height+"px":-n.height+"px":t.at.endsWith("center")?h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height+i.height/2+"px":s.height/2-n.height+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-s.top-parseFloat(l.borderTopWidth)-n.height+i.height+"px":s.height-n.height+"px",h="window"!==o?parseFloat(h)-d.x+"px":parseFloat(h)-c.x+"px")),e.style.left=1===r.x?p:parseFloat(p)/r.x+"px",e.style.top=1===r.y?h:parseFloat(h)/r.y+"px";let f=getComputedStyle(e),u={left:f.left,top:f.top};return t.autoposition&&t.my===t.at&&["left-top","center-top","right-top","left-bottom","center-bottom","right-bottom"].indexOf(t.my)>=0&&(u=this.applyPositionAutopos(e,u,t)),(t.offsetX||t.offsetY)&&(u=this.applyPositionOffset(e,u,t)),(t.minLeft||t.minTop||t.maxLeft||t.maxTop)&&(u=this.applyPositionMinMax(e,u,t)),t.modify&&(u=this.applyPositionModify(e,u,t)),"number"==typeof e.options.opacity?e.style.opacity=e.options.opacity:e.style.opacity=1,e},applyPositionAutopos(e,t,o){const n=`${o.my}-${o.autoposition.toLowerCase()}`;e.classList.add(n);const a=Array.prototype.slice.call(document.querySelectorAll(`.${n}`)),s=a.indexOf(e);if(a.length>1){switch(o.autoposition){case"down":a.forEach((e,o)=>{o>0&&o<=s&&(t.top=parseFloat(t.top)+a[--o].getBoundingClientRect().height+jsPanel.autopositionSpacing+"px")});break;case"up":a.forEach((e,o)=>{o>0&&o<=s&&(t.top=parseFloat(t.top)-a[--o].getBoundingClientRect().height-jsPanel.autopositionSpacing+"px")});break;case"right":a.forEach((e,o)=>{o>0&&o<=s&&(t.left=parseFloat(t.left)+a[--o].getBoundingClientRect().width+jsPanel.autopositionSpacing+"px")});break;case"left":a.forEach((e,o)=>{o>0&&o<=s&&(t.left=parseFloat(t.left)-a[--o].getBoundingClientRect().width-jsPanel.autopositionSpacing+"px")})}e.style.left=t.left,e.style.top=t.top}return{left:t.left,top:t.top}},applyPositionOffset(e,t,o){["offsetX","offsetY"].forEach(e=>{o[e]?("function"==typeof o[e]&&(o[e]=o[e].call(t,t,o)),!1===isNaN(o[e])&&(o[e]=`${o[e]}px`)):o[e]="0px"}),e.style.left=`calc(${e.style.left} + ${o.offsetX})`,e.style.top=`calc(${e.style.top} + ${o.offsetY})`;const n=getComputedStyle(e);return{left:n.left,top:n.top}},applyPositionMinMax(e,t,o){if(["minLeft","minTop","maxLeft","maxTop"].forEach(e=>{o[e]&&("function"==typeof o[e]&&(o[e]=o[e].call(t,t,o)),(Number.isInteger(o[e])||o[e].match(/^\d+$/))&&(o[e]=`${o[e]}px`))}),o.minLeft){e.style.left=o.minLeft;let n=getComputedStyle(e).left;parseFloat(n)parseFloat(t.left)?e.style.left=t.left:t.left=n}if(o.maxTop){e.style.top=o.maxTop;let n=getComputedStyle(e).top;parseFloat(n)>parseFloat(t.top)?e.style.top=t.top:t.top=n}const n=getComputedStyle(e);return{left:n.left,top:n.top}},applyPositionModify(e,t,o){if(o.modify&&"function"==typeof o.modify){const n=o.modify.call(t,t,o);e.style.left=Number.isInteger(n.left)||n.left.match(/^\d+$/)?`${n.left}px`:n.left,e.style.top=Number.isInteger(n.top)||n.top.match(/^\d+$/)?`${n.top}px`:n.top}const n=getComputedStyle(e);return{left:n.left,top:n.top}},autopositionRemaining(e){let t,o=e.options.container;if(["left-top-down","left-top-right","center-top-down","right-top-down","right-top-left","left-bottom-up","left-bottom-right","center-bottom-up","right-bottom-up","right-bottom-left"].forEach(o=>{e.classList.contains(o)&&(t=o)}),t){("window"===o?document.body:"string"==typeof o?document.querySelector(o):o).querySelectorAll(`.${t}`).forEach(e=>e.reposition())}},getThemeDetails(e){const t=this.pOtheme(e);if(this.themes.some(e=>e===t.color.split(/\s/i)[0])){let e=t.color.split(/\s/i)[0],o=document.createElement("button");o.className=e+"-bg",document.body.appendChild(o),t.color=getComputedStyle(o).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(o),o=void 0}else if(t.color.startsWith("bootstrap-")){let e=t.color.indexOf("-"),o=document.createElement("button");o.className="btn btn"+t.color.slice(e),document.body.appendChild(o),t.color=getComputedStyle(o).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(o),o=void 0}else if(t.color.startsWith("mdb-")){let e,o=t.color.indexOf("-")+1,n=document.createElement("span");e=t.color.endsWith("-dark")?(e=t.color.slice(o)).replace("-dark","-color-dark"):t.color.slice(o)+"-color",n.className=e,document.body.appendChild(n),t.color=getComputedStyle(n).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(n),n=void 0}return t.colors=this.calcColors(t.color),t},clearTheme(e,t){return this.themes.forEach(t=>{["panel",`jsPanel-theme-${t}`,`panel-${t}`,`${t}-color`].forEach(t=>e.classList.remove(t)),e.header.classList.remove(`jsPanel-theme-${t}`)}),e.content.classList.remove("jsPanel-content-filled","jsPanel-content-filledlight"),e.header.classList.remove("jsPanel-hdr-light"),e.header.classList.remove("jsPanel-hdr-dark"),e.style.backgroundColor="",this.setStyles(e.headertoolbar,{boxShadow:"",width:"",marginLeft:"",borderTopColor:"transparent"}),this.setStyles(e.content,{background:"",borderTopColor:"transparent"}),e.header.style.background="",Array.prototype.slice.call(e.controlbar.querySelectorAll(".jsPanel-icon")).concat([e.headerlogo,e.headertitle,e.headertoolbar,e.content]).forEach(e=>e.style.color=""),t&&t.call(e,e),e},applyColorTheme(e,t){if(e.style.backgroundColor=t.colors[0],e.header.style.backgroundColor=t.colors[0],e.header.style.color=t.colors[3],[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(o=>e.querySelector(o).style.color=t.colors[3]),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>e.style.color=t.colors[3]),"string"==typeof e.options.theme&&"filled"===t.filling&&(e.content.style.borderTop="#000000"===t.colors[3]?"1px solid rgba(0,0,0,0.15)":"1px solid rgba(255,255,255,0.15)"),"#000000"===t.colors[3]?e.header.classList.add("jsPanel-hdr-light"):e.header.classList.add("jsPanel-hdr-dark"),t.filling)switch(t.filling){case"filled":this.setStyles(e.content,{backgroundColor:t.colors[2],color:t.colors[3]});break;case"filledlight":e.content.style.backgroundColor=t.colors[1];break;case"filleddark":this.setStyles(e.content,{backgroundColor:t.colors[6],color:t.colors[7]});break;default:e.content.style.backgroundColor=t.filling,e.content.style.color=this.perceivedBrightness(t.filling)<=this.colorBrightnessThreshold?"#fff":"#000"}return e},applyCustomTheme(e,t){let o={bgPanel:"#ffffff",bgContent:"#fffffff",bgFooter:"#f5f5f5",colorHeader:"#000000",colorContent:"#000000",colorFooter:"#000000",border:void 0,borderRadius:void 0},n="object"==typeof t?Object.assign(o,t):o,a=n.bgPanel,s=n.bgContent,r=n.colorHeader,l=n.colorContent,i=n.bgFooter,c=n.colorFooter;return this.colorNames[a]?e.style.background="#"+this.colorNames[a]:e.style.background=this.getCssVariableValue(a),this.colorNames[r]&&(r="#"+this.colorNames[r]),[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(t=>e.querySelector(t).style.color=this.getCssVariableValue(r)),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>e.style.color=this.getCssVariableValue(r)),this.colorNames[s]?e.content.style.background="#"+this.colorNames[s]:e.content.style.background=this.getCssVariableValue(s),this.colorNames[l]?e.content.style.color="#"+this.colorNames[l]:e.content.style.color=this.getCssVariableValue(l),this.perceivedBrightness(r)>this.colorBrightnessThreshold?e.header.classList.add("jsPanel-hdr-dark"):e.header.classList.add("jsPanel-hdr-light"),this.perceivedBrightness(l)>this.colorBrightnessThreshold?e.content.style.borderTop="1px solid rgba(255,255,255,0.15)":e.content.style.borderTop="1px solid rgba(0,0,0,0.15)",this.colorNames[i]?e.footer.style.background="#"+this.colorNames[i]:e.footer.style.background=this.getCssVariableValue(i),this.colorNames[c]?e.footer.style.color="#"+this.colorNames[c]:e.footer.style.color=this.getCssVariableValue(c),n.border&&e.setBorder(n.border),n.borderRadius&&(e.options.borderRadius=void 0,e.setBorderRadius(n.borderRadius)),e},getCssVariableValue(e){if(e.startsWith("--"))return getComputedStyle(document.documentElement).getPropertyValue(e).replace(/\s+/g,"");if(e.startsWith("var")){let t=e.slice(e.indexOf("(")+1,e.indexOf(")"));return getComputedStyle(document.documentElement).getPropertyValue(t).replace(/\s+/g,"")}return e},getScrollbarWidth(e=document.body){if(e===document.body)return{y:window.innerWidth-document.documentElement.clientWidth,x:window.innerHeight-document.documentElement.clientHeight};{let t=getComputedStyle(e);return{y:e.offsetWidth-e.clientWidth-parseFloat(t.borderRightWidth)-parseFloat(t.borderLeftWidth),x:e.offsetHeight-e.clientHeight-parseFloat(t.borderBottomWidth)-parseFloat(t.borderTopWidth)}}},remClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.remove(t)),e),setClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.add(t)),e),setStyles(e,t){for(const[o,n]of Object.entries(t))e.style[o]="string"==typeof n?jsPanel.getCssVariableValue(n):n;return e},setStyle(e,t){return this.setStyles.call(e,e,t)},strToHtml:e=>document.createRange().createContextualFragment(e),toggleClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.contains(t)?e.classList.remove(t):e.classList.add(t)),e),emptyNode(e){for(;e.firstChild;)e.removeChild(e.firstChild);return e},addScript(e,t="application/javascript",o){if(!document.querySelector(`script[src="${e}"]`)){const n=document.createElement("script");n.src=e,n.type=t,document.head.appendChild(n),o&&(n.onload=o)}},ajax(e,t){let o,n,a=new XMLHttpRequest;const s={method:"GET",async:!0,user:"",pwd:"",done:function(){if(t){let e=jsPanel.strToHtml(this.responseText);o.urlSelector&&(e=e.querySelector(o.urlSelector)),t.contentRemove(),t.content.append(e)}},autoresize:!0,autoreposition:!0};if(t&&"string"==typeof e)o=Object.assign({},s,{url:e});else{if("object"!=typeof e||!e.url){if(this.errorReporting){let e="XMLHttpRequest seems to miss the url parameter!";jsPanel.errorpanel(e)}return}(o=Object.assign({},s,e)).url=e.url,!1===o.async&&(o.timeout=0,o.withCredentials&&(o.withCredentials=void 0),o.responseType&&(o.responseType=void 0))}n=o.url.trim().split(/\s+/),o.url=encodeURI(n[0]),n.length>1&&(n.shift(),o.urlSelector=n.join(" ")),a.onreadystatechange=(()=>{4===a.readyState&&(200===a.status?t?o.done.call(a,a,t):o.done.call(a,a):o.fail&&(t?o.fail.call(a,a,t):o.fail.call(a,a)),o.always&&(t?o.always.call(a,a,t):o.always.call(a,a)),t&&(o.autoresize||o.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,o),jsPanel.ajaxAlwaysCallbacks.length&&jsPanel.ajaxAlwaysCallbacks.forEach(e=>{t?e.call(a,a,t):e.call(a,a)}))}),a.open(o.method,o.url,o.async,o.user,o.pwd),a.timeout=o.timeout||0,o.withCredentials&&(a.withCredentials=o.withCredentials),o.responseType&&(a.responseType=o.responseType),o.beforeSend&&(t?o.beforeSend.call(a,a,t):o.beforeSend.call(a,a)),o.data?a.send(o.data):a.send(null)},fetch(e,t){let o;const n={bodyMethod:"text",autoresize:!0,autoreposition:!0,done:function(e,t){if(t){let o=jsPanel.strToHtml(e);t.contentRemove(),t.content.append(o)}}};if(t&&"string"==typeof e)o=Object.assign({},n,{resource:encodeURI(e)});else{if("object"!=typeof e||!e.resource){if(this.errorReporting){let e="Fetch Request seems to miss the resource parameter!";jsPanel.errorpanel(e)}return}(o=Object.assign({},n,e)).resource=encodeURI(e.resource)}const a=o.fetchInit||{};o.beforeSend&&(t?o.beforeSend.call(e,e,t):o.beforeSend.call(e,e)),fetch(o.resource,a).then(e=>{if(e.ok)return e[o.bodyMethod]()}).then(e=>{t?o.done.call(e,e,t):o.done.call(e,e),t&&(o.autoresize||o.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,o)})},ajaxAutoresizeAutoreposition(e,t){const o=e.options.contentSize;if("string"==typeof o&&o.match(/auto/i)){const n=o.split(" "),a=Object.assign({},{width:n[0],height:n[1]});t.autoresize&&e.resize(a),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}else if("object"==typeof o&&("auto"===o.width||"auto"===o.height)){const n=Object.assign({},o);t.autoresize&&e.resize(n),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}},createPanelTemplate(e=!0){const t=document.createElement("div");return t.className="jsPanel",t.style.left="0",t.style.top="0",e&&["close","maximize","normalize","minimize","smallify"].forEach(e=>{t.setAttribute(`data-btn${e}`,"enabled")}),t.innerHTML=`
\n
\n \n
\n
\n
\n
\n \n \n \n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
`,t},createMinimizedTemplate(){const e=document.createElement("div");return e.className="jsPanel-replacement",e.innerHTML=`
\n
\n \n
\n
\n
\n
\n \n \n \n
\n
\n
`,e},createSnapArea(e,t,o){const n=document.createElement("div"),a=e.parentElement;n.className=`jsPanel-snap-area jsPanel-snap-area-${t}`,"lt"===t||"rt"===t||"rb"===t||"lb"===t?(n.style.width=o+"px",n.style.height=o+"px"):"ct"===t||"cb"===t?n.style.height=o+"px":"lc"!==t&&"rc"!==t||(n.style.width=o+"px"),a!==document.body&&(n.style.position="absolute"),document.querySelector(`.jsPanel-snap-area.jsPanel-snap-area-${t}`)||e.parentElement.appendChild(n)},removeSnapAreas(){document.querySelectorAll(".jsPanel-snap-area").forEach(e=>e.parentElement.removeChild(e))},extend(e){if("[object Object]"===Object.prototype.toString.call(e))for(let t in e)Object.prototype.hasOwnProperty.call(e,t)&&(this.extensions[t]=e[t])},getPanels:(e=function(){return this.classList.contains("jsPanel-standard")})=>Array.prototype.slice.call(document.querySelectorAll(".jsPanel")).filter(t=>e.call(t,t)).sort((e,t)=>t.style.zIndex-e.style.zIndex),processCallbacks(e,t,o="some",n,a){if("function"==typeof t&&(t=[t]),o)return t[o](t=>t.call(e,e,n,a));t.forEach(t=>t.call(e,e,n,a))},resetZi(){this.zi=((e=jsPanel.ziBase)=>{let t=e;return{next:()=>t++}})(),Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).sort((e,t)=>e.style.zIndex-t.style.zIndex).forEach(e=>e.style.zIndex=jsPanel.zi.next())},errorpanel(e){this.create({paneltype:"error",dragit:!1,resizeit:!1,theme:{bgPanel:"white",bgContent:"white",colorHeader:"rebeccapurple",colorContent:"#333333",border:"2px solid rebeccapurple"},borderRadius:".33rem",headerControls:"closeonly xs",headerTitle:"⚠ jsPanel Error",contentSize:{width:"50%",height:"auto"},position:"center-top 0 5 down",animateIn:"jsPanelFadeIn",content:`

${e}

`})},create(e={},t){jsPanel.zi||(jsPanel.zi=((e=jsPanel.ziBase)=>{let t=e;return{next:()=>t++}})()),e.config?delete(e=Object.assign({},this.defaults,e.config,e)).config:e=Object.assign({},this.defaults,e),e.id?"function"==typeof e.id&&(e.id=e.id()):e.id=`jsPanel-${jsPanel.idCounter+=1}`;const o=document.getElementById(e.id);if(null!==o){if(o.classList.contains("jsPanel")&&o.front(),this.errorReporting){let t=`◀ COULD NOT CREATE NEW JSPANEL ►
An element with the ID ${e.id} already exists in the document.`;jsPanel.errorpanel(t)}return!1}let n=this.pOcontainer(e.container);if("object"==typeof n&&n.length&&n.length>0&&(n=n[0]),!n){if(this.errorReporting){let e="◀ COULD NOT CREATE NEW JSPANEL ►
The container to append the panel to does not exist";jsPanel.errorpanel(e)}return!1}["onbeforeclose","onbeforemaximize","onbeforeminimize","onbeforenormalize","onbeforesmallify","onbeforeunsmallify","onclosed","onfronted","onmaximized","onminimized","onnormalized","onsmallified","onstatuschange","onunsmallified"].forEach(t=>{e[t]?"function"==typeof e[t]&&(e[t]=[e[t]]):e[t]=[]});const a=e.template||this.createPanelTemplate();a.options=e,a.closetimer=void 0,a.status="initialized",a.currentData={},a.header=a.querySelector(".jsPanel-hdr"),a.headerbar=a.header.querySelector(".jsPanel-headerbar"),a.titlebar=a.header.querySelector(".jsPanel-titlebar"),a.headerlogo=a.headerbar.querySelector(".jsPanel-headerlogo"),a.headertitle=a.headerbar.querySelector(".jsPanel-title"),a.controlbar=a.headerbar.querySelector(".jsPanel-controlbar"),a.headertoolbar=a.header.querySelector(".jsPanel-hdr-toolbar"),a.content=a.querySelector(".jsPanel-content"),a.footer=a.querySelector(".jsPanel-ftr"),a.snappableTo=!1,a.snapped=!1,a.droppableTo=!1,a.progressbar=a.autocloseProgressbar=a.querySelector(".jsPanel-progressbar");const s=new CustomEvent("jspanelloaded",{detail:e.id,cancelable:!0}),r=new CustomEvent("jspanelstatuschange",{detail:e.id,cancelable:!0}),l=new CustomEvent("jspanelbeforenormalize",{detail:e.id,cancelable:!0}),i=new CustomEvent("jspanelnormalized",{detail:e.id,cancelable:!0}),c=new CustomEvent("jspanelbeforemaximize",{detail:e.id,cancelable:!0}),d=new CustomEvent("jspanelmaximized",{detail:e.id,cancelable:!0}),p=new CustomEvent("jspanelbeforeminimize",{detail:e.id,cancelable:!0}),h=new CustomEvent("jspanelminimized",{detail:e.id,cancelable:!0}),f=new CustomEvent("jspanelbeforesmallify",{detail:e.id,cancelable:!0}),u=new CustomEvent("jspanelsmallified",{detail:e.id,cancelable:!0}),m=new CustomEvent("jspanelsmallifiedmax",{detail:e.id,cancelable:!0}),g=new CustomEvent("jspanelbeforeunsmallify",{detail:e.id,cancelable:!0}),b=new CustomEvent("jspanelfronted",{detail:e.id,cancelable:!0}),y=new CustomEvent("jspanelbeforeclose",{detail:e.id,cancelable:!0}),w=new CustomEvent("jspanelclosed",{detail:e.id,cancelable:!0}),v=new CustomEvent("jspanelcloseduser",{detail:e.id,cancelable:!0});[s,r,l,i,c,d,p,h,f,u,m,g,b,y].forEach(e=>e.panel=a);const j=a.querySelector(".jsPanel-btn-close"),x=a.querySelector(".jsPanel-btn-maximize"),E=a.querySelector(".jsPanel-btn-normalize"),C=a.querySelector(".jsPanel-btn-smallify"),P=a.querySelector(".jsPanel-btn-minimize");j&&jsPanel.pointerup.forEach(e=>{j.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}),x&&jsPanel.pointerup.forEach(e=>{x.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.maximize()})}),E&&jsPanel.pointerup.forEach(e=>{E.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.normalize()})}),C&&jsPanel.pointerup.forEach(e=>{C.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;"normalized"===a.status||"maximized"===a.status?a.smallify():"smallified"!==a.status&&"smallifiedmax"!==a.status||a.unsmallify()})}),P&&jsPanel.pointerup.forEach(e=>{P.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.minimize()})});let F=jsPanel.extensions;for(let e in F)Object.prototype.hasOwnProperty.call(F,e)&&(a[e]=F[e]);if(a.setBorder=(e=>{let t=jsPanel.pOborder(e);return t[2].length||(t[2]=a.style.backgroundColor),t=t.join(" "),a.style.border=t,a.options.border=t,a}),a.setBorderRadius=(e=>{"string"==typeof e&&(e.startsWith("--")||e.startsWith("var"))&&(e=e.replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," "),e=jsPanel.getCssVariableValue(e)),"number"==typeof e&&(e+="px"),a.style.borderRadius=e;const t=getComputedStyle(a);return a.options.header?(a.header.style.borderTopLeftRadius=t.borderTopLeftRadius,a.header.style.borderTopRightRadius=t.borderTopRightRadius):(a.content.style.borderTopLeftRadius=t.borderTopLeftRadius,a.content.style.borderTopRightRadius=t.borderTopRightRadius),a.options.footerToolbar?(a.footer.style.borderBottomRightRadius=t.borderBottomRightRadius,a.footer.style.borderBottomLeftRadius=t.borderBottomLeftRadius):(a.content.style.borderBottomRightRadius=t.borderBottomRightRadius,a.content.style.borderBottomLeftRadius=t.borderBottomLeftRadius),a}),a.setTheme=((t=e.theme,o)=>{let n;if("minimized"===a.status&&(n=!0,a.normalize()),jsPanel.clearTheme(a),"object"==typeof t)e.border=void 0,jsPanel.applyCustomTheme(a,t);else if("string"==typeof t){"none"===t&&(t="white");let e=jsPanel.getThemeDetails(t);jsPanel.applyColorTheme(a,e)}return n&&a.minimize(),o&&o.call(a,a),a}),a.remove=((e,t,o)=>{a.parentElement.removeChild(a),document.getElementById(e)?o&&o.call(a,e,a):(a.removeMinimizedReplacement(),a.status="closed",t&&document.dispatchEvent(v),document.dispatchEvent(w),a.options.onclosed&&jsPanel.processCallbacks(a,a.options.onclosed,"every",t),jsPanel.autopositionRemaining(a),o&&o.call(e,e)),window.removeEventListener("resize",a.windowResizeHandler),document.removeEventListener("jspanelresize",a.parentResizeHandler)}),a.close=((e,t)=>{if(a.parentElement){if(a.closetimer&&window.clearInterval(a.closetimer),document.dispatchEvent(y),a.statusBefore=a.status,a.options.onbeforeclose&&a.options.onbeforeclose.length>0&&!jsPanel.processCallbacks(a,a.options.onbeforeclose,"some",a.status,t))return a;a.options.animateOut?(a.options.animateIn&&jsPanel.remClass(a,a.options.animateIn),jsPanel.setClass(a,a.options.animateOut),a.addEventListener("animationend",o=>{o.stopPropagation(),a.remove(a.id,t,e)})):a.remove(a.id,t,e)}}),a.maximize=((t,o)=>{if(a.statusBefore=a.status,e.onbeforemaximize&&e.onbeforemaximize.length>0&&!jsPanel.processCallbacks(a,e.onbeforemaximize,"some",a.statusBefore))return a;document.dispatchEvent(c);const n=a.parentElement,s=jsPanel.pOcontainment(e.maximizedMargin);return n===document.body?(a.style.width=document.documentElement.clientWidth-s[1]-s[3]+"px",a.style.height=document.documentElement.clientHeight-s[0]-s[2]+"px",a.style.left=s[3]+"px",a.style.top=s[0]+"px"):(a.style.width=n.clientWidth-s[1]-s[3]+"px",a.style.height=n.clientHeight-s[0]-s[2]+"px",a.style.left=s[3]+"px",a.style.top=s[0]+"px"),C.style.transform="unset",a.removeMinimizedReplacement(),a.status="maximized",a.setControls([".jsPanel-btn-maximize"]),o||a.front(),document.dispatchEvent(d),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),t&&t.call(a,a,a.statusBefore),e.onmaximized&&jsPanel.processCallbacks(a,e.onmaximized,"every",a.statusBefore),a}),a.minimize=(t=>{if("minimized"===a.status)return a;if(a.statusBefore=a.status,e.onbeforeminimize&&e.onbeforeminimize.length>0&&!jsPanel.processCallbacks(a,e.onbeforeminimize,"some",a.statusBefore))return a;if(document.dispatchEvent(p),!document.getElementById("jsPanel-replacement-container")){const e=document.createElement("div");e.id="jsPanel-replacement-container",document.body.append(e)}if(a.style.left="-9999px",a.status="minimized",document.dispatchEvent(h),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),e.minimizeTo){let t,o,n,s=a.createMinimizedReplacement();switch(e.minimizeTo){case"default":document.getElementById("jsPanel-replacement-container").append(s);break;case"parentpanel":(t=(n=(o=a.closest(".jsPanel-content").parentElement).querySelectorAll(".jsPanel-minimized-box"))[n.length-1]).append(s);break;case"parent":(t=(o=a.parentElement).querySelector(".jsPanel-minimized-container"))||((t=document.createElement("div")).className="jsPanel-minimized-container",o.append(t)),t.append(s);break;default:document.querySelector(e.minimizeTo).append(s)}}return t&&t.call(a,a,a.statusBefore),e.onminimized&&jsPanel.processCallbacks(a,e.onminimized,"every",a.statusBefore),a}),a.normalize=(t=>"normalized"===a.status?a:(a.statusBefore=a.status,e.onbeforenormalize&&e.onbeforenormalize.length>0&&!jsPanel.processCallbacks(a,e.onbeforenormalize,"some",a.statusBefore)?a:(document.dispatchEvent(l),a.style.width=a.currentData.width,a.style.height=a.currentData.height,a.snapped?a.snap(a.snapped,!0):(a.style.left=a.currentData.left,a.style.top=a.currentData.top),C.style.transform="unset",a.removeMinimizedReplacement(),a.status="normalized",a.setControls([".jsPanel-btn-normalize"]),a.front(),document.dispatchEvent(i),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),t&&t.call(a,a,a.statusBefore),e.onnormalized&&jsPanel.processCallbacks(a,e.onnormalized,"every",a.statusBefore),a))),a.smallify=(t=>{if("smallified"===a.status||"smallifiedmax"===a.status)return a;if(a.statusBefore=a.status,e.onbeforesmallify&&e.onbeforesmallify.length>0&&!jsPanel.processCallbacks(a,e.onbeforesmallify,"some",a.statusBefore))return a;document.dispatchEvent(f),a.style.overflow="hidden";const o=window.getComputedStyle(a),n=parseFloat(window.getComputedStyle(a.headerbar).height);a.style.height=parseFloat(o.borderTopWidth)+parseFloat(o.borderBottomWidth)+n+"px",C.style.transform="rotate(180deg)","normalized"===a.status?(a.setControls([".jsPanel-btn-normalize"]),a.status="smallified",document.dispatchEvent(u),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore)):"maximized"===a.status&&(a.setControls([".jsPanel-btn-maximize"]),a.status="smallifiedmax",document.dispatchEvent(m),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore));const s=a.querySelectorAll(".jsPanel-minimized-box");return s[s.length-1].style.display="none",t&&t.call(a,a,a.statusBefore),e.onsmallified&&jsPanel.processCallbacks(a,e.onsmallified,"every",a.statusBefore),a}),a.unsmallify=(t=>{if(a.statusBefore=a.status,"smallified"===a.status||"smallifiedmax"===a.status){if(e.onbeforeunsmallify&&e.onbeforeunsmallify.length>0&&!jsPanel.processCallbacks(a,e.onbeforeunsmallify,"some",a.statusBefore))return a;document.dispatchEvent(g),a.style.overflow="visible",a.front(),"smallified"===a.status?(a.style.height=a.currentData.height,a.setControls([".jsPanel-btn-normalize"]),a.status="normalized",document.dispatchEvent(i),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore)):"smallifiedmax"===a.status?a.maximize():"minimized"===a.status&&a.normalize(),C.style.transform="rotate(0deg)";const o=a.querySelectorAll(".jsPanel-minimized-box");o[o.length-1].style.display="flex",t&&t.call(a,a,a.statusBefore),e.onunsmallified&&jsPanel.processCallbacks(a,e.onunsmallified,"every",a.statusBefore)}return a}),a.front=((t,o=!0)=>{if("minimized"===a.status)"maximized"===a.statusBefore?a.maximize():a.normalize();else{const e=Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).map(e=>e.style.zIndex);Math.max(...e)>a.style.zIndex&&(a.style.zIndex=jsPanel.zi.next()),jsPanel.resetZi()}return document.dispatchEvent(b),t&&t.call(a,a),e.onfronted&&o&&jsPanel.processCallbacks(a,e.onfronted,"every",a.status),a}),a.snap=((e,t=!1)=>{if(t||(a.currentData.beforeSnap={width:a.currentData.width,height:a.currentData.height}),e&&"function"==typeof e&&!t)e.call(a,a,a.snappableTo);else if(!1!==e){let e=[0,0];if(a.options.dragit.snap.containment&&a.options.dragit.containment){const t=jsPanel.pOcontainment(a.options.dragit.containment),o=a.snappableTo;o.startsWith("left")?e[0]=t[3]:o.startsWith("right")&&(e[0]=-t[1]),o.endsWith("top")?e[1]=t[0]:o.endsWith("bottom")&&(e[1]=-t[2])}a.reposition(`${a.snappableTo} ${e[0]} ${e[1]}`)}t||(a.snapped=a.snappableTo)}),a.move=((e,t)=>{let o=a.overlaps(e,"paddingbox"),n=a.parentElement;return e.appendChild(a),a.options.container=e,a.style.left=o.left+"px",a.style.top=o.top+"px",a.saveCurrentDimensions(),a.saveCurrentPosition(),a.calcSizeFactors(),t&&t.call(a,a,e,n),a}),a.closeChildpanels=(e=>(a.getChildpanels().forEach(e=>e.close()),e&&e.call(a,a),a)),a.getChildpanels=(e=>{const t=a.content.querySelectorAll(".jsPanel");return e&&t.forEach((t,o,n)=>{e.call(t,t,o,n)}),t}),a.isChildpanel=(e=>{const t=a.closest(".jsPanel-content"),o=t?t.parentElement:null;return e&&e.call(a,a,o),!!t&&o}),a.contentRemove=(e=>(jsPanel.emptyNode(a.content),e&&e.call(a,a),a)),a.createMinimizedReplacement=(()=>{const t=jsPanel.createMinimizedTemplate(),o=window.getComputedStyle(a.headertitle).color,n=window.getComputedStyle(a),s=e.iconfont,r=t.querySelector(".jsPanel-controlbar");return"auto-show-hide"!==a.options.header?jsPanel.setStyles(t,{backgroundColor:n.backgroundColor,backgroundPositionX:n.backgroundPositionX,backgroundPositionY:n.backgroundPositionY,backgroundRepeat:n.backgroundRepeat,backgroundAttachment:n.backgroundAttachment,backgroundImage:n.backgroundImage,backgroundSize:n.backgroundSize,backgroundOrigin:n.backgroundOrigin,backgroundClip:n.backgroundClip}):t.style.backgroundColor=window.getComputedStyle(a.header).backgroundColor,t.id=a.id+"-min",t.querySelector(".jsPanel-headerbar").replaceChild(a.headerlogo.cloneNode(!0),t.querySelector(".jsPanel-headerlogo")),t.querySelector(".jsPanel-titlebar").replaceChild(a.headertitle.cloneNode(!0),t.querySelector(".jsPanel-title")),t.querySelector(".jsPanel-titlebar").setAttribute("title",a.headertitle.textContent),t.querySelector(".jsPanel-title").style.color=o,r.style.color=o,r.querySelectorAll("button").forEach(e=>e.style.color=o),["jsPanel-hdr-dark","jsPanel-hdr-light"].forEach(e=>{a.header.classList.contains(e)&&t.querySelector(".jsPanel-hdr").classList.add(e)}),a.setIconfont(s,t),"enabled"===a.dataset.btnnormalize?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-normalize").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.normalize()})}):r.querySelector(".jsPanel-btn-normalize").style.display="none","enabled"===a.dataset.btnmaximize?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-maximize").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.maximize()})}):r.querySelector(".jsPanel-btn-maximize").style.display="none","enabled"===a.dataset.btnclose?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-close").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}):r.querySelector(".jsPanel-btn-close").style.display="none",t}),a.removeMinimizedReplacement=(()=>{const e=document.getElementById(`${a.id}-min`);e&&e.parentElement.removeChild(e)}),a.drag=((e={})=>{let t,o,n;const s=new CustomEvent("jspaneldragstart",{detail:a.id}),r=new CustomEvent("jspaneldrag",{detail:a.id}),l=new CustomEvent("jspaneldragstop",{detail:a.id});[s,r,l].forEach(e=>e.panel=a);const i=e=>{let t=e.split("-");return t.forEach((e,o)=>{t[o]=e.charAt(0).toUpperCase()+e.slice(1)}),"snap"+t.join("")};function c(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(e=>{document.removeEventListener(e,o,!1),a.style.opacity=1})}let d=e.handles||jsPanel.defaults.dragit.handles,p=e.cursor||jsPanel.defaults.dragit.cursor;function h(e){if(jsPanel.pointermove.forEach(e=>document.removeEventListener(e,o)),jsPanel.removeSnapAreas(),t){if(a.style.opacity=1,t=void 0,n.snap){switch(a.snappableTo){case"left-top":a.snap(n.snap.snapLeftTop);break;case"center-top":a.snap(n.snap.snapCenterTop);break;case"right-top":a.snap(n.snap.snapRightTop);break;case"right-center":a.snap(n.snap.snapRightCenter);break;case"right-bottom":a.snap(n.snap.snapRightBottom);break;case"center-bottom":a.snap(n.snap.snapCenterBottom);break;case"left-bottom":a.snap(n.snap.snapLeftBottom);break;case"left-center":a.snap(n.snap.snapLeftCenter)}n.snap.callback&&a.snappableTo&&"function"==typeof n.snap.callback&&(n.snap.callback.call(a,a),n.snap.repositionOnSnap&&!1!==n.snap[i(a.snappableTo)]&&a.repositionOnSnap(a.snappableTo)),a.snappableTo&&n.snap.repositionOnSnap&&n.snap[i(a.snappableTo)]&&a.repositionOnSnap(a.snappableTo)}if(a.droppableTo&&a.droppableTo){let e=a.parentElement;a.move(a.droppableTo),n.drop.callback&&n.drop.callback.call(a,a,a.droppableTo,e)}if(document.dispatchEvent(l),n.stop.length){let t=window.getComputedStyle(a),o={left:parseFloat(t.left),top:parseFloat(t.top),width:parseFloat(t.width),height:parseFloat(t.height)};jsPanel.processCallbacks(a,n.stop,!1,o,e)}a.saveCurrentPosition(),a.calcSizeFactors()}a.controlbar.style.pointerEvents="inherit",a.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="auto"),document.removeEventListener(e,h)}return a.querySelectorAll(d).forEach(l=>{l.style.touchAction="none",l.style.cursor=p,jsPanel.pointerdown.forEach(i=>{l.addEventListener(i,l=>{if(l.button&&l.button>0)return!1;if((n=Object.assign({},jsPanel.defaults.dragit,e)).disableOnMaximized&&"maximized"===a.status)return!1;if((n.containment||0===n.containment)&&(n.containment=jsPanel.pOcontainment(n.containment)),n.grid&&Array.isArray(n.grid)&&1===n.grid.length&&(n.grid[1]=n.grid[0]),n.snap&&("object"==typeof n.snap?n.snap=Object.assign({},jsPanel.defaultSnapConfig,n.snap):n.snap=jsPanel.defaultSnapConfig),l.target.closest(".jsPanel-ftr-btn"))return;a.controlbar.style.pointerEvents="none",a.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="none");let i=window.getComputedStyle(a),d=parseFloat(i.left),p=parseFloat(i.top),h=parseFloat(i.width),f=parseFloat(i.height),u=l.touches?l.touches[0].clientX:l.clientX,m=l.touches?l.touches[0].clientY:l.clientY,g=a.parentElement,b=g.getBoundingClientRect(),y=window.getComputedStyle(g),w=a.getScaleFactor(),v=0,j=jsPanel.getScrollbarWidth(g);o=(e=>{if(e.preventDefault(),!t){if(document.dispatchEvent(s),a.style.opacity=n.opacity,a.snapped&&n.snap.resizeToPreSnap&&a.currentData.beforeSnap){a.resize(a.currentData.beforeSnap.width+" "+a.currentData.beforeSnap.height),a.setControls([".jsPanel-btn-normalize"]);let e=a.getBoundingClientRect(),t=u-(e.left+e.width),o=e.width/2;t>-o&&(v=t+o)}if(a.front(),a.snapped=!1,"maximized"===a.status&&(a.setControls([".jsPanel-btn-normalize"]),a.status="normalized"),n.drop&&n.drop.dropZones){let e=n.drop.dropZones.map(e=>jsPanel.pOcontainer(e)),t=[];e.forEach(function(e){e.length?e.forEach(function(e){t.push(e)}):t.push(e)}),t=t.filter(function(e,t,o){return o.indexOf(e)===t}),n.drop.dropZones=t}n.start.length&&jsPanel.processCallbacks(a,n.start,!1,{left:d,top:p,width:h,height:f},e)}let o,l,i,c,x,E,C,P,F,z;t=1;let S,A=e.touches?e.touches[0].clientX:e.clientX,k=e.touches?e.touches[0].clientY:e.clientY,B=window.getComputedStyle(a);if(g===document.body){let e=a.getBoundingClientRect();F=window.innerWidth-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(e.left+e.width),z=window.innerHeight-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(e.top+e.height)}else F=parseInt(y.width,10)-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(parseInt(B.left,10)+parseInt(B.width,10)),z=parseInt(y.height,10)-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(parseInt(B.top,10)+parseInt(B.height,10));o=parseFloat(B.left),i=parseFloat(B.top),x=F,C=z,n.snap&&("panel"===n.snap.trigger?(l=o**2,c=i**2,E=x**2,P=C**2):"pointer"===n.snap.trigger&&("window"===a.options.container?(o=A,l=A**2,c=(i=k)**2,E=(x=window.innerWidth-A)**2,P=(C=window.innerHeight-k)**2):(o=(S=a.overlaps(g,"paddingbox",e)).pointer.left,i=S.pointer.top,x=S.pointer.right,C=S.pointer.bottom,l=S.pointer.left**2,c=S.pointer.top**2,E=S.pointer.right**2,P=S.pointer.bottom**2)));let T=Math.sqrt(l+c),L=Math.sqrt(l+P),R=Math.sqrt(E+c),W=Math.sqrt(E+P),D=Math.abs(o-x)/2,$=Math.abs(i-C)/2,O=Math.sqrt(l+$**2),q=Math.sqrt(c+D**2),H=Math.sqrt(E+$**2),M=Math.sqrt(P+D**2);if(window.getSelection().removeAllRanges(),document.dispatchEvent(r),n.axis&&"x"!==n.axis||(a.style.left=d+(A-u)/w.x+v+"px"),n.axis&&"y"!==n.axis||(a.style.top=p+(k-m)/w.y+"px"),n.grid){let e=n.grid,t=n.axis,o=e[0]*Math.round((d+(A-u))/e[0]),s=e[1]*Math.round((p+(k-m))/e[1]);t&&"x"!==t||(a.style.left=`${o}px`),t&&"y"!==t||(a.style.top=`${s}px`)}if(n.containment||0===n.containment){let e,t,o=n.containment;if("window"===a.options.container)e=window.innerWidth-parseFloat(B.width)-o[1]-j.y,t=window.innerHeight-parseFloat(B.height)-o[2]-j.x;else{let n=parseFloat(y.borderLeftWidth)+parseFloat(y.borderRightWidth),a=parseFloat(y.borderTopWidth)+parseFloat(y.borderBottomWidth);e=b.width/w.x-parseFloat(B.width)-o[1]-n-j.y,t=b.height/w.y-parseFloat(B.height)-o[2]-a-j.x}parseFloat(a.style.left)<=o[3]&&(a.style.left=o[3]+"px"),parseFloat(a.style.top)<=o[0]&&(a.style.top=o[0]+"px"),parseFloat(a.style.left)>=e&&(a.style.left=e+"px"),parseFloat(a.style.top)>=t&&(a.style.top=t+"px")}if(n.drag.length){let t={left:o,top:i,right:x,bottom:C,width:parseFloat(B.width),height:parseFloat(B.height)};jsPanel.processCallbacks(a,n.drag,!1,t,e)}if(n.snap){let e=n.snap.sensitivity,t=g===document.body?window.innerWidth/8:b.width/8,s=g===document.body?window.innerHeight/8:b.height/8;a.snappableTo=!1,jsPanel.removeSnapAreas(),T0&&S.pointer.top>0?(a.snappableTo="left-top",jsPanel.createSnapArea(a,"lt",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-top",jsPanel.createSnapArea(a,"lt",e))):L0&&S.pointer.bottom>0?(a.snappableTo="left-bottom",jsPanel.createSnapArea(a,"lb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-bottom",jsPanel.createSnapArea(a,"lb",e))):R0&&S.pointer.top>0?(a.snappableTo="right-top",jsPanel.createSnapArea(a,"rt",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-top",jsPanel.createSnapArea(a,"rt",e))):W0&&S.pointer.bottom>0?(a.snappableTo="right-bottom",jsPanel.createSnapArea(a,"rb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-bottom",jsPanel.createSnapArea(a,"rb",e))):i0?(a.snappableTo="center-top",jsPanel.createSnapArea(a,"ct",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="center-top",jsPanel.createSnapArea(a,"ct",e))):o0?(a.snappableTo="left-center",jsPanel.createSnapArea(a,"lc",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-center",jsPanel.createSnapArea(a,"lc",e))):x0?(a.snappableTo="right-center",jsPanel.createSnapArea(a,"rc",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-center",jsPanel.createSnapArea(a,"rc",e))):C0?(a.snappableTo="center-bottom",jsPanel.createSnapArea(a,"cb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="center-bottom",jsPanel.createSnapArea(a,"cb",e)))}if(n.drop&&n.drop.dropZones){let t=jsPanel.isIE?"msElementsFromPoint":"elementsFromPoint",o=document[t](e.clientX,e.clientY);Array.isArray(o)||(o=Array.prototype.slice.call(o)),n.drop.dropZones.forEach(e=>{o.includes(e)&&(a.droppableTo=e)}),o.includes(a.droppableTo)||(a.droppableTo=!1)}}),jsPanel.pointermove.forEach(e=>document.addEventListener(e,o)),window.addEventListener("mouseout",c,!1)})}),jsPanel.pointerup.forEach(e=>{document.addEventListener(e,h),window.removeEventListener("mouseout",c)}),e.disable&&(l.style.pointerEvents="none")}),a}),a.dragit=(t=>{const o=Object.assign({},jsPanel.defaults.dragit,e.dragit),n=a.querySelectorAll(o.handles);return"disable"===t?n.forEach(e=>e.style.pointerEvents="none"):n.forEach(e=>e.style.pointerEvents="auto"),a}),a.sizeit=((e={})=>{const t=new CustomEvent("jspanelresizestart",{detail:a.id}),o=new CustomEvent("jspanelresize",{detail:a.id}),n=new CustomEvent("jspanelresizestop",{detail:a.id});[t,o,n].forEach(e=>e.panel=a);let s,r,l,i,c,d,p={};p.handles=e.handles||jsPanel.defaults.resizeit.handles,p.handles.split(",").forEach(e=>{const t=document.createElement("DIV");t.className=`jsPanel-resizeit-handle jsPanel-resizeit-${e.trim()}`,a.append(t)});let h=!!e.aspectRatio&&e.aspectRatio;function f(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(e=>document.removeEventListener(e,s,!1))}function u(e){if(jsPanel.pointermove.forEach(e=>document.removeEventListener(e,s,!1)),e.target.classList&&e.target.classList.contains("jsPanel-resizeit-handle")){let t,o,n=e.target.className;if(n.match(/jsPanel-resizeit-nw|jsPanel-resizeit-w|jsPanel-resizeit-sw/i)&&(t=!0),n.match(/jsPanel-resizeit-nw|jsPanel-resizeit-n|jsPanel-resizeit-ne/i)&&(o=!0),p.grid&&Array.isArray(p.grid)){1===p.grid.length&&(p.grid[1]=p.grid[0]);const e=parseFloat(a.style.width),n=parseFloat(a.style.height),s=e%p.grid[0],r=n%p.grid[1],l=parseFloat(a.style.left),i=parseFloat(a.style.top),c=l%p.grid[0],d=i%p.grid[1];sd+5&&(t.style.transform="rotate(0deg)"),document.dispatchEvent(n),p.stop.length){let t=window.getComputedStyle(a),o={left:parseFloat(t.left),top:parseFloat(t.top),width:parseFloat(t.width),height:parseFloat(t.height)};jsPanel.processCallbacks(a,p.stop,!1,o,e)}}a.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="auto"),p.aspectRatio=h,document.removeEventListener(e,u)}return a.querySelectorAll(".jsPanel-resizeit-handle").forEach(n=>{n.style.touchAction="none",jsPanel.pointerdown.forEach(h=>{n.addEventListener(h,n=>{if(n.preventDefault(),n.stopPropagation(),n.button&&n.button>0)return!1;let h=1;if(((p=Object.assign({},jsPanel.defaults.resizeit,e)).containment||0===p.containment)&&(p.containment=jsPanel.pOcontainment(p.containment)),p.aspectRatio&&!0===p.aspectRatio&&(p.aspectRatio="panel"),jsPanel.modifier){let e=jsPanel.modifier;e.altKey?p.aspectRatio="content":e.ctrlKey?p.aspectRatio="panel":e.shiftKey&&(p.aspectRatio=!1,h=2)}let u="function"==typeof p.maxWidth?p.maxWidth():p.maxWidth||1e4,m="function"==typeof p.maxHeight?p.maxHeight():p.maxHeight||1e4,g="function"==typeof p.minWidth?p.minWidth():p.minWidth,b="function"==typeof p.minHeight?p.minHeight():p.minHeight;a.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="none");const y=a.parentElement,w=y.tagName.toLowerCase(),v=a.getBoundingClientRect(),j=y.getBoundingClientRect(),x=window.getComputedStyle(y,null),E=parseInt(x.borderLeftWidth,10),C=parseInt(x.borderTopWidth,10),P=x.getPropertyValue("position"),F=n.clientX||0===n.clientX||n.touches[0].clientX,z=n.clientY||0===n.clientY||n.touches[0].clientY,S=F/z,A=n.target.classList,k=a.getScaleFactor(),B=v.width/v.height,T=a.content.getBoundingClientRect(),L=T.width/T.height,R=a.header.getBoundingClientRect().height,W=a.footer.getBoundingClientRect().height||0;let D=v.left,$=v.top,O=1e4,q=1e4,H=1e4,M=1e4;c=v.width,d=v.height,"body"!==w&&(D=v.left-j.left+y.scrollLeft,$=v.top-j.top+y.scrollTop),"body"===w&&p.containment?(O=document.documentElement.clientWidth-v.left,H=document.documentElement.clientHeight-v.top,q=v.width+v.left,M=v.height+v.top):p.containment&&("static"===P?(O=j.width-v.left+E,H=j.height+j.top-v.top+C,q=v.width+(v.left-j.left)-E,M=v.height+(v.top-j.top)-C):(O=y.clientWidth-(v.left-j.left)/k.x+E,H=y.clientHeight-(v.top-j.top)/k.y+C,q=(v.width+v.left-j.left)/k.x-E,M=a.clientHeight+(v.top-j.top)/k.y-C)),p.containment&&(q-=p.containment[3],M-=p.containment[0],O-=p.containment[1],H-=p.containment[2]);const N=window.getComputedStyle(a),I=parseFloat(N.width)-v.width,V=parseFloat(N.height)-v.height;let X=parseFloat(N.left)-v.left,Y=parseFloat(N.top)-v.top;y!==document.body&&(X+=j.left,Y+=j.top);let Z=parseInt(N.borderTopWidth,10),U=parseInt(N.borderRightWidth,10),K=parseInt(N.borderBottomWidth,10),_=parseInt(N.borderLeftWidth,10);s=(e=>{e.preventDefault(),r||(document.dispatchEvent(t),p.start.length&&jsPanel.processCallbacks(a,p.start,!1,{width:c,height:d,left:D,top:$},e),a.front(),"maximized"===a.status&&(a.status="normalized",a.controlbar.querySelector(".jsPanel-btn-maximize")&&a.setControlStatus("maximize","show"),a.controlbar.querySelector(".jsPanel-btn-normalize")&&a.setControlStatus("normalize","hide")),v.height>d+5&&(a.status="normalized",a.setControls([".jsPanel-btn-normalize"]))),r=1,document.dispatchEvent(o);let n,s=e.touches?e.touches[0].clientX:e.clientX,f=e.touches?e.touches[0].clientY:e.clientY;A.contains("jsPanel-resizeit-e")?((l=c+(s-F)*h/k.x+I)>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(s-F)+"px"),"content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-s")?((i=d+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),"content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/B+"px"))):A.contains("jsPanel-resizeit-w")?((l=c+(F-s)*h/k.x+I)<=u&&l>=g&&l<=q&&(a.style.left=D+(s-F)/k.x+X+"px"),l>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px","content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-n")?((i=d+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/B+"px"))):A.contains("jsPanel-resizeit-se")?((l=c+(s-F)*h/k.x+I)>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(s-F)+"px"),p.aspectRatio&&(a.style.height=l/B+"px"),(i=d+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),"content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/B+"px"))):A.contains("jsPanel-resizeit-sw")?((i=d+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),p.aspectRatio&&(a.style.width=i*B+"px"),(l=c+(F-s)*h/k.x+I)<=u&&l>=g&&l<=q&&(a.style.left=D+(s-F)/k.x+X+"px"),l>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px","content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(n=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-ne")?((l=c+(s-F)*h/k.x+I)>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(s-F)+"px"),p.aspectRatio&&(a.style.height=l/B+"px"),(i=d+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(n=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=O+"px",a.style.height=O/B+"px"))):A.contains("jsPanel-resizeit-nw")&&(p.aspectRatio&&A.contains("jsPanel-resizeit-nw")&&(f=(s=f*S)/S),(l=c+(F-s)*h/k.x+I)<=u&&l>=g&&l<=q&&(a.style.left=D+(s-F)/k.x+X+"px"),l>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",p.aspectRatio&&(a.style.height=l/B+"px"),(i=d+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?a.style.width=(i-R-W-Z-K)*L+Z+K+"px":"panel"===p.aspectRatio&&(a.style.width=i*B+"px")),window.getSelection().removeAllRanges();const w=window.getComputedStyle(a),j={left:parseFloat(w.left),top:parseFloat(w.top),right:parseFloat(w.right),bottom:parseFloat(w.bottom),width:parseFloat(w.width),height:parseFloat(w.height)};p.resize.length&&jsPanel.processCallbacks(a,p.resize,!1,j,e)}),jsPanel.pointermove.forEach(e=>document.addEventListener(e,s,!1)),window.addEventListener("mouseout",f,!1)})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,u),window.removeEventListener("mouseout",f)}),e.disable&&(n.style.pointerEvents="none")}),a}),a.resizeit=(e=>{const t=a.querySelectorAll(".jsPanel-resizeit-handle");return"disable"===e?t.forEach(e=>e.style.pointerEvents="none"):t.forEach(e=>e.style.pointerEvents="auto"),a}),a.getScaleFactor=(()=>{const e=a.getBoundingClientRect();return{x:e.width/a.offsetWidth,y:e.height/a.offsetHeight}}),a.calcSizeFactors=(()=>{const t=window.getComputedStyle(a);if("window"===e.container)a.hf=parseFloat(t.left)/(window.innerWidth-parseFloat(t.width)),a.vf=parseFloat(t.top)/(window.innerHeight-parseFloat(t.height));else if(a.parentElement){let e=a.parentElement.getBoundingClientRect();a.hf=parseFloat(t.left)/(e.width-parseFloat(t.width)),a.vf=parseFloat(t.top)/(e.height-parseFloat(t.height))}}),a.saveCurrentDimensions=((e=!1)=>{const t=window.getComputedStyle(a);a.currentData.width=t.width,"normalized"===a.status&&(a.currentData.height=t.height),e&&(a.style.height=t.height)}),a.saveCurrentPosition=(()=>{const e=window.getComputedStyle(a);a.currentData.left=e.left,a.currentData.top=e.top}),a.reposition=((...t)=>{let o,n=e.position,s=!0;return t.forEach(e=>{"string"==typeof e||"object"==typeof e?n=e:"boolean"==typeof e?s=e:"function"==typeof e&&(o=e)}),jsPanel.position(a,n),a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition()),s&&a.saveCurrentPosition(),o&&o.call(a,a),a}),a.repositionOnSnap=(t=>{let o="0",n="0",s=jsPanel.pOcontainment(e.dragit.containment);if(e.dragit.snap.containment)switch(t){case"left-top":o=s[3],n=s[0];break;case"right-top":o=-s[1],n=s[0];break;case"right-bottom":o=-s[1],n=-s[2];break;case"left-bottom":o=s[3],n=-s[2];break;case"center-top":o=s[3]/2-s[1]/2,n=s[0];break;case"center-bottom":o=s[3]/2-s[1]/2,n=-s[2];break;case"left-center":o=s[3],n=s[0]/2-s[2]/2;break;case"right-center":o=-s[1],n=s[0]/2-s[2]/2}jsPanel.position(a,t),jsPanel.setStyles(a,{left:`calc(${a.style.left} + ${o}px)`,top:`calc(${a.style.top} + ${n}px)`})}),a.overlaps=((e,t,o)=>{let n,s=a.getBoundingClientRect(),r=getComputedStyle(a.parentElement),l=a.getScaleFactor(),i={top:0,right:0,bottom:0,left:0},c=0,d=0,p=0,h=0;"window"!==a.options.container&&"paddingbox"===t&&(i.top=parseInt(r.borderTopWidth,10)*l.y,i.right=parseInt(r.borderRightWidth,10)*l.x,i.bottom=parseInt(r.borderBottomWidth,10)*l.y,i.left=parseInt(r.borderLeftWidth,10)*l.x),n="string"==typeof e?"window"===e?{left:0,top:0,right:window.innerWidth,bottom:window.innerHeight}:"parent"===e?a.parentElement.getBoundingClientRect():document.querySelector(e).getBoundingClientRect():e.getBoundingClientRect(),o&&(c=o.touches?o.touches[0].clientX:o.clientX,d=o.touches?o.touches[0].clientY:o.clientY,p=c-n.left,h=d-n.top);let f=s.leftn.left,u=s.topn.top;return{overlaps:f&&u,top:s.top-n.top-i.top,right:n.right-s.right-i.right,bottom:n.bottom-s.bottom-i.bottom,left:s.left-n.left-i.left,parentBorderWidth:i,panelRect:s,referenceRect:n,pointer:{clientX:c,clientY:d,left:p-i.left,top:h-i.top,right:n.width-p-i.right,bottom:n.height-h-i.bottom}}}),a.setSize=(()=>{if(e.panelSize){const t=jsPanel.pOsize(a,e.panelSize);a.style.width=t.width,a.style.height=t.height}else if(e.contentSize){const t=jsPanel.pOsize(a,e.contentSize);a.content.style.width=t.width,a.content.style.height=t.height,a.style.width=t.width,a.content.style.width="100%"}return a}),a.resize=((...e)=>{let t,o=window.getComputedStyle(a),n={width:o.width,height:o.height},s=!0;e.forEach(e=>{"string"==typeof e?n=e:"object"==typeof e?n=Object.assign(n,e):"boolean"==typeof e?s=e:"function"==typeof e&&(t=e)});let r=jsPanel.pOsize(a,n);a.style.width=r.width,a.style.height=r.height,a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition()),s&&a.saveCurrentDimensions(),a.status="normalized";let l=a.controlbar.querySelector(".jsPanel-btn-smallify");return l&&(l.style.transform="rotate(0deg)"),t&&t.call(a,a),a.calcSizeFactors(),a}),a.windowResizeHandler=(t=>{if(t.target===window){let o,n,s=a.status,r=e.onwindowresize;if("maximized"===s&&r)a.maximize(!1,!0);else if(a.snapped&&"minimized"!==s)a.snap(a.snapped,!0);else if("normalized"===s||"smallified"===s||"maximized"===s){let e=typeof r;"boolean"===e?(o=(window.innerWidth-a.offsetWidth)*a.hf,a.style.left=o<=0?0:o+"px",n=(window.innerHeight-a.offsetHeight)*a.vf,a.style.top=n<=0?0:n+"px"):"function"===e?r.call(a,t,a):"object"===e&&(!0===r.preset?(o=(window.innerWidth-a.offsetWidth)*a.hf,a.style.left=o<=0?0:o+"px",n=(window.innerHeight-a.offsetHeight)*a.vf,a.style.top=n<=0?0:n+"px",r.callback.call(a,t,a)):r.callback.call(a,t,a))}else"smallifiedmax"===s&&r&&a.maximize(!1,!0).smallify();a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition())}}),a.setControls=((e,t)=>(a.header.querySelectorAll(".jsPanel-btn").forEach(e=>{const t=e.className.split("-"),o=t[t.length-1];"hidden"!==a.getAttribute(`data-btn${o}`)&&(e.style.display="block")}),e.forEach(e=>{const t=a.controlbar.querySelector(e);t&&(t.style.display="none")}),t&&t.call(a,a),a)),a.setControlStatus=((e,t="enable",o)=>{const n=a.controlbar.querySelector(`.jsPanel-btn-${e}`);switch(t){case"disable":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"disabled"),n.style.pointerEvents="none",n.style.opacity=.4,n.style.cursor="default");break;case"hide":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"hidden"),n.style.display="none");break;case"show":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"enabled"),n.style.display="block",n.style.pointerEvents="auto",n.style.opacity=1,n.style.cursor="pointer");break;case"enable":"removed"!==a.getAttribute(`data-btn${e}`)&&("hidden"===a.getAttribute(`data-btn${e}`)&&(n.style.display="block"),a.setAttribute(`data-btn${e}`,"enabled"),n.style.pointerEvents="auto",n.style.opacity=1,n.style.cursor="pointer");break;case"remove":a.controlbar.removeChild(n),a.setAttribute(`data-btn${e}`,"removed")}return o&&o.call(a,a),a}),a.setControlSize=(e=>{const t=e.toLowerCase();a.controlbar.querySelectorAll(".jsPanel-btn").forEach(e=>{["jsPanel-btn-xl","jsPanel-btn-lg","jsPanel-btn-md","jsPanel-btn-sm","jsPanel-btn-xs"].forEach(t=>e.classList.remove(t)),e.classList.add(`jsPanel-btn-${t}`)}),"xl"===t?a.titlebar.style.fontSize="1.5rem":"lg"===t?a.titlebar.style.fontSize="1.25rem":"md"===t?a.titlebar.style.fontSize="1.05rem":"sm"===t?a.titlebar.style.fontSize=".9rem":"xs"===t&&(a.titlebar.style.fontSize=".8rem")}),a.setHeaderControls=(t=>{if(a.options.headerControls.add){let e=a.options.headerControls.add;Array.isArray(e)||(e=[e]),e.forEach(e=>a.addControl(e))}let o=[];a.controlbar.querySelectorAll(".jsPanel-btn").forEach(e=>{let t=e.className.match(/jsPanel-btn-[a-z0-9]{3,}/i)[0].substring(12);o.push(t)});const n=jsPanel.pOheaderControls(e.headerControls);return e.headerControls=n,o.forEach(e=>{n[e]&&a.setControlStatus(e,n[e])}),a.setControlSize(n.size),t&&t.call(a,a),a}),a.setHeaderLogo=((e,t)=>{let o=[a.headerlogo],n=document.querySelector("#"+a.id+"-min");return n&&o.push(n.querySelector(".jsPanel-headerlogo")),"string"==typeof e?e.startsWith("<")?o.forEach(t=>t.innerHTML=e):o.forEach(t=>{jsPanel.emptyNode(t);let o=document.createElement("img");o.src=e,t.append(o)}):o.forEach(t=>{jsPanel.emptyNode(t),t.append(e)}),a.headerlogo.childNodes.forEach(e=>{e.nodeName&&"IMG"===e.nodeName&&e.setAttribute("draggable","false")}),t&&t.call(a,a),a}),a.setHeaderRemove=(e=>(a.removeChild(a.header),a.content.classList.add("jsPanel-content-noheader"),["close","maximize","normalize","minimize","smallify"].forEach(e=>a.setAttribute(`data-btn${e}`,"removed")),e&&e.call(a,a),a)),a.setHeaderTitle=((e,t)=>{let o=[a.headertitle],n=document.querySelector("#"+a.id+"-min");return n&&o.push(n.querySelector(".jsPanel-title")),"string"==typeof e?o.forEach(t=>t.innerHTML=e):"function"==typeof e?o.forEach(t=>{jsPanel.emptyNode(t),t.innerHTML=e()}):o.forEach(t=>{jsPanel.emptyNode(t),t.append(e)}),t&&t.call(a,a),a}),a.setIconfont=((e,t=a,o)=>{if(e){let o,n;if("fa"===e||"far"===e||"fal"===e||"fas"===e||"fad"===e)o=[`${e} fa-window-close`,`${e} fa-window-maximize`,`${e} fa-window-restore`,`${e} fa-window-minimize`,`${e} fa-chevron-up`];else if("material-icons"===e)o=[e,e,e,e,e,e],n=["close","fullscreen","fullscreen_exit","call_received","expand_less"];else if(Array.isArray(e))o=[`custom-control-icon ${e[4]}`,`custom-control-icon ${e[3]}`,`custom-control-icon ${e[2]}`,`custom-control-icon ${e[1]}`,`custom-control-icon ${e[0]}`];else{if("bootstrap"!==e&&"glyphicon"!==e)return t;o=["glyphicon glyphicon-remove","glyphicon glyphicon-fullscreen","glyphicon glyphicon-resize-full","glyphicon glyphicon-minus","glyphicon glyphicon-chevron-up"]}t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>jsPanel.emptyNode(e).innerHTML=""),Array.prototype.slice.call(t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn > span")).reverse().forEach((t,a)=>{t.className=o[a],"material-icons"===e&&(t.textContent=n[a])})}return o&&o.call(t,t),t}),a.addToolbar=((e,t,o)=>{if("header"===e?e=a.headertoolbar:"footer"===e&&(e=a.footer),"string"==typeof t)e.innerHTML=t;else if(Array.isArray(t))t.forEach(t=>{"string"==typeof t?e.innerHTML+=t:e.append(t)});else if("function"==typeof t){let o=t.call(a,a);"string"==typeof o?e.innerHTML=o:e.append(o)}else e.append(t);return e.classList.add("active"),o&&o.call(a,a),a}),a.addCloseControl=(()=>{let e=document.createElement("button"),t=a.content.style.color;return e.classList.add("jsPanel-addCloseCtrl"),e.innerHTML=jsPanel.icons.close,e.style.color=t,a.options.rtl&&e.classList.add("rtl"),a.appendChild(e),jsPanel.pointerup.forEach(t=>{e.addEventListener(t,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}),jsPanel.pointerdown.forEach(t=>{e.addEventListener(t,e=>e.preventDefault())}),a}),a.addControl=(t=>{if(!t.html)return a;t.position||(t.position=1);const o=a.controlbar.querySelectorAll(".jsPanel-btn").length;let n=document.createElement("button");n.innerHTML=t.html,n.className=`jsPanel-btn jsPanel-btn-${t.name} jsPanel-btn-${e.headerControls.size}`,n.style.color=a.header.style.color,t.position>o?a.controlbar.append(n):a.controlbar.insertBefore(n,a.querySelector(`.jsPanel-controlbar .jsPanel-btn:nth-child(${t.position})`));const s=t.ariaLabel||t.name;return s&&n.setAttribute("aria-label",s),jsPanel.pointerup.forEach(e=>{n.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;t.handler.call(a,a,n)})}),t.afterInsert&&t.afterInsert.call(n,n),a}),a.setRtl=(()=>{[a.header,a.content,a.footer].forEach(t=>{t.dir="rtl",e.rtl.lang&&(t.lang=e.rtl.lang)})}),a.id=e.id,a.classList.add("jsPanel-"+e.paneltype),"standard"===e.paneltype&&(a.style.zIndex=this.zi.next()),n.append(a),a.front(!1,!1),a.setTheme(e.theme),e.boxShadow&&a.classList.add(`jsPanel-depth-${e.boxShadow}`),e.header){if(e.headerLogo&&a.setHeaderLogo(e.headerLogo),a.setIconfont(e.iconfont),a.setHeaderTitle(e.headerTitle),a.setHeaderControls(),jsPanel.isIE){let e=[a.headerbar,a.controlbar];switch(a.options.headerControls.size){case"md":e.forEach(e=>{e.style.height="34px"});break;case"xs":e.forEach(e=>{e.style.height="26px"});break;case"sm":e.forEach(e=>{e.style.height="30px"});break;case"lg":e.forEach(e=>{e.style.height="38px"});break;case"xl":e.forEach(e=>{e.style.height="42px"})}}if("auto-show-hide"===e.header){let t="jsPanel-depth-"+e.boxShadow;a.header.style.opacity=0,a.style.backgroundColor="transparent",this.remClass(a,t),this.setClass(a.content,t),a.header.addEventListener("mouseenter",()=>{a.header.style.opacity=1,jsPanel.setClass(a,t),jsPanel.remClass(a.content,t)}),a.header.addEventListener("mouseleave",()=>{a.header.style.opacity=0,jsPanel.remClass(a,t),jsPanel.setClass(a.content,t)})}}else a.setHeaderRemove(),e.addCloseControl&&a.addCloseControl();if(e.headerToolbar&&a.addToolbar(a.headertoolbar,e.headerToolbar),e.footerToolbar&&a.addToolbar(a.footer,e.footerToolbar),e.border&&a.setBorder(e.border),e.borderRadius&&a.setBorderRadius(e.borderRadius),e.css)for(const[t,o]of Object.entries(e.css))if("panel"===t)a.className+=` ${o}`;else{let e=a.querySelector(`.jsPanel-${t}`);e&&(e.className+=` ${o}`)}if(e.content&&("function"==typeof e.content?e.content.call(a,a):"string"==typeof e.content?a.content.innerHTML=e.content:a.content.append(e.content)),e.contentAjax&&this.ajax(e.contentAjax,a),e.contentFetch&&this.fetch(e.contentFetch,a),e.contentOverflow){const t=e.contentOverflow.split(" ");1===t.length?a.content.style.overflow=t[0]:2===t.length&&(a.content.style.overflowX=t[0],a.content.style.overflowY=t[1])}if(e.autoclose){"number"==typeof e.autoclose?e.autoclose={time:e.autoclose+"ms"}:"string"==typeof e.autoclose&&(e.autoclose={time:e.autoclose});let t=Object.assign({},jsPanel.defaultAutocloseConfig,e.autoclose);t.time&&"number"==typeof t.time&&(t.time+="ms");let o=a.progressbar.querySelector("div");o.addEventListener("animationend",e=>{e.stopPropagation(),a.progressbar.classList.remove("active"),a.close()}),t.progressbar&&(a.progressbar.classList.add("active"),t.background?jsPanel.themes.indexOf(t.background)>-1?a.progressbar.classList.add(t.background+"-bg"):jsPanel.colorNames[t.background]?a.progressbar.style.background="#"+jsPanel.colorNames[t.background]:a.progressbar.style.background=t.background:a.progressbar.classList.add("success-bg")),o.style.animation=`${t.time} progressbar`}if(e.rtl&&a.setRtl(),a.setSize(),a.status="normalized",e.position?this.position(a,e.position):a.style.opacity=1,document.dispatchEvent(i),a.calcSizeFactors(),e.animateIn&&(a.addEventListener("animationend",()=>{this.remClass(a,e.animateIn)}),this.setClass(a,e.animateIn)),e.syncMargins){let t=this.pOcontainment(e.maximizedMargin);e.dragit&&(e.dragit.containment=t,!0===e.dragit.snap?(e.dragit.snap=jsPanel.defaultSnapConfig,e.dragit.snap.containment=!0):e.dragit.snap&&(e.dragit.snap.containment=!0)),e.resizeit&&(e.resizeit.containment=t)}if(e.dragit?(["start","drag","stop"].forEach(t=>{e.dragit[t]?"function"==typeof e.dragit[t]&&(e.dragit[t]=[e.dragit[t]]):e.dragit[t]=[]}),a.drag(e.dragit),a.addEventListener("jspaneldragstop",e=>{e.panel===a&&a.calcSizeFactors()},!1)):a.titlebar.style.cursor="default",e.resizeit){["start","resize","stop"].forEach(t=>{e.resizeit[t]?"function"==typeof e.resizeit[t]&&(e.resizeit[t]=[e.resizeit[t]]):e.resizeit[t]=[]}),a.sizeit(e.resizeit);let t=void 0;a.addEventListener("jspanelresizestart",e=>{e.panel===a&&(t=a.status)},!1),a.addEventListener("jspanelresizestop",o=>{o.panel===a&&("smallified"===t||"smallifiedmax"===t||"maximized"===t)&&parseFloat(a.style.height)>parseFloat(window.getComputedStyle(a.header).height)&&(a.setControls([".jsPanel-btn-normalize"]),a.status="normalized",document.dispatchEvent(i),document.dispatchEvent(r),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every"),a.calcSizeFactors())},!1)}if(a.saveCurrentDimensions(!0),a.saveCurrentPosition(),e.setStatus&&("smallifiedmax"===e.setStatus?a.maximize().smallify():"smallified"===e.setStatus?a.smallify():a[e.setStatus.slice(0,-1)]()),this.pointerdown.forEach(t=>{a.addEventListener(t,t=>{t.target.closest(".jsPanel-btn-close")||t.target.closest(".jsPanel-btn-minimize")||"standard"!==e.paneltype||a.front()},!1)}),e.onwindowresize&&"window"===a.options.container&&window.addEventListener("resize",a.windowResizeHandler,!1),e.onparentresize){let t=e.onparentresize,o=typeof t,n=a.isChildpanel();if(n){const e=n.content;let s=[];a.parentResizeHandler=(r=>{if(r.panel===n){s[0]=e.offsetWidth,s[1]=e.offsetHeight;let n,r,l=a.status;"maximized"===l&&t?a.maximize():a.snapped&&"minimized"!==l?a.snap(a.snapped,!0):"normalized"===l||"smallified"===l||"maximized"===l?"function"===o?t.call(a,a,{width:s[0],height:s[1]}):"object"===o&&!0===t.preset?(n=(s[0]-a.offsetWidth)*a.hf,a.style.left=n<=0?0:n+"px",r=(s[1]-a.offsetHeight)*a.vf,a.style.top=r<=0?0:r+"px",t.callback.call(a,a,{width:s[0],height:s[1]})):"boolean"===o&&(n=(s[0]-a.offsetWidth)*a.hf,a.style.left=n<=0?0:n+"px",r=(s[1]-a.offsetHeight)*a.vf,a.style.top=r<=0?0:r+"px"):"smallifiedmax"===l&&t&&a.maximize().smallify()}}),document.addEventListener("jspanelresize",a.parentResizeHandler,!1)}}return this.globalCallbacks&&(Array.isArray(this.globalCallbacks)?this.globalCallbacks.forEach(e=>e.call(a,a)):this.globalCallbacks.call(a,a)),e.callback&&(Array.isArray(e.callback)?e.callback.forEach(e=>e.call(a,a)):e.callback.call(a,a)),t&&t.call(a,a),document.dispatchEvent(s),a}}; \ No newline at end of file +export let jsPanel={version:"4.16.1",date:"2022-11-03 09:18",ajaxAlwaysCallbacks:[],autopositionSpacing:4,closeOnEscape:void document.addEventListener("keydown",e=>{"Escape"!==e.key&&"Escape"!==e.code&&"Esc"!==e.key||jsPanel.getPanels(e=>e.classList.contains("jsPanel")).some(e=>!!e.options.closeOnEscape&&("function"==typeof e.options.closeOnEscape?e.options.closeOnEscape.call(e,e):(e.close(null,!0),!0)))},!1),defaults:{boxShadow:3,container:"window",contentSize:{width:"400px",height:"200px"},dragit:{cursor:"move",handles:".jsPanel-headerlogo, .jsPanel-titlebar, .jsPanel-ftr",opacity:.8,disableOnMaximized:!0},header:!0,headerTitle:"jsPanel",headerControls:{size:"md"},iconfont:void 0,maximizedMargin:0,minimizeTo:"default",paneltype:"standard",position:{my:"center",at:"center"},resizeit:{handles:"n, e, s, w, ne, se, sw, nw",minWidth:128,minHeight:38},theme:"default"},defaultAutocloseConfig:{time:"8s",progressbar:!0},defaultSnapConfig:{sensitivity:70,trigger:"panel",active:"both"},extensions:{},globalCallbacks:!1,icons:{close:'',maximize:'',normalize:'',minimize:'',smallify:''},idCounter:0,isIE:(()=>document.documentMode||!1)(),pointerdown:"onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],pointermove:"onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],pointerup:"onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"],polyfills:(Object.assign||Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:function(e){if(null==e)throw new TypeError("Cannot convert first argument to object");let t=Object(e);for(let e=1;e=0&&n.item(t)!==o;);}while(t<0&&(o=o.parentElement));return o}),function(){if("function"==typeof window.CustomEvent)return!1;function e(e,t){t=t||{bubbles:!1,cancelable:!1,detail:void 0};let n=document.createEvent("CustomEvent");return n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail),n}e.prototype=window.Event.prototype,window.CustomEvent=e}(),String.prototype.endsWith||(String.prototype.endsWith=function(e,t){return(void 0===t||t>this.length)&&(t=this.length),this.substring(t-e.length,t)===e}),String.prototype.startsWith||Object.defineProperty(String.prototype,"startsWith",{value:function(e,t){var n=t>0?0|t:0;return this.substring(n,n+e.length)===e}}),String.prototype.includes||(String.prototype.includes=function(e,t){"use strict";if(e instanceof RegExp)throw TypeError("first argument must not be a RegExp");return void 0===t&&(t=0),-1!==this.indexOf(e,t)}),String.prototype.repeat||(String.prototype.repeat=function(e){"use strict";if(null==this)throw new TypeError("can't convert "+this+" to object");var t=""+this;if((e=+e)!=e&&(e=0),e<0)throw new RangeError("repeat count must be non-negative");if(e==1/0)throw new RangeError("repeat count must be less than infinity");if(e=Math.floor(e),0==t.length||0==e)return"";if(t.length*e>=1<<28)throw new RangeError("repeat count must not overflow maximum string size");var n=t.length*e;for(e=Math.floor(Math.log(e)/Math.log(2));e;)t+=t,e--;return t+=t.substring(0,n-t.length)}),Number.isInteger=Number.isInteger||function(e){return"number"==typeof e&&isFinite(e)&&Math.floor(e)===e},void(Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(e,t){if(null==this)throw new TypeError('"this" is null or not defined');let n=Object(this),o=n.length>>>0;if(0===o)return!1;let a=0|t,r=Math.max(a>=0?a:o-Math.abs(a),0);for(;rjsPanel.modifier=e),void document.addEventListener("keyup",()=>jsPanel.modifier=!1)),usePointerEvents(e=!0){e?(this.pointerdown="onpointerdown"in window?["pointerdown"]:"ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="onpointermove"in window?["pointermove"]:"ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="onpointerup"in window?["pointerup"]:"ontouchend"in window?["touchend","mouseup"]:["mouseup"]):(this.pointerdown="ontouchend"in window?["touchstart","mousedown"]:["mousedown"],this.pointermove="ontouchend"in window?["touchmove","mousemove"]:["mousemove"],this.pointerup="ontouchend"in window?["touchend","mouseup"]:["mouseup"])},pOcontainer(e){if("window"===e)return document.body;if("string"==typeof e){let t=document.querySelectorAll(e);return!!(t.length&&t.length>0)&&t}return 1===e.nodeType?e:!!e.length&&e[0]},pOcontainment(e){let t=e;if("function"==typeof e&&(t=e()),"number"==typeof t)return[t,t,t,t];if(Array.isArray(t)){if(1===t.length)return[t[0],t[0],t[0],t[0]];if(2===t.length)return t.concat(t);3===t.length&&(t[3]=t[1])}return t},pOsize(e,t){let n=t||this.defaults.contentSize;const o=e.parentElement;if("string"==typeof n){const e=n.trim().split(" ");(n={}).width=e[0],2===e.length?n.height=e[1]:n.height=e[0]}else n.width&&!n.height?n.height=n.width:n.height&&!n.width&&(n.width=n.height);if(String(n.width).match(/^[\d.]+$/gi))n.width+="px";else if("string"==typeof n.width&&n.width.endsWith("%"))if(o===document.body)n.width=window.innerWidth*(parseFloat(n.width)/100)+"px";else{const e=window.getComputedStyle(o),t=parseFloat(e.borderLeftWidth)+parseFloat(e.borderRightWidth);n.width=(parseFloat(e.width)-t)*(parseFloat(n.width)/100)+"px"}else"function"==typeof n.width&&(n.width=n.width.call(e,e),"number"==typeof n.width?n.width+="px":"string"==typeof n.width&&n.width.match(/^[\d.]+$/gi)&&(n.width+="px"));if(String(n.height).match(/^[\d.]+$/gi))n.height+="px";else if("string"==typeof n.height&&n.height.endsWith("%"))if(o===document.body)n.height=window.innerHeight*(parseFloat(n.height)/100)+"px";else{const e=window.getComputedStyle(o),t=parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth);n.height=(parseFloat(e.height)-t)*(parseFloat(n.height)/100)+"px"}else"function"==typeof n.height&&(n.height=n.height.call(e,e),"number"==typeof n.height?n.height+="px":"string"==typeof n.height&&n.height.match(/^[\d.]+$/gi)&&(n.height+="px"));return n},pOborder(e){let t=[],n=e.trim().replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," ").split(" ");return n.forEach((e,t)=>{(e.startsWith("--")||e.startsWith("var"))&&(n[t]=jsPanel.getCssVariableValue(e))}),n.forEach(e=>{jsPanel.colorNames[e]?t[2]="#"+jsPanel.colorNames[e]:e.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)?t[1]=e:e.match(/(thin|medium|thick)|(\d*\.?\d*(cap|ch|em|ex|ic|lh|rem|rlh|vh|vw|vmax|vmin|vb|vi|px|cm|mm|Q|in|pc|pt))/)?t[0]=e:t[2]=e}),t[0]||(t[0]="medium"),t[1]||(t[1]="solid"),t[2]||(t[2]=""),t},pOheaderControls(e){if("string"==typeof e){let t={},n=e.toLowerCase(),o=n.match(/xl|lg|md|sm|xs/),a=n.match(/closeonly|none/);return o&&(t.size=o[0]),a&&(t=Object.assign({},t,{maximize:"remove",normalize:"remove",minimize:"remove",smallify:"remove"}),"none"===a[0]&&(t.close="remove")),Object.assign({},this.defaults.headerControls,t)}return Object.assign({},this.defaults.headerControls,e)},pOtheme(e){let t,n="";if((e=e.trim()).match(/^(rgb|hsl|var)/)){let o=e.indexOf(")");(t=e.slice(0,o+1).replace(/\s+/g,"")).startsWith("var")&&(t=jsPanel.getCssVariableValue(t)),n=e.slice(o+1,e.length).trim()}else if(e.match(/^(#|\w|--)/)){let o=e.indexOf(" ");o>0?(t=e.slice(0,o+1).replace(/\s+/g,""),n=e.slice(o+1,e.length).trim()):t=e,t.startsWith("--")&&(t=jsPanel.getCssVariableValue(t))}if(t.match(/^([\da-f]{3}|[\da-f]{6})$/gi)&&(t="#"+t),n.startsWith("fillcolor")){let e=n.indexOf(" ");n=(n=n.slice(e+1,n.length).trim().replace(/\s+/g,"")).match(/^([\da-f]{3}|[\da-f]{6})$/gi)?"#"+n:jsPanel.colorNames[n]?"#"+jsPanel.colorNames[n]:n.match(/^(--|var)/)?jsPanel.getCssVariableValue(n):"#fff"}return{color:t,colors:!1,filling:n}},color(e){let t,n,o,a,r,s,l,i,d,c=e.toLowerCase(),p={};const h=/^rgba?\((\d{1,3}),(\d{1,3}),(\d{1,3}),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi,f=/^hsla?\((\d{1,3}),(\d{1,3}%),(\d{1,3}%),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi,u=this.colorNames;return u[c]&&(c=u[c]),null!==c.match(/^#?([\da-f]{3}|[\da-f]{6})$/gi)?((c=c.replace("#","")).length%2==1?(t=c.slice(0,1).repeat(2),n=c.slice(1,2).repeat(2),o=c.slice(2,3).repeat(2),p.rgb={r:parseInt(t,16),g:parseInt(n,16),b:parseInt(o,16)},p.hex=`#${t}${n}${o}`):(p.rgb={r:parseInt(c.slice(0,2),16),g:parseInt(c.slice(2,4),16),b:parseInt(c.slice(4,6),16)},p.hex=`#${c}`),d=this.rgbToHsl(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl=d,p.rgb.css=`rgb(${p.rgb.r},${p.rgb.g},${p.rgb.b})`):c.match(h)?(l=h.exec(c),p.rgb={css:c,r:l[1],g:l[2],b:l[3]},p.hex=this.rgbToHex(l[1],l[2],l[3]),d=this.rgbToHsl(l[1],l[2],l[3]),p.hsl=d):c.match(f)?(a=(l=f.exec(c))[1]/360,r=l[2].slice(0,l[2].length-1)/100,s=l[3].slice(0,l[3].length-1)/100,i=this.hslToRgb(a,r,s),p.rgb={css:`rgb(${i[0]},${i[1]},${i[2]})`,r:i[0],g:i[1],b:i[2]},p.hex=this.rgbToHex(p.rgb.r,p.rgb.g,p.rgb.b),p.hsl={css:`hsl(${l[1]},${l[2]},${l[3]})`,h:l[1],s:l[2],l:l[3]}):(p.hex="#f5f5f5",p.rgb={css:"rgb(245,245,245)",r:245,g:245,b:245},p.hsl={css:"hsl(0,0%,96%)",h:0,s:"0%",l:"96%"}),p},calcColors(e){const t=this.colorBrightnessThreshold,n=this.color(e),o=this.lighten(e,this.colorFilledLight),a=this.darken(e,this.colorFilled),r=this.perceivedBrightness(e)<=t?"#ffffff":"#000000",s=this.perceivedBrightness(o)<=t?"#ffffff":"#000000",l=this.perceivedBrightness(a)<=t?"#ffffff":"#000000",i=this.lighten(e,this.colorFilledDark),d=this.perceivedBrightness(i)<=t?"#ffffff":"#000000";return[n.hsl.css,o,a,r,s,l,i,d]},darken(e,t){const n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o-o*t)+"%";return`hsl(${n.h},${n.s},${a})`},lighten(e,t){const n=this.color(e).hsl,o=parseFloat(n.l),a=Math.round(o+(100-o)*t)+"%";return`hsl(${n.h},${n.s},${a})`},hslToRgb(e,t,n){let o,a,r;if(0===t)o=a=r=n;else{let s=(e,t,n)=>(n<0&&(n+=1),n>1&&(n-=1),n<1/6?e+6*(t-e)*n:n<.5?t:n<2/3?e+(t-e)*(2/3-n)*6:e),l=n<.5?n*(1+t):n+t-n*t,i=2*n-l;o=s(i,l,e+1/3),a=s(i,l,e),r=s(i,l,e-1/3)}return[Math.round(255*o),Math.round(255*a),Math.round(255*r)]},rgbToHsl(e,t,n){e/=255,t/=255,n/=255;let o,a,r=Math.max(e,t,n),s=Math.min(e,t,n),l=(r+s)/2;if(r===s)o=a=0;else{let i=r-s;switch(a=l>.5?i/(2-r-s):i/(r+s),r){case e:o=(t-n)/i+(te.match(/^(down|right|up|left)$/i));o.length&&(t.autoposition=o[0],n.splice(n.indexOf(o[0]),1));let a=n.filter(e=>e.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i));a.length?(t.my=a[0],t.at=a[1]||a[0],n.splice(n.indexOf(a[0]),1),a[1]&&n.splice(n.indexOf(a[1]),1)):(t.my="center",t.at="center");let r=n.filter(e=>e.match(/^[+-]?\d*\.?\d+[a-z%]*$/i));return r.length&&(t.offsetX=r[0].match(/^[+-]?\d*\.?\d+$/i)?`${r[0]}px`:r[0],r[1]?t.offsetY=r[1].match(/^[+-]?\d*\.?\d+$/i)?`${r[1]}px`:r[1]:t.offsetY=t.offsetX,n.splice(n.indexOf(r[0]),1),r[1]&&n.splice(n.indexOf(r[1]),1)),n.length&&(t.of=n.join(" ")),t},position(e,t){if(!t)return e.style.opacity=1,e;t="string"==typeof t?Object.assign({},this.defaults.position,this.pOposition(t)):Object.assign({},this.defaults.position,t),["my","at","of"].forEach(n=>{"function"==typeof t[n]&&(t[n]=t[n].call(e,e))}),"window"===e.options.container&&(e.style.position="fixed"),"string"==typeof e?e=document.querySelector(e):Object.getPrototypeOf(e).jquery&&(e=e[0]);const n="window"===e.options.container?"window":e.parentElement,o=e.getBoundingClientRect(),a=e.parentElement.getBoundingClientRect(),r="window"===n?{left:0,top:0,width:document.documentElement.clientWidth,height:window.innerHeight}:{width:a.width,height:a.height,left:a.left,top:a.top},s="window"===n?{x:1,y:1}:{x:r.width/n.offsetWidth,y:r.height/n.offsetHeight},l="window"===n?{borderTopWidth:"0px",borderRightWidth:"0px",borderBottomWidth:"0px",borderLeftWidth:"0px"}:window.getComputedStyle(n);let i;r.width-=(parseFloat(l.borderLeftWidth)+parseFloat(l.borderRightWidth))*s.x,r.height-=(parseFloat(l.borderTopWidth)+parseFloat(l.borderBottomWidth))*s.y,i=t.of?"string"==typeof t.of?"window"===t.of?{borderTopWidth:"0px",borderRightWidth:"0px",borderBottomWidth:"0px",borderLeftWidth:"0px"}:document.querySelector(t.of).getBoundingClientRect():Object.getPrototypeOf(t.of).jquery?t.of[0].getBoundingClientRect():t.of.getBoundingClientRect():r;let d=this.getScrollbarWidth(document.body),c=this.getScrollbarWidth(e.parentElement),p="0px";t.my.startsWith("left-")?t.at.startsWith("left-")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)+"px":"0px":t.at.startsWith("center")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)+i.width/2+"px":r.width/2+"px":t.at.startsWith("right-")&&(p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)+i.width+"px":r.width+"px"):t.my.startsWith("center")?t.at.startsWith("left-")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)-o.width/2+"px":-o.width/2+"px":t.at.startsWith("center")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)-(o.width-i.width)/2+"px":r.width/2-o.width/2+"px":t.at.startsWith("right-")&&(p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)+(i.width-o.width/2)+"px":r.width-o.width/2+"px"):t.my.startsWith("right-")&&(t.at.startsWith("left-")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)-o.width+"px":-o.width+"px":t.at.startsWith("center")?p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)-o.width+i.width/2+"px":r.width/2-o.width+"px":t.at.startsWith("right-")&&(p=t.of?i.left-r.left-parseFloat(l.borderLeftWidth)+i.width-o.width+"px":r.width-o.width+"px","window"!==n&&(p=parseFloat(p)-c.y+"px")));let h="0px";t.my.endsWith("-top")?t.at.endsWith("-top")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)+"px":"0px":t.at.endsWith("center")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)+i.height/2+"px":r.height/2+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)+i.height+"px":r.height+"px"):t.my.endsWith("center")?t.at.endsWith("-top")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height/2+"px":-o.height/2+"px":t.at.endsWith("center")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height/2+i.height/2+"px":r.height/2-o.height/2+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height/2+i.height+"px":r.height-o.height/2+"px"):t.my.endsWith("-bottom")&&(t.at.endsWith("-top")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height+"px":-o.height+"px":t.at.endsWith("center")?h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height+i.height/2+"px":r.height/2-o.height+"px":t.at.endsWith("-bottom")&&(h=t.of?i.top-r.top-parseFloat(l.borderTopWidth)-o.height+i.height+"px":r.height-o.height+"px",h="window"!==n?parseFloat(h)-c.x+"px":parseFloat(h)-d.x+"px")),e.style.left=1===s.x?p:parseFloat(p)/s.x+"px",e.style.top=1===s.y?h:parseFloat(h)/s.y+"px";let f=getComputedStyle(e),u={left:f.left,top:f.top};return t.autoposition&&t.my===t.at&&["left-top","center-top","right-top","left-bottom","center-bottom","right-bottom"].indexOf(t.my)>=0&&(u=this.applyPositionAutopos(e,u,t)),(t.offsetX||t.offsetY)&&(u=this.applyPositionOffset(e,u,t)),(t.minLeft||t.minTop||t.maxLeft||t.maxTop)&&(u=this.applyPositionMinMax(e,u,t)),t.modify&&(u=this.applyPositionModify(e,u,t)),"number"==typeof e.options.opacity?e.style.opacity=e.options.opacity:e.style.opacity=1,e},applyPositionAutopos(e,t,n){const o=`${n.my}-${n.autoposition.toLowerCase()}`;e.classList.add(o);const a=Array.prototype.slice.call(document.querySelectorAll(`.${o}`)),r=a.indexOf(e);if(a.length>1){switch(n.autoposition){case"down":a.forEach((e,n)=>{n>0&&n<=r&&(t.top=parseFloat(t.top)+a[--n].getBoundingClientRect().height+jsPanel.autopositionSpacing+"px")});break;case"up":a.forEach((e,n)=>{n>0&&n<=r&&(t.top=parseFloat(t.top)-a[--n].getBoundingClientRect().height-jsPanel.autopositionSpacing+"px")});break;case"right":a.forEach((e,n)=>{n>0&&n<=r&&(t.left=parseFloat(t.left)+a[--n].getBoundingClientRect().width+jsPanel.autopositionSpacing+"px")});break;case"left":a.forEach((e,n)=>{n>0&&n<=r&&(t.left=parseFloat(t.left)-a[--n].getBoundingClientRect().width-jsPanel.autopositionSpacing+"px")})}e.style.left=t.left,e.style.top=t.top}return{left:t.left,top:t.top}},applyPositionOffset(e,t,n){["offsetX","offsetY"].forEach(e=>{n[e]?("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),!1===isNaN(n[e])&&(n[e]=`${n[e]}px`)):n[e]="0px"}),e.style.left=`calc(${e.style.left} + ${n.offsetX})`,e.style.top=`calc(${e.style.top} + ${n.offsetY})`;const o=getComputedStyle(e);return{left:o.left,top:o.top}},applyPositionMinMax(e,t,n){if(["minLeft","minTop","maxLeft","maxTop"].forEach(e=>{n[e]&&("function"==typeof n[e]&&(n[e]=n[e].call(t,t,n)),(Number.isInteger(n[e])||n[e].match(/^\d+$/))&&(n[e]=`${n[e]}px`))}),n.minLeft){e.style.left=n.minLeft;let o=getComputedStyle(e).left;parseFloat(o)parseFloat(t.left)?e.style.left=t.left:t.left=o}if(n.maxTop){e.style.top=n.maxTop;let o=getComputedStyle(e).top;parseFloat(o)>parseFloat(t.top)?e.style.top=t.top:t.top=o}const o=getComputedStyle(e);return{left:o.left,top:o.top}},applyPositionModify(e,t,n){if(n.modify&&"function"==typeof n.modify){const o=n.modify.call(t,t,n);e.style.left=Number.isInteger(o.left)||o.left.match(/^\d+$/)?`${o.left}px`:o.left,e.style.top=Number.isInteger(o.top)||o.top.match(/^\d+$/)?`${o.top}px`:o.top}const o=getComputedStyle(e);return{left:o.left,top:o.top}},autopositionRemaining(e){let t,n=e.options.container;if(["left-top-down","left-top-right","center-top-down","right-top-down","right-top-left","left-bottom-up","left-bottom-right","center-bottom-up","right-bottom-up","right-bottom-left"].forEach(n=>{e.classList.contains(n)&&(t=n)}),t){("window"===n?document.body:"string"==typeof n?document.querySelector(n):n).querySelectorAll(`.${t}`).forEach(e=>e.reposition())}},getThemeDetails(e){const t=this.pOtheme(e);if(t.color.startsWith("bootstrap-")){let e=t.color.indexOf("-"),n=document.createElement("button");n.className="btn btn"+t.color.slice(e),document.body.appendChild(n),t.color=getComputedStyle(n).backgroundColor.replace(/\s+/gi,""),document.body.removeChild(n),n=void 0}return t.colors=this.calcColors(t.color),t},clearTheme(e,t){return e.content.classList.remove("jsPanel-content-filled","jsPanel-content-filledlight"),e.header.classList.remove("jsPanel-hdr-light"),e.header.classList.remove("jsPanel-hdr-dark"),e.style.backgroundColor="",this.setStyles(e.headertoolbar,{boxShadow:"",width:"",marginLeft:"",borderTopColor:"transparent"}),this.setStyles(e.content,{background:"",borderTopColor:"transparent"}),e.header.style.background="",Array.prototype.slice.call(e.controlbar.querySelectorAll(".jsPanel-icon")).concat([e.headerlogo,e.headertitle,e.headertoolbar,e.content]).forEach(e=>e.style.color=""),t&&t.call(e,e),e},applyColorTheme(e,t){if(e.style.backgroundColor=t.colors[0],e.header.style.backgroundColor=t.colors[0],e.header.style.color=t.colors[3],[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(n=>e.querySelector(n).style.color=t.colors[3]),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>e.style.color=t.colors[3]),"string"==typeof e.options.theme&&"filled"===t.filling&&(e.content.style.borderTop="#000000"===t.colors[3]?"1px solid rgba(0,0,0,0.15)":"1px solid rgba(255,255,255,0.15)"),"#000000"===t.colors[3]?e.header.classList.add("jsPanel-hdr-light"):e.header.classList.add("jsPanel-hdr-dark"),t.filling)switch(t.filling){case"filled":this.setStyles(e.content,{backgroundColor:t.colors[2],color:t.colors[3]});break;case"filledlight":e.content.style.backgroundColor=t.colors[1];break;case"filleddark":this.setStyles(e.content,{backgroundColor:t.colors[6],color:t.colors[7]});break;default:e.content.style.backgroundColor=t.filling,e.content.style.color=this.perceivedBrightness(t.filling)<=this.colorBrightnessThreshold?"#fff":"#000"}return e},applyCustomTheme(e,t){let n={bgPanel:"#ffffff",bgContent:"#ffffff",bgFooter:"#f5f5f5",colorHeader:"#000000",colorContent:"#000000",colorFooter:"#000000",border:void 0,borderRadius:void 0},o="object"==typeof t?Object.assign(n,t):n,a=o.bgPanel,r=o.bgContent,s=o.colorHeader,l=o.colorContent,i=o.bgFooter,d=o.colorFooter;return this.colorNames[a]?e.style.background="#"+this.colorNames[a]:e.style.background=this.getCssVariableValue(a),this.colorNames[s]&&(s="#"+this.colorNames[s]),[".jsPanel-headerlogo",".jsPanel-title",".jsPanel-hdr-toolbar"].forEach(t=>e.querySelector(t).style.color=this.getCssVariableValue(s)),e.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>e.style.color=this.getCssVariableValue(s)),this.colorNames[r]?e.content.style.background="#"+this.colorNames[r]:e.content.style.background=this.getCssVariableValue(r),this.colorNames[l]?e.content.style.color="#"+this.colorNames[l]:e.content.style.color=this.getCssVariableValue(l),this.perceivedBrightness(s)>this.colorBrightnessThreshold?e.header.classList.add("jsPanel-hdr-dark"):e.header.classList.add("jsPanel-hdr-light"),this.perceivedBrightness(l)>this.colorBrightnessThreshold?e.content.style.borderTop="1px solid rgba(255,255,255,0.15)":e.content.style.borderTop="1px solid rgba(0,0,0,0.15)",this.colorNames[i]?e.footer.style.background="#"+this.colorNames[i]:e.footer.style.background=this.getCssVariableValue(i),this.colorNames[d]?e.footer.style.color="#"+this.colorNames[d]:e.footer.style.color=this.getCssVariableValue(d),o.border&&e.setBorder(o.border),o.borderRadius&&(e.options.borderRadius=void 0,e.setBorderRadius(o.borderRadius)),e},getCssVariableValue(e){if(e.startsWith("--"))return getComputedStyle(document.documentElement).getPropertyValue(e).replace(/\s+/g,"");if(e.startsWith("var")){let t=e.slice(e.indexOf("(")+1,e.indexOf(")"));return getComputedStyle(document.documentElement).getPropertyValue(t).replace(/\s+/g,"")}return e},getScrollbarWidth(e=document.body){if(e===document.body)return{y:window.innerWidth-document.documentElement.clientWidth,x:window.innerHeight-document.documentElement.clientHeight};{let t=getComputedStyle(e);return{y:e.offsetWidth-e.clientWidth-parseFloat(t.borderRightWidth)-parseFloat(t.borderLeftWidth),x:e.offsetHeight-e.clientHeight-parseFloat(t.borderBottomWidth)-parseFloat(t.borderTopWidth)}}},remClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.remove(t)),e),setClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.add(t)),e),setStyles(e,t){for(const[n,o]of Object.entries(t))e.style[n]="string"==typeof o?jsPanel.getCssVariableValue(o):o;return e},setStyle(e,t){return this.setStyles.call(e,e,t)},strToHtml:e=>document.createRange().createContextualFragment(e),toggleClass:(e,t)=>(t.trim().split(/\s+/).forEach(t=>e.classList.contains(t)?e.classList.remove(t):e.classList.add(t)),e),emptyNode(e){for(;e.firstChild;)e.removeChild(e.firstChild);return e},addScript(e,t="application/javascript",n){if(!document.querySelector(`script[src="${e}"]`)){const o=document.createElement("script");o.src=e,o.type=t,document.head.appendChild(o),n&&(o.onload=n)}},ajax(e,t){let n,o,a=new XMLHttpRequest;const r={method:"GET",async:!0,user:"",pwd:"",done:function(){if(t){let e=jsPanel.strToHtml(this.responseText);n.urlSelector&&(e=e.querySelector(n.urlSelector)),t.contentRemove(),t.content.append(e)}},autoresize:!0,autoreposition:!0};if(t&&"string"==typeof e)n=Object.assign({},r,{url:e});else{if("object"!=typeof e||!e.url){if(this.errorReporting){let e="XMLHttpRequest seems to miss the url parameter!";jsPanel.errorpanel(e)}return}(n=Object.assign({},r,e)).url=e.url,!1===n.async&&(n.timeout=0,n.withCredentials&&(n.withCredentials=void 0),n.responseType&&(n.responseType=void 0))}o=n.url.trim().split(/\s+/),n.url=encodeURI(o[0]),o.length>1&&(o.shift(),n.urlSelector=o.join(" ")),a.onreadystatechange=(()=>{4===a.readyState&&(200===a.status?t?n.done.call(a,a,t):n.done.call(a,a):n.fail&&(t?n.fail.call(a,a,t):n.fail.call(a,a)),n.always&&(t?n.always.call(a,a,t):n.always.call(a,a)),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n),jsPanel.ajaxAlwaysCallbacks.length&&jsPanel.ajaxAlwaysCallbacks.forEach(e=>{t?e.call(a,a,t):e.call(a,a)}))}),a.open(n.method,n.url,n.async,n.user,n.pwd),a.timeout=n.timeout||0,n.withCredentials&&(a.withCredentials=n.withCredentials),n.responseType&&(a.responseType=n.responseType),n.beforeSend&&(t?n.beforeSend.call(a,a,t):n.beforeSend.call(a,a)),n.data?a.send(n.data):a.send(null)},fetch(e,t){let n;const o={bodyMethod:"text",autoresize:!0,autoreposition:!0,done:function(e,t){if(t){let n=jsPanel.strToHtml(e);t.contentRemove(),t.content.append(n)}}};if(t&&"string"==typeof e)n=Object.assign({},o,{resource:encodeURI(e)});else{if("object"!=typeof e||!e.resource){if(this.errorReporting){let e="Fetch Request seems to miss the resource parameter!";jsPanel.errorpanel(e)}return}(n=Object.assign({},o,e)).resource=encodeURI(e.resource)}const a=n.fetchInit||{};n.beforeSend&&(t?n.beforeSend.call(e,e,t):n.beforeSend.call(e,e)),fetch(n.resource,a).then(e=>{if(e.ok)return e[n.bodyMethod]()}).then(e=>{t?n.done.call(e,e,t):n.done.call(e,e),t&&(n.autoresize||n.autoreposition)&&jsPanel.ajaxAutoresizeAutoreposition(t,n)})},ajaxAutoresizeAutoreposition(e,t){const n=e.options.contentSize;if("string"==typeof n&&n.match(/auto/i)){const o=n.split(" "),a=Object.assign({},{width:o[0],height:o[1]});t.autoresize&&e.resize(a),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}else if("object"==typeof n&&("auto"===n.width||"auto"===n.height)){const o=Object.assign({},n);t.autoresize&&e.resize(o),e.classList.contains("jsPanel-contextmenu")||t.autoreposition&&e.reposition()}},createPanelTemplate(e=!0){const t=document.createElement("div");return t.className="jsPanel",t.style.left="0",t.style.top="0",e&&["close","maximize","normalize","minimize","smallify"].forEach(e=>{t.setAttribute(`data-btn${e}`,"enabled")}),t.innerHTML=`
\n
\n \n
\n
\n
\n
\n \n \n \n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
`,t},createMinimizedTemplate(){const e=document.createElement("div");return e.className="jsPanel-replacement",e.innerHTML=`
\n
\n \n
\n
\n
\n
\n \n \n \n
\n
\n
`,e},createSnapArea(e,t,n){const o=document.createElement("div"),a=e.parentElement;o.className=`jsPanel-snap-area jsPanel-snap-area-${t}`,"lt"===t||"rt"===t||"rb"===t||"lb"===t?(o.style.width=n+"px",o.style.height=n+"px"):"ct"===t||"cb"===t?o.style.height=n+"px":"lc"!==t&&"rc"!==t||(o.style.width=n+"px"),a!==document.body&&(o.style.position="absolute"),document.querySelector(`.jsPanel-snap-area.jsPanel-snap-area-${t}`)||e.parentElement.appendChild(o)},removeSnapAreas(){document.querySelectorAll(".jsPanel-snap-area").forEach(e=>e.parentElement.removeChild(e))},extend(e){if("[object Object]"===Object.prototype.toString.call(e))for(let t in e)Object.prototype.hasOwnProperty.call(e,t)&&(this.extensions[t]=e[t])},getPanels:(e=function(){return this.classList.contains("jsPanel-standard")})=>Array.prototype.slice.call(document.querySelectorAll(".jsPanel")).filter(t=>e.call(t,t)).sort((e,t)=>t.style.zIndex-e.style.zIndex),processCallbacks(e,t,n="some",o,a){if("function"==typeof t&&(t=[t]),n)return t[n](t=>t.call(e,e,o,a));t.forEach(t=>t.call(e,e,o,a))},resetZi(){this.zi=((e=jsPanel.ziBase)=>{let t=e;return{next:()=>t++}})(),Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).sort((e,t)=>e.style.zIndex-t.style.zIndex).forEach(e=>e.style.zIndex=jsPanel.zi.next())},errorpanel(e){this.create({paneltype:"error",dragit:!1,resizeit:!1,theme:{bgPanel:"white",bgContent:"white",colorHeader:"rebeccapurple",colorContent:"#333333",border:"2px solid rebeccapurple"},borderRadius:".33rem",headerControls:"closeonly xs",headerTitle:"⚠ jsPanel Error",contentSize:{width:"50%",height:"auto"},position:"center-top 0 5 down",animateIn:"jsPanelFadeIn",content:`

${e}

`})},create(e={},t){jsPanel.zi||(jsPanel.zi=((e=jsPanel.ziBase)=>{let t=e;return{next:()=>t++}})()),e.config?delete(e=Object.assign({},this.defaults,e.config,e)).config:e=Object.assign({},this.defaults,e),e.id?"function"==typeof e.id&&(e.id=e.id()):e.id=`jsPanel-${jsPanel.idCounter+=1}`;const n=document.getElementById(e.id);if(null!==n){if(n.classList.contains("jsPanel")&&n.front(),this.errorReporting){let t=`◀ COULD NOT CREATE NEW JSPANEL ►
An element with the ID ${e.id} already exists in the document.`;jsPanel.errorpanel(t)}return!1}let o=this.pOcontainer(e.container);if("object"==typeof o&&o.length&&o.length>0&&(o=o[0]),!o){if(this.errorReporting){let e="◀ COULD NOT CREATE NEW JSPANEL ►
The container to append the panel to does not exist";jsPanel.errorpanel(e)}return!1}["onbeforeclose","onbeforemaximize","onbeforeminimize","onbeforenormalize","onbeforesmallify","onbeforeunsmallify","onclosed","onfronted","onmaximized","onminimized","onnormalized","onsmallified","onstatuschange","onunsmallified"].forEach(t=>{e[t]?"function"==typeof e[t]&&(e[t]=[e[t]]):e[t]=[]});const a=e.template||this.createPanelTemplate();a.options=e,a.closetimer=void 0,a.status="initialized",a.currentData={},a.header=a.querySelector(".jsPanel-hdr"),a.headerbar=a.header.querySelector(".jsPanel-headerbar"),a.titlebar=a.header.querySelector(".jsPanel-titlebar"),a.headerlogo=a.headerbar.querySelector(".jsPanel-headerlogo"),a.headertitle=a.headerbar.querySelector(".jsPanel-title"),a.controlbar=a.headerbar.querySelector(".jsPanel-controlbar"),a.headertoolbar=a.header.querySelector(".jsPanel-hdr-toolbar"),a.content=a.querySelector(".jsPanel-content"),a.footer=a.querySelector(".jsPanel-ftr"),a.snappableTo=!1,a.snapped=!1,a.droppableTo=!1,a.progressbar=a.autocloseProgressbar=a.querySelector(".jsPanel-progressbar");const r=new CustomEvent("jspanelloaded",{detail:e.id,cancelable:!0}),s=new CustomEvent("jspanelstatuschange",{detail:e.id,cancelable:!0}),l=new CustomEvent("jspanelbeforenormalize",{detail:e.id,cancelable:!0}),i=new CustomEvent("jspanelnormalized",{detail:e.id,cancelable:!0}),d=new CustomEvent("jspanelbeforemaximize",{detail:e.id,cancelable:!0}),c=new CustomEvent("jspanelmaximized",{detail:e.id,cancelable:!0}),p=new CustomEvent("jspanelbeforeminimize",{detail:e.id,cancelable:!0}),h=new CustomEvent("jspanelminimized",{detail:e.id,cancelable:!0}),f=new CustomEvent("jspanelbeforesmallify",{detail:e.id,cancelable:!0}),u=new CustomEvent("jspanelsmallified",{detail:e.id,cancelable:!0}),m=new CustomEvent("jspanelsmallifiedmax",{detail:e.id,cancelable:!0}),g=new CustomEvent("jspanelbeforeunsmallify",{detail:e.id,cancelable:!0}),b=new CustomEvent("jspanelfronted",{detail:e.id,cancelable:!0}),y=new CustomEvent("jspanelbeforeclose",{detail:e.id,cancelable:!0}),w=new CustomEvent("jspanelclosed",{detail:e.id,cancelable:!0}),v=new CustomEvent("jspanelcloseduser",{detail:e.id,cancelable:!0});[r,s,l,i,d,c,p,h,f,u,m,g,b,y].forEach(e=>e.panel=a);const j=a.querySelector(".jsPanel-btn-close"),E=a.querySelector(".jsPanel-btn-maximize"),x=a.querySelector(".jsPanel-btn-normalize"),C=a.querySelector(".jsPanel-btn-smallify"),P=a.querySelector(".jsPanel-btn-minimize");j&&jsPanel.pointerup.forEach(e=>{j.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}),E&&jsPanel.pointerup.forEach(e=>{E.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.maximize()})}),x&&jsPanel.pointerup.forEach(e=>{x.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.normalize()})}),C&&jsPanel.pointerup.forEach(e=>{C.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;"normalized"===a.status||"maximized"===a.status?a.smallify():"smallified"!==a.status&&"smallifiedmax"!==a.status||a.unsmallify()})}),P&&jsPanel.pointerup.forEach(e=>{P.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.minimize()})});let F=jsPanel.extensions;for(let e in F)Object.prototype.hasOwnProperty.call(F,e)&&(a[e]=F[e]);if(a.setBorder=(e=>{let t=jsPanel.pOborder(e);return t[2].length||(t[2]=a.style.backgroundColor),t=t.join(" "),a.style.border=t,a.options.border=t,a}),a.setBorderRadius=(e=>{"string"==typeof e&&(e.startsWith("--")||e.startsWith("var"))&&(e=e.replace(/\s*\(\s*/g,"(").replace(/\s*\)/g,")").replace(/\s+/g," "),e=jsPanel.getCssVariableValue(e)),"number"==typeof e&&(e+="px"),a.style.borderRadius=e;const t=getComputedStyle(a);return a.options.header?(a.header.style.borderTopLeftRadius=t.borderTopLeftRadius,a.header.style.borderTopRightRadius=t.borderTopRightRadius):(a.content.style.borderTopLeftRadius=t.borderTopLeftRadius,a.content.style.borderTopRightRadius=t.borderTopRightRadius),a.options.footerToolbar?(a.footer.style.borderBottomRightRadius=t.borderBottomRightRadius,a.footer.style.borderBottomLeftRadius=t.borderBottomLeftRadius):(a.content.style.borderBottomRightRadius=t.borderBottomRightRadius,a.content.style.borderBottomLeftRadius=t.borderBottomLeftRadius),a}),a.setTheme=((t=e.theme,n)=>{let o;if("minimized"===a.status&&(o=!0,a.normalize()),jsPanel.clearTheme(a),"object"==typeof t)e.border=void 0,jsPanel.applyCustomTheme(a,t);else if("string"==typeof t){"none"===t&&(t="white");let e=jsPanel.getThemeDetails(t);jsPanel.applyColorTheme(a,e)}return o&&a.minimize(),n&&n.call(a,a),a}),a.remove=((e,t,n)=>{a.parentElement.removeChild(a),document.getElementById(e)?n&&n.call(a,e,a):(a.removeMinimizedReplacement(),a.status="closed",t&&document.dispatchEvent(v),document.dispatchEvent(w),a.options.onclosed&&jsPanel.processCallbacks(a,a.options.onclosed,"every",t),jsPanel.autopositionRemaining(a),n&&n.call(e,e)),window.removeEventListener("resize",a.windowResizeHandler),document.removeEventListener("jspanelresize",a.parentResizeHandler)}),a.close=((e,t)=>{if(a.parentElement){if(a.closetimer&&window.clearInterval(a.closetimer),document.dispatchEvent(y),a.statusBefore=a.status,a.options.onbeforeclose&&a.options.onbeforeclose.length>0&&!jsPanel.processCallbacks(a,a.options.onbeforeclose,"some",a.status,t))return a;a.options.animateOut?(a.options.animateIn&&jsPanel.remClass(a,a.options.animateIn),jsPanel.setClass(a,a.options.animateOut),a.addEventListener("animationend",n=>{n.stopPropagation(),a.remove(a.id,t,e)})):a.remove(a.id,t,e)}}),a.maximize=((t,n)=>{if(a.statusBefore=a.status,e.onbeforemaximize&&e.onbeforemaximize.length>0&&!jsPanel.processCallbacks(a,e.onbeforemaximize,"some",a.statusBefore))return a;document.dispatchEvent(d);const o=a.parentElement,r=jsPanel.pOcontainment(e.maximizedMargin);return o===document.body?(a.style.width=document.documentElement.clientWidth-r[1]-r[3]+"px",a.style.height=document.documentElement.clientHeight-r[0]-r[2]+"px",a.style.left=r[3]+"px",a.style.top=r[0]+"px"):(a.style.width=o.clientWidth-r[1]-r[3]+"px",a.style.height=o.clientHeight-r[0]-r[2]+"px",a.style.left=r[3]+"px",a.style.top=r[0]+"px"),C.style.transform="unset",a.removeMinimizedReplacement(),a.status="maximized",a.setControls([".jsPanel-btn-maximize"]),n||a.front(),document.dispatchEvent(c),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),t&&t.call(a,a,a.statusBefore),e.onmaximized&&jsPanel.processCallbacks(a,e.onmaximized,"every",a.statusBefore),a}),a.minimize=(t=>{if("minimized"===a.status)return a;if(a.statusBefore=a.status,e.onbeforeminimize&&e.onbeforeminimize.length>0&&!jsPanel.processCallbacks(a,e.onbeforeminimize,"some",a.statusBefore))return a;if(document.dispatchEvent(p),!document.getElementById("jsPanel-replacement-container")){const e=document.createElement("div");e.id="jsPanel-replacement-container",document.body.append(e)}if(a.style.left="-9999px",a.status="minimized",document.dispatchEvent(h),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),e.minimizeTo){let t,n,o,r=a.createMinimizedReplacement();switch(e.minimizeTo){case"default":document.getElementById("jsPanel-replacement-container").append(r);break;case"parentpanel":(t=(o=(n=a.closest(".jsPanel-content").parentElement).querySelectorAll(".jsPanel-minimized-box"))[o.length-1]).append(r);break;case"parent":(t=(n=a.parentElement).querySelector(".jsPanel-minimized-container"))||((t=document.createElement("div")).className="jsPanel-minimized-container",n.append(t)),t.append(r);break;default:document.querySelector(e.minimizeTo).append(r)}}return t&&t.call(a,a,a.statusBefore),e.onminimized&&jsPanel.processCallbacks(a,e.onminimized,"every",a.statusBefore),a}),a.normalize=(t=>"normalized"===a.status?a:(a.statusBefore=a.status,e.onbeforenormalize&&e.onbeforenormalize.length>0&&!jsPanel.processCallbacks(a,e.onbeforenormalize,"some",a.statusBefore)?a:(document.dispatchEvent(l),a.style.width=a.currentData.width,a.style.height=a.currentData.height,a.snapped?a.snap(a.snapped,!0):(a.style.left=a.currentData.left,a.style.top=a.currentData.top),C.style.transform="unset",a.removeMinimizedReplacement(),a.status="normalized",a.setControls([".jsPanel-btn-normalize"]),a.front(),document.dispatchEvent(i),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore),t&&t.call(a,a,a.statusBefore),e.onnormalized&&jsPanel.processCallbacks(a,e.onnormalized,"every",a.statusBefore),a))),a.smallify=(t=>{if("smallified"===a.status||"smallifiedmax"===a.status)return a;if(a.statusBefore=a.status,e.onbeforesmallify&&e.onbeforesmallify.length>0&&!jsPanel.processCallbacks(a,e.onbeforesmallify,"some",a.statusBefore))return a;document.dispatchEvent(f),a.style.overflow="hidden";const n=window.getComputedStyle(a),o=parseFloat(window.getComputedStyle(a.headerbar).height);a.style.height=parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth)+o+"px",C.style.transform="rotate(180deg)","normalized"===a.status?(a.setControls([".jsPanel-btn-normalize"]),a.status="smallified",document.dispatchEvent(u),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore)):"maximized"===a.status&&(a.setControls([".jsPanel-btn-maximize"]),a.status="smallifiedmax",document.dispatchEvent(m),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore));const r=a.querySelectorAll(".jsPanel-minimized-box");return r[r.length-1].style.display="none",t&&t.call(a,a,a.statusBefore),e.onsmallified&&jsPanel.processCallbacks(a,e.onsmallified,"every",a.statusBefore),a}),a.unsmallify=(t=>{if(a.statusBefore=a.status,"smallified"===a.status||"smallifiedmax"===a.status){if(e.onbeforeunsmallify&&e.onbeforeunsmallify.length>0&&!jsPanel.processCallbacks(a,e.onbeforeunsmallify,"some",a.statusBefore))return a;document.dispatchEvent(g),a.style.overflow="visible",a.front(),"smallified"===a.status?(a.style.height=a.currentData.height,a.setControls([".jsPanel-btn-normalize"]),a.status="normalized",document.dispatchEvent(i),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every",a.statusBefore)):"smallifiedmax"===a.status?a.maximize():"minimized"===a.status&&a.normalize(),C.style.transform="rotate(0deg)";const n=a.querySelectorAll(".jsPanel-minimized-box");n[n.length-1].style.display="flex",t&&t.call(a,a,a.statusBefore),e.onunsmallified&&jsPanel.processCallbacks(a,e.onunsmallified,"every",a.statusBefore)}return a}),a.front=((t,n=!0)=>{if("minimized"===a.status)"maximized"===a.statusBefore?a.maximize():a.normalize();else{const e=Array.prototype.slice.call(document.querySelectorAll(".jsPanel-standard")).map(e=>e.style.zIndex);Math.max(...e)>a.style.zIndex&&(a.style.zIndex=jsPanel.zi.next()),jsPanel.resetZi()}return document.dispatchEvent(b),t&&t.call(a,a),e.onfronted&&n&&jsPanel.processCallbacks(a,e.onfronted,"every",a.status),a}),a.snap=((e,t=!1)=>{if(t||(a.currentData.beforeSnap={width:a.currentData.width,height:a.currentData.height}),e&&"function"==typeof e&&!t)e.call(a,a,a.snappableTo);else if(!1!==e){let e=[0,0];if(a.options.dragit.snap.containment&&a.options.dragit.containment){const t=jsPanel.pOcontainment(a.options.dragit.containment),n=a.snappableTo;n.startsWith("left")?e[0]=t[3]:n.startsWith("right")&&(e[0]=-t[1]),n.endsWith("top")?e[1]=t[0]:n.endsWith("bottom")&&(e[1]=-t[2])}a.reposition(`${a.snappableTo} ${e[0]} ${e[1]}`)}t||(a.snapped=a.snappableTo)}),a.move=((e,t)=>{let n=a.overlaps(e,"paddingbox"),o=a.parentElement;return e.appendChild(a),a.options.container=e,a.style.left=n.left+"px",a.style.top=n.top+"px",a.saveCurrentDimensions(),a.saveCurrentPosition(),a.calcSizeFactors(),t&&t.call(a,a,e,o),a}),a.closeChildpanels=(e=>(a.getChildpanels().forEach(e=>e.close()),e&&e.call(a,a),a)),a.getChildpanels=(e=>{const t=a.content.querySelectorAll(".jsPanel");return e&&t.forEach((t,n,o)=>{e.call(t,t,n,o)}),t}),a.isChildpanel=(e=>{const t=a.closest(".jsPanel-content"),n=t?t.parentElement:null;return e&&e.call(a,a,n),!!t&&n}),a.contentRemove=(e=>(jsPanel.emptyNode(a.content),e&&e.call(a,a),a)),a.createMinimizedReplacement=(()=>{const t=jsPanel.createMinimizedTemplate(),n=window.getComputedStyle(a.headertitle).color,o=window.getComputedStyle(a),r=e.iconfont,s=t.querySelector(".jsPanel-controlbar");return"auto-show-hide"!==a.options.header?jsPanel.setStyles(t,{backgroundColor:o.backgroundColor,backgroundPositionX:o.backgroundPositionX,backgroundPositionY:o.backgroundPositionY,backgroundRepeat:o.backgroundRepeat,backgroundAttachment:o.backgroundAttachment,backgroundImage:o.backgroundImage,backgroundSize:o.backgroundSize,backgroundOrigin:o.backgroundOrigin,backgroundClip:o.backgroundClip}):t.style.backgroundColor=window.getComputedStyle(a.header).backgroundColor,t.id=a.id+"-min",t.querySelector(".jsPanel-headerbar").replaceChild(a.headerlogo.cloneNode(!0),t.querySelector(".jsPanel-headerlogo")),t.querySelector(".jsPanel-titlebar").replaceChild(a.headertitle.cloneNode(!0),t.querySelector(".jsPanel-title")),t.querySelector(".jsPanel-titlebar").setAttribute("title",a.headertitle.textContent),t.querySelector(".jsPanel-title").style.color=n,s.style.color=n,s.querySelectorAll("button").forEach(e=>e.style.color=n),["jsPanel-hdr-dark","jsPanel-hdr-light"].forEach(e=>{a.header.classList.contains(e)&&t.querySelector(".jsPanel-hdr").classList.add(e)}),a.setIconfont(r,t),"enabled"===a.dataset.btnnormalize?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-normalize").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.normalize()})}):s.querySelector(".jsPanel-btn-normalize").style.display="none","enabled"===a.dataset.btnmaximize?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-maximize").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.maximize()})}):s.querySelector(".jsPanel-btn-maximize").style.display="none","enabled"===a.dataset.btnclose?jsPanel.pointerup.forEach(e=>{t.querySelector(".jsPanel-btn-close").addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}):s.querySelector(".jsPanel-btn-close").style.display="none",t}),a.removeMinimizedReplacement=(()=>{const e=document.getElementById(`${a.id}-min`);e&&e.parentElement.removeChild(e)}),a.drag=((e={})=>{let t,n,o;const r=new CustomEvent("jspaneldragstart",{detail:a.id}),s=new CustomEvent("jspaneldrag",{detail:a.id}),l=new CustomEvent("jspaneldragstop",{detail:a.id});[r,s,l].forEach(e=>e.panel=a);const i=e=>{let t=e.split("-");return t.forEach((e,n)=>{t[n]=e.charAt(0).toUpperCase()+e.slice(1)}),"snap"+t.join("")};function d(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(e=>{document.removeEventListener(e,n,!1),a.style.opacity=1})}let c=e.handles||jsPanel.defaults.dragit.handles,p=e.cursor||jsPanel.defaults.dragit.cursor;function h(e){if(jsPanel.pointermove.forEach(e=>document.removeEventListener(e,n)),jsPanel.removeSnapAreas(),t){if(a.style.opacity=1,t=void 0,o.snap){switch(a.snappableTo){case"left-top":a.snap(o.snap.snapLeftTop);break;case"center-top":a.snap(o.snap.snapCenterTop);break;case"right-top":a.snap(o.snap.snapRightTop);break;case"right-center":a.snap(o.snap.snapRightCenter);break;case"right-bottom":a.snap(o.snap.snapRightBottom);break;case"center-bottom":a.snap(o.snap.snapCenterBottom);break;case"left-bottom":a.snap(o.snap.snapLeftBottom);break;case"left-center":a.snap(o.snap.snapLeftCenter)}o.snap.callback&&a.snappableTo&&"function"==typeof o.snap.callback&&(o.snap.callback.call(a,a),o.snap.repositionOnSnap&&!1!==o.snap[i(a.snappableTo)]&&a.repositionOnSnap(a.snappableTo)),a.snappableTo&&o.snap.repositionOnSnap&&o.snap[i(a.snappableTo)]&&a.repositionOnSnap(a.snappableTo)}if(a.droppableTo&&a.droppableTo){let e=a.parentElement;a.move(a.droppableTo),o.drop.callback&&o.drop.callback.call(a,a,a.droppableTo,e)}if(document.dispatchEvent(l),o.stop.length){let t=window.getComputedStyle(a),n={left:parseFloat(t.left),top:parseFloat(t.top),width:parseFloat(t.width),height:parseFloat(t.height)};jsPanel.processCallbacks(a,o.stop,!1,n,e)}a.saveCurrentPosition(),a.calcSizeFactors()}a.controlbar.style.pointerEvents="inherit",a.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="auto"),document.removeEventListener(e,h)}return a.querySelectorAll(c).forEach(l=>{l.style.touchAction="none",l.style.cursor=p,jsPanel.pointerdown.forEach(i=>{l.addEventListener(i,l=>{if(l.button&&l.button>0)return!1;if((o=Object.assign({},jsPanel.defaults.dragit,e)).disableOnMaximized&&"maximized"===a.status)return!1;if((o.containment||0===o.containment)&&(o.containment=jsPanel.pOcontainment(o.containment)),o.grid&&Array.isArray(o.grid)&&1===o.grid.length&&(o.grid[1]=o.grid[0]),o.snap&&("object"==typeof o.snap?o.snap=Object.assign({},jsPanel.defaultSnapConfig,o.snap):o.snap=jsPanel.defaultSnapConfig),l.target.closest(".jsPanel-ftr-btn"))return;a.controlbar.style.pointerEvents="none",a.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="none");let i=window.getComputedStyle(a),c=parseFloat(i.left),p=parseFloat(i.top),h=parseFloat(i.width),f=parseFloat(i.height),u=l.touches?l.touches[0].clientX:l.clientX,m=l.touches?l.touches[0].clientY:l.clientY,g=a.parentElement,b=g.getBoundingClientRect(),y=window.getComputedStyle(g),w=a.getScaleFactor(),v=0,j=jsPanel.getScrollbarWidth(g);n=(e=>{if(e.preventDefault(),!t){if(document.dispatchEvent(r),a.style.opacity=o.opacity,a.snapped&&o.snap.resizeToPreSnap&&a.currentData.beforeSnap){a.resize(a.currentData.beforeSnap.width+" "+a.currentData.beforeSnap.height),a.setControls([".jsPanel-btn-normalize"]);let e=a.getBoundingClientRect(),t=u-(e.left+e.width),n=e.width/2;t>-n&&(v=t+n)}if(a.front(),a.snapped=!1,"maximized"===a.status&&(a.setControls([".jsPanel-btn-normalize"]),a.status="normalized"),o.drop&&o.drop.dropZones){let e=o.drop.dropZones.map(e=>jsPanel.pOcontainer(e)),t=[];e.forEach(function(e){e.length?e.forEach(function(e){t.push(e)}):t.push(e)}),t=t.filter(function(e,t,n){return n.indexOf(e)===t}),o.drop.dropZones=t}o.start.length&&jsPanel.processCallbacks(a,o.start,!1,{left:c,top:p,width:h,height:f},e)}let n,l,i,d,E,x,C,P,F,z;t=1;let S,A=e.touches?e.touches[0].clientX:e.clientX,k=e.touches?e.touches[0].clientY:e.clientY,B=window.getComputedStyle(a);if(g===document.body){let e=a.getBoundingClientRect();F=window.innerWidth-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(e.left+e.width),z=window.innerHeight-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(e.top+e.height)}else F=parseInt(y.width,10)-parseInt(y.borderLeftWidth,10)-parseInt(y.borderRightWidth,10)-(parseInt(B.left,10)+parseInt(B.width,10)),z=parseInt(y.height,10)-parseInt(y.borderTopWidth,10)-parseInt(y.borderBottomWidth,10)-(parseInt(B.top,10)+parseInt(B.height,10));n=parseFloat(B.left),i=parseFloat(B.top),E=F,C=z,o.snap&&("panel"===o.snap.trigger?(l=n**2,d=i**2,x=E**2,P=C**2):"pointer"===o.snap.trigger&&("window"===a.options.container?(n=A,l=A**2,d=(i=k)**2,x=(E=window.innerWidth-A)**2,P=(C=window.innerHeight-k)**2):(n=(S=a.overlaps(g,"paddingbox",e)).pointer.left,i=S.pointer.top,E=S.pointer.right,C=S.pointer.bottom,l=S.pointer.left**2,d=S.pointer.top**2,x=S.pointer.right**2,P=S.pointer.bottom**2)));let T=Math.sqrt(l+d),L=Math.sqrt(l+P),R=Math.sqrt(x+d),W=Math.sqrt(x+P),D=Math.abs(n-E)/2,$=Math.abs(i-C)/2,q=Math.sqrt(l+$**2),O=Math.sqrt(d+D**2),H=Math.sqrt(x+$**2),M=Math.sqrt(P+D**2);if(window.getSelection().removeAllRanges(),document.dispatchEvent(s),o.axis&&"x"!==o.axis||(a.style.left=c+(A-u)/w.x+v+"px"),o.axis&&"y"!==o.axis||(a.style.top=p+(k-m)/w.y+"px"),o.grid){let e=o.grid,t=o.axis,n=e[0]*Math.round((c+(A-u))/e[0]),r=e[1]*Math.round((p+(k-m))/e[1]);t&&"x"!==t||(a.style.left=`${n}px`),t&&"y"!==t||(a.style.top=`${r}px`)}if(o.containment||0===o.containment){let e,t,n=o.containment;if("window"===a.options.container)e=window.innerWidth-parseFloat(B.width)-n[1]-j.y,t=window.innerHeight-parseFloat(B.height)-n[2]-j.x;else{let o=parseFloat(y.borderLeftWidth)+parseFloat(y.borderRightWidth),a=parseFloat(y.borderTopWidth)+parseFloat(y.borderBottomWidth);e=b.width/w.x-parseFloat(B.width)-n[1]-o-j.y,t=b.height/w.y-parseFloat(B.height)-n[2]-a-j.x}parseFloat(a.style.left)<=n[3]&&(a.style.left=n[3]+"px"),parseFloat(a.style.top)<=n[0]&&(a.style.top=n[0]+"px"),parseFloat(a.style.left)>=e&&(a.style.left=e+"px"),parseFloat(a.style.top)>=t&&(a.style.top=t+"px")}if(o.drag.length){let t={left:n,top:i,right:E,bottom:C,width:parseFloat(B.width),height:parseFloat(B.height)};jsPanel.processCallbacks(a,o.drag,!1,t,e)}if(o.snap){let e=o.snap.sensitivity,t=g===document.body?window.innerWidth/8:b.width/8,r=g===document.body?window.innerHeight/8:b.height/8;a.snappableTo=!1,jsPanel.removeSnapAreas(),T0&&S.pointer.top>0?(a.snappableTo="left-top",jsPanel.createSnapArea(a,"lt",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-top",jsPanel.createSnapArea(a,"lt",e))):L0&&S.pointer.bottom>0?(a.snappableTo="left-bottom",jsPanel.createSnapArea(a,"lb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-bottom",jsPanel.createSnapArea(a,"lb",e))):R0&&S.pointer.top>0?(a.snappableTo="right-top",jsPanel.createSnapArea(a,"rt",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-top",jsPanel.createSnapArea(a,"rt",e))):W0&&S.pointer.bottom>0?(a.snappableTo="right-bottom",jsPanel.createSnapArea(a,"rb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-bottom",jsPanel.createSnapArea(a,"rb",e))):i0?(a.snappableTo="center-top",jsPanel.createSnapArea(a,"ct",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="center-top",jsPanel.createSnapArea(a,"ct",e))):n0?(a.snappableTo="left-center",jsPanel.createSnapArea(a,"lc",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="left-center",jsPanel.createSnapArea(a,"lc",e))):E0?(a.snappableTo="right-center",jsPanel.createSnapArea(a,"rc",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="right-center",jsPanel.createSnapArea(a,"rc",e))):C0?(a.snappableTo="center-bottom",jsPanel.createSnapArea(a,"cb",e)):(a.snappableTo=!1,jsPanel.removeSnapAreas())):(a.snappableTo="center-bottom",jsPanel.createSnapArea(a,"cb",e)))}if(o.drop&&o.drop.dropZones){let t=jsPanel.isIE?"msElementsFromPoint":"elementsFromPoint",n=document[t](e.clientX,e.clientY);Array.isArray(n)||(n=Array.prototype.slice.call(n)),o.drop.dropZones.forEach(e=>{n.includes(e)&&(a.droppableTo=e)}),n.includes(a.droppableTo)||(a.droppableTo=!1)}}),jsPanel.pointermove.forEach(e=>document.addEventListener(e,n)),window.addEventListener("mouseout",d,!1)})}),jsPanel.pointerup.forEach(e=>{document.addEventListener(e,h),window.removeEventListener("mouseout",d)}),e.disable&&(l.style.pointerEvents="none")}),a}),a.dragit=(t=>{const n=Object.assign({},jsPanel.defaults.dragit,e.dragit),o=a.querySelectorAll(n.handles);return"disable"===t?o.forEach(e=>e.style.pointerEvents="none"):o.forEach(e=>e.style.pointerEvents="auto"),a}),a.sizeit=((e={})=>{const t=new CustomEvent("jspanelresizestart",{detail:a.id}),n=new CustomEvent("jspanelresize",{detail:a.id}),o=new CustomEvent("jspanelresizestop",{detail:a.id});[t,n,o].forEach(e=>e.panel=a);let r,s,l,i,d,c,p={};p.handles=e.handles||jsPanel.defaults.resizeit.handles,p.handles.split(",").forEach(e=>{const t=document.createElement("DIV");t.className=`jsPanel-resizeit-handle jsPanel-resizeit-${e.trim()}`,a.append(t)});let h=!!e.aspectRatio&&e.aspectRatio;function f(e){null===e.relatedTarget&&jsPanel.pointermove.forEach(e=>document.removeEventListener(e,r,!1))}function u(e){if(jsPanel.pointermove.forEach(e=>document.removeEventListener(e,r,!1)),e.target.classList&&e.target.classList.contains("jsPanel-resizeit-handle")){let t,n,o=e.target.className;if(o.match(/jsPanel-resizeit-nw|jsPanel-resizeit-w|jsPanel-resizeit-sw/i)&&(t=!0),o.match(/jsPanel-resizeit-nw|jsPanel-resizeit-n|jsPanel-resizeit-ne/i)&&(n=!0),p.grid&&Array.isArray(p.grid)){1===p.grid.length&&(p.grid[1]=p.grid[0]);const e=parseFloat(a.style.width),o=parseFloat(a.style.height),r=e%p.grid[0],s=o%p.grid[1],l=parseFloat(a.style.left),i=parseFloat(a.style.top),d=l%p.grid[0],c=i%p.grid[1];rc+5&&(t.style.transform="rotate(0deg)"),document.dispatchEvent(o),p.stop.length){let t=window.getComputedStyle(a),n={left:parseFloat(t.left),top:parseFloat(t.top),width:parseFloat(t.width),height:parseFloat(t.height)};jsPanel.processCallbacks(a,p.stop,!1,n,e)}}a.content.style.pointerEvents="inherit",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="auto"),p.aspectRatio=h,document.removeEventListener(e,u)}return a.querySelectorAll(".jsPanel-resizeit-handle").forEach(o=>{o.style.touchAction="none",jsPanel.pointerdown.forEach(h=>{o.addEventListener(h,o=>{if(o.preventDefault(),o.stopPropagation(),o.button&&o.button>0)return!1;let h=1;if(((p=Object.assign({},jsPanel.defaults.resizeit,e)).containment||0===p.containment)&&(p.containment=jsPanel.pOcontainment(p.containment)),p.aspectRatio&&!0===p.aspectRatio&&(p.aspectRatio="panel"),jsPanel.modifier){let e=jsPanel.modifier;e.altKey?p.aspectRatio="content":e.ctrlKey?p.aspectRatio="panel":e.shiftKey&&(p.aspectRatio=!1,h=2)}let u="function"==typeof p.maxWidth?p.maxWidth():p.maxWidth||1e4,m="function"==typeof p.maxHeight?p.maxHeight():p.maxHeight||1e4,g="function"==typeof p.minWidth?p.minWidth():p.minWidth,b="function"==typeof p.minHeight?p.minHeight():p.minHeight;a.content.style.pointerEvents="none",document.querySelectorAll("iframe").forEach(e=>e.style.pointerEvents="none");const y=a.parentElement,w=y.tagName.toLowerCase(),v=a.getBoundingClientRect(),j=y.getBoundingClientRect(),E=window.getComputedStyle(y,null),x=parseInt(E.borderLeftWidth,10),C=parseInt(E.borderTopWidth,10),P=E.getPropertyValue("position"),F=o.clientX||0===o.clientX||o.touches[0].clientX,z=o.clientY||0===o.clientY||o.touches[0].clientY,S=F/z,A=o.target.classList,k=a.getScaleFactor(),B=v.width/v.height,T=a.content.getBoundingClientRect(),L=T.width/T.height,R=a.header.getBoundingClientRect().height,W=a.footer.getBoundingClientRect().height||0;let D=v.left,$=v.top,q=1e4,O=1e4,H=1e4,M=1e4;d=v.width,c=v.height,"body"!==w&&(D=v.left-j.left+y.scrollLeft,$=v.top-j.top+y.scrollTop),"body"===w&&p.containment?(q=document.documentElement.clientWidth-v.left,H=document.documentElement.clientHeight-v.top,O=v.width+v.left,M=v.height+v.top):p.containment&&("static"===P?(q=j.width-v.left+x,H=j.height+j.top-v.top+C,O=v.width+(v.left-j.left)-x,M=v.height+(v.top-j.top)-C):(q=y.clientWidth-(v.left-j.left)/k.x+x,H=y.clientHeight-(v.top-j.top)/k.y+C,O=(v.width+v.left-j.left)/k.x-x,M=a.clientHeight+(v.top-j.top)/k.y-C)),p.containment&&(O-=p.containment[3],M-=p.containment[0],q-=p.containment[1],H-=p.containment[2]);const I=window.getComputedStyle(a),N=parseFloat(I.width)-v.width,V=parseFloat(I.height)-v.height;let X=parseFloat(I.left)-v.left,Y=parseFloat(I.top)-v.top;y!==document.body&&(X+=j.left,Y+=j.top);let Z=parseInt(I.borderTopWidth,10),U=parseInt(I.borderRightWidth,10),K=parseInt(I.borderBottomWidth,10),_=parseInt(I.borderLeftWidth,10);r=(e=>{e.preventDefault(),s||(document.dispatchEvent(t),p.start.length&&jsPanel.processCallbacks(a,p.start,!1,{width:d,height:c,left:D,top:$},e),a.front(),"maximized"===a.status&&(a.status="normalized",a.controlbar.querySelector(".jsPanel-btn-maximize")&&a.setControlStatus("maximize","show"),a.controlbar.querySelector(".jsPanel-btn-normalize")&&a.setControlStatus("normalize","hide")),v.height>c+5&&(a.status="normalized",a.setControls([".jsPanel-btn-normalize"]))),s=1,document.dispatchEvent(n);let o,r=e.touches?e.touches[0].clientX:e.clientX,f=e.touches?e.touches[0].clientY:e.clientY;A.contains("jsPanel-resizeit-e")?((l=d+(r-F)*h/k.x+N)>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(r-F)+"px"),"content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-s")?((i=c+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),"content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/B+"px"))):A.contains("jsPanel-resizeit-w")?((l=d+(F-r)*h/k.x+N)<=u&&l>=g&&l<=O&&(a.style.left=D+(r-F)/k.x+X+"px"),l>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px","content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-n")?((i=c+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/B+"px"))):A.contains("jsPanel-resizeit-se")?((l=d+(r-F)*h/k.x+N)>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(r-F)+"px"),p.aspectRatio&&(a.style.height=l/B+"px"),(i=c+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),"content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/B+"px"))):A.contains("jsPanel-resizeit-sw")?((i=c+(f-z)*h/k.y+V)>=H&&(i=H),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px",2===h&&(a.style.top=$-(f-z)+"px"),p.aspectRatio&&(a.style.width=i*B+"px"),(l=d+(F-r)*h/k.x+N)<=u&&l>=g&&l<=O&&(a.style.left=D+(r-F)/k.x+X+"px"),l>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px","content"===p.aspectRatio?(a.style.height=(l-U-_)/L+R+W+Z+K+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*L+"px")):"panel"===p.aspectRatio&&(a.style.height=l/B+"px",p.containment&&(o=a.overlaps(y)).bottom<=p.containment[2]&&(a.style.height=H+"px",a.style.width=H*B+"px"))):A.contains("jsPanel-resizeit-ne")?((l=d+(r-F)*h/k.x+N)>=q&&(l=q),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",2===h&&(a.style.left=D-(r-F)+"px"),p.aspectRatio&&(a.style.height=l/B+"px"),(i=c+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?(a.style.width=(i-R-W-Z-K)*L+Z+K+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/L+"px")):"panel"===p.aspectRatio&&(a.style.width=i*B+"px",p.containment&&(o=a.overlaps(y)).right<=p.containment[1]&&(a.style.width=q+"px",a.style.height=q/B+"px"))):A.contains("jsPanel-resizeit-nw")&&(p.aspectRatio&&A.contains("jsPanel-resizeit-nw")&&(f=(r=f*S)/S),(l=d+(F-r)*h/k.x+N)<=u&&l>=g&&l<=O&&(a.style.left=D+(r-F)/k.x+X+"px"),l>=O&&(l=O),l>=u&&(l=u),l<=g&&(l=g),a.style.width=l+"px",p.aspectRatio&&(a.style.height=l/B+"px"),(i=c+(z-f)*h/k.y+V)<=m&&i>=b&&i<=M&&(a.style.top=$+(f-z)/k.y+Y+"px"),i>=M&&(i=M),i>=m&&(i=m),i<=b&&(i=b),a.style.height=i+"px","content"===p.aspectRatio?a.style.width=(i-R-W-Z-K)*L+Z+K+"px":"panel"===p.aspectRatio&&(a.style.width=i*B+"px")),window.getSelection().removeAllRanges();const w=window.getComputedStyle(a),j={left:parseFloat(w.left),top:parseFloat(w.top),right:parseFloat(w.right),bottom:parseFloat(w.bottom),width:parseFloat(w.width),height:parseFloat(w.height)};p.resize.length&&jsPanel.processCallbacks(a,p.resize,!1,j,e)}),jsPanel.pointermove.forEach(e=>document.addEventListener(e,r,!1)),window.addEventListener("mouseout",f,!1)})}),jsPanel.pointerup.forEach(function(e){document.addEventListener(e,u),window.removeEventListener("mouseout",f)}),e.disable&&(o.style.pointerEvents="none")}),a}),a.resizeit=(e=>{const t=a.querySelectorAll(".jsPanel-resizeit-handle");return"disable"===e?t.forEach(e=>e.style.pointerEvents="none"):t.forEach(e=>e.style.pointerEvents="auto"),a}),a.getScaleFactor=(()=>{const e=a.getBoundingClientRect();return{x:e.width/a.offsetWidth,y:e.height/a.offsetHeight}}),a.calcSizeFactors=(()=>{const t=window.getComputedStyle(a);if("window"===e.container)a.hf=parseFloat(t.left)/(window.innerWidth-parseFloat(t.width)),a.vf=parseFloat(t.top)/(window.innerHeight-parseFloat(t.height));else if(a.parentElement){let e=a.parentElement.getBoundingClientRect();a.hf=parseFloat(t.left)/(e.width-parseFloat(t.width)),a.vf=parseFloat(t.top)/(e.height-parseFloat(t.height))}}),a.saveCurrentDimensions=(()=>{const e=window.getComputedStyle(a);a.currentData.width=e.width,a.currentData.height=e.height}),a.saveCurrentPosition=(()=>{const e=window.getComputedStyle(a);a.currentData.left=e.left,a.currentData.top=e.top}),a.reposition=((...t)=>{let n,o=e.position,r=!0;return t.forEach(e=>{"string"==typeof e||"object"==typeof e?o=e:"boolean"==typeof e?r=e:"function"==typeof e&&(n=e)}),jsPanel.position(a,o),a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition()),r&&a.saveCurrentPosition(),n&&n.call(a,a),a}),a.repositionOnSnap=(t=>{let n="0",o="0",r=jsPanel.pOcontainment(e.dragit.containment);if(e.dragit.snap.containment)switch(t){case"left-top":n=r[3],o=r[0];break;case"right-top":n=-r[1],o=r[0];break;case"right-bottom":n=-r[1],o=-r[2];break;case"left-bottom":n=r[3],o=-r[2];break;case"center-top":n=r[3]/2-r[1]/2,o=r[0];break;case"center-bottom":n=r[3]/2-r[1]/2,o=-r[2];break;case"left-center":n=r[3],o=r[0]/2-r[2]/2;break;case"right-center":n=-r[1],o=r[0]/2-r[2]/2}jsPanel.position(a,t),jsPanel.setStyles(a,{left:`calc(${a.style.left} + ${n}px)`,top:`calc(${a.style.top} + ${o}px)`})}),a.overlaps=((e,t,n)=>{let o,r=a.getBoundingClientRect(),s=getComputedStyle(a.parentElement),l=a.getScaleFactor(),i={top:0,right:0,bottom:0,left:0},d=0,c=0,p=0,h=0;"window"!==a.options.container&&"paddingbox"===t&&(i.top=parseInt(s.borderTopWidth,10)*l.y,i.right=parseInt(s.borderRightWidth,10)*l.x,i.bottom=parseInt(s.borderBottomWidth,10)*l.y,i.left=parseInt(s.borderLeftWidth,10)*l.x),o="string"==typeof e?"window"===e?{left:0,top:0,right:window.innerWidth,bottom:window.innerHeight}:"parent"===e?a.parentElement.getBoundingClientRect():document.querySelector(e).getBoundingClientRect():e.getBoundingClientRect(),n&&(d=n.touches?n.touches[0].clientX:n.clientX,c=n.touches?n.touches[0].clientY:n.clientY,p=d-o.left,h=c-o.top);let f=r.lefto.left,u=r.topo.top;return{overlaps:f&&u,top:r.top-o.top-i.top,right:o.right-r.right-i.right,bottom:o.bottom-r.bottom-i.bottom,left:r.left-o.left-i.left,parentBorderWidth:i,panelRect:r,referenceRect:o,pointer:{clientX:d,clientY:c,left:p-i.left,top:h-i.top,right:o.width-p-i.right,bottom:o.height-h-i.bottom}}}),a.setSize=(()=>{if(e.panelSize){const t=jsPanel.pOsize(a,e.panelSize);a.style.width=t.width,a.style.height=t.height}else if(e.contentSize){const t=jsPanel.pOsize(a,e.contentSize);a.content.style.width=t.width,a.content.style.height=t.height,a.style.width=t.width,a.content.style.width="100%"}return a}),a.resize=((...e)=>{let t,n=window.getComputedStyle(a),o={width:n.width,height:n.height},r=!0;e.forEach(e=>{"string"==typeof e?o=e:"object"==typeof e?o=Object.assign(o,e):"boolean"==typeof e?r=e:"function"==typeof e&&(t=e)});let s=jsPanel.pOsize(a,o);a.style.width=s.width,a.style.height=s.height,a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition()),r&&a.saveCurrentDimensions(),a.status="normalized";let l=a.controlbar.querySelector(".jsPanel-btn-smallify");return l&&(l.style.transform="rotate(0deg)"),t&&t.call(a,a),a.calcSizeFactors(),a}),a.windowResizeHandler=(t=>{if(t.target===window){let n,o,r=a.status,s=e.onwindowresize;if("maximized"===r&&s)a.maximize(!1,!0);else if(a.snapped&&"minimized"!==r)a.snap(a.snapped,!0);else if("normalized"===r||"smallified"===r||"maximized"===r){let e=typeof s;"boolean"===e?(n=(window.innerWidth-a.offsetWidth)*a.hf,a.style.left=n<=0?0:n+"px",o=(window.innerHeight-a.offsetHeight)*a.vf,a.style.top=o<=0?0:o+"px"):"function"===e?s.call(a,t,a):"object"===e&&(!0===s.preset?(n=(window.innerWidth-a.offsetWidth)*a.hf,a.style.left=n<=0?0:n+"px",o=(window.innerHeight-a.offsetHeight)*a.vf,a.style.top=o<=0?0:o+"px",s.callback.call(a,t,a)):s.callback.call(a,t,a))}else"smallifiedmax"===r&&s&&a.maximize(!1,!0).smallify();a.slaves&&a.slaves.size>0&&a.slaves.forEach(e=>e.reposition())}}),a.setControls=((e,t)=>(a.header.querySelectorAll(".jsPanel-btn").forEach(e=>{const t=e.className.split("-"),n=t[t.length-1];"hidden"!==a.getAttribute(`data-btn${n}`)&&(e.style.display="block")}),e.forEach(e=>{const t=a.controlbar.querySelector(e);t&&(t.style.display="none")}),t&&t.call(a,a),a)),a.setControlStatus=((e,t="enable",n)=>{const o=a.controlbar.querySelector(`.jsPanel-btn-${e}`);switch(t){case"disable":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"disabled"),o.style.pointerEvents="none",o.style.opacity=.4,o.style.cursor="default");break;case"hide":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"hidden"),o.style.display="none");break;case"show":"removed"!==a.getAttribute(`data-btn${e}`)&&(a.setAttribute(`data-btn${e}`,"enabled"),o.style.display="block",o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"enable":"removed"!==a.getAttribute(`data-btn${e}`)&&("hidden"===a.getAttribute(`data-btn${e}`)&&(o.style.display="block"),a.setAttribute(`data-btn${e}`,"enabled"),o.style.pointerEvents="auto",o.style.opacity=1,o.style.cursor="pointer");break;case"remove":a.controlbar.removeChild(o),a.setAttribute(`data-btn${e}`,"removed")}return n&&n.call(a,a),a}),a.setControlSize=(e=>{const t=e.toLowerCase();a.controlbar.querySelectorAll(".jsPanel-btn").forEach(e=>{["jsPanel-btn-xl","jsPanel-btn-lg","jsPanel-btn-md","jsPanel-btn-sm","jsPanel-btn-xs"].forEach(t=>e.classList.remove(t)),e.classList.add(`jsPanel-btn-${t}`)}),"xl"===t?a.titlebar.style.fontSize="1.5rem":"lg"===t?a.titlebar.style.fontSize="1.25rem":"md"===t?a.titlebar.style.fontSize="1.05rem":"sm"===t?a.titlebar.style.fontSize=".9rem":"xs"===t&&(a.titlebar.style.fontSize=".8rem")}),a.setHeaderControls=(t=>{if(a.options.headerControls.add){let e=a.options.headerControls.add;Array.isArray(e)||(e=[e]),e.forEach(e=>a.addControl(e))}let n=[];a.controlbar.querySelectorAll(".jsPanel-btn").forEach(e=>{let t=e.className.match(/jsPanel-btn-[a-z\d]{3,}/i)[0].substring(12);n.push(t)});const o=jsPanel.pOheaderControls(e.headerControls);return e.headerControls=o,n.forEach(e=>{o[e]&&a.setControlStatus(e,o[e])}),a.setControlSize(o.size),t&&t.call(a,a),a}),a.setHeaderLogo=((e,t)=>{let n=[a.headerlogo],o=document.querySelector("#"+a.id+"-min");return o&&n.push(o.querySelector(".jsPanel-headerlogo")),"string"==typeof e?e.startsWith("<")?n.forEach(t=>t.innerHTML=e):n.forEach(t=>{jsPanel.emptyNode(t);let n=document.createElement("img");n.src=e,t.append(n)}):n.forEach(t=>{jsPanel.emptyNode(t),t.append(e)}),a.headerlogo.childNodes.forEach(e=>{e.nodeName&&"IMG"===e.nodeName&&e.setAttribute("draggable","false")}),t&&t.call(a,a),a}),a.setHeaderRemove=(e=>(a.removeChild(a.header),a.content.classList.add("jsPanel-content-noheader"),["close","maximize","normalize","minimize","smallify"].forEach(e=>a.setAttribute(`data-btn${e}`,"removed")),e&&e.call(a,a),a)),a.setHeaderTitle=((e,t)=>{let n=[a.headertitle],o=document.querySelector("#"+a.id+"-min");return o&&n.push(o.querySelector(".jsPanel-title")),"string"==typeof e?n.forEach(t=>t.innerHTML=e):"function"==typeof e?n.forEach(t=>{jsPanel.emptyNode(t),t.innerHTML=e()}):n.forEach(t=>{jsPanel.emptyNode(t),t.append(e)}),t&&t.call(a,a),a}),a.setIconfont=((e,t=a,n)=>{if(e){let n,o;if("fa"===e||"far"===e||"fal"===e||"fas"===e||"fad"===e)n=[`${e} fa-window-close`,`${e} fa-window-maximize`,`${e} fa-window-restore`,`${e} fa-window-minimize`,`${e} fa-chevron-up`];else if("material-icons"===e)n=[e,e,e,e,e,e],o=["close","fullscreen","fullscreen_exit","call_received","expand_less"];else if(Array.isArray(e))n=[`custom-control-icon ${e[4]}`,`custom-control-icon ${e[3]}`,`custom-control-icon ${e[2]}`,`custom-control-icon ${e[1]}`,`custom-control-icon ${e[0]}`];else{if("bootstrap"!==e&&"glyphicon"!==e)return t;n=["glyphicon glyphicon-remove","glyphicon glyphicon-fullscreen","glyphicon glyphicon-resize-full","glyphicon glyphicon-minus","glyphicon glyphicon-chevron-up"]}t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn").forEach(e=>jsPanel.emptyNode(e).innerHTML=""),Array.prototype.slice.call(t.querySelectorAll(".jsPanel-controlbar .jsPanel-btn > span")).reverse().forEach((t,a)=>{t.className=n[a],"material-icons"===e&&(t.textContent=o[a])})}return n&&n.call(t,t),t}),a.addToolbar=((e,t,n)=>{if("header"===e?e=a.headertoolbar:"footer"===e&&(e=a.footer),"string"==typeof t)e.innerHTML=t;else if(Array.isArray(t))t.forEach(t=>{"string"==typeof t?e.innerHTML+=t:e.append(t)});else if("function"==typeof t){let n=t.call(a,a);"string"==typeof n?e.innerHTML=n:e.append(n)}else e.append(t);return e.classList.add("active"),n&&n.call(a,a),a}),a.addCloseControl=(()=>{let e=document.createElement("button"),t=a.content.style.color;return e.classList.add("jsPanel-addCloseCtrl"),e.innerHTML=jsPanel.icons.close,e.style.color=t,a.options.rtl&&e.classList.add("rtl"),a.appendChild(e),jsPanel.pointerup.forEach(t=>{e.addEventListener(t,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;a.close(null,!0)})}),jsPanel.pointerdown.forEach(t=>{e.addEventListener(t,e=>e.preventDefault())}),a}),a.addControl=(t=>{if(!t.html)return a;t.position||(t.position=1);const n=a.controlbar.querySelectorAll(".jsPanel-btn").length;let o=document.createElement("button");o.innerHTML=t.html,o.className=`jsPanel-btn jsPanel-btn-${t.name} jsPanel-btn-${e.headerControls.size}`,o.style.color=a.header.style.color,t.position>n?a.controlbar.append(o):a.controlbar.insertBefore(o,a.querySelector(`.jsPanel-controlbar .jsPanel-btn:nth-child(${t.position})`));const r=t.ariaLabel||t.name;return r&&o.setAttribute("aria-label",r),jsPanel.pointerup.forEach(e=>{o.addEventListener(e,e=>{if(e.preventDefault(),e.button&&e.button>0)return!1;t.handler.call(a,a,o)})}),t.afterInsert&&t.afterInsert.call(o,o),a}),a.setRtl=(()=>{[a.header,a.content,a.footer].forEach(t=>{t.dir="rtl",e.rtl.lang&&(t.lang=e.rtl.lang)})}),a.id=e.id,a.classList.add("jsPanel-"+e.paneltype),"standard"===e.paneltype&&(a.style.zIndex=this.zi.next()),o.append(a),a.front(!1,!1),a.setTheme(e.theme),e.boxShadow&&a.classList.add(`jsPanel-depth-${e.boxShadow}`),e.header){if(e.headerLogo&&a.setHeaderLogo(e.headerLogo),a.setIconfont(e.iconfont),a.setHeaderTitle(e.headerTitle),a.setHeaderControls(),jsPanel.isIE){let e=[a.headerbar,a.controlbar];switch(a.options.headerControls.size){case"md":e.forEach(e=>{e.style.height="34px"});break;case"xs":e.forEach(e=>{e.style.height="26px"});break;case"sm":e.forEach(e=>{e.style.height="30px"});break;case"lg":e.forEach(e=>{e.style.height="38px"});break;case"xl":e.forEach(e=>{e.style.height="42px"})}}if("auto-show-hide"===e.header){let t="jsPanel-depth-"+e.boxShadow;a.header.style.opacity=0,a.style.backgroundColor="transparent",this.remClass(a,t),this.setClass(a.content,t),a.header.addEventListener("mouseenter",()=>{a.header.style.opacity=1,jsPanel.setClass(a,t),jsPanel.remClass(a.content,t)}),a.header.addEventListener("mouseleave",()=>{a.header.style.opacity=0,jsPanel.remClass(a,t),jsPanel.setClass(a.content,t)})}}else a.setHeaderRemove(),e.addCloseControl&&a.addCloseControl();if(e.headerToolbar&&a.addToolbar(a.headertoolbar,e.headerToolbar),e.footerToolbar&&a.addToolbar(a.footer,e.footerToolbar),e.border&&a.setBorder(e.border),e.borderRadius&&a.setBorderRadius(e.borderRadius),e.css)for(const[t,n]of Object.entries(e.css))if("panel"===t)a.className+=` ${n}`;else{let e=a.querySelector(`.jsPanel-${t}`);e&&(e.className+=` ${n}`)}if(e.content&&("function"==typeof e.content?e.content.call(a,a):"string"==typeof e.content?a.content.innerHTML=e.content:a.content.append(e.content)),e.contentAjax&&this.ajax(e.contentAjax,a),e.contentFetch&&this.fetch(e.contentFetch,a),e.contentOverflow){const t=e.contentOverflow.split(" ");1===t.length?a.content.style.overflow=t[0]:2===t.length&&(a.content.style.overflowX=t[0],a.content.style.overflowY=t[1])}if(e.autoclose){"number"==typeof e.autoclose?e.autoclose={time:e.autoclose+"ms"}:"string"==typeof e.autoclose&&(e.autoclose={time:e.autoclose});let t=Object.assign({},jsPanel.defaultAutocloseConfig,e.autoclose);t.time&&"number"==typeof t.time&&(t.time+="ms");let n=a.progressbar.querySelector("div");n.addEventListener("animationend",e=>{e.stopPropagation(),a.progressbar.classList.remove("active"),a.close()}),t.progressbar&&(a.progressbar.classList.add("active"),t.background?jsPanel.colorNames[t.background]?a.progressbar.style.background="#"+jsPanel.colorNames[t.background]:a.progressbar.style.background=t.background:a.progressbar.classList.add("success-bg")),n.style.animation=`${t.time} progressbar`}if(e.rtl&&a.setRtl(),a.setSize(),a.status="normalized",e.position?this.position(a,e.position):a.style.opacity=1,document.dispatchEvent(i),a.calcSizeFactors(),e.animateIn&&(a.addEventListener("animationend",()=>{this.remClass(a,e.animateIn)}),this.setClass(a,e.animateIn)),e.syncMargins){let t=this.pOcontainment(e.maximizedMargin);e.dragit&&(e.dragit.containment=t,!0===e.dragit.snap?(e.dragit.snap=jsPanel.defaultSnapConfig,e.dragit.snap.containment=!0):e.dragit.snap&&(e.dragit.snap.containment=!0)),e.resizeit&&(e.resizeit.containment=t)}if(e.dragit?(["start","drag","stop"].forEach(t=>{e.dragit[t]?"function"==typeof e.dragit[t]&&(e.dragit[t]=[e.dragit[t]]):e.dragit[t]=[]}),a.drag(e.dragit),a.addEventListener("jspaneldragstop",e=>{e.panel===a&&a.calcSizeFactors()},!1)):a.titlebar.style.cursor="default",e.resizeit){["start","resize","stop"].forEach(t=>{e.resizeit[t]?"function"==typeof e.resizeit[t]&&(e.resizeit[t]=[e.resizeit[t]]):e.resizeit[t]=[]}),a.sizeit(e.resizeit);let t=void 0;a.addEventListener("jspanelresizestart",e=>{e.panel===a&&(t=a.status)},!1),a.addEventListener("jspanelresizestop",n=>{n.panel===a&&("smallified"===t||"smallifiedmax"===t||"maximized"===t)&&parseFloat(a.style.height)>parseFloat(window.getComputedStyle(a.header).height)&&(a.setControls([".jsPanel-btn-normalize"]),a.status="normalized",document.dispatchEvent(i),document.dispatchEvent(s),e.onstatuschange&&jsPanel.processCallbacks(a,e.onstatuschange,"every"),a.calcSizeFactors())},!1)}if(a.saveCurrentDimensions(),a.saveCurrentPosition(),e.setStatus&&("smallifiedmax"===e.setStatus?a.maximize().smallify():"smallified"===e.setStatus?a.smallify():a[e.setStatus.slice(0,-1)]()),this.pointerdown.forEach(t=>{a.addEventListener(t,t=>{t.target.closest(".jsPanel-btn-close")||t.target.closest(".jsPanel-btn-minimize")||"standard"!==e.paneltype||a.front()},!1)}),e.onwindowresize&&"window"===a.options.container&&window.addEventListener("resize",a.windowResizeHandler,!1),e.onparentresize){let t=e.onparentresize,n=typeof t,o=a.isChildpanel();if(o){const e=o.content;let r=[];a.parentResizeHandler=(s=>{if(s.panel===o){r[0]=e.offsetWidth,r[1]=e.offsetHeight;let o,s,l=a.status;"maximized"===l&&t?a.maximize():a.snapped&&"minimized"!==l?a.snap(a.snapped,!0):"normalized"===l||"smallified"===l||"maximized"===l?"function"===n?t.call(a,a,{width:r[0],height:r[1]}):"object"===n&&!0===t.preset?(o=(r[0]-a.offsetWidth)*a.hf,a.style.left=o<=0?0:o+"px",s=(r[1]-a.offsetHeight)*a.vf,a.style.top=s<=0?0:s+"px",t.callback.call(a,a,{width:r[0],height:r[1]})):"boolean"===n&&(o=(r[0]-a.offsetWidth)*a.hf,a.style.left=o<=0?0:o+"px",s=(r[1]-a.offsetHeight)*a.vf,a.style.top=s<=0?0:s+"px"):"smallifiedmax"===l&&t&&a.maximize().smallify()}}),document.addEventListener("jspanelresize",a.parentResizeHandler,!1)}}return this.globalCallbacks&&(Array.isArray(this.globalCallbacks)?this.globalCallbacks.forEach(e=>e.call(a,a)):this.globalCallbacks.call(a,a)),e.callback&&(Array.isArray(e.callback)?e.callback.forEach(e=>e.call(a,a)):e.callback.call(a,a)),t&&(Array.isArray(t)?t.forEach(e=>e.call(a,a)):t.call(a,a)),document.dispatchEvent(r),a}}; \ No newline at end of file diff --git a/package.json b/package.json index e326ddf..44d7cc2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "jspanel4", - "version": "4.16.0", + "version": "4.16.1", "description": "A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu", "keywords": [ "jsPanel", @@ -40,12 +40,10 @@ "email": "info@jspanel.de" }, "devDependencies": { - "@babel/cli": "^7.18.6", - "@babel/core": "^7.18.6", - "@babel/preset-env": "^7.18.6", - "eslint": "^8.19.0", - "eslint-config-standard": "^17.0.0", - "eslint-plugin-import": "^2.26.0", + "@babel/cli": "^7.19.3", + "@babel/core": "^7.19.6", + "@babel/preset-env": "^7.19.4", + "eslint": "^8.26.0", "gulp": "^4.0.2", "gulp-babel": "^8.0.0", "gulp-babel-minify": "^0.5.2", @@ -57,7 +55,7 @@ "gulp-rename": "^2.0.0", "gulp-sass": "^5.1.0", "node-sass": "^7.0.1", - "npm": "^8.13.2", + "npm": "^8.19.2", "prettier": "^2.7.1" }, "prettier": { diff --git a/source/extensions/dialog/jspanel.dialog.css b/source/extensions/dialog/jspanel.dialog.css index 1e1e2c8..4d023b1 100644 --- a/source/extensions/dialog/jspanel.dialog.css +++ b/source/extensions/dialog/jspanel.dialog.css @@ -4,33 +4,21 @@ margin-top: 50px; max-height: calc(90vh - 50px); } - .jsPanel-dialog .jsPanel-content { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + flex-direction: column; overflow: hidden; - /* Add some padding to the dialog content */ + /* Add some padding to the dialog content */ padding: 1rem; } - .jsPanel-dialog .buttonbar { margin-top: 10px; padding-top: 10px; border-top: 1px solid #ccc; width: 100%; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: right; - -ms-flex-pack: right; - justify-content: right; + justify-content: right; } - .jsPanel-dialog .buttonbar button { margin-left: 0.5rem; } @@ -68,19 +56,16 @@ width: 90vw !important; } } - @media (max-width: 991px) { .dialog-lg, .dialog-xl { width: 90vw !important; } } - @media (max-width: 1199px) { .dialog-xl { width: 90vw !important; } } - /* A few button colors */ button.blue, button.info { color: #fff !important; @@ -129,12 +114,12 @@ input:disabled, input[readonly] { } /* Radio buttons and checkboxes, followed by a span */ -input[type="checkbox"], input[type="radio"] { +input[type=checkbox], input[type=radio] { vertical-align: middle; margin: 0 0.5rem 0 0; } -input[type="radio"] { +input[type=radio] { margin-bottom: 2px; } @@ -142,4 +127,5 @@ input:disabled + span { opacity: 0.4; cursor: not-allowed; } -/*# sourceMappingURL=jspanel.dialog.css.map */ \ No newline at end of file + +/*# sourceMappingURL=jspanel.dialog.css.map */ diff --git a/source/extensions/dialog/jspanel.dialog.css.map b/source/extensions/dialog/jspanel.dialog.css.map index a146819..79d010c 100644 --- a/source/extensions/dialog/jspanel.dialog.css.map +++ b/source/extensions/dialog/jspanel.dialog.css.map @@ -1,9 +1 @@ -{ - "version": 3, - "mappings": "AAEA,2CAA2C;AAC3C,AAAA,eAAe,CAAC;EACZ,SAAS,EAAE,KAAK;EAChB,UAAU,EALK,IAAI;EAMnB,UAAU,EAAE,iBAAiC;CAkBX;;AArBtC,AAKI,eALW,CAKX,gBAAgB,CAAC;EACb,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,QAAQ,EAAE,MAAM;EAChB,4CAA4C;EAC5C,OAAO,EAAE,IAAI;CAAG;;AAVxB,AAYI,eAZW,CAYX,UAAU,CAAC;EACP,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,IAAI;EACjB,UAAU,EAAE,cAAc;EAC1B,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,KAAK;CAGM;;AArBpC,AAoBQ,eApBO,CAYX,UAAU,CAQN,MAAM,CAAC;EACH,WAAW,EAAE,MAAM;CAAG;;AAGlC,qDAAqD;AACrD,AAAA,cAAc,AAAA,WAAW,CAAC;EACtB,OAAO,EAAE,cAAc;CAAG;;AAE9B,kBAAkB;AAClB,AAAA,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;EAC3C,UAAU,EAAE,iBAAiC;EAC7C,QAAQ,EAAE,WAAW;EACrB,MAAM,EAAE,MAAM;CAAG;;AAErB,AAAA,UAAU,CAAC;EACP,KAAK,EAAE,gBAAgB;CAAG;;AAE9B,AAAA,UAAU,CAAC;EACP,KAAK,EAAE,gBAAgB;CAAG;;AAE9B,AAAA,UAAU,CAAC;EACP,KAAK,EAAE,gBAAgB;CAAG;;AAE9B,AAAA,UAAU,CAAC;EACP,KAAK,EAAE,iBAAiB;CAAG;;AAG/B,MAAM,EAAE,SAAS,EAAE,KAAK;EACtB,AAAA,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;IACjC,KAAK,EAAE,eAAe;GAAG;;;AAG7B,MAAM,EAAE,SAAS,EAAE,KAAK;EACtB,AAAA,UAAU,EAAE,UAAU,CAAC;IACrB,KAAK,EAAE,eAAe;GAAG;;;AAG7B,MAAM,EAAE,SAAS,EAAE,MAAM;EACvB,AAAA,UAAU,CAAC;IACT,KAAK,EAAE,eAAe;GAAG;;;AAE7B,yBAAyB;AACzB,AAAA,MAAM,AAAA,KAAK,EAAE,MAAM,AAAA,KAAK,CAAC;EACrB,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,MAAM,AAAA,KAAK,EAAE,MAAM,AAAA,QAAQ,EAAE,MAAM,AAAA,UAAU,CAAC;EAC1C,KAAK,EAAE,IAAI;EACX,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,MAAM,AAAA,MAAM,CAAC;EACT,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,eAAe;CAAG;;AAExC,AAAA,MAAM,AAAA,QAAQ,CAAC;EACX,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,MAAM,AAAA,OAAO,EAAE,MAAM,AAAA,QAAQ,CAAC;EAC1B,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,MAAM,AAAA,IAAI,EAAE,MAAM,AAAA,OAAO,CAAC;EACtB,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,MAAM,AAAA,MAAM,EAAE,MAAM,AAAA,QAAQ,CAAC;EACzB,KAAK,EAAE,eAAe;EACtB,gBAAgB,EAAE,kBAAkB;EACpC,YAAY,EAAE,kBAAkB;CAAG;;AAEvC,AAAA,KAAK,AAAA,SAAS,EAAE,KAAK,CAAA,AAAA,QAAC,AAAA,EAAU;EAC5B,MAAM,EAAE,sBAAsB;EAC9B,gBAAgB,EAAE,eAAe;CAAG;;AAExC,sDAAsD;AACtD,AAAA,KAAK,CAAA,AAAA,IAAC,CAAK,UAAU,AAAf,GAAkB,KAAK,CAAA,AAAA,IAAC,CAAK,OAAO,AAAZ,EAAc;EACxC,cAAc,EAAE,MAAM;EACtB,MAAM,EAAE,YAAY;CAAG;;AAE3B,AAAA,KAAK,CAAA,AAAA,IAAC,CAAK,OAAO,AAAZ,EAAc;EAChB,aAAa,EAAE,GAAG;CAAG;;AAEzB,AAAA,KAAK,AAAA,SAAS,GAAC,IAAI,CAAC;EAChB,OAAO,EAAE,GAAG;EACZ,MAAM,EAAE,WAAW;CAAG", - "sources": [ - "jspanel.dialog.sass" - ], - "names": [], - "file": "jspanel.dialog.css" -} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["jspanel.dialog.sass"],"names":[],"mappings":"AAEA;AACA;EACI;EACA,YALe;EAMf;;AAEA;EACI;EACA;EACA;AACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AAGZ;AACA;EACI;;;AAEJ;AACA;EACI;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;;AAEJ;AACA;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;;AAEJ;AACA;EACI;EACA;;;AAEJ;EACI;;;AAEJ;EACI;EACA","file":"jspanel.dialog.css"} \ No newline at end of file diff --git a/source/jspanel.css b/source/jspanel.css index 1a2b52e..c3830a2 100644 --- a/source/jspanel.css +++ b/source/jspanel.css @@ -1,35 +1,3 @@ -.default-bg, .secondary-bg { - background-color: #b0bec5; -} - -.primary-bg { - background-color: #01579b; -} - -.info-bg { - background-color: #039be5; -} - -.success-bg { - background-color: #2e7d32; -} - -.warning-bg { - background-color: #f57f17; -} - -.danger-bg { - background-color: #dd2c00; -} - -.light-bg { - background-color: #e0e0e0; -} - -.dark-bg { - background-color: #263238; -} - .jsPanel { border: 0; box-sizing: border-box; @@ -53,7 +21,6 @@ font-weight: normal; display: flex; flex-direction: column; - flex-shrink: 0; line-height: normal; } diff --git a/source/jspanel.css.map b/source/jspanel.css.map index 65229bd..b60d249 100644 --- a/source/jspanel.css.map +++ b/source/jspanel.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["jspanel.sass"],"names":[],"mappings":"AAAA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAkBF;EAdE;EACA;EACA;EACA;EACA;EAYA;EACA;EACA;EACA;EACA;AACA;EACA;;;AAEF;EAxBE;EACA;EACA;EACA;EACA;EAsBA;EACA;EACA;EACA;;;AAEF;EA/BE;EACA;EACA;EACA;EACA;EA6BA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EAlEE;EACA;EACA;EACA;EACA;;AAiEA;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEJ;EACE;;AAGA;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;;AAEN;EACE;EACA;EACA;;;AAEF;EAxME;EACA;EACA;EACA;EACA;EAsMA;;;AAKF;AACA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAIF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;;AAEN;EACE;EACA;;AAEF;EACE;;;AAEJ;EACE;EACA;EACA;;;AAIF;AACA;EACE;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAGE;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAIN;AACA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AACA;AAAA;AAAA;AAAA;EAIE;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAYE;EACA;EACA;EACA;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAGF;AACA;EACE;IACE;;;AACJ;AAIA;AACA;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;;;AAGF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;EACE;IACE;;EACF;IACE;;;AAIJ;EACE;;;AAIF;EACE","file":"jspanel.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["jspanel.sass"],"names":[],"mappings":"AAeA;EAdE;EACA;EACA;EACA;EACA;EAYA;EACA;EACA;EACA;EACA;AACA;EACA;;;AAEF;EAxBE;EACA;EACA;EACA;EACA;EAsBA;EACA;EACA;;;AAEF;EA9BE;EACA;EACA;EACA;EACA;EA4BA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EAjEE;EACA;EACA;EACA;EACA;;AAgEA;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEJ;EACE;;AAGA;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACF;EACE;;AACF;EACE;;AACF;EACE;EACA;EACA;;;AAEN;EACE;EACA;EACA;;;AAEF;EAvME;EACA;EACA;EACA;EACA;EAqMA;;;AAKF;AACA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAIF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;;AAEN;EACE;EACA;;AAEF;EACE;;;AAEJ;EACE;EACA;EACA;;;AAIF;AACA;EACE;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAGE;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAIN;AACA;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;AACA;AAAA;AAAA;AAAA;EAIE;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAYE;EACA;EACA;EACA;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAEF;AAAA;AAAA;EAGE;EACA;;;AAEF;EACE;;;AACF;EACE;;;AACF;EACE;;;AAGF;AACA;EACE;IACE;;;AACJ;AAIA;AACA;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;;;AAGF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EACF;IACE;;;AAEJ;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;EACE;IACE;;EACF;IACE;;;AAIJ;EACE;;;AAIF;EACE","file":"jspanel.css"} \ No newline at end of file diff --git a/source/jspanel.js b/source/jspanel.js index dc4eb9c..bd561da 100644 --- a/source/jspanel.js +++ b/source/jspanel.js @@ -2,33 +2,29 @@ // noinspection JSVoidFunctionReturnValueUsed // eslint-disable-next-line no-redeclare let jsPanel = { - version: '4.16.0', - date: '2022-07-03 19:05', + version: '4.16.1', + date: '2022-11-03 09:18', ajaxAlwaysCallbacks: [], autopositionSpacing: 4, closeOnEscape: (() => { - document.addEventListener( - 'keydown', - (e) => { - if (e.key === 'Escape' || e.code === 'Escape' || e.key === 'Esc') { - jsPanel - .getPanels(panel => panel.classList.contains('jsPanel')) // Array is sorted by z-index (the highest first) - .some(item => { - if (item.options.closeOnEscape) { - if (typeof item.options.closeOnEscape === 'function') { - return item.options.closeOnEscape.call(item, item); - // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops - } else { - item.close(null, true); - return true; - } + document.addEventListener('keydown', e => { + if (e.key === 'Escape' || e.code === 'Escape' || e.key === 'Esc') { + jsPanel + .getPanels(panel => panel.classList.contains('jsPanel')) // Array is sorted by z-index (the highest first) + .some(item => { + if (item.options.closeOnEscape) { + if (typeof item.options.closeOnEscape === 'function') { + return item.options.closeOnEscape.call(item, item); + // if return value is falsy next panel in sequence will close, otherwise processing of Array.prototype.some() stops + } else { + item.close(null, true); + return true; } - return false; - }); - } - }, - false - ); + } + return false; + }); + } + }, false); })(), defaults: { boxShadow: 3, @@ -42,12 +38,12 @@ let jsPanel = { }, header: true, headerTitle: 'jsPanel', - headerControls: { size: 'md' }, // must be an object + headerControls: {size: 'md'}, // must be an object iconfont: undefined, maximizedMargin: 0, minimizeTo: 'default', paneltype: 'standard', - position: { my: 'center', at: 'center' }, // default position.of MUST NOT be set with new positioning engine + position: {my: 'center', at: 'center'}, // default position.of MUST NOT be set with new positioning engine resizeit: { handles: 'n, e, s, w, ne, se, sw, nw', minWidth: 128, @@ -55,7 +51,7 @@ let jsPanel = { }, theme: 'default' }, - defaultAutocloseConfig: { time: '8s', progressbar: true }, + defaultAutocloseConfig: {time: '8s', progressbar: true}, defaultSnapConfig: { sensitivity: 70, trigger: 'panel', @@ -110,6 +106,7 @@ let jsPanel = { // Object.entries() - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries if (!Object.entries) { Object.entries = function( obj ){ + // noinspection ES6ConvertVarToLetConst var ownProps = Object.keys( obj ), i = ownProps.length, resArray = new Array(i); // preallocate the Array @@ -170,6 +167,7 @@ let jsPanel = { detail: undefined, }; let evt = document.createEvent('CustomEvent'); + // noinspection JSDeprecatedSymbols evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); return evt; } @@ -191,6 +189,7 @@ let jsPanel = { if (!String.prototype.startsWith) { Object.defineProperty(String.prototype, 'startsWith', { value: function(search, rawPos) { + // noinspection ES6ConvertVarToLetConst var pos = rawPos > 0 ? rawPos|0 : 0; return this.substring(pos, pos + search.length) === search; } @@ -213,6 +212,7 @@ let jsPanel = { 'use strict'; if (this == null) throw new TypeError('can\'t convert ' + this + ' to object'); + // noinspection ES6ConvertVarToLetConst var str = '' + this; count = +count; if (count != count) @@ -226,6 +226,7 @@ let jsPanel = { return ''; if (str.length * count >= 1 << 28) throw new RangeError('repeat count must not overflow maximum string size'); + // noinspection ES6ConvertVarToLetConst var maxCount = str.length * count; count = Math.floor(Math.log(count) / Math.log(2)); while (count) { @@ -285,13 +286,21 @@ let jsPanel = { }); } })(), - themes: ['default', 'primary', 'secondary', 'info', 'success', 'warning', 'danger', 'light', 'dark'], ziBase: 100, colorFilledLight: 0.81, colorFilledDark: 0.08, colorFilled: 0, colorBrightnessThreshold: 0.55, colorNames: { + default: 'b0bec5', // Material Design bluegray200 + secondary: 'b0bec5', + primary: '01579b', // Material Design lightblue900 + info: '039be5', // Material Design lightblue600 + success: '2e7d32', // Material Design green800 + warning: 'f57f17', // Material Design yellow900 + danger: 'dd2c00', // Material Design deeporangeA700 + light: 'e0e0e0', // Material Design gray300 + dark: '263238', // Material Design bluegray900 // https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords aliceblue: 'f0f8ff', antiquewhite: 'faebd7', @@ -716,6 +725,18 @@ let jsPanel = { brown700: '5D4037', brown800: '4E342E', brown900: '3E2723', + /* Material Design for Bootstrap v4 themes https://mdbootstrap.com/docs/b4/jquery/css/colors/#mdb-colors */ + 'mdb-default': '2BBBAD', 'mdb-default-dark': '00695c', + 'mdb-primary': '4285F4', 'mdb-primary-dark': '0d47a1', + 'mdb-secondary': 'aa66cc', 'mdb-secondary-dark': '9933CC', + 'mdb-danger': 'ff4444', 'mdb-danger-dark': 'CC0000', + 'mdb-warning': 'ffbb33', 'mdb-warning-dark': 'FF8800', + 'mdb-success': '00C851', 'mdb-success-dark': '007E33', + 'mdb-info': '33b5e5', 'mdb-info-dark': '0099CC', + 'mdb-elegant': '2E2E2E', 'mdb-elegant-dark': '212121', + 'mdb-stylish': '4B515D', 'mdb-stylish-dark': '3E4551', + 'mdb-unique': '3F729B', 'mdb-unique-dark': '1C2331', + 'mdb-special': '37474F', 'mdb-special-dark': '263238' }, errorReporting: 1, modifier: false, @@ -790,7 +811,7 @@ let jsPanel = { } } - if (String(values.width).match(/^[0-9.]+$/gi)) { + if (String(values.width).match(/^[\d.]+$/gi)) { // if number only values.width += 'px'; } else if (typeof values.width === 'string' && values.width.endsWith('%')) { @@ -805,12 +826,12 @@ let jsPanel = { values.width = values.width.call(panel, panel); if (typeof values.width === 'number') { values.width += 'px'; - } else if (typeof values.width === 'string' && values.width.match(/^[0-9.]+$/gi)) { + } else if (typeof values.width === 'string' && values.width.match(/^[\d.]+$/gi)) { values.width += 'px'; } } - if (String(values.height).match(/^[0-9.]+$/gi)) { + if (String(values.height).match(/^[\d.]+$/gi)) { // if number only values.height += 'px'; } else if (typeof values.height === 'string' && values.height.endsWith('%')) { @@ -825,7 +846,7 @@ let jsPanel = { values.height = values.height.call(panel, panel); if (typeof values.height === 'number') { values.height += 'px'; - } else if (typeof values.height === 'string' && values.height.match(/^[0-9.]+$/gi)) { + } else if (typeof values.height === 'string' && values.height.match(/^[\d.]+$/gi)) { values.height += 'px'; } } @@ -840,13 +861,13 @@ let jsPanel = { .replace(/\s+/g, ' ') // replace all other whitespace(s) with a single whitespace .split(' '); // replace css custom props/variables with values - border.forEach( (val, index) => { + border.forEach((val, index) => { if(val.startsWith('--') || val.startsWith('var')) { border[index] = jsPanel.getCssVariableValue(val); } }); // border is now an array like ['5px', 'solid', 'red'] // check values for type (border width, style or color) and add to result array - border.forEach( (val) => { + border.forEach(val => { if (jsPanel.colorNames[val]) { result[2] = '#' + jsPanel.colorNames[val]; } else if (val.match(/(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset)/)) { @@ -913,13 +934,13 @@ let jsPanel = { color = jsPanel.getCssVariableValue(color); } } - if (color.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (color.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { color = '#' + color; } if (filling.startsWith('fillcolor')) { let devide = filling.indexOf(' '); filling = filling.slice(devide + 1, filling.length).trim().replace(/\s+/g, ''); - if (filling.match(/^([0-9a-f]{3}|[0-9a-f]{6})$/gi)) { + if (filling.match(/^([\da-f]{3}|[\da-f]{6})$/gi)) { filling = '#' + filling; } else if (jsPanel.colorNames[filling]) { filling = '#' + jsPanel.colorNames[filling]; @@ -945,9 +966,9 @@ let jsPanel = { channels, hsl, result = {}; - const hexPattern = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/gi, // matches "#123" or "#f05a78" with or without "#" - RGBAPattern = /^rgba?\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3}),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, // matches rgb/rgba color values, whitespace allowed - HSLAPattern = /^hsla?\(([0-9]{1,3}),([0-9]{1,3}%),([0-9]{1,3}%),?(0|1|0\.[0-9]{1,2}|\.[0-9]{1,2})?\)$/gi, + const hexPattern = /^#?([\da-f]{3}|[\da-f]{6})$/gi, // matches "#123" or "#f05a78" with or without "#" + RGBAPattern = /^rgba?\((\d{1,3}),(\d{1,3}),(\d{1,3}),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, // matches rgb/rgba color values, whitespace allowed + HSLAPattern = /^hsla?\((\d{1,3}),(\d{1,3}%),(\d{1,3}%),?(0|1|0\.\d{1,2}|\.\d{1,2})?\)$/gi, namedColors = this.colorNames; // change named color to corresponding hex value @@ -1167,9 +1188,7 @@ let jsPanel = { } // find my and at values and assign to result - let my_at = pos.filter((item) => { - return item.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i); - }); + let my_at = pos.filter(item => item.match(/^(left-|right-)(top|center|bottom)$|(^center-)(top|bottom)$|(^center$)/i)); if (my_at.length) { result.my = my_at[0]; result.at = my_at[1] || my_at[0]; @@ -1227,7 +1246,7 @@ let jsPanel = { // process parameter functions for 'my', 'at', 'of' // 'offsetX', 'offsetY', 'minLeft', 'maxLeft', 'minTop', 'maxTop' are processed when params are applied - ['my', 'at', 'of'].forEach((item) => { + ['my', 'at', 'of'].forEach(item => { if (typeof position[item] === 'function') { position[item] = position[item].call(panel, panel); } @@ -1274,7 +1293,7 @@ let jsPanel = { // window is never scaled --> scale factors default to 1 const scaleFactor = container === 'window' - ? { x: 1, y: 1 } + ? {x: 1, y: 1} : { x: containerRect.width / container.offsetWidth, y: containerRect.height / container.offsetHeight, @@ -1505,7 +1524,7 @@ let jsPanel = { } panel.style.left = scaleFactor.x === 1 ? left : parseFloat(left) / scaleFactor.x + 'px'; panel.style.top = scaleFactor.y === 1 ? top : parseFloat(top) / scaleFactor.y + 'px'; - // at this point panels are correctly positioned according to the my/at values + // at this point panels are correctly positioned according to my/at values let panelStyle = getComputedStyle(panel); // eslint-disable-next-line no-unused-vars @@ -1595,7 +1614,7 @@ let jsPanel = { return { left: pos.left, top: pos.top }; }, applyPositionOffset(panel, pos, position) { - ['offsetX', 'offsetY'].forEach((offset) => { + ['offsetX', 'offsetY'].forEach(offset => { if (position[offset]) { if (typeof position[offset] === 'function') { position[offset] = position[offset].call(pos, pos, position); @@ -1614,7 +1633,7 @@ let jsPanel = { return { left: panelStyle.left, top: panelStyle.top }; }, applyPositionMinMax(panel, pos, position) { - ['minLeft', 'minTop', 'maxLeft', 'maxTop'].forEach((val) => { + ['minLeft', 'minTop', 'maxLeft', 'maxTop'].forEach(val => { if (position[val]) { if (typeof position[val] === 'function') { position[val] = position[val].call(pos, pos, position); @@ -1713,18 +1732,8 @@ let jsPanel = { // theming methods ------------------------- getThemeDetails(th) { - const theme = this.pOtheme(th), - builtIn = this.themes.some(item => item === theme.color.split(/\s/i)[0]); - if (builtIn) { - let baseTheme = theme.color.split(/\s/i)[0], - btn = document.createElement('button'); - btn.className = baseTheme + '-bg'; - document.body.appendChild(btn); - theme.color = getComputedStyle(btn).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(btn); - // noinspection JSUnusedAssignment - btn = undefined; - } else if (theme.color.startsWith('bootstrap-')) { + const theme = this.pOtheme(th); + if (theme.color.startsWith('bootstrap-')) { // works with bootstrap 3 and 4 let index = theme.color.indexOf('-'), btn = document.createElement('button'); @@ -1734,32 +1743,11 @@ let jsPanel = { document.body.removeChild(btn); // noinspection JSUnusedAssignment btn = undefined; - } else if (theme.color.startsWith('mdb-')) { - // material design for bootstrap theme - let index = theme.color.indexOf('-') + 1, - span = document.createElement('span'), - testClass; - if (theme.color.endsWith('-dark')) { - testClass = theme.color.slice(index); - testClass = testClass.replace('-dark', '-color-dark'); - } else { - testClass = theme.color.slice(index) + '-color'; - } - span.className = testClass; - document.body.appendChild(span); - theme.color = getComputedStyle(span).backgroundColor.replace(/\s+/gi, ''); - document.body.removeChild(span); - // noinspection JSUnusedAssignment - span = undefined; } theme.colors = this.calcColors(theme.color); return theme; }, clearTheme(panel, cb) { - this.themes.forEach(value => { - ['panel', `jsPanel-theme-${value}`, `panel-${value}`, `${value}-color`].forEach(item => panel.classList.remove(item)); - panel.header.classList.remove(`jsPanel-theme-${value}`); - }); panel.content.classList.remove('jsPanel-content-filled', 'jsPanel-content-filledlight'); panel.header.classList.remove('jsPanel-hdr-light'); panel.header.classList.remove('jsPanel-hdr-dark'); @@ -1828,7 +1816,7 @@ let jsPanel = { applyCustomTheme(panel, theme) { let defaults = { bgPanel: '#ffffff', - bgContent: '#fffffff', + bgContent: '#ffffff', bgFooter: '#f5f5f5', colorHeader: '#000000', colorContent: '#000000', @@ -1944,7 +1932,6 @@ let jsPanel = { }, setStyles(elmt, stylesobject) { for (const [prop, value] of Object.entries(stylesobject)) { - //elmt.style[prop] = jsPanel.getCssVariableValue(value); elmt.style[prop] = typeof value === 'string' ? jsPanel.getCssVariableValue(value) : value; } return elmt; @@ -2063,7 +2050,7 @@ let jsPanel = { // allows plugins to add callback functions to the ajax always callback if (jsPanel.ajaxAlwaysCallbacks.length) { - jsPanel.ajaxAlwaysCallbacks.forEach((item) => { + jsPanel.ajaxAlwaysCallbacks.forEach(item => { panel ? item.call(xhr, xhr, panel) : item.call(xhr, xhr); }); } @@ -2119,12 +2106,12 @@ let jsPanel = { } fetch(config.resource, fetchInit) - .then((response) => { + .then(response => { if (response.ok) { return response[config.bodyMethod](); } }) - .then((response) => { + .then(response => { panel ? config.done.call(response, response, panel) : config.done.call(response, response); if (panel) { // resize and/or reposition panel if either width or height is set to 'auto' @@ -2167,7 +2154,7 @@ let jsPanel = { panel.style.left = '0'; panel.style.top = '0'; if (dataAttr) { - ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach((item) => { + ['close', 'maximize', 'normalize', 'minimize', 'smallify'].forEach(item => { panel.setAttribute(`data-btn${item}`, 'enabled'); }); } @@ -2677,7 +2664,7 @@ let jsPanel = { jsPanel.remClass(self, self.options.animateIn); } jsPanel.setClass(self, self.options.animateOut); - self.addEventListener('animationend', (e) => { + self.addEventListener('animationend', e => { e.stopPropagation(); self.remove(self.id, closedByUser, cb); }); @@ -3690,7 +3677,7 @@ let jsPanel = { if (!Array.isArray(elementsFrom)) { elementsFrom = Array.prototype.slice.call(elementsFrom); } - opts.drop.dropZones.forEach((zone) => { + opts.drop.dropZones.forEach(zone => { // Array.prototype.includes() needs polyfill in IE if (elementsFrom.includes(zone)) { self.droppableTo = zone; @@ -4491,15 +4478,10 @@ let jsPanel = { } } }; - self.saveCurrentDimensions = (setStyleHeight = false) => { + self.saveCurrentDimensions = () => { const normData = window.getComputedStyle(self); self.currentData.width = normData.width; - if (self.status === 'normalized') { - self.currentData.height = normData.height; - } - if (setStyleHeight) { - self.style.height = normData.height; - } + self.currentData.height = normData.height; }; self.saveCurrentPosition = () => { const normData = window.getComputedStyle(self); @@ -4850,7 +4832,7 @@ let jsPanel = { let controls = [], ctrls = self.controlbar.querySelectorAll('.jsPanel-btn'); ctrls.forEach(ctrl => { - let match = ctrl.className.match(/jsPanel-btn-[a-z0-9]{3,}/i), + let match = ctrl.className.match(/jsPanel-btn-[a-z\d]{3,}/i), ctrlName = match[0].substring(12); controls.push(ctrlName); }); @@ -5138,27 +5120,27 @@ let jsPanel = { let bars = [self.headerbar, self.controlbar]; switch (self.options.headerControls.size) { case 'md': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '34px'; }); break; case 'xs': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '26px'; }); break; case 'sm': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '30px'; }); break; case 'lg': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '38px'; }); break; case 'xl': - bars.forEach((bar) => { + bars.forEach(bar => { bar.style.height = '42px'; }); break; @@ -5278,9 +5260,7 @@ let jsPanel = { if (autoclose.progressbar) { self.progressbar.classList.add('active'); if (autoclose.background) { - if (jsPanel.themes.indexOf(autoclose.background) > -1) { - self.progressbar.classList.add(autoclose.background + '-bg'); - } else if (jsPanel.colorNames[autoclose.background]) { + if (jsPanel.colorNames[autoclose.background]) { self.progressbar.style.background = '#' + jsPanel.colorNames[autoclose.background]; } else { self.progressbar.style.background = autoclose.background; @@ -5350,15 +5330,9 @@ let jsPanel = { }); self.drag(options.dragit); // do not use self.options.dragit.stop.push() !!! - self.addEventListener( - 'jspaneldragstop', - e => { - if (e.panel === self) { - self.calcSizeFactors(); - } - }, - false - ); + self.addEventListener('jspaneldragstop', e => { + if (e.panel === self) {self.calcSizeFactors();} + }, false); } else { self.titlebar.style.cursor = 'default'; } @@ -5377,15 +5351,9 @@ let jsPanel = { self.sizeit(options.resizeit); let startstatus = void 0; // do not use self.options.resizeit.start.push() !!! - self.addEventListener( - 'jspanelresizestart', - e => { - if (e.panel === self) { - startstatus = self.status; - } - }, - false - ); + self.addEventListener('jspanelresizestart', e => { + if (e.panel === self) {startstatus = self.status;} + }, false); // do not use self.options.resizeit.stop.push() !!! self.addEventListener( 'jspanelresizestop', @@ -5411,7 +5379,8 @@ let jsPanel = { } // initialize self.currentData - must be after options position & size - self.saveCurrentDimensions(true); + //self.saveCurrentDimensions(true); // not clear why 'true' was added here or why this param is needed at all in the method + self.saveCurrentDimensions(); self.saveCurrentPosition(); // option.setStatus @@ -5517,8 +5486,13 @@ let jsPanel = { } // constructor callback + // if (cb) {cb.call(self, self);} if (cb) { - cb.call(self, self); + if (Array.isArray(cb)) { + cb.forEach(item => item.call(self, self)); + } else { + cb.call(self, self); + } } document.dispatchEvent(jspanelloaded); diff --git a/source/jspanel.sass b/source/jspanel.sass index b50a7c5..448445e 100644 --- a/source/jspanel.sass +++ b/source/jspanel.sass @@ -1,28 +1,3 @@ -.default-bg, .secondary-bg - background-color: #b0bec5 // Material Design bluegray200 - -.primary-bg - background-color: #01579b // Material Design lightblue900 - -.info-bg - background-color: #039be5 // Material Design lightblue600 - -.success-bg - background-color: #2e7d32 // Material Design green800 - -.warning-bg - background-color: #f57f17 // Material Design yellow900 - -.danger-bg - background-color: #dd2c00 // Material Design deeporangeA700 - -.light-bg - background-color: #e0e0e0 // Material Design gray300 - -.dark-bg - background-color: #263238 // Material Design bluegray900 - - =basic-mixin border: 0 box-sizing: border-box @@ -52,7 +27,6 @@ +basic-mixin display: flex flex-direction: column - flex-shrink: 0 line-height: normal .jsPanel-content