Rich Lyric View

src/app/app.module.ts

@@ -293,6 +293,8 @@ import { VolumeIconComponent } from './ui/components/volume-icon/volume-icon.com
 import { EditTracksDialogComponent } from './ui/components/dialogs/edit-tracks-dialog/edit-tracks-dialog.component';
 import { InfoDialogComponent } from './ui/components/dialogs/info-dialog/info-dialog.component';
 import { IterableMenuComponent } from './ui/components/common/iterable-menu.component';
+import { SrtLyricsGetter } from './services/lyrics/srt-lyrics-getter';
+import { GripesSettingsComponent } from './ui/components/settings/gripes-settings/gripes-settings.component';
 
 export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
     return new TranslateHttpLoader(http, './assets/i18n/', '.json');
@@ -551,6 +553,7 @@ export function settingsInitializerFactory(settings: SettingsBase) {
         GuidFactory,
         EmbeddedLyricsGetter,
         LrcLyricsGetter,
+        SrtLyricsGetter,
         OnlineLyricsGetter,
         IntegrationTestRunner,
         AudioVisualizer,

src/app/common/api/lyrics/lyrics-source-type.ts

@@ -3,4 +3,5 @@ export enum LyricsSourceType {
     embedded = 2,
     lrc = 3,
     online = 4,
+    srt = 5,
 }

src/app/common/settings/settings.base.ts

@@ -86,6 +86,9 @@ export abstract class SettingsBase {
     public abstract fullPlayerPositionSizeMaximized: string;
     public abstract coverPlayerPosition: string;
     public abstract useGaplessPlayback: boolean;
+    public abstract showRichLyrics: boolean;
+    public abstract richLyricsLineCount: number;
+    public abstract richLyricsFontSize: number;
     public abstract jumpToPlayingSong: boolean;
     public abstract showSquareImages: boolean;
     public abstract useCompactYearView: boolean;

src/app/common/settings/settings.ts

@@ -817,6 +817,33 @@ export class Settings implements SettingsBase {
         this.set('useGaplessPlayback', v);
     }
 
+    // showRichLyrics
+    public get showRichLyrics(): boolean {
+        return this.get<boolean>('showRichLyrics');
+    }
+
+    public set showRichLyrics(v: boolean) {
+        this.set('showRichLyrics', v);
+    }
+
+    // richLyricsLineCount
+    public get richLyricsLineCount(): number {
+        return this.get<number>('richLyricsLineCount');
+    }
+
+    public set richLyricsLineCount(v: number) {
+        this.set('richLyricsLineCount', v)
+    }
+
+    // richLyricsFontSize
+    public get richLyricsFontSize(): number {
+        return this.get<number>('richLyricsFontSize');
+    }
+
+    public set richLyricsFontSize(v: number) {
+        this.set('richLyricsFontSize', v);
+    }
+
     // jumpToPlayingSong
     public get jumpToPlayingSong(): boolean {
         return this.get<boolean>('jumpToPlayingSong');

src/app/services/lyrics/embedded-lyrics-getter.ts

@@ -18,6 +18,6 @@ export class EmbeddedLyricsGetter implements ILyricsGetter {
             return LyricsModel.empty(track);
         }
 
-        return new LyricsModel(track, '', LyricsSourceType.embedded, fileMetadata.lyrics);
+        return LyricsModel.createSimple(track, '', LyricsSourceType.embedded, fileMetadata.lyrics);
     }
 }

src/app/services/lyrics/lrc-lyrics-getter.ts

@@ -19,12 +19,22 @@ export class LrcLyricsGetter implements ILyricsGetter {
 
         const lines: string[] = await this.fileAccess.readLinesAsync(lrcFilePath);
         let lyricsText: string = '';
+        const lyricLines: string[] = [];
+        const timeStamps: number[] = [];
 
         for (let i = 0; i < lines.length; i++) {
-            const lineParts: string[] = lines[i].split(']');
-            const lineWithoutTimestamp: string = lineParts.length > 1 ? lineParts[1] : lineParts[0];
+            const lineParts = lines[i].replace('[', '').split(']');
+            const lineWithoutTimestamp: string = lineParts[1];
+            const timeStamp: string = lineParts[0];
 
-            if (!StringUtils.isNullOrWhiteSpace(lineWithoutTimestamp) && !lineWithoutTimestamp.startsWith('[')) {
+            const timeList = timeStamp.split(':');
+
+            const startTime = (Number(timeList[0]) * 60) + (Number(timeList[1].replace('.', '')) / 100);
+
+            lyricLines.push(lineWithoutTimestamp);
+            timeStamps.push(startTime);
+
+            if (!StringUtils.isNullOrWhiteSpace(lineWithoutTimestamp)) {
                 lyricsText += `${lineWithoutTimestamp}`;
 
                 if (i < lines.length - 1) {
@@ -37,7 +47,7 @@ export class LrcLyricsGetter implements ILyricsGetter {
             return LyricsModel.empty(track);
         }
 
-        return new LyricsModel(track, '', LyricsSourceType.lrc, lyricsText);
+        return LyricsModel.createWithoutEnds(track, '', LyricsSourceType.lrc, lyricsText, lyricLines, timeStamps);
     }
 
     private getLrcFilePath(track: TrackModel): string {

src/app/services/lyrics/lyrics-model.spec.ts

@@ -8,7 +8,7 @@ describe('LyricsModel', () => {
         it('should create', () => {
             // Arrange, Act
             const trackMock: TrackModel = MockCreator.createTrackModel('path', 'trackTitle', 'artists');
-            const instance = new LyricsModel(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
+            const instance = LyricsModel.createSimple(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
 
             // Assert
             expect(instance).toBeDefined();
@@ -17,7 +17,7 @@ describe('LyricsModel', () => {
         it('should set sourceName', () => {
             // Arrange, Act
             const trackMock: TrackModel = MockCreator.createTrackModel('path', 'trackTitle', 'artists');
-            const instance = new LyricsModel(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
+            const instance = LyricsModel.createSimple(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
 
             // Assert
             expect(instance.sourceName).toEqual('sourceName');
@@ -26,7 +26,7 @@ describe('LyricsModel', () => {
         it('should set sourceType', () => {
             // Arrange, Act
             const trackMock: TrackModel = MockCreator.createTrackModel('path', 'trackTitle', 'artists');
-            const instance = new LyricsModel(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
+            const instance = LyricsModel.createSimple(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
 
             // Assert
             expect(instance.sourceType).toEqual(LyricsSourceType.embedded);
@@ -35,7 +35,7 @@ describe('LyricsModel', () => {
         it('should set text', () => {
             // Arrange, Act
             const trackMock: TrackModel = MockCreator.createTrackModel('path', 'trackTitle', 'artists');
-            const instance = new LyricsModel(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
+            const instance = LyricsModel.createSimple(trackMock, 'sourceName', LyricsSourceType.embedded, 'text');
 
             // Assert
             expect(instance.text).toEqual('text');

src/app/services/lyrics/lyrics-model.ts

@@ -7,9 +7,20 @@ export class LyricsModel {
         public sourceName: string,
         public sourceType: LyricsSourceType,
         public text: string,
+        public lyricList: string[] | undefined,
+        public timeStamps: number[] | undefined,
+        public timeStampEnds: number[] | undefined
     ) {}
 
+    public static createWithoutEnds(track: TrackModel | undefined, sourceName: string, sourceType: LyricsSourceType, text: string, lyricList: string[], timeStamps: number[]): LyricsModel {
+        return new LyricsModel(track, sourceName, sourceType, text, lyricList, timeStamps, undefined);
+    }
+
+    public static createSimple(track: TrackModel | undefined, sourceName: string, sourceType: LyricsSourceType, text: string): LyricsModel {
+        return new LyricsModel(track, sourceName, sourceType, text, undefined, undefined, undefined);
+    }
+
     public static empty(track: TrackModel | undefined): LyricsModel {
-        return new LyricsModel(track, '', LyricsSourceType.none, '');
+        return new LyricsModel(track, '', LyricsSourceType.none, '', undefined, undefined, undefined);
     }
 }

src/app/services/lyrics/lyrics.service.base.ts

@@ -4,4 +4,7 @@ import { LyricsModel } from './lyrics-model';
 
 export abstract class LyricsServiceBase implements ILyricsGetter {
     public abstract getLyricsAsync(track: TrackModel): Promise<LyricsModel>;
+    public abstract showRichLyrics: boolean;
+    public abstract richLyricsLineCount: number;
+    public abstract richLyricsFontSize: number;
 }