/* global jsPanel */'use strict';// Object.assign Polyfill - https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Object/assign - ONLY FOR IE11if (!Object.assign) {    Object.defineProperty(Object, 'assign', {        enumerable:   false,        configurable: true,        writable:     true,        value:        function (target) {            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;        }    });} var jsPanel = {    version:             '3.11.1',    date:                '2017-11-01 11:22',    id:                  0,     // counter to add to automatically generated id attribute    ziBase:              100,   // the lowest z-index a jsPanel may have    zi:                  100,   // z-index counter, has initially to be the same as ziBase    modalcount:          0,     // counter to set modal background and modal jsPanel z-index    autopositionSpacing: 5,     // sets spacing between autopositioned jsPanels    pbTreshold:          0.556, // perceived brightness threshold to switch between white or black font color    lastbeforeclose:     false, // used in the handlers to reposition autopositioned panels    template:            `<div class="jsPanel">                <div class="jsPanel-hdr">                    <div class="jsPanel-headerbar">                        <div class="jsPanel-headerlogo"></div>                        <div class="jsPanel-titlebar">                            <h3 class="jsPanel-title"></h3>                        </div>                        <div class="jsPanel-controlbar">                            <div class="jsPanel-btn jsPanel-btn-smallify"><span class="jsglyph jsglyph-chevron-up"></span></div>                            <div class="jsPanel-btn jsPanel-btn-smallifyrev"><span class="jsglyph jsglyph-chevron-down"></span></div>                            <div class="jsPanel-btn jsPanel-btn-minimize"><span class="jsglyph jsglyph-minimize"></span></div>                            <div class="jsPanel-btn jsPanel-btn-normalize"><span class="jsglyph jsglyph-normalize"></span></div>                            <div class="jsPanel-btn jsPanel-btn-maximize"><span class="jsglyph jsglyph-maximize"></span></div>                            <div class="jsPanel-btn jsPanel-btn-close"><span class="jsglyph jsglyph-close"></span></div>                        </div>                    </div>                    <div class="jsPanel-hdr-toolbar"></div>                </div>                <div class="jsPanel-content jsPanel-content-nofooter"></div>                <div class="jsPanel-minimized-box"></div>                <div class="jsPanel-ftr"></div>               </div>`,    replacementTemplate: `<div class="jsPanel-replacement">                            <div class="jsPanel-hdr">                                <div class="jsPanel-headerbar">                                    <div class="jsPanel-titlebar">                                        <h3 class="jsPanel-title"></h3>                                    </div>                                    <div class="jsPanel-controlbar">                                        <div class="jsPanel-btn jsPanel-btn-normalize"><span class="jsglyph jsglyph-normalize"></span></div>                                        <div class="jsPanel-btn jsPanel-btn-maximize"><span class="jsglyph jsglyph-maximize"></span></div>                                        <div class="jsPanel-btn jsPanel-btn-close"><span class="jsglyph jsglyph-close"></span></div>                                    </div>                                </div>                            </div>                          </div>`,    themes:              ['default', 'primary', 'info', 'success', 'warning', 'danger'],    mdbthemes:           ['secondary', 'elegant', 'stylish', 'unique', 'special'], // just the extra themes which are not contained in jsPanel.themes    controls:            ['close', 'maximize', 'normalize', 'minimize', 'smallify', 'smallifyrev'],    tplHeaderOnly:       `<div class="jsPanel">                        <div class="jsPanel-hdr">                            <div class="jsPanel-headerbar">                                <div class="jsPanel-headerlogo"></div>                                <div class="jsPanel-titlebar">                                    <h3 class="jsPanel-title"></h3>                                </div>                                <div class="jsPanel-controlbar">                                    <div class="jsPanel-btn jsPanel-btn-close"><span class="jsglyph jsglyph-close"></span></div>                                </div>                            </div>                            <div class="jsPanel-hdr-toolbar"></div>                        </div>                    </div>`,    tplContentOnly:      `<div class="jsPanel">                        <div class="jsPanel-content jsPanel-content-noheader jsPanel-content-nofooter"></div>                        <div class="jsPanel-minimized-box"></div>                     </div>`,    activePanels:        {        list: [],        getPanel(arg) {            return typeof arg === 'string' ? document.getElementById(arg).jspanel.noop() : document.getElementById(this.list[arg]).jspanel.noop();        }        // example: jsPanel.activePanels.getPanel(0).resize(600,250).reposition().css('background','yellow');        // or:      jsPanel.activePanels.getPanel('jsPanel-1').resize(600,250).reposition().css('background','yellow');    },    closeOnEscape:       false,    isIE:                (function () {        return navigator.appVersion.indexOf('Trident') !== -1;    }()),    isEdge:              (function () {        return navigator.appVersion.indexOf('Edge') !== -1;    }()),     addConnector(panel) {        const bgColor = panel.option.paneltype.connectorBG || null;         if (panel[0].classList.contains('jsPanel-tooltip-top')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-top">');            jQuery('.jsPanel-connector-top', panel).css('border-top-color', bgColor || this.calcConnectorBg(panel, 'top'));            panel.option.position.offsetY = panel.option.position.offsetY - 10 || -10;         } else if (panel[0].classList.contains('jsPanel-tooltip-bottom')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-bottom">');            jQuery('.jsPanel-connector-bottom', panel).css('border-bottom-color', bgColor || this.calcConnectorBg(panel, 'bottom'));            panel.option.position.offsetY = panel.option.position.offsetY + 10 || 10;         } else if (panel[0].classList.contains('jsPanel-tooltip-left')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-left">');            jQuery('.jsPanel-connector-left', panel).css('border-left-color', bgColor || this.calcConnectorBg(panel, 'left'));            panel.option.position.offsetX = panel.option.position.offsetX - 12 || -12;         } else if (panel[0].classList.contains('jsPanel-tooltip-right')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-right">');            jQuery('.jsPanel-connector-right', panel).css('border-right-color', bgColor || this.calcConnectorBg(panel, 'right'));            panel.option.position.offsetX = panel.option.position.offsetX + 12 || 12;         } else if (panel[0].classList.contains('jsPanel-tooltip-lefttopcorner')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-lefttopcorner">');            jQuery('.jsPanel-connector-lefttopcorner', panel).css('background-color', bgColor || this.calcConnectorBg(panel, 'lefttopcorner'));         } else if (panel[0].classList.contains('jsPanel-tooltip-righttopcorner')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-righttopcorner">');            jQuery('.jsPanel-connector-righttopcorner', panel).css('background-color', bgColor || this.calcConnectorBg(panel, 'righttopcorner'));         } else if (panel[0].classList.contains('jsPanel-tooltip-rightbottomcorner')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-rightbottomcorner">');            jQuery('.jsPanel-connector-rightbottomcorner', panel).css('background-color', bgColor || this.calcConnectorBg(panel, 'rightbottomcorner'));         } else if (panel[0].classList.contains('jsPanel-tooltip-leftbottomcorner')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-leftbottomcorner">');            jQuery('.jsPanel-connector-leftbottomcorner', panel).css('background-color', bgColor || this.calcConnectorBg(panel, 'leftbottomcorner'));         } else if (panel[0].classList.contains('jsPanel-tooltip-lefttop')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-lefttop">');            jQuery('.jsPanel-connector-lefttop', panel).css('border-left-color', bgColor || this.calcConnectorBg(panel, 'lefttop'));            panel.option.position.offsetX = panel.option.position.offsetX - 12 || -12;         } else if (panel[0].classList.contains('jsPanel-tooltip-leftbottom')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-leftbottom">');            jQuery('.jsPanel-connector-leftbottom', panel).css('border-left-color', bgColor || this.calcConnectorBg(panel, 'leftbottom'));            panel.option.position.offsetX = panel.option.position.offsetX - 12 || -12;         } else if (panel[0].classList.contains('jsPanel-tooltip-topleft')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-topleft">');            jQuery('.jsPanel-connector-topleft', panel).css('border-top-color', bgColor || this.calcConnectorBg(panel, 'topleft'));            panel.option.position.offsetY = panel.option.position.offsetY - 10 || -10;         } else if (panel[0].classList.contains('jsPanel-tooltip-topright')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-topright">');            jQuery('.jsPanel-connector-topright', panel).css('border-top-color', bgColor || this.calcConnectorBg(panel, 'topright'));            panel.option.position.offsetY = panel.option.position.offsetY - 10 || -10;         } else if (panel[0].classList.contains('jsPanel-tooltip-righttop')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-righttop">');            jQuery('.jsPanel-connector-righttop', panel).css('border-right-color', bgColor || this.calcConnectorBg(panel, 'righttop'));            panel.option.position.offsetX = panel.option.position.offsetX + 12 || 12;         } else if (panel[0].classList.contains('jsPanel-tooltip-rightbottom')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-rightbottom">');            jQuery('.jsPanel-connector-rightbottom', panel).css('border-right-color', bgColor || this.calcConnectorBg(panel, 'rightbottom'));            panel.option.position.offsetX = panel.option.position.offsetX + 12 || 12;         } else if (panel[0].classList.contains('jsPanel-tooltip-bottomleft')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-bottomleft">');            jQuery('.jsPanel-connector-bottomleft', panel).css('border-bottom-color', bgColor || this.calcConnectorBg(panel, 'bottomleft'));            panel.option.position.offsetY = panel.option.position.offsetY + 10 || 10;         } else if (panel[0].classList.contains('jsPanel-tooltip-bottomright')) {            panel.append('<div class="jsPanel-connector jsPanel-connector-bottomright">');            jQuery('.jsPanel-connector-bottomright', panel).css('border-bottom-color', bgColor || this.calcConnectorBg(panel, 'bottomright'));            panel.option.position.offsetY = panel.option.position.offsetY + 10 || 10;         }    },     addCustomTheme(theme) {        if (this.themes.indexOf(theme) === -1) {            this.themes.push(theme);        }    },     ajax(panel) {         const oAjax = panel.option.contentAjax,              oSize = panel.option.contentSize;         if (oAjax.then) {            if (oAjax.then[0]) {                oAjax.done = oAjax.then[0];            }            if (oAjax.then[1]) {                oAjax.fail = oAjax.then[1];            }        }         jQuery.ajax(oAjax)            .done((data, textStatus, jqXHR) => {                 if (oAjax.autoload) {                    panel.content.append(data);                }                if (jQuery.isFunction(oAjax.done)) {                    oAjax.done.call(panel, data, textStatus, jqXHR, panel);                }             })            .fail((jqXHR, textStatus, errorThrown) => {                 if (jQuery.isFunction(oAjax.fail)) {                    oAjax.fail.call(panel, jqXHR, textStatus, errorThrown, panel);                }             })            .always((arg1, textStatus, arg3) => {                 if (jQuery.isFunction(oAjax.always)) {                    oAjax.always.call(panel, arg1, textStatus, arg3, panel);                }                 if (panel.hasClass('jsPanel-contextmenu')) {                    jsPanel.checkContextmenuOverflow(panel);                }                 // resize panel if either width or height is set to 'auto'                if (typeof oSize === 'string' && oSize.match(/auto/i)) {                    var parts = oSize.split(' '),                        sizes = Object.assign({}, jQuery.jsPanel.resizedefaults, {width: parts[0], height: parts[1]});                    if (oAjax.autoresize) {                        panel.resize(sizes);                    }                    if (!panel.hasClass('jsPanel-contextmenu')) {                        if (oAjax.autoreposition) {                            panel.reposition();                        }                    }                } else if (jQuery.isPlainObject(oSize) && (oSize.width === 'auto' || oSize.height === 'auto')) {                    var sizes = Object.assign({}, jQuery.jsPanel.resizedefaults, oSize);                    if (oAjax.autoresize) {                        panel.resize(sizes);                    }                    if (!panel.hasClass('jsPanel-contextmenu')) {                        if (oAjax.autoreposition) {                            panel.reposition();                        }                    }                }             });         panel.data('ajaxURL', oAjax.url); // needed for exportPanels()     },     applyBuiltInTheme(panel, themeDetails) {        panel[0].classList.add(`jsPanel-theme-${themeDetails.color}`);  // do not remove theme from jsP        if (panel.header[0]) {            panel.header[0].classList.add(`jsPanel-theme-${themeDetails.color}`);        }         // optionally set theme filling        if (themeDetails.filling === 'filled') {            panel.content.css('background', '')[0].classList.add('jsPanel-content-filled');        } else if (themeDetails.filling === 'filledlight') {            panel.content.css('background', '')[0].classList.add('jsPanel-content-filledlight');        }         if (!panel.option.headerToolbar) {            panel.content.css({borderTop: `1px solid ${panel.header.title.css('color')}`});        }    },     applyArbitraryTheme(panel, themeDetails) {         panel.header.css('background-color', themeDetails.colors[0]);        jQuery('.jsPanel-headerlogo, .jsPanel-title, .jsPanel-controlbar .jsPanel-btn .jsglyph, .jsPanel-hdr-toolbar', panel).css({color: themeDetails.colors[3]});         if (panel.option.headerToolbar) {             panel.header.toolbar.css({                boxShadow:  `0 0 1px ${themeDetails.colors[3]} inset`,                width:      'calc(100% + 4px)',                marginLeft: '-1px'            });         } else {             panel.content.css({borderTop: `1px solid ${themeDetails.colors[3]}`});         }         if (themeDetails.filling === 'filled') {             panel.content.css({backgroundColor: themeDetails.colors[0], color: themeDetails.colors[3]});         } else if (themeDetails.filling === 'filledlight') {             panel.content.css({backgroundColor: themeDetails.colors[1]});         }     },     applyBootstrapTheme(panel, themeDetails) {        let pColor;         panel.addClass(`panel panel-${themeDetails.bstheme} card card-inverse card-${themeDetails.bstheme}`);        if (panel.header[0]) {            panel.header[0].classList.add('panel-heading');            panel.header.title[0].classList.add('panel-title');        }         // added support for material-design-for-bootstrap 4.x colors        if (themeDetails.bs === 'mdb') {            let mdbColor = `${themeDetails.bstheme}-color`;            if (themeDetails.mdbStyle) {                mdbColor = `${mdbColor}-dark`;            }            panel.removeClass(`panel panel-${themeDetails.bstheme}`);            panel[0].classList.add(mdbColor);        }        // ----------------------------------------------------         panel.content[0].classList.add('panel-body');            // fix css problems for panels nested in other bootstrap panels        panel.content.css('border-top-color', () => {            return panel.header.css('border-top-color');        });         panel.footer.addClass('panel-footer card-footer');         if (jQuery('.panel-heading', panel).css('background-color') === 'transparent') {            pColor = panel.css('background-color').replace(/\s+/g, '');        } else {            pColor = jQuery('.panel-heading', panel).css('background-color').replace(/\s+/g, '');        }         const bsColors = this.calcColors(pColor);        jQuery('.jsPanel-headerlogo, .jsPanel-title, .jsPanel-controlbar .jsPanel-btn, .jsPanel-hdr-toolbar', panel.header).css('color', bsColors[3]);         if (panel.option.headerToolbar) {            panel.header.toolbar.css({                boxShadow:  `0 0 1px ${bsColors[3]} inset`,                width:      'calc(100% + 4px)',                marginLeft: '-1px'            });        } else {            panel.content.css({borderTop: `1px solid ${bsColors[3]}`});        }         if (themeDetails.filling === 'filled') {            panel.content.css({backgroundColor: pColor, color: bsColors[3]});        } else if (themeDetails.filling === 'filledlight') {            panel.content.css({backgroundColor: bsColors[1], color: '#000000'});        }     },     applyThemeBorder(panel, themeDetails) {         const bordervalues = panel.option.border.split(' ');        panel.css({borderWidth: bordervalues[0], borderStyle: bordervalues[1], borderColor: bordervalues[2]});        //panel.header.css({'border-top-left-radius': 0, 'border-top-right-radius': 0});         if (!themeDetails.bs) {            if (this.themes.indexOf(themeDetails.color) === -1) {                // arbitrary themes only (for built-in themes it's taken from the css file)                bordervalues[2] ? panel.css('border-color', bordervalues[2]) : panel.css('border-color', themeDetails.colors[0]);            }        } else {            // bootstrap            let pColor;            if (jQuery('.panel-heading', panel).css('background-color') === 'transparent') {                pColor = panel.css('background-color').replace(/\s+/g, '');            } else {                pColor = jQuery('.panel-heading', panel).css('background-color').replace(/\s+/g, '');            }            bordervalues[2] ? panel.css('border-color', bordervalues[2]) : panel.css('border-color', pColor);        }     },     calcColors(primaryColor) {        const primeColor = this.color(primaryColor),            secondColor = this.lighten(primaryColor, 0.81),            thirdColor = this.darken(primaryColor, 0.5),            fontColorForPrimary = this.perceivedBrightness(primaryColor) <= this.pbTreshold ? '#ffffff' : '#000000',            fontColorForSecond = this.perceivedBrightness(secondColor) <= this.pbTreshold ? '#ffffff' : '#000000',            fontColorForThird = this.perceivedBrightness(thirdColor) <= this.pbTreshold ? '#000000' : '#ffffff';         return [primeColor.hsl.css, secondColor, thirdColor, fontColorForPrimary, fontColorForSecond, fontColorForThird];    },     calcConnectorBg(panel, connector) {        const bgColor_content = panel.content.css('background-color'),            bgColor_ftr = panel.footer.css('background-color'),            bgColor_panel = panel.header.css('background-color');         if (connector.match(/^(top|topleft|topright|lefttopcorner|righttopcorner|leftbottom|rightbottom)$/)) {             if (panel.footer.css('display') !== 'none') {                return bgColor_ftr;            } else if (parseFloat(panel.option.contentSize.height) > 0) {                return bgColor_content;            }            return bgColor_panel;         } else if (connector.match(/^(bottom|bottomleft|bottomright|leftbottomcorner|rightbottomcorner)$/)) {             if (!panel.option.headerRemove) {                return bgColor_panel;            } else if (parseFloat(panel.option.contentSize.height) > 0) {                return bgColor_content;            } else if (panel.footer.css('display') !== 'none') {                return bgColor_ftr;            }         } else if (connector.match(/^(lefttop|righttop)$/)) {             if (!panel.option.headerRemove) {                return bgColor_panel;            } else {                return bgColor_content;            }         } else if (connector.match(/^(left|right)$/)) {             if (parseFloat(panel.option.contentSize.height) > 0) {                return bgColor_content;            } else if (!panel.option.headerRemove) {                return bgColor_panel;            } else if (panel.footer.css('display') !== 'none') {                return bgColor_ftr;            }         }     },     clearTheme(panel) {        this.themes.concat(this.mdbthemes).forEach(function (value) {            panel.removeClass(`panel card card-inverse jsPanel-theme-${value} panel-${value} card-${value} ${value}-color`);            panel.header.removeClass(`panel-heading jsPanel-theme-${value}`);        });        panel.content.removeClass('panel-body jsPanel-content-filled jsPanel-content-filledlight');        panel.css({borderWidth: '', borderStyle: '', borderColor: ''});        jQuery('.jsPanel-hdr, .jsPanel-content', panel).css({background: ''});        jQuery('.jsPanel-headerlogo, .jsPanel-title, .jsPanel-controlbar .jsPanel-btn .jsglyph, .jsPanel-hdr-toolbar, .jsPanel-content', panel).css({color: ''});        panel.header.title.removeClass('panel-title');        panel.header.toolbar.css({boxShadow: '', width: '', marginLeft: ''});        panel.css({borderTop: '', borderTopColor: ''});        panel.footer.removeClass('panel-footer card-footer');    },     close(panel, ...params) {         const id = panel.attr('id'),            trigger = this.setTrigger(panel.option.position),            delay = panel.option.delayClose,            args = params;        // params[0] has to be the callback or false        // params[1] has to skipOnbeforeClose (if true callback is skipped)        // params[2] has to be skipOnclosed (if true callback is skipped)         function closePanel(panel, ...params) {            params = args;             // this code block is only relevant if panel uses autoposition ------------------------------            const jsPop = panel.option.position;            if (jsPop.autoposition || ( typeof jsPop === 'string' && jsPop.match(/DOWN|RIGHT|UP|LEFT/i))) {                 const regex = /left-top|center-top|right-top|left-center|center|right-center|left-bottom|center-bottom|right-bottom/,                    parent = jQuery(panel).parent(),                    match = document.getElementById(id).className.match(regex);                 if (match) {

Lines 1–500 of 4196. Load more