"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.rawExtractStyle = exports._extractStyle = exports.extractStyle = void 0;
const isFrameRelative_1 = require("../isFrameRelative");
const Component_1 = require("../system/platform/component/Iframe/Component");
const svg_1 = require("../util/svg");
function extractStyle(component, measureText) {
    const { $element } = component;
    let _element = $element;
    // AD HOC
    if (component instanceof Component_1.default) {
        _element = component._iframe_el;
    }
    return _extractStyle(component, _element, measureText);
}
exports.extractStyle = extractStyle;
function _extractStyle(component, element, measureText) {
    if (element instanceof Text) {
        const fontSize = component.getFontSize();
        const { textContent } = component.$element;
        const { width, height } = measureText(textContent, fontSize);
        return {
            left: '2px',
            top: '2px',
            width: `${width}px`,
            height: `${height}px`,
        };
    }
    const style = rawExtractStyle(element);
    if (style['display'] === 'contents') {
        return {
            width: '100%',
            height: '100%',
        };
    }
    if (element instanceof HTMLCanvasElement) {
        const treatProp = (name) => {
            const prop = component.getProp(name);
            if (prop !== undefined) {
                if (typeof prop === 'string') {
                    if ((0, isFrameRelative_1.isFrameRelativeValue)(prop)) {
                        const prop_num = prop.substring(0, prop.length - 2);
                        style[name] = `${prop_num}%`;
                    }
                    else {
                        // TODO
                    }
                }
                else {
                    style[name] = `${prop}px`;
                }
            }
            else {
                style[name] = `${element[name]}px`;
            }
        };
        treatProp('width');
        treatProp('height');
    }
    if (element instanceof SVGPathElement) {
        const d = element.getAttribute('d');
        const bb = (0, svg_1.getPathBoundingBox)(d);
        style['width'] = `${bb.width}px`;
        style['height'] = `${bb.height}px`;
        // TODO
    }
    if (element instanceof SVGRectElement) {
        style['width'] = `${element.width.animVal.value}px`;
        style['height'] = `${element.height.animVal.value}px`;
        // TODO
    }
    if (element instanceof SVGCircleElement) {
        const r = element.r.animVal.value;
        const width = 2 * r;
        const height = width;
        style['width'] = `${width}px`;
        style['height'] = `${height}px`;
        // TODO
    }
    return style;
}
exports._extractStyle = _extractStyle;
function rawExtractStyle(element) {
    const style = {};
    for (const key in element.style) {
        const value = element.style[key];
        if (value && typeof value === 'string' && isNaN(parseInt(key))) {
            style[key] = value;
        }
    }
    return style;
}
exports.rawExtractStyle = rawExtractStyle;
//# sourceMappingURL=extractStyle.js.map