fix change detection on push

This commit is contained in:
2023-03-26 23:53:59 +02:00
parent 383d2a533b
commit 4b25c18864
2 changed files with 19 additions and 12 deletions

View File

@@ -15,6 +15,7 @@
border-radius: 0; border-radius: 0;
background: #ffff; background: #ffff;
margin: 0; margin: 0;
color: #000;
} }
&.padding { &.padding {

View File

@@ -1,4 +1,4 @@
import {Component, ElementRef, EventEmitter, Input, OnInit, Output, QueryList, ViewChildren} from '@angular/core'; import {ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, OnInit, Output, QueryList, ViewChildren} from '@angular/core';
import {TextRenderingService} from '../../../modules/songs/services/text-rendering.service'; import {TextRenderingService} from '../../../modules/songs/services/text-rendering.service';
import {faGripLines} from '@fortawesome/free-solid-svg-icons'; import {faGripLines} from '@fortawesome/free-solid-svg-icons';
import {songSwitch} from './animation'; import {songSwitch} from './animation';
@@ -30,7 +30,7 @@ export class SongTextComponent implements OnInit {
private iText = ''; private iText = '';
private iTranspose: TransposeMode | null = null; private iTranspose: TransposeMode | null = null;
public constructor(private textRenderingService: TextRenderingService, private elRef: ElementRef<HTMLElement>) {} public constructor(private textRenderingService: TextRenderingService, private elRef: ElementRef<HTMLElement>, private cRef: ChangeDetectorRef) {}
@Input() @Input()
public set chordMode(value: ChordMode) { public set chordMode(value: ChordMode) {
@@ -49,26 +49,32 @@ export class SongTextComponent implements OnInit {
this.render(); this.render();
} }
private render() {
this.offset = 0;
this.sections = [];
if (this.fullscreen) {
setTimeout(() => (this.sections = this.textRenderingService.parse(this.iText, this.iTranspose)), 100);
} else {
this.sections = this.textRenderingService.parse(this.iText, this.iTranspose); //.sort((a, b) => a.type - b.type);
}
}
public ngOnInit(): void { public ngOnInit(): void {
setInterval(() => { setInterval(() => {
if (!this.fullscreen || this.index === -1 || !this.viewSections?.toArray()[this.index]) { if (!this.fullscreen || this.index === -1 || !this.viewSections?.toArray()[this.index]) {
this.offset = 0; this.offset = 0;
this.cRef.markForCheck();
return; return;
} }
this.offset = -this.viewSections?.toArray()[this.index].nativeElement.offsetTop; this.offset = -this.viewSections?.toArray()[this.index].nativeElement.offsetTop;
this.cRef.markForCheck();
}, 100); }, 100);
} }
private render() {
this.offset = 0;
this.sections = [];
if (this.fullscreen) {
setTimeout(() => {
this.sections = this.textRenderingService.parse(this.iText, this.iTranspose);
this.cRef.markForCheck();
}, 100);
} else {
this.sections = this.textRenderingService.parse(this.iText, this.iTranspose); //.sort((a, b) => a.type - b.type);
this.cRef.markForCheck();
}
}
public getLines(section: Section): Line[] { public getLines(section: Section): Line[] {
return section.lines.filter(_ => { return section.lines.filter(_ => {
if (_.type !== LineType.chord) { if (_.type !== LineType.chord) {