@foblex/flow
Version:
An Angular library designed to simplify the creation and manipulation of dynamic flow. Provides components for flows, nodes, and connections, automating node manipulation and inter-node connections.
75 lines • 9.6 kB
JavaScript
import { Directive, Inject } from '@angular/core';
import { F_CONNECTION_IDENTIFIERS } from '../f-connection-identifiers';
import { F_CONNECTION } from '../f-connection.injection-token';
import * as i0 from "@angular/core";
import * as i1 from "@foblex/platform";
export class FConnectionTextPathDirective {
elementReference;
base;
fBrowser;
get linkToConnection() {
return F_CONNECTION_IDENTIFIERS.linkToConnection(this.base.fId + this.base.fOutputId + this.base.fInputId);
}
get hostElement() {
return this.elementReference.nativeElement;
}
symbolWidth = 8;
fontSize = '12px';
constructor(elementReference, base, fBrowser) {
this.elementReference = elementReference;
this.base = base;
this.fBrowser = fBrowser;
}
ngOnInit() {
this.hostElement.setAttribute('text-anchor', `middle`);
this.symbolWidth = this.getSymbolWidth(this.base.fText || '');
}
getBBox() {
return this.hostElement.getBBox();
}
redraw() {
this.hostElement.setAttribute('startOffset', this.base.fTextStartOffset || '50%');
}
getFontStyles(element) {
const computedStyles = this.fBrowser.window.getComputedStyle(element);
return {
fontSize: computedStyles.fontSize,
fontFamily: computedStyles.fontFamily
};
}
getSymbolWidth(name) {
const text = name || 'connection';
const { fontFamily, fontSize } = this.getFontStyles(this.hostElement);
this.fontSize = fontSize || '12px';
const canvas = this.fBrowser.document.createElement('canvas');
let context;
try {
context = canvas.getContext('2d');
}
catch (e) {
context = null;
}
if (!context) {
return 0;
}
context.font = `${fontSize} ${fontFamily}`;
const metrics = context.measureText(text);
const symbolWidth = metrics.width / text.length;
return symbolWidth;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionTextPathDirective, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: FConnectionTextPathDirective, selector: "textPath[f-connection-text-path]", host: { properties: { "attr.href": "linkToConnection" } }, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionTextPathDirective, decorators: [{
type: Directive,
args: [{
selector: 'textPath[f-connection-text-path]',
host: {
'[attr.href]': 'linkToConnection'
}
}]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: undefined, decorators: [{
type: Inject,
args: [F_CONNECTION]
}] }, { type: i1.BrowserService }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZi1jb25uZWN0aW9uLXRleHQtcGF0aC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9mLWZsb3cvc3JjL2YtY29ubmVjdGlvbi9jb21tb24vZi1jb25uZWN0aW9uLXRleHQvZi1jb25uZWN0aW9uLXRleHQtcGF0aC5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxNQUFNLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDdEUsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDdkUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlDQUFpQyxDQUFDOzs7QUFZL0QsTUFBTSxPQUFPLDRCQUE0QjtJQWdCM0I7SUFDc0I7SUFDdEI7SUFoQlosSUFBVyxnQkFBZ0I7UUFDekIsT0FBTyx3QkFBd0IsQ0FBQyxnQkFBZ0IsQ0FDOUMsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQ3pELENBQUM7SUFDSixDQUFDO0lBRUQsSUFBVyxXQUFXO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsQ0FBQztJQUM3QyxDQUFDO0lBRU0sV0FBVyxHQUFXLENBQUMsQ0FBQztJQUN4QixRQUFRLEdBQVcsTUFBTSxDQUFDO0lBRWpDLFlBQ1ksZ0JBQWdELEVBQzFCLElBQStDLEVBQ3JFLFFBQXdCO1FBRnhCLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBZ0M7UUFDMUIsU0FBSSxHQUFKLElBQUksQ0FBMkM7UUFDckUsYUFBUSxHQUFSLFFBQVEsQ0FBZ0I7SUFFcEMsQ0FBQztJQUVNLFFBQVE7UUFDYixJQUFJLENBQUMsV0FBVyxDQUFDLFlBQVksQ0FBQyxhQUFhLEVBQUUsUUFBUSxDQUFDLENBQUM7UUFDdkQsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxJQUFJLEVBQUUsQ0FBQyxDQUFDO0lBQ2hFLENBQUM7SUFFTSxPQUFPO1FBQ1osT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU8sRUFBRSxDQUFDO0lBQ3BDLENBQUM7SUFFTSxNQUFNO1FBQ1gsSUFBSSxDQUFDLFdBQVcsQ0FBQyxZQUFZLENBQUMsYUFBYSxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLElBQUksS0FBSyxDQUFDLENBQUM7SUFDcEYsQ0FBQztJQUVPLGFBQWEsQ0FBQyxPQUEyQjtRQUMvQyxNQUFNLGNBQWMsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUN0RSxPQUFPO1lBQ0wsUUFBUSxFQUFFLGNBQWMsQ0FBQyxRQUFRO1lBQ2pDLFVBQVUsRUFBRSxjQUFjLENBQUMsVUFBVTtTQUN0QyxDQUFDO0lBQ0osQ0FBQztJQUVPLGNBQWMsQ0FBQyxJQUFZO1FBQ2pDLE1BQU0sSUFBSSxHQUFHLElBQUksSUFBSSxZQUFZLENBQUM7UUFDbEMsTUFBTSxFQUFFLFVBQVUsRUFBRSxRQUFRLEVBQUUsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUN0RSxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsSUFBSSxNQUFNLENBQUM7UUFDbkMsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsYUFBYSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBQzlELElBQUksT0FBTyxDQUFDO1FBRVosSUFBSSxDQUFDO1lBQ0gsT0FBTyxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDcEMsQ0FBQztRQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUM7WUFDWCxPQUFPLEdBQUcsSUFBSSxDQUFDO1FBQ2pCLENBQUM7UUFDRCxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7WUFDYixPQUFPLENBQUMsQ0FBQztRQUNYLENBQUM7UUFFRCxPQUFPLENBQUMsSUFBSSxHQUFHLEdBQUksUUFBUyxJQUFLLFVBQVcsRUFBRSxDQUFDO1FBRS9DLE1BQU0sT0FBTyxHQUFHLE9BQU8sQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDMUMsTUFBTSxXQUFXLEdBQUcsT0FBTyxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDO1FBQ2hELE9BQU8sV0FBVyxDQUFDO0lBQ3JCLENBQUM7d0dBaEVVLDRCQUE0Qiw0Q0FpQjNCLFlBQVk7NEZBakJiLDRCQUE0Qjs7NEZBQTVCLDRCQUE0QjtrQkFOeEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsa0NBQWtDO29CQUM1QyxJQUFJLEVBQUU7d0JBQ0osYUFBYSxFQUFFLGtCQUFrQjtxQkFDbEM7aUJBQ0Y7OzBCQWtCTSxNQUFNOzJCQUFDLFlBQVkiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIEluamVjdCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGX0NPTk5FQ1RJT05fSURFTlRJRklFUlMgfSBmcm9tICcuLi9mLWNvbm5lY3Rpb24taWRlbnRpZmllcnMnO1xuaW1wb3J0IHsgRl9DT05ORUNUSU9OIH0gZnJvbSAnLi4vZi1jb25uZWN0aW9uLmluamVjdGlvbi10b2tlbic7XG5pbXBvcnQgeyBJSGFzQ29ubmVjdGlvblRleHQgfSBmcm9tICcuLi9pLWhhcy1jb25uZWN0aW9uLXRleHQnO1xuaW1wb3J0IHsgSUhhc0Nvbm5lY3Rpb25Gcm9tVG8gfSBmcm9tICcuLi9pLWhhcy1jb25uZWN0aW9uLWZyb20tdG8nO1xuaW1wb3J0IHsgQnJvd3NlclNlcnZpY2UgfSBmcm9tICdAZm9ibGV4L3BsYXRmb3JtJztcbmltcG9ydCB7IElIYXNIb3N0RWxlbWVudCB9IGZyb20gJy4uLy4uLy4uL2ktaGFzLWhvc3QtZWxlbWVudCc7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ3RleHRQYXRoW2YtY29ubmVjdGlvbi10ZXh0LXBhdGhdJyxcbiAgaG9zdDoge1xuICAgICdbYXR0ci5ocmVmXSc6ICdsaW5rVG9Db25uZWN0aW9uJ1xuICB9XG59KVxuZXhwb3J0IGNsYXNzIEZDb25uZWN0aW9uVGV4dFBhdGhEaXJlY3RpdmUgaW1wbGVtZW50cyBJSGFzSG9zdEVsZW1lbnQsIE9uSW5pdCB7XG5cbiAgcHVibGljIGdldCBsaW5rVG9Db25uZWN0aW9uKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIEZfQ09OTkVDVElPTl9JREVOVElGSUVSUy5saW5rVG9Db25uZWN0aW9uKFxuICAgICAgdGhpcy5iYXNlLmZJZCArIHRoaXMuYmFzZS5mT3V0cHV0SWQgKyB0aGlzLmJhc2UuZklucHV0SWRcbiAgICApO1xuICB9XG5cbiAgcHVibGljIGdldCBob3N0RWxlbWVudCgpOiBTVkdUZXh0UGF0aEVsZW1lbnQge1xuICAgIHJldHVybiB0aGlzLmVsZW1lbnRSZWZlcmVuY2UubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIHB1YmxpYyBzeW1ib2xXaWR0aDogbnVtYmVyID0gODtcbiAgcHVibGljIGZvbnRTaXplOiBzdHJpbmcgPSAnMTJweCc7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgICBwcml2YXRlIGVsZW1lbnRSZWZlcmVuY2U6IEVsZW1lbnRSZWY8U1ZHVGV4dFBhdGhFbGVtZW50PixcbiAgICAgIEBJbmplY3QoRl9DT05ORUNUSU9OKSBwcml2YXRlIGJhc2U6IElIYXNDb25uZWN0aW9uVGV4dCAmIElIYXNDb25uZWN0aW9uRnJvbVRvLFxuICAgICAgcHJpdmF0ZSBmQnJvd3NlcjogQnJvd3NlclNlcnZpY2VcbiAgKSB7XG4gIH1cblxuICBwdWJsaWMgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5ob3N0RWxlbWVudC5zZXRBdHRyaWJ1dGUoJ3RleHQtYW5jaG9yJywgYG1pZGRsZWApO1xuICAgIHRoaXMuc3ltYm9sV2lkdGggPSB0aGlzLmdldFN5bWJvbFdpZHRoKHRoaXMuYmFzZS5mVGV4dCB8fCAnJyk7XG4gIH1cblxuICBwdWJsaWMgZ2V0QkJveCgpOiBET01SZWN0IHtcbiAgICByZXR1cm4gdGhpcy5ob3N0RWxlbWVudC5nZXRCQm94KCk7XG4gIH1cblxuICBwdWJsaWMgcmVkcmF3KCk6IHZvaWQge1xuICAgIHRoaXMuaG9zdEVsZW1lbnQuc2V0QXR0cmlidXRlKCdzdGFydE9mZnNldCcsIHRoaXMuYmFzZS5mVGV4dFN0YXJ0T2Zmc2V0IHx8ICc1MCUnKTtcbiAgfVxuXG4gIHByaXZhdGUgZ2V0Rm9udFN0eWxlcyhlbGVtZW50OiBTVkdUZXh0UGF0aEVsZW1lbnQpOiB7IGZvbnRTaXplOiBzdHJpbmcsIGZvbnRGYW1pbHk6IHN0cmluZyB9IHtcbiAgICBjb25zdCBjb21wdXRlZFN0eWxlcyA9IHRoaXMuZkJyb3dzZXIud2luZG93LmdldENvbXB1dGVkU3R5bGUoZWxlbWVudCk7XG4gICAgcmV0dXJuIHtcbiAgICAgIGZvbnRTaXplOiBjb21wdXRlZFN0eWxlcy5mb250U2l6ZSxcbiAgICAgIGZvbnRGYW1pbHk6IGNvbXB1dGVkU3R5bGVzLmZvbnRGYW1pbHlcbiAgICB9O1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRTeW1ib2xXaWR0aChuYW1lOiBzdHJpbmcpOiBudW1iZXIge1xuICAgIGNvbnN0IHRleHQgPSBuYW1lIHx8ICdjb25uZWN0aW9uJztcbiAgICBjb25zdCB7IGZvbnRGYW1pbHksIGZvbnRTaXplIH0gPSB0aGlzLmdldEZvbnRTdHlsZXModGhpcy5ob3N0RWxlbWVudCk7XG4gICAgdGhpcy5mb250U2l6ZSA9IGZvbnRTaXplIHx8ICcxMnB4JztcbiAgICBjb25zdCBjYW52YXMgPSB0aGlzLmZCcm93c2VyLmRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2NhbnZhcycpO1xuICAgIGxldCBjb250ZXh0O1xuXG4gICAgdHJ5IHtcbiAgICAgIGNvbnRleHQgPSBjYW52YXMuZ2V0Q29udGV4dCgnMmQnKTtcbiAgICB9IGNhdGNoIChlKSB7XG4gICAgICBjb250ZXh0ID0gbnVsbDtcbiAgICB9XG4gICAgaWYgKCFjb250ZXh0KSB7XG4gICAgICByZXR1cm4gMDtcbiAgICB9XG5cbiAgICBjb250ZXh0LmZvbnQgPSBgJHsgZm9udFNpemUgfSAkeyBmb250RmFtaWx5IH1gO1xuXG4gICAgY29uc3QgbWV0cmljcyA9IGNvbnRleHQubWVhc3VyZVRleHQodGV4dCk7XG4gICAgY29uc3Qgc3ltYm9sV2lkdGggPSBtZXRyaWNzLndpZHRoIC8gdGV4dC5sZW5ndGg7XG4gICAgcmV0dXJuIHN5bWJvbFdpZHRoO1xuICB9XG59XG5cbiJdfQ==