import { Component, HostListener } from '@angular/core';
import { MatDialog, MatDialogConfig } from '@angular/material';
import { VideoPopupComponent } from '../popups/video-popup/video-popup.component';
import { environment } from '../../../environments/environment';
import { Countdown } from './countdown';
import { HttpClient } from '@angular/common/http';
import { VideoServices } from './video-services';
import { YoutubePopupComponent } from '../popups/youtube-popup/youtube-popup.component';

@Component({
  selector: 'home-component',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css'],
})
export class HomeComponent {
  backgroundTop: string = "0px";

  public get showVGC() : boolean {

    let maxDate = new Date(2024,7,15,11); // August 15th 2018 -- Set the month one month behind since JavaScript dates are 0 based
    let now = new Date();
    if (now.getFullYear() > maxDate.getFullYear()) return false;
    if (now.getFullYear() == maxDate.getFullYear()) {
      if (now.getMonth() > maxDate.getMonth()) return false;
      if (now.getMonth() == maxDate.getMonth()) {
        if (now.getDate() > maxDate.getDate()) return false;
        if (now.getDate() == maxDate.getDate()) {
          if (now.getHours() > maxDate.getHours()) return false;
        }
      }
    }
    return true;
  }

  public get showSpecial() : boolean {

    let maxDate = new Date(2022,8,18,11); // September 18th 2018 -- Set the month one month behind since JavaScript dates are 0 based
    let now = new Date();
    if (now.getFullYear() > maxDate.getFullYear()) return false;
    if (now.getFullYear() == maxDate.getFullYear()) {
      if (now.getMonth() > maxDate.getMonth()) return false;
      if (now.getMonth() == maxDate.getMonth()) {
        if (now.getDate() > maxDate.getDate()) return false;
        if (now.getDate() == maxDate.getDate()) {
          if (now.getHours() > maxDate.getHours()) return false;
        }
      }
    }
    return true;
  }

  public get showCallToAction(): boolean {
    let maxDate = new Date(2020,4,10); // July 8th 2018 -- Set the month one month behind since JavaScript dates are 0 based
    let now = new Date();
    if (now.getFullYear() > maxDate.getFullYear()) return false;
    if (now.getFullYear() == maxDate.getFullYear()) {
      if (now.getMonth() > maxDate.getMonth()) return false;
      if (now.getMonth() == maxDate.getMonth()) {
        if (now.getDate() > maxDate.getDate()) return false;
      }
    }
    return true;
  }
  public get showVBS(): boolean {
    let maxDate = new Date(2019,7,22); // August 22nd 2018 -- Set the month one month behind since JavaScript dates are 0 based
    let now = new Date();
    if (now.getFullYear() > maxDate.getFullYear()) return false;
    if (now.getFullYear() == maxDate.getFullYear()) {
      if (now.getMonth() > maxDate.getMonth()) return false;
      if (now.getMonth() == maxDate.getMonth()) {
        if (now.getDate() > maxDate.getDate()) return false;
      }
    }
    return true;
  }

  public countdown: Countdown;
  public showCountdown: boolean = false;

  constructor(private dialog: MatDialog, private http: HttpClient)
  {
    this.http.get<VideoServices>('assets/json/videoServices.json').subscribe(res => {
      this.countdown = new Countdown(res.videos);
    });
  }  

  playVictoryGospelCrusade() {
    const url = 'https://drive.google.com/file/d/1gPdCTLkJEtNWEyn_y8FQ78PaDi40MU7N/preview'

    let opts = new MatDialogConfig;
    opts.data = { title: 'Victory Gospel Crusade', embedUrl: url };
    let dialog = this.dialog.open(YoutubePopupComponent, opts);
  }



  @HostListener('window:scroll', ['$event'])
  onScroll(event){
    let scrollTop = event.target.documentElement.scrollTop || event.target.body.scrollTop || window.pageYOffset;
    //this.backgroundTop = Math.min((scrollTop * .30),100) * -1 + "px";
  }

  actionClick() {
    let opts = new MatDialogConfig;
    let baseUrl = environment.production === true ? "" : "https://ofbbutte.com/";
    opts.data = { videoSrc: baseUrl + 'static/media/video/Sledding2019.mp4', posterSrc: baseUrl + 'static/media/video/Sledding2019Poster.jpg' };
    opts.closeOnNavigation = true;
    let dialog = this.dialog.open(VideoPopupComponent, opts)
  }
}