ee28065046
* chore: upgrade angular => 8.2.2
Summary:
- upgrade angular => 8.2.2
- setup the { static: false/true } for the ViewChild
- use alignment-baseline="middle" in svg text to align correct the texts
* fix: keymap popover crash
55 lines
1.9 KiB
TypeScript
55 lines
1.9 KiB
TypeScript
import { Component, Input, ChangeDetectionStrategy, OnChanges, SimpleChanges } from '@angular/core';
|
|
|
|
import { isRectangleAsSecondaryRoleKey } from '../util';
|
|
import { SECONDARY_ROLE_BOTTOM_MARGIN } from '../../constants';
|
|
|
|
@Component({
|
|
selector: 'g[svg-text-icon-key]',
|
|
templateUrl: './svg-text-icon-key.component.html',
|
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
})
|
|
export class SvgTextIconKeyComponent implements OnChanges {
|
|
@Input() width: number;
|
|
@Input() height: number;
|
|
@Input() text: string;
|
|
@Input() icon: string;
|
|
@Input() secondaryText: string;
|
|
|
|
useWidth: number;
|
|
useHeight: number;
|
|
useX: number;
|
|
useY: number;
|
|
textY: number;
|
|
textAnchor: string;
|
|
textX: number;
|
|
secondaryTextY: number;
|
|
secondaryHeight: number;
|
|
|
|
constructor() { }
|
|
|
|
ngOnChanges(changes: SimpleChanges): void {
|
|
this.calculatePositions();
|
|
}
|
|
|
|
calculatePositions(): void {
|
|
let textYModifier = 0;
|
|
let secondaryYModifier = 0;
|
|
|
|
if (this.secondaryText && isRectangleAsSecondaryRoleKey(this.width, this.height)) {
|
|
textYModifier = this.height / 5;
|
|
secondaryYModifier = 5;
|
|
}
|
|
|
|
this.useWidth = this.width / 3;
|
|
this.useHeight = this.height / 3;
|
|
this.useX = (this.width > 2 * this.height) ? this.width * 0.6 : this.width / 3;
|
|
this.useY = (this.width > 2 * this.height) ? this.height / 3 : this.height / 2;
|
|
this.textY = ((this.width > 2 * this.height) ? this.height / 2 : this.height / 3) - textYModifier;
|
|
this.textAnchor = (this.width > 2 * this.height) ? 'end' : 'middle';
|
|
this.textX = (this.width > 2 * this.height) ? 0.6 * this.width : this.width / 2;
|
|
|
|
this.secondaryHeight = this.height / 4;
|
|
this.secondaryTextY = this.height - this.secondaryHeight - SECONDARY_ROLE_BOTTOM_MARGIN - secondaryYModifier;
|
|
}
|
|
}
|