fix change detection on push
This commit is contained in:
@@ -15,6 +15,7 @@
|
|||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
background: #ffff;
|
background: #ffff;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.padding {
|
&.padding {
|
||||||
|
|||||||
@@ -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) {
|
||||||
|
|||||||
Reference in New Issue
Block a user