@aurigma/design-editor-iframe/FullWindowHandler.js

Using this module you can embed Design Editor (a part of Customer's Canvas) to your page through the IFrame API.

import { Events } from "./PostMessage/RpcTypes";
/** @internal */
var FullWindowHandler = /** @class */ (function () {
    function FullWindowHandler(editor, _iframe) {
        var _this = this;
        this._iframe = _iframe;
        this._updateFullWindowStylesheet = function () {
            var styleId = 'ccFullWindowIframeStylesheet';
            if (document.getElementById(styleId)) {
                if (document.getElementById(styleId).remove)
                    document.getElementById(styleId).remove();
                else if (document.getElementById(styleId)["removeNode"])
                    document.getElementById(styleId)["removeNode"]();
            }
            var style = document.createElement('style');
            style.type = 'text/css';
            style.id = styleId;
            var height = window.innerHeight;
            var width = window.innerWidth;
            style.innerHTML = '.ccFullWindowIframe{' +
                'position: fixed !important;' +
                'top: 0!important;' +
                'left: 0!important;' +
                'bottom:0!important;' +
                'right: 0!important;' +
                'margin: 0!important;' +
                ("width: " + width + "px !important;") +
                ("height: " + height + "px !important;") +
                'background-color: white!important;' +
                'z-index: ' + _this._getMaxZIndex() + ' !important;' +
                '}';
            document.getElementsByTagName('head')[0].appendChild(style);
        };
        editor.subscribe(Events.FullWindow, function () { return _this._setFullWindow(); });
        editor.subscribe(Events.OriginalSize, function () { return _this._setOriginalSize(); });
    }
    FullWindowHandler.prototype._setOriginalSize = function () {
        this._iframe.classList.remove('ccFullWindowIframe');
        window.removeEventListener("resize", this._updateFullWindowStylesheet);
    };
    FullWindowHandler.prototype._setFullWindow = function () {
        this._updateFullWindowStylesheet();
        this._iframe.classList.add('ccFullWindowIframe');
        window.addEventListener("resize", this._updateFullWindowStylesheet);
    };
    FullWindowHandler.prototype._getMaxZIndex = function () {
        var highestZ = 0;
        var tags = document.getElementsByTagName('*');
        if (tags.length === 0)
            return 0;
        for (var i = 0; i < tags.length; i++) {
            var zIndex = parseInt(window.getComputedStyle(tags[i]).zIndex);
            if (zIndex > highestZ)
                highestZ = zIndex;
        }
        return highestZ;
    };
    return FullWindowHandler;
}());
export { FullWindowHandler };
//# sourceMappingURL=FullWindowHandler.js.map