(function ($) {
    "use strict";

    $.pixeCallback = {};

    $.pixeCallback['input-button-style2-p'] = function (data, slug, ss) {
        if (slug != 'button-preset' || !data['button-preset']) return;

        // clear local style that should come from the preset
        var clearKeys = [
            'icon', 'icon-style', 'width-type', 'width', 'height', 'padding', 'margin', 'alignment',
            'background', 'background-hover', 'text-color', 'text-color-hover',
        ];
        var devices = ['', 'tablet-', 'mobile-'];
        for (var i in devices) {
            for (var j in clearKeys) {
                $.pixeSetData(data, devices[i] + clearKeys[j], '');
            }
        }

        if (ss.settings && ss.settings.obj && ss.settings.obj.typo) {
            $.pixeSetData(ss.settings.obj.typo, 'button', '');
        }

        ss.popupContent.trigger('pixerefresh');
    }

    // text ai
    $.pixeCallback['ai-text-option'] = function (button, value, item) {
        if (typeof ($.pixeAIGenerateText) == 'function') {
            $.pixeAIGenerateText(button, item);
        } else {
            new $.pixeStyleSelector({
                target: button,
                type: 'unlock-ai-writing',
                obj: { '': {} }
            });
        }
    }

    // image ai
    $.pixeCallback['ai-image-option'] = function (button, value, item) {
        if (typeof ($.pixeAIGenerateImage) == 'function') {
            $.pixeAIGenerateImage(button, item);
        } else {
            new $.pixeStyleSelector({
                target: button,
                type: 'unlock-ai-image',
                obj: { '': {} }
            });
        }
    }
    $.pixeCallback['browse-stock-image'] = function (button, value, item) {
        if (typeof ($.pixeBrowseStockImage) == 'function') {
            $.pixeBrowseStockImage(button, item);
        } else {
            new $.pixeStyleSelector({
                target: button,
                type: 'unlock-stock-image',
                obj: { '': {} }
            });
        }
    }

    // preload
    $.pixeCallback['transition-data'] = function (object) {
        if (!object) return object;

        if (object['enable-preloader']) {
            object.css = '';
            object.css += $.pixeSetCss('.pixe-page-transition .pixe-overlay', {
                'background-color': object['overlay-color'],
                'background-image': object['overlay-image'],
            });

            var inEffect = object['in-effect'] ? object['in-effect'] : 'fade-out';
            var outEffect = object['out-effect'] ? object['out-effect'] : 'fade-in';
            object.css += $.pixeHoverAnimationCss(inEffect, {
                selector: '.pixe-page-transition.pixe-in-start',
                hoverSelector: '.pixe-page-transition.pixe-in'
            });
            object.css += $.pixeHoverAnimationCss(outEffect, {
                selector: '.pixe-page-transition.pixe-out-start',
                hoverSelector: '.pixe-page-transition.pixe-out'
            });
            if (object['duration']) {
                object.css += $.pixeSetCss('.pixe-page-transition.pixe-in, .pixe-page-transition.pixe-out', {
                    'transition-duration': object['duration']
                });
            }

            if (object.type == 'css') {
                object.css += $.pixeSetCss('.pixe-page-transition .pixe-uib-container', {
                    '--uib-size': object['size'],
                    '--uib-color': object['color'],
                    '--uib-speed': (object['speed'] ? object['speed'] + 'ms' : '')
                });
            } else {
                var iconCss = '';
                if (object['icon-effect']) {
                    iconCss += $.pixeAnimationInitial(object['icon-effect']);
                    iconCss += $.pixeAnimationActive(object['icon-effect']);
                    iconCss += 'animation-iteration-count: infinite;';
                }
                if (object['icon-duration']) {
                    iconCss += '-webkit-animation-duration: ' + parseInt(object['icon-duration']) + 'ms; animation-duration: ' + parseInt(object['icon-duration']) + 'ms;';
                }
                if (object['icon-delay']) {
                    iconCss += '-webkit-animation-delay: ' + parseInt(object['icon-delay']) + 'ms; animation-delay: ' + parseInt(object['icon-delay']) + 'ms;';
                }

                object.css += $.pixeSetCss('.pixe-page-transition .pixe-icon', {
                    'width': object['icon-width'],
                    'custom': iconCss
                });
                if (object.type == 'icon') {
                    object.css += $.pixeSetCss('.pixe-page-transition .pixe-icon.pixe-type-svg', {
                        'fill': object['icon-color']
                    });
                } else if (object.type == 'image') {
                    object.css += $.pixeSetCss('.pixe-page-transition .pixe-icon.pixe-type-image', {
                        'opacity': object['icon-opacity']
                    });
                }
            }
        } else {
            delete object.css;
        }

        // refresh preview preload
        $.pixeCallback.previewPreloadContent(object);

        return object;
    }
    $.pixeCallback['preview-preload'] = function (button, value) {
        if ($.pixeCallback.preloadContent) {
            $.pixeCallback.previewPreloadContent(value);
            return;
        }

        var container = $('<div class="pixe-preload-popup-container" ></div>');
        var popup = new $.pixePopup({
            target: button,
            closeEvent: false,
            customPosition: { top: 65, right: 30 },
            style: 'pixe-preload-popup',
            content: container,
        });

        // popup draggable
        container.pixeDraggable({
            handlerClass: '.pixe-preload-popup-container',
            frameSelector: '.pixe-popup'
        });

        // close popup
        container.append($.pixeGetAdminIcon('cancel', { class: 'pixe-close' }));
        container.on('click', '.pixe-close', function () {
            popup.close();
            delete $.pixeCallback.preloadContent;
        });

        $.pixeCallback.preloadContent = $('<div class="preload-content" ></div>');
        $.pixeCallback.preloadContent.appendTo(container);
        $.pixeCallback.previewPreloadContent(value);
    }
    $.pixeCallback.previewPreloadContent = function (value) {
        if (!$.pixeCallback.preloadContent) return;

        var t = this;
        $.pixeCallback.preloadContent.empty();

        var transition = $('<div class="pixe-page-transition" ><div class="pixe-overlay" ></div></div>');

        if (value.type == 'css' && value.style) {
            transition.append($.pixePreloadScript(value.style));
        } else if (value.type == 'image' && value.image) {
            var obj = {
                type: 'image',
                value: value.image
            };
            transition.append($.pixeGetIcon(obj, { class: 'pixe-preload-icon' }));
        } else if (value.type == 'icon' && value.icon) {
            var obj = {
                type: 'svg',
                value: value.icon
            };
            transition.append($.pixeGetIcon(obj, { class: 'pixe-preload-icon' }));
        }

        transition.append('<style>' + value.css + '</style>');
        transition.appendTo(t.preloadContent);
    }

    // ai unlock message settings
    $.pixeStyleSelectorOption['unlock-ai-writing'] = {
        'title': pixei18n.button.aiWriting,
        'options': {
            'html': {
                'type': 'html',
                'html': function () {
                    return '<div class="pixe-ss-unlock" >' +
                        '<div class="pixe-ss-unlock-title" >' + $.pixeGetAdminIcon('bolt') + pixei18n.upgrade.aiWritingTitle + '</div>' +
                        '<div class="pixe-ss-unlock-content" >' + pixei18n.upgrade.aiWritingContent + '</div>' +
                        $.pixeProUpgradeButton('', '?source=ai-inline-toolbar') +
                        '</div>';
                }
            }
        }
    }
    $.pixeStyleSelectorOption['unlock-ai-image'] = {
        'title': 'AI Image Generator',
        'options': {
            'html': {
                'type': 'html',
                'html': function () {
                    return '<div class="pixe-ss-unlock" >' +
                        '<div class="pixe-ss-unlock-title" >' + $.pixeGetAdminIcon('bolt') + pixei18n.upgrade.aiImageTitle + '</div>' +
                        '<div class="pixe-ss-unlock-content" >' + pixei18n.upgrade.aiImageContent + '</div>' +
                        $.pixeProUpgradeButton('', '?source=ai-image-generator') +
                        '</div>';
                }
            }
        }
    }
    $.pixeStyleSelectorOption['unlock-stock-image'] = {
        'title': pixei18n.upgrade.stockImageHead,
        'options': {
            'html': {
                'type': 'html',
                'html': function () {
                    return '<div class="pixe-ss-unlock" >' +
                        '<div class="pixe-ss-unlock-title" >' + $.pixeGetAdminIcon('bolt') + pixei18n.upgrade.stockImageTitle + '</div>' +
                        '<div class="pixe-ss-unlock-content" >' + pixei18n.upgrade.stockImageContent + '</div>' +
                        $.pixeProUpgradeButton('', '?source=stock-images') +
                        '</div>';
                }
            }
        }
    }

})(jQuery);
