Merge branch 'master' of https://github.com/Tzahi12345/YoutubeDL-Material into updated-player

src/app/app-routing.module.ts

@@ -19,7 +19,7 @@ const routes: Routes = [
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes, { useHash: true })],
+  imports: [RouterModule.forRoot(routes, { useHash: true, relativeLinkResolution: 'legacy' })],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }

src/app/app.component.spec.ts

@@ -1,9 +1,9 @@
-import { TestBed, async } from '@angular/core/testing';
+import { TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [
         AppComponent
@@ -11,19 +11,19 @@ describe('AppComponent', () => {
     }).compileComponents();
   }));
 
-  it('should create the app', async(() => {
+  it('should create the app', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app).toBeTruthy();
   }));
 
-  it(`should have as title 'app'`, async(() => {
+  it(`should have as title 'app'`, waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app.title).toEqual('app');
   }));
 
-  it('should render title in a h1 tag', async(() => {
+  it('should render title in a h1 tag', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     fixture.detectChanges();
     const compiled = fixture.debugElement.nativeElement;

src/app/app.module.ts

@@ -39,7 +39,10 @@ import { RouterModule } from '@angular/router';
 import { AppRoutingModule } from './app-routing.module';
 import { MainComponent } from './main/main.component';
 import { PlayerComponent } from './player/player.component';
-import { VgCoreModule, VgControlsModule, VgOverlayPlayModule, VgBufferingModule } from 'ngx-videogular';
+import { VgControlsModule } from '@videogular/ngx-videogular/controls';
+import { VgBufferingModule } from '@videogular/ngx-videogular/buffering';
+import { VgOverlayPlayModule } from '@videogular/ngx-videogular/overlay-play';
+import { VgCoreModule } from '@videogular/ngx-videogular/core';
 import { InputDialogComponent } from './input-dialog/input-dialog.component';
 import { LazyLoadImageModule, IsVisibleProps } from 'ng-lazyload-image';
 import { audioFilesMouseHovering, videoFilesMouseHovering, audioFilesOpened, videoFilesOpened } from './main/main.component';

src/app/components/custom-playlists/custom-playlists.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CustomPlaylistsComponent } from './custom-playlists.component';
 
@@ -6,7 +6,7 @@ describe('CustomPlaylistsComponent', () => {
   let component: CustomPlaylistsComponent;
   let fixture: ComponentFixture<CustomPlaylistsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CustomPlaylistsComponent ]
     })

src/app/components/downloads/downloads.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { DownloadsComponent } from './downloads.component';
 
@@ -6,7 +6,7 @@ describe('DownloadsComponent', () => {
   let component: DownloadsComponent;
   let fixture: ComponentFixture<DownloadsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ DownloadsComponent ]
     })

src/app/components/login/login.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { LoginComponent } from './login.component';
 
@@ -6,7 +6,7 @@ describe('LoginComponent', () => {
   let component: LoginComponent;
   let fixture: ComponentFixture<LoginComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ LoginComponent ]
     })

src/app/components/logs-viewer/logs-viewer.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { LogsViewerComponent } from './logs-viewer.component';
 
@@ -6,7 +6,7 @@ describe('LogsViewerComponent', () => {
   let component: LogsViewerComponent;
   let fixture: ComponentFixture<LogsViewerComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ LogsViewerComponent ]
     })

src/app/components/manage-role/manage-role.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ManageRoleComponent } from './manage-role.component';
 
@@ -6,7 +6,7 @@ describe('ManageRoleComponent', () => {
   let component: ManageRoleComponent;
   let fixture: ComponentFixture<ManageRoleComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ManageRoleComponent ]
     })

src/app/components/manage-user/manage-user.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ManageUserComponent } from './manage-user.component';
 
@@ -6,7 +6,7 @@ describe('ManageUserComponent', () => {
   let component: ManageUserComponent;
   let fixture: ComponentFixture<ManageUserComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ManageUserComponent ]
     })

src/app/components/modify-users/modify-users.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ModifyUsersComponent } from './modify-users.component';
 
@@ -6,7 +6,7 @@ describe('ModifyUsersComponent', () => {
   let component: ModifyUsersComponent;
   let fixture: ComponentFixture<ModifyUsersComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ModifyUsersComponent ]
     })

src/app/components/recent-videos/recent-videos.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { RecentVideosComponent } from './recent-videos.component';
 
@@ -6,7 +6,7 @@ describe('RecentVideosComponent', () => {
   let component: RecentVideosComponent;
   let fixture: ComponentFixture<RecentVideosComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ RecentVideosComponent ]
     })

src/app/components/recent-videos/recent-videos.component.ts

@@ -59,7 +59,8 @@ export class RecentVideosComponent implements OnInit {
   constructor(public postsService: PostsService, private router: Router) {
     // get cached file count
     if (localStorage.getItem('cached_file_count')) {
-      this.cached_file_count = +localStorage.getItem('cached_file_count');
+      this.cached_file_count = +localStorage.getItem('cached_file_count') <= 10 ? +localStorage.getItem('cached_file_count') : 10;
+      
       this.loading_files = Array(this.cached_file_count).fill(0);
     }
   }

src/app/components/twitch-chat/twitch-chat.component.html

@@ -1,7 +1,8 @@
 <div class="chat-container" #scrollContainer *ngIf="visible_chat">
     <div style="width: 250px; text-align: center;"><strong>Twitch Chat</strong></div>
-    <div style="max-width: 250px" *ngFor="let chat of visible_chat">
+    <div #chat style="max-width: 250px" *ngFor="let chat of visible_chat; let last = last">
         {{chat.timestamp_str}} - <strong [style.color]="chat.user_color ? chat.user_color : null">{{chat.name}}</strong>: {{chat.message}}
+        {{last ? scrollToBottom() : ''}}
     </div>
 </div>
 

src/app/components/twitch-chat/twitch-chat.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { TwitchChatComponent } from './twitch-chat.component';
 
@@ -6,7 +6,7 @@ describe('TwitchChatComponent', () => {
   let component: TwitchChatComponent;
   let fixture: ComponentFixture<TwitchChatComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ TwitchChatComponent ]
     })

src/app/components/twitch-chat/twitch-chat.component.ts

@@ -21,9 +21,11 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
   scrollContainer = null;
 
   @Input() db_file = null;
+  @Input() sub = null;
   @Input() current_timestamp = null;
 
   @ViewChild('scrollContainer') scrollRef: ElementRef;
+  @ViewChildren('chat') chat: QueryList<any>;
 
   constructor(private postsService: PostsService) { }
 
@@ -35,22 +37,31 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
   }
 
   private isUserNearBottom(): boolean {
-    const threshold = 300;
+    const threshold = 150;
     const position = this.scrollContainer.scrollTop + this.scrollContainer.offsetHeight;
     const height = this.scrollContainer.scrollHeight;
     return position > height - threshold;
   }
 
-  scrollToBottom = () => {
-    this.scrollContainer.scrollTop = this.scrollContainer.scrollHeight;
+  scrollToBottom = (force_scroll) => {
+    if (force_scroll || this.isUserNearBottom()) {
+      this.scrollContainer.scrollTop = this.scrollContainer.scrollHeight;
+    }
   }
 
   addNewChatMessages() {
+    const next_chat_index = this.getIndexOfNextChat();
     if (!this.scrollContainer) {
       this.scrollContainer = this.scrollRef.nativeElement;
     }
     if (this.current_chat_index === null) {
-      this.current_chat_index = this.getIndexOfNextChat();
+      this.current_chat_index = next_chat_index;
+    }
+
+    if (Math.abs(next_chat_index - this.current_chat_index) > 25) {
+      this.visible_chat = [];
+      this.current_chat_index = next_chat_index - 25;
+      setTimeout(() => this.scrollToBottom(true), 100);
     }
 
     const latest_chat_timestamp = this.visible_chat.length ? this.visible_chat[this.visible_chat.length - 1]['timestamp'] : 0;
@@ -59,9 +70,6 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
       if (this.full_chat[i]['timestamp'] >= latest_chat_timestamp && this.full_chat[i]['timestamp'] <= this.current_timestamp) {
         this.visible_chat.push(this.full_chat[i]);
         this.current_chat_index = i;
-        if (this.isUserNearBottom()) {
-          this.scrollToBottom();
-        }
       } else if (this.full_chat[i]['timestamp'] > this.current_timestamp) {
         break;
       }
@@ -74,7 +82,7 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
   }
 
   getFullChat() {
-    this.postsService.getFullTwitchChat(this.db_file.id, this.db_file.isAudio ? 'audio' : 'video', null).subscribe(res => {
+    this.postsService.getFullTwitchChat(this.db_file.id, this.db_file.isAudio ? 'audio' : 'video', null, this.sub).subscribe(res => {
       this.chat_response_received = true;
       if (res['chat']) {
         this.initializeChatCheck(res['chat']);
@@ -82,11 +90,6 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
     });
   }
 
-  renewChat() {
-    this.visible_chat = [];
-    this.current_chat_index = this.getIndexOfNextChat();
-  }
-
   downloadTwitchChat() {
     this.downloading_chat = true;
     let vodId = this.db_file.url.split('videos/').length > 1 && this.db_file.url.split('videos/')[1];
@@ -94,7 +97,7 @@ export class TwitchChatComponent implements OnInit, AfterViewInit {
     if (!vodId) {
       this.postsService.openSnackBar('VOD url for this video is not supported. VOD ID must be after "twitch.tv/videos/"');
     }
-    this.postsService.downloadTwitchChat(this.db_file.id, this.db_file.isAudio ? 'audio' : 'video', vodId, null).subscribe(res => {
+    this.postsService.downloadTwitchChat(this.db_file.id, this.db_file.isAudio ? 'audio' : 'video', vodId, null, this.sub).subscribe(res => {
       if (res['chat']) {
         this.initializeChatCheck(res['chat']);
       } else {

src/app/components/unified-file-card/unified-file-card.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { UnifiedFileCardComponent } from './unified-file-card.component';
 
@@ -6,7 +6,7 @@ describe('UnifiedFileCardComponent', () => {
   let component: UnifiedFileCardComponent;
   let fixture: ComponentFixture<UnifiedFileCardComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ UnifiedFileCardComponent ]
     })

src/app/create-playlist/create-playlist.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CreatePlaylistComponent } from './create-playlist.component';
 
@@ -6,7 +6,7 @@ describe('CreatePlaylistComponent', () => {
   let component: CreatePlaylistComponent;
   let fixture: ComponentFixture<CreatePlaylistComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CreatePlaylistComponent ]
     })

src/app/dialogs/about-dialog/about-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AboutDialogComponent } from './about-dialog.component';
 
@@ -6,7 +6,7 @@ describe('AboutDialogComponent', () => {
   let component: AboutDialogComponent;
   let fixture: ComponentFixture<AboutDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ AboutDialogComponent ]
     })

src/app/dialogs/add-user-dialog/add-user-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AddUserDialogComponent } from './add-user-dialog.component';
 
@@ -6,7 +6,7 @@ describe('AddUserDialogComponent', () => {
   let component: AddUserDialogComponent;
   let fixture: ComponentFixture<AddUserDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ AddUserDialogComponent ]
     })

src/app/dialogs/arg-modifier-dialog/arg-modifier-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ArgModifierDialogComponent } from './arg-modifier-dialog.component';
 
@@ -6,7 +6,7 @@ describe('ArgModifierDialogComponent', () => {
   let component: ArgModifierDialogComponent;
   let fixture: ComponentFixture<ArgModifierDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ArgModifierDialogComponent ]
     })

src/app/dialogs/confirm-dialog/confirm-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ConfirmDialogComponent } from './confirm-dialog.component';
 
@@ -6,7 +6,7 @@ describe('ConfirmDialogComponent', () => {
   let component: ConfirmDialogComponent;
   let fixture: ComponentFixture<ConfirmDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ConfirmDialogComponent ]
     })

src/app/dialogs/cookies-uploader-dialog/cookies-uploader-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CookiesUploaderDialogComponent } from './cookies-uploader-dialog.component';
 
@@ -6,7 +6,7 @@ describe('CookiesUploaderDialogComponent', () => {
   let component: CookiesUploaderDialogComponent;
   let fixture: ComponentFixture<CookiesUploaderDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CookiesUploaderDialogComponent ]
     })

src/app/dialogs/edit-category-dialog/edit-category-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { EditCategoryDialogComponent } from './edit-category-dialog.component';
 
@@ -6,7 +6,7 @@ describe('EditCategoryDialogComponent', () => {
   let component: EditCategoryDialogComponent;
   let fixture: ComponentFixture<EditCategoryDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ EditCategoryDialogComponent ]
     })

src/app/dialogs/edit-subscription-dialog/edit-subscription-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { EditSubscriptionDialogComponent } from './edit-subscription-dialog.component';
 
@@ -6,7 +6,7 @@ describe('EditSubscriptionDialogComponent', () => {
   let component: EditSubscriptionDialogComponent;
   let fixture: ComponentFixture<EditSubscriptionDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ EditSubscriptionDialogComponent ]
     })

src/app/dialogs/modify-playlist/modify-playlist.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ModifyPlaylistComponent } from './modify-playlist.component';
 
@@ -6,7 +6,7 @@ describe('ModifyPlaylistComponent', () => {
   let component: ModifyPlaylistComponent;
   let fixture: ComponentFixture<ModifyPlaylistComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ModifyPlaylistComponent ]
     })

src/app/dialogs/set-default-admin-dialog/set-default-admin-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SetDefaultAdminDialogComponent } from './set-default-admin-dialog.component';
 
@@ -6,7 +6,7 @@ describe('SetDefaultAdminDialogComponent', () => {
   let component: SetDefaultAdminDialogComponent;
   let fixture: ComponentFixture<SetDefaultAdminDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SetDefaultAdminDialogComponent ]
     })

src/app/dialogs/share-media-dialog/share-media-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { ShareMediaDialogComponent } from './share-media-dialog.component';
 
@@ -6,7 +6,7 @@ describe('ShareMediaDialogComponent', () => {
   let component: ShareMediaDialogComponent;
   let fixture: ComponentFixture<ShareMediaDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ShareMediaDialogComponent ]
     })

src/app/dialogs/subscribe-dialog/subscribe-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SubscribeDialogComponent } from './subscribe-dialog.component';
 
@@ -6,7 +6,7 @@ describe('SubscribeDialogComponent', () => {
   let component: SubscribeDialogComponent;
   let fixture: ComponentFixture<SubscribeDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SubscribeDialogComponent ]
     })

src/app/dialogs/subscription-info-dialog/subscription-info-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SubscriptionInfoDialogComponent } from './subscription-info-dialog.component';
 
@@ -6,7 +6,7 @@ describe('SubscriptionInfoDialogComponent', () => {
   let component: SubscriptionInfoDialogComponent;
   let fixture: ComponentFixture<SubscriptionInfoDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SubscriptionInfoDialogComponent ]
     })

src/app/dialogs/update-progress-dialog/update-progress-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { UpdateProgressDialogComponent } from './update-progress-dialog.component';
 
@@ -6,7 +6,7 @@ describe('UpdateProgressDialogComponent', () => {
   let component: UpdateProgressDialogComponent;
   let fixture: ComponentFixture<UpdateProgressDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ UpdateProgressDialogComponent ]
     })

src/app/dialogs/user-profile-dialog/user-profile-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { UserProfileDialogComponent } from './user-profile-dialog.component';
 
@@ -6,7 +6,7 @@ describe('UserProfileDialogComponent', () => {
   let component: UserProfileDialogComponent;
   let fixture: ComponentFixture<UserProfileDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ UserProfileDialogComponent ]
     })

src/app/dialogs/video-info-dialog/video-info-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { VideoInfoDialogComponent } from './video-info-dialog.component';
 
@@ -6,7 +6,7 @@ describe('VideoInfoDialogComponent', () => {
   let component: VideoInfoDialogComponent;
   let fixture: ComponentFixture<VideoInfoDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ VideoInfoDialogComponent ]
     })

src/app/download-item/download-item.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { DownloadItemComponent } from './download-item.component';
 
@@ -6,7 +6,7 @@ describe('DownloadItemComponent', () => {
   let component: DownloadItemComponent;
   let fixture: ComponentFixture<DownloadItemComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ DownloadItemComponent ]
     })

src/app/file-card/file-card.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { FileCardComponent } from './file-card.component';
 
@@ -6,7 +6,7 @@ describe('FileCardComponent', () => {
   let component: FileCardComponent;
   let fixture: ComponentFixture<FileCardComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ FileCardComponent ]
     })

src/app/input-dialog/input-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { InputDialogComponent } from './input-dialog.component';
 
@@ -6,7 +6,7 @@ describe('InputDialogComponent', () => {
   let component: InputDialogComponent;
   let fixture: ComponentFixture<InputDialogComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ InputDialogComponent ]
     })

src/app/main/main.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { MainComponent } from './main.component';
 
@@ -6,7 +6,7 @@ describe('MainComponent', () => {
   let component: MainComponent;
   let fixture: ComponentFixture<MainComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ MainComponent ]
     })

src/app/player/player.component.html

@@ -41,7 +41,7 @@
                     </div>
                     <mat-drawer #drawer class="example-sidenav" mode="side" position="end" [opened]="db_file && db_file['chat_exists'] && postsService['config']['API']['use_twitch_API']">
                         <ng-container *ngIf="api_ready && db_file && db_file.url.includes('twitch.tv/videos/')">
-                            <app-twitch-chat #twitchchat [db_file]="db_file" [current_timestamp]="api.currentTime"></app-twitch-chat>
+                            <app-twitch-chat #twitchchat [db_file]="db_file" [current_timestamp]="api.currentTime" [sub]="subscription"></app-twitch-chat>
                         </ng-container>
                     </mat-drawer>
 

src/app/player/player.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { PlayerComponent } from './player.component';
 
@@ -6,7 +6,7 @@ describe('PlayerComponent', () => {
   let component: PlayerComponent;
   let fixture: ComponentFixture<PlayerComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ PlayerComponent ]
     })

src/app/player/player.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, HostListener, EventEmitter, OnDestroy, AfterViewInit, ViewChild } from '@angular/core';
-import { VgAPI } from 'ngx-videogular';
+import { VgApiService } from '@videogular/ngx-videogular/core';
 import { PostsService } from 'app/posts.services';
 import { ActivatedRoute, Router } from '@angular/router';
 import { MatDialog } from '@angular/material/dialog';
@@ -31,7 +31,7 @@ export class PlayerComponent implements OnInit, AfterViewInit, OnDestroy {
 
   currentIndex = 0;
   currentItem: IMedia = null;
-  api: VgAPI;
+  api: VgApiService;
   api_ready = false;
 
   // params
@@ -39,6 +39,7 @@ export class PlayerComponent implements OnInit, AfterViewInit, OnDestroy {
   type: string;
   id = null; // used for playlists (not subscription)
   uid = null; // used for non-subscription files (audio, video, playlist)
+  subscription = null;
   subscriptionName = null;
   subPlaylist = null;
   uuid = null; // used for sharing in multi-user mode, uuid is the user that downloaded the video
@@ -180,6 +181,7 @@ export class PlayerComponent implements OnInit, AfterViewInit, OnDestroy {
   getSubscription() {
     this.postsService.getSubscription(null, this.subscriptionName).subscribe(res => {
       const subscription = res['subscription'];
+      this.subscription = subscription;
       if (this.fileNames) {
         subscription.videos.forEach(video => {
           if (video['id'] === this.fileNames[0]) {
@@ -272,16 +274,10 @@ export class PlayerComponent implements OnInit, AfterViewInit, OnDestroy {
     this.original_playlist = JSON.stringify(this.playlist);
   }
 
-  onPlayerReady(api: VgAPI) {
+  onPlayerReady(api: VgApiService) {
       this.api = api;
       this.api_ready = true;
 
-      this.api.subscriptions.seeked.subscribe(data => {
-        if (this.twitchChat) {
-          this.twitchChat.renewChat();
-        }
-      });
-
       // checks if volume has been previously set. if so, use that as default
       if (localStorage.getItem('player_volume')) {
         this.api.volume = parseFloat(localStorage.getItem('player_volume'));

src/app/posts.services.ts

@@ -234,12 +234,12 @@ export class PostsService implements CanActivate {
         return this.http.post(this.path + 'getAllFiles', {}, this.httpOptions);
     }
 
-    getFullTwitchChat(id, type, uuid = null) {
-        return this.http.post(this.path + 'getFullTwitchChat', {id: id, type: type, uuid: uuid}, this.httpOptions);
+    getFullTwitchChat(id, type, uuid = null, sub = null) {
+        return this.http.post(this.path + 'getFullTwitchChat', {id: id, type: type, uuid: uuid, sub: sub}, this.httpOptions);
     }
 
-    downloadTwitchChat(id, type, vodId, uuid = null) {
-        return this.http.post(this.path + 'downloadTwitchChatByVODID', {id: id, type: type, vodId: vodId, uuid: uuid}, this.httpOptions);
+    downloadTwitchChat(id, type, vodId, uuid = null, sub = null) {
+        return this.http.post(this.path + 'downloadTwitchChatByVODID', {id: id, type: type, vodId: vodId, uuid: uuid, sub: sub}, this.httpOptions);
     }
 
     downloadFileFromServer(fileName, type, outputName = null, fullPathProvided = null, subscriptionName = null, subPlaylist = null,

src/app/settings/settings.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SettingsComponent } from './settings.component';
 
@@ -6,7 +6,7 @@ describe('SettingsComponent', () => {
   let component: SettingsComponent;
   let fixture: ComponentFixture<SettingsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SettingsComponent ]
     })

src/app/subscription/subscription-file-card/subscription-file-card.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SubscriptionFileCardComponent } from './subscription-file-card.component';
 
@@ -6,7 +6,7 @@ describe('SubscriptionFileCardComponent', () => {
   let component: SubscriptionFileCardComponent;
   let fixture: ComponentFixture<SubscriptionFileCardComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SubscriptionFileCardComponent ]
     })

src/app/subscription/subscription/subscription.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SubscriptionComponent } from './subscription.component';
 
@@ -6,7 +6,7 @@ describe('SubscriptionComponent', () => {
   let component: SubscriptionComponent;
   let fixture: ComponentFixture<SubscriptionComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SubscriptionComponent ]
     })

src/app/subscriptions/subscriptions.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { SubscriptionsComponent } from './subscriptions.component';
 
@@ -6,7 +6,7 @@ describe('SubscriptionsComponent', () => {
   let component: SubscriptionsComponent;
   let fixture: ComponentFixture<SubscriptionsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SubscriptionsComponent ]
     })

src/app/updater/updater.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { UpdaterComponent } from './updater.component';
 
@@ -6,7 +6,7 @@ describe('UpdaterComponent', () => {
   let component: UpdaterComponent;
   let fixture: ComponentFixture<UpdaterComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ UpdaterComponent ]
     })