import { Component, OnInit, Input } from '@angular/core';
import { BsModalRef, BsModalService } from 'ngx-bootstrap';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ToastrService } from 'ngx-toastr';
import { NGXLogger } from 'ngx-logger';
import { FileUploadService } from '../../../services/fileupload.service';
import { UploadVideoService } from '../../../services/upload.video.service';
import { DeleteVideoComponent } from '../upload-video/delete-video/delete-video.component';

@Component({
    selector: 'upload-video',
    templateUrl: './upload-video.component.html',
    styleUrls: ['./upload-video.component.css']
})

export class UploadVideoComponent implements OnInit {
    uploadVideoForm: FormGroup;
    videoFileContent;
    @Input() title: string;

    //deleteSliderRef
    deleteSliderRef: BsModalRef;

    constructor(public bsModalRef: BsModalRef, private modalService:BsModalService, private logger: NGXLogger, private toastr: ToastrService, private fb: FormBuilder, private uploadVideoService:UploadVideoService, private fileUploadService:FileUploadService) {}

    ngOnInit(): void {
        this.uploadVideoForm = this.fb.group({
            file_name: ['', Validators.required],
            ktVideo: ['', Validators.required]
        });
    }

    getUploadVideoContent(event){
        const files = event.target.files;
        if (files && files.length > 0) {
            for (const file of files) {
                this.fileUploadService.getImageBinaryString(file, (content) => {
                    this.videoFileContent = content;
                })
            }
        }
    }

    removeValidators() {
        this.uploadVideoForm.get('file_name').clearValidators();
        this.uploadVideoForm.get('file_name').updateValueAndValidity();
        this.uploadVideoForm.get('ktVideo').clearValidators();
        this.uploadVideoForm.get('ktVideo').updateValueAndValidity();
    }

    setValidators() {
        this.uploadVideoForm.get('file_name').setValidators(Validators.required);
        this.uploadVideoForm.get('file_name').updateValueAndValidity();
        this.uploadVideoForm.get('ktVideo').updateValueAndValidity();
    }

    async checkDuplicateName() {
        if (this.uploadVideoForm.get('file_name').value) {
          let videoName = this.uploadVideoForm.get('file_name').value.toString().trim();
    
          // Duplicate slider name check
          const body = await this.uploadVideoService.isVideoExists(videoName);
    
          let videoExist = body['data'] as boolean;
          if (videoExist) {
            this.uploadVideoForm.get('file_name').setValue('');
          }
        }
    }

    deleteExisitingVideo(){
        this.deleteSliderRef = this.modalService.show(DeleteVideoComponent);
    }

    async onSubmit() {
        if (this.uploadVideoForm.get('file_name').value === '' || this.uploadVideoForm.get('ktVideo').value === '') {
            this.uploadVideoForm.controls['file_name'].markAllAsTouched();
            this.uploadVideoForm.controls['ktVideo'].markAllAsTouched();
        }
        if (this.uploadVideoForm.valid && this.videoFileContent){        
            this.uploadVideoForm.value.uploadVideoFileContent = this.videoFileContent;
            this.uploadVideoService.uploadVideo(this.uploadVideoForm.value).subscribe((result: { status: string, message: string, data }) => {
                if (result.status === 'success') {
                    this.toastr.success('Video uploaded successfully');
                }
            }, (error) => {
                    this.toastr.error('Some error occured');
                    this.logger.error(error);
                },
            );
            this.bsModalRef.hide();
        }
        else {
          this.uploadVideoForm.controls['file_name'].markAsTouched();
          this.uploadVideoForm.controls['ktVideo'].markAsTouched();
        }
    }

    get file_name() { return this.uploadVideoForm.get('file_name') }
    get ktVideo() { return this.uploadVideoForm.get('ktVideo') }
}