djabsher
/
UIAngular
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update live page

test
dan 2020-03-23 20:10:59 -06:00
parent a2edf88fb1
commit 6f26bb859d
2 changed files with 34 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
Client/src/app/components/live-stream/live-stream.component.html
View File

@ -1,9 +1,14 @@
<secondary-page-component [hideSideBarOnMobile]="true" > <secondary-page-component [hideSideBarOnMobile]="true" >
<div mainContent class="mapWrapper"> <div mainContent class="mapWrapper">
<div class="video-container"> <h2 *ngIf="!showVideo">{{message}}</h2>
<h1 *ngIf="!showVideo">{{message}}</h1> <div class="video-container" *ngIf="showVideo">
<video [class.opacity-zero]="!showVideo" *ngIf="!error" style="width:100%" [src]="videoSrc" controls [poster]="poster" (error)="vidError()"></video> <video [class.opacity-zero]="!showVideo" *ngIf="!error" style="width:100%" [src]="videoSrc" controls [poster]="poster" (error)="vidError()"></video>
</div> </div>
<div style="margin-top: 10px">
<button routerLink="/video" style="margin-top:5px; width:100%;" mat-stroked-button>
<b><i ofbicon style="margin-top:-4px; vertical-align: middle;">play_arrow</i> Click here for previous video services</b>
</button>
</div>
</div> </div>
<div sideBar ofbFadeInOnScroll> <div sideBar ofbFadeInOnScroll>

60
Client/src/app/components/live-stream/live-stream.component.ts
View File

@ -29,46 +29,36 @@ export class LiveStreamComponent implements OnInit {
private interval; private interval;
ngOnInit() { ngOnInit() {
this.update();
this.interval = setInterval(() => { this.interval = setInterval(() => {
this.http.get<VideoServices>('assets/json/videoServices.json').subscribe(res => { this.update();
res.videos = res.videos.filter(v => v.archived === false); }, 3000);
res.videos.forEach(v => v.date = DateTime.fromISO(v.date, {zone: 'America/Denver'})); }
res.videos.sort((a, b) => {
if (a.date < b.date) return -1;
if (a.date === b.date) return 0;
return 1;
});
var service = res.videos[0];
if (service) { update() {
this.message = (<any>service).message; this.http.get<VideoServices>('assets/json/videoServices.json').subscribe(res => {
if (service.isReady === true) { res.videos = res.videos.filter(v => v.archived === false);
this.showVideo = true; res.videos.forEach(v => v.date = DateTime.fromISO(v.date, {zone: 'America/Denver'}));
this.videoSrc = ''; res.videos.sort((a, b) => {
this.videoSrc = service.src; if (a.date < b.date) return -1;
clearInterval(this.interval); if (a.date === b.date) return 0;
} return 1;
} else {
this.message = 'No Live Services';
}
}); });
}, 3000); var service = res.videos[0];
} if (service) {
this.message = (<any>service).message;
public async vidError() { if (service.isReady === true) {
console.log('err');
return;
if (this.videoSrc === '') return;
this.error = true;
setTimeout(async () => {
this.error = false;
setTimeout(() => {
if (!this.error) {
this.showVideo = true; this.showVideo = true;
this.videoSrc = '';
this.videoSrc = service.src;
clearInterval(this.interval);
} }
}, 3000); } else {
}, 3000); this.message = 'No Live Services';
}
});
} }
} }