import { ConditionalDynamicDisplayElement } from '../base/conditional-dynamic-display-element';
import { ImageFillType } from '../../model/image/image-fill-type';
import { GraphStateElement } from '../shared/graph/graph-state-element';
import { LOGGER_SERVICE_TOKEN } from '../../logger';
export class ImageElement extends ConditionalDynamicDisplayElement {
    constructor(element, injector, imageStore, permissionChecker, variableCommunicator, variableStore, graphStore, signalRAppId) {
        super(element, permissionChecker, variableCommunicator, variableStore, signalRAppId);
        this.graphStore = graphStore;
        this.logger = injector.get(LOGGER_SERVICE_TOKEN);
        if (!this.model.version || this.model.version < 4 || this.model.fillType !== ImageFillType.Graph) {
            let imageSourceUrl = '';
            if (this.model.imageId) {
                imageSourceUrl = imageStore.getImageUrl(this.model.imageId);
            }
            const imageEl = this.rootElement.select('image');
            // gojs-v1.7.11不输出image元素导致图片不显示，这里专门处理一下。
            if (imageEl.empty()) {
                const size = this.model.size;
                if (size) {
                    this.rootElement.append('image')
                        .attr('width', size.width)
                        .attr('height', size.height)
                        .attr('xlink:href', imageSourceUrl)
                        .attr('preserveAspectRatio', 'none')
                        .attr('crossorigin', 'anonymous');
                }
            }
            else {
                imageEl.attr('xlink:href', imageSourceUrl).attr('crossorigin', 'anonymous');
            }
        }
        else {
            this.initGraph(this.model.size.width, this.model.size.height);
        }
    }
    initGraph(width, height) {
        const graphStateElement = new GraphStateElement(this.model.graphSetting, width, height, this.graphStore, this.logger);
        graphStateElement.switchToState(0);
        this.$element.prepend(graphStateElement.Element);
    }
}
