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

update countdown and archived

test
dan 2020-03-22 20:41:15 -06:00
parent ba8903c3ac
commit a2edf88fb1
5 changed files with 59 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
Client/src/app/components/home/countdown.ts
View File

@ -72,20 +72,9 @@ export class Countdown {
private updateClock() {
this.showCounter = true;
var now = DateTime.local();
var nearestPast = this.getNearestPastDate(now).date;
if (nearestPast) {
var pastDiff = now.diff(nearestPast, ['minutes']);
if (pastDiff.minutes < 240) {
this.showButton = true;
this.dateDisplay = nearestPast.toLocaleString(DateTime.DATETIME_HUGE);
this.dateDisplaySmall = nearestPast.toLocaleString(DateTime.DATETIME_MED);
return;
}
}
this.showButton = false;
var nearestFuture = this.getNearestFutureDate(now).date;
if (!nearestFuture) {
var firstNonArchived = this.getFirstNonArchived(now);
if (!firstNonArchived) {
this.stopClock();
this.resetToZero();
this.showCounter = false;
@ -93,26 +82,27 @@ export class Countdown {
this.dateDisplaySmall = '';
return;
}
var secDiff = (<DateTime>nearestFuture).diff(now, ['seconds']);
if (secDiff.seconds <= 0) {
this.showButton = true;
}
var hourDiff = (<DateTime>nearestFuture).diff(now, ['hours']);
var hourDiff = (<DateTime>firstNonArchived.date).diff(now, ['hours']);
if (hourDiff.hours >= 48) {
this.showCounter = false;
this.dateDisplay = '';
this.dateDisplaySmall = '';
return;
}
}
var diff = (<DateTime>nearestFuture).diff(now, ['days', 'hours', 'minutes', 'seconds']);
var secDiff = (<DateTime>firstNonArchived.date).diff(now, ['seconds']);
if (secDiff.seconds <= 0) {
this.showButton = true;
}
var diff = (<DateTime>firstNonArchived.date).diff(now, ['days', 'hours', 'minutes', 'seconds']);
this.days = diff.days;
this.hours = diff.hours;
this.minutes = diff.minutes;
this.seconds = Math.floor(diff.seconds);
this.dateDisplay = nearestFuture.toLocaleString(DateTime.DATETIME_HUGE);
this.dateDisplaySmall = nearestFuture.toLocaleString(DateTime.DATETIME_MED)
this.dateDisplay = firstNonArchived.date.toLocaleString(DateTime.DATETIME_HUGE);
this.dateDisplaySmall = firstNonArchived.date.toLocaleString(DateTime.DATETIME_MED)
}
private startClock() {
@ -123,13 +113,23 @@ export class Countdown {
clearInterval(this.clock);
}
private getFirstNonArchived(now: DateTime): VideoService {
if (this.services.length === 0) return null;
const nonArchived = this.services.filter(s => s.archived === false);
if (!nonArchived || nonArchived.length === 0) return null;
return nonArchived[0];
}
private getNearestPastDate(now: DateTime): VideoService {
if (this.services.length === 0) return null;
const archived = this.services.filter(s => s.archived === false);
if (!archived || archived.length === 0) return null;
var now = now || DateTime.local();
var nearestIndex = this.services.findIndex(s => s.date > now);
var nearestIndex = archived.findIndex(s => s.date > now);
if (nearestIndex === 0) return null;
if (nearestIndex === -1) return this.services[this.services.length - 1];
return this.services[nearestIndex - 1];
if (nearestIndex === -1) return archived[archived.length - 1];
return archived[nearestIndex - 1];
}
private getNearestFutureDate(now: DateTime): VideoService {

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

@ -3,6 +3,7 @@ import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClient } from '@angular/common/http';
import { VideoServices } from '../home/video-services';
import { DateTime } from "luxon";
@Component({
selector: 'live-stream-component',
@ -30,9 +31,16 @@ export class LiveStreamComponent implements OnInit {
ngOnInit() {
this.interval = setInterval(() => {
this.http.get<VideoServices>('assets/json/videoServices.json').subscribe(res => {
var nonArchivedReady = res.videos.filter(v => v.archived === false);
if (nonArchivedReady && nonArchivedReady.length > 0) {
var service = nonArchivedReady[0];
res.videos = res.videos.filter(v => v.archived === false);
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) {
this.message = (<any>service).message;
if (service.isReady === true) {
this.showVideo = true;
@ -40,17 +48,11 @@ export class LiveStreamComponent implements OnInit {
this.videoSrc = service.src;
clearInterval(this.interval);
}
}
} else {
this.message = 'No Live Services';
}
});
}, 3000);
// setTimeout(() => {
// this.isReady = true;
// this.showVideo = true;
// this.videoSrc = '';
// this.videoSrc = this.videoSrc;
// clearInterval(this.interval);
// }, 12000)
}

8
Client/src/app/components/video-services/video-services.component.html
View File

@ -1,11 +1,11 @@
<secondary-page-component [hideSideBarOnMobile]="true" >
<div mainContent>
<div *ngFor="let video of services; let i = index;">
<button (click)="showVideo(i)" mat-stroked-button>
<div *ngFor="let video of services; let i = index;" style="margin-top: 10px;">
<button (click)="showVideo(i)" mat-stroked-button style="margin-bottom: 10px;">
<i ofbicon class="mr-10" >live_tv</i>
{{video.title}}
{{getTitle(i)}}
</button>
<video style="width:100%" *ngIf="video.show" src="{{video.src}}"></video>
<video style="width:100%" *ngIf="video.show" src="{{video.src}}" controls poster="https://ofbbutte.com/static/media/video/ClickToPlay.jpg"></video>
</div>
</div>
<div sideBar class="side-bar">

8
Client/src/app/components/video-services/video-services.component.ts
View File

@ -2,7 +2,7 @@ import { WindowRefService } from './../../services/window-ref.service';
import { Component, HostListener, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { VideoServices, VideoService } from '../home/video-services';
import { take } from 'rxjs/operators';
import { DateTime } from "luxon";
@ -32,4 +32,10 @@ export class VideoServicesComponent implements OnInit {
});
(<any>this.services[index]).show = true;
}
getTitle(index: number): string {
const title = this.services[index].title;
const dte = DateTime.fromISO(this.services[index].date, {zone: 'America/Denver'})
return title + ' | ' + dte.toLocaleString(DateTime.DATETIME_MED);
}
}

10
Client/src/assets/json/videoServices.json
View File

@ -2,11 +2,19 @@
"videos": [
{
"isReady": false,
"title": "Wednesday Evening",
"src": "https://ofbbutte.com/static/media/video/2020-03-25 1900 Pastor Derek Loewen.mp4",
"date": "2020-03-25T19:00:00-06:00",
"archived": false,
"message": "Please Stay Tuned Until 3/25/2020 at 7:00 PM MDT"
},
{
"isReady": true,
"title": "Sunday Evening",
"src": "https://ofbbutte.com/static/media/video/2020-03-22 1900 Pastor Derek Loewen.mp4",
"date": "2020-03-22T19:00:00-06:00",
"archived": false,
"message": "Please Stay Tuned Until 3/22/2020 at 7 PM MDT"
"message": "Please Stay Tuned Until 3/22/2020 at 7:00 PM MDT"
},
{
"isReady": true,