ngx-editor/esm2022/lib/plugins/image-resize.mjs

The Rich Text Editor for Angular, Built on ProseMirror

import { ApplicationRef, createComponent } from '@angular/core';
import { NodeSelection, Plugin, PluginKey } from 'prosemirror-state';
import { ImageViewComponent } from '../components/image-view/image-view.component';
class ImageRezieView {
    constructor(node, view, getPos, injector) {
        this.updating = false;
        this.handleResize = () => {
            if (this.updating) {
                return;
            }
            const { state, dispatch } = this.view;
            const { tr } = state;
            const transaction = tr.setNodeMarkup(this.getPos(), undefined, {
                ...this.node.attrs,
                width: this.imageComponentRef.instance.outerWidth,
            });
            const resolvedPos = transaction.doc.resolve(this.getPos());
            const newSelection = new NodeSelection(resolvedPos);
            transaction.setSelection(newSelection);
            dispatch(transaction);
        };
        this.applicationRef = injector.get(ApplicationRef);
        // create component ref
        this.imageComponentRef = createComponent(ImageViewComponent, {
            environmentInjector: this.applicationRef.injector,
        });
        // Attach to the view so that the change detector knows to run
        this.applicationRef.attachView(this.imageComponentRef.hostView);
        this.setNodeAttributes(node.attrs);
        this.imageComponentRef.instance.view = view;
        this.dom = this.imageComponentRef.location.nativeElement;
        this.view = view;
        this.node = node;
        this.getPos = getPos;
        this.resizeSubscription = this.imageComponentRef.instance.imageResize.subscribe(() => {
            this.handleResize();
        });
    }
    computeChanges(prevAttrs, newAttrs) {
        return JSON.stringify(prevAttrs) === JSON.stringify(newAttrs);
    }
    setNodeAttributes(attrs) {
        this.imageComponentRef.instance.src = attrs['src'];
        this.imageComponentRef.instance.alt = attrs['alt'];
        this.imageComponentRef.instance.title = attrs['title'];
        this.imageComponentRef.instance.outerWidth = attrs['width'];
    }
    update(node) {
        if (node.type !== this.node.type) {
            return false;
        }
        this.node = node;
        const changed = this.computeChanges(this.node.attrs, node.attrs);
        if (changed) {
            this.updating = true;
            this.setNodeAttributes(node.attrs);
            this.updating = false;
        }
        return true;
    }
    ignoreMutation() {
        return true;
    }
    selectNode() {
        this.imageComponentRef.instance.selected = true;
    }
    deselectNode() {
        this.imageComponentRef.instance.selected = false;
    }
    destroy() {
        this.resizeSubscription.unsubscribe();
        this.applicationRef.detachView(this.imageComponentRef.hostView);
    }
}
const imageResizePlugin = (injector) => {
    return new Plugin({
        key: new PluginKey('image-resize'),
        props: {
            nodeViews: {
                image: (node, view, getPos) => {
                    return new ImageRezieView(node, view, getPos, injector);
                },
            },
        },
    });
};
export default imageResizePlugin;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UtcmVzaXplLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWVkaXRvci9zcmMvbGliL3BsdWdpbnMvaW1hZ2UtcmVzaXplLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQWdCLGVBQWUsRUFBWSxNQUFNLGVBQWUsQ0FBQztBQUV4RixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQztBQUlyRSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUVuRixNQUFNLGNBQWM7SUFZbEIsWUFBWSxJQUFxQixFQUFFLElBQWdCLEVBQUUsTUFBb0IsRUFBRSxRQUFrQjtRQUY3RixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBcUNqQixpQkFBWSxHQUFHLEdBQVMsRUFBRTtZQUN4QixJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUU7Z0JBQ2pCLE9BQU87YUFDUjtZQUVELE1BQU0sRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQztZQUN0QyxNQUFNLEVBQUUsRUFBRSxFQUFFLEdBQUcsS0FBSyxDQUFDO1lBRXJCLE1BQU0sV0FBVyxHQUFHLEVBQUUsQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxFQUFFLFNBQVMsRUFBRTtnQkFDN0QsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUs7Z0JBQ2xCLEtBQUssRUFBRSxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLFVBQVU7YUFDbEQsQ0FBQyxDQUFDO1lBRUgsTUFBTSxXQUFXLEdBQUcsV0FBVyxDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLENBQUM7WUFDM0QsTUFBTSxZQUFZLEdBQUcsSUFBSSxhQUFhLENBQUMsV0FBVyxDQUFDLENBQUM7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QUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLFFBQVEsR0FBRyxLQUFLLENBQUM7SUFDbkQsQ0FBQztJQUVELE9BQU87UUFDTCxJQUFJLENBQUMsa0JBQWtCLENBQUMsV0FBVyxFQUFFLENBQUM7UUFDdEMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ2xFLENBQUM7Q0FDRjtBQUVELE1BQU0saUJBQWlCLEdBQUcsQ0FBQyxRQUFrQixFQUFVLEVBQUU7SUFDdkQsT0FBTyxJQUFJLE1BQU0sQ0FBQztRQUNoQixHQUFHLEVBQUUsSUFBSSxTQUFTLENBQUMsY0FBYyxDQUFDO1FBQ2xDLEtBQUssRUFBRTtZQUNMLFNBQVMsRUFBRTtnQkFDVCxLQUFLLEVBQUUsQ0FBQyxJQUFxQixFQUFFLElBQWdCLEVBQUUsTUFBb0IsRUFBRSxFQUFFO29CQUN2RSxPQUFPLElBQUksY0FBYyxDQUFDLElBQUksRUFBRSxJQUFJLEVBQUUsTUFBTSxFQUFFLFFBQVEsQ0FBQyxDQUFDO2dCQUMxRCxDQUFDO2FBQ0Y7U0FDRjtLQUNGLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQztBQUVGLGVBQWUsaUJBQWlCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBcHBsaWNhdGlvblJlZiwgQ29tcG9uZW50UmVmLCBjcmVhdGVDb21wb25lbnQsIEluamVjdG9yIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOb2RlIGFzIFByb3NlTWlycm9yTm9kZSB9IGZyb20gJ3Byb3NlbWlycm9yLW1vZGVsJztcbmltcG9ydCB7IE5vZGVTZWxlY3Rpb24sIFBsdWdpbiwgUGx1Z2luS2V5IH0gZnJvbSAncHJvc2VtaXJyb3Itc3RhdGUnO1xuaW1wb3J0IHsgRWRpdG9yVmlldywgTm9kZVZpZXcgfSBmcm9tICdwcm9zZW1pcnJvci12aWV3JztcbmltcG9ydCB7IFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xuXG5pbXBvcnQgeyBJbWFnZVZpZXdDb21wb25lbnQgfSBmcm9tICcuLi9jb21wb25lbnRzL2ltYWdlLXZpZXcvaW1hZ2Utdmlldy5jb21wb25lbnQnO1xuXG5jbGFzcyBJbWFnZVJlemllVmlldyBpbXBsZW1lbnRzIE5vZGVWaWV3IHtcbiAgZG9tOiBIVE1MRWxlbWVudDtcbiAgdmlldzogRWRpdG9yVmlldztcbiAgZ2V0UG9zOiAoKSA9PiBudW1iZXI7XG5cbiAgYXBwbGljYXRpb25SZWY6IEFwcGxpY2F0aW9uUmVmO1xuICBpbWFnZUNvbXBvbmVudFJlZjogQ29tcG9uZW50UmVmPEltYWdlVmlld0NvbXBvbmVudD47XG4gIHJlc2l6ZVN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuXG4gIG5vZGU6IFByb3NlTWlycm9yTm9kZTtcbiAgdXBkYXRpbmcgPSBmYWxzZTtcblxuICBjb25zdHJ1Y3Rvcihub2RlOiBQcm9zZU1pcnJvck5vZGUsIHZpZXc6IEVkaXRvclZpZXcsIGdldFBvczogKCkgPT4gbnVtYmVyLCBpbmplY3RvcjogSW5qZWN0b3IpIHtcbiAgICB0aGlzLmFwcGxpY2F0aW9uUmVmID0gaW5qZWN0b3IuZ2V0KEFwcGxpY2F0aW9uUmVmKTtcblxuICAgIC8vIGNyZWF0ZSBjb21wb25lbnQgcmVmXG4gICAgdGhpcy5pbWFnZUNvbXBvbmVudFJlZiA9IGNyZWF0ZUNvbXBvbmVudChJbWFnZVZpZXdDb21wb25lbnQsIHtcbiAgICAgIGVudmlyb25tZW50SW5qZWN0b3I6IHRoaXMuYXBwbGljYXRpb25SZWYuaW5qZWN0b3IsXG4gICAgfSk7XG5cbiAgICAvLyBBdHRhY2ggdG8gdGhlIHZpZXcgc28gdGhhdCB0aGUgY2hhbmdlIGRldGVjdG9yIGtub3dzIHRvIHJ1blxuICAgIHRoaXMuYXBwbGljYXRpb25SZWYuYXR0YWNoVmlldyh0aGlzLmltYWdlQ29tcG9uZW50UmVmLmhvc3RWaWV3KTtcblxuICAgIHRoaXMuc2V0Tm9kZUF0dHJpYnV0ZXMobm9kZS5hdHRycyk7XG4gICAgdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS52aWV3ID0gdmlldztcblxuICAgIHRoaXMuZG9tID0gdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5sb2NhdGlvbi5uYXRpdmVFbGVtZW50O1xuICAgIHRoaXMudmlldyA9IHZpZXc7XG4gICAgdGhpcy5ub2RlID0gbm9kZTtcbiAgICB0aGlzLmdldFBvcyA9IGdldFBvcztcblxuICAgIHRoaXMucmVzaXplU3Vic2NyaXB0aW9uID0gdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS5pbWFnZVJlc2l6ZS5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgdGhpcy5oYW5kbGVSZXNpemUoKTtcbiAgICB9KTtcbiAgfVxuXG4gIHByaXZhdGUgY29tcHV0ZUNoYW5nZXMocHJldkF0dHJzOiBSZWNvcmQ8c3RyaW5nLCBhbnk+LCBuZXdBdHRyczogUmVjb3JkPHN0cmluZywgYW55Pik6IGJvb2xlYW4ge1xuICAgIHJldHVybiBKU09OLnN0cmluZ2lmeShwcmV2QXR0cnMpID09PSBKU09OLnN0cmluZ2lmeShuZXdBdHRycyk7XG4gIH1cblxuICBwcml2YXRlIHNldE5vZGVBdHRyaWJ1dGVzKGF0dHJzOiBSZWNvcmQ8c3RyaW5nLCBhbnk+KTogdm9pZCB7XG4gICAgdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS5zcmMgPSBhdHRyc1snc3JjJ107XG4gICAgdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS5hbHQgPSBhdHRyc1snYWx0J107XG4gICAgdGhpcy5pbWFnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS50aXRsZSA9IGF0dHJzWyd0aXRsZSddO1xuICAgIHRoaXMuaW1hZ2VDb21wb25lbnRSZWYuaW5zdGFuY2Uub3V0ZXJXaWR0aCA9IGF0dHJzWyd3aWR0aCddO1xuICB9XG5cbiAgaGFuZGxlUmVzaXplID0gKCk6IHZvaWQgPT4ge1xuICAgIGlmICh0aGlzLnVwZGF0aW5nKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgY29uc3QgeyBzdGF0ZSwgZGlzcGF0Y2ggfSA9IHRoaXMudmlldztcbiAgICBjb25zdCB7IHRyIH0gPSBzdGF0ZTtcblxuICAgIGNvbnN0IHRyYW5zYWN0aW9uID0gdHIuc2V0Tm9kZU1hcmt1cCh0aGlzLmdldFBvcygpLCB1bmRlZmluZWQsIHtcbiAgICAgIC4uLnRoaXMubm9kZS5hdHRycyxcbiAgICAgIHdpZHRoOiB0aGlzLmltYWdlQ29tcG9uZW50UmVmLmluc3RhbmNlLm91dGVyV2lkdGgsXG4gICAgfSk7XG5cbiAgICBjb25zdCByZXNvbHZlZFBvcyA9IHRyYW5zYWN0aW9uLmRvYy5yZXNvbHZlKHRoaXMuZ2V0UG9zKCkpO1xuICAgIGNvbnN0IG5ld1NlbGVjdGlvbiA9IG5ldyBOb2RlU2VsZWN0aW9uKHJlc29sdmVkUG9zKTtcblxuICAgIHRyYW5zYWN0aW9uLnNldFNlbGVjdGlvbihuZXdTZWxlY3Rpb24pO1xuICAgIGRpc3BhdGNoKHRyYW5zYWN0aW9uKTtcbiAgfTtcblxuICB1cGRhdGUobm9kZTogUHJvc2VNaXJyb3JOb2RlKTogYm9vbGVhbiB7XG4gICAgaWYgKG5vZGUudHlwZSAhPT0gdGhpcy5ub2RlLnR5cGUpIHtcbiAgICAgIHJldHVybiBmYWxzZTtcbiAgICB9XG5cbiAgICB0aGlzLm5vZGUgPSBub2RlO1xuXG4gICAgY29uc3QgY2hhbmdlZCA9IHRoaXMuY29tcHV0ZUNoYW5nZXModGhpcy5ub2RlLmF0dHJzLCBub2RlLmF0dHJzKTtcbiAgICBpZiAoY2hhbmdlZCkge1xuICAgICAgdGhpcy51cGRhdGluZyA9IHRydWU7XG4gICAgICB0aGlzLnNldE5vZGVBdHRyaWJ1dGVzKG5vZGUuYXR0cnMpO1xuICAgICAgdGhpcy51cGRhdGluZyA9IGZhbHNlO1xuICAgIH1cbiAgICByZXR1cm4gdHJ1ZTtcbiAgfVxuXG4gIGlnbm9yZU11dGF0aW9uKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0cnVlO1xuICB9XG5cbiAgc2VsZWN0Tm9kZSgpOiB2b2lkIHtcbiAgICB0aGlzLmltYWdlQ29tcG9uZW50UmVmLmluc3RhbmNlLnNlbGVjdGVkID0gdHJ1ZTtcbiAgfVxuXG4gIGRlc2VsZWN0Tm9kZSgpOiB2b2lkIHtcbiAgICB0aGlzLmltYWdlQ29tcG9uZW50UmVmLmluc3RhbmNlLnNlbGVjdGVkID0gZmFsc2U7XG4gIH1cblxuICBkZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMucmVzaXplU3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gICAgdGhpcy5hcHBsaWNhdGlvblJlZi5kZXRhY2hWaWV3KHRoaXMuaW1hZ2VDb21wb25lbnRSZWYuaG9zdFZpZXcpO1xuICB9XG59XG5cbmNvbnN0IGltYWdlUmVzaXplUGx1Z2luID0gKGluamVjdG9yOiBJbmplY3Rvcik6IFBsdWdpbiA9PiB7XG4gIHJldHVybiBuZXcgUGx1Z2luKHtcbiAgICBrZXk6IG5ldyBQbHVnaW5LZXkoJ2ltYWdlLXJlc2l6ZScpLFxuICAgIHByb3BzOiB7XG4gICAgICBub2RlVmlld3M6IHtcbiAgICAgICAgaW1hZ2U6IChub2RlOiBQcm9zZU1pcnJvck5vZGUsIHZpZXc6IEVkaXRvclZpZXcsIGdldFBvczogKCkgPT4gbnVtYmVyKSA9PiB7XG4gICAgICAgICAgcmV0dXJuIG5ldyBJbWFnZVJlemllVmlldyhub2RlLCB2aWV3LCBnZXRQb3MsIGluamVjdG9yKTtcbiAgICAgICAgfSxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBpbWFnZVJlc2l6ZVBsdWdpbjtcbiJdfQ==