doneit-web/src/app/shared/publication/new-publication/new-publication.page.ts

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { PublicationsService } from 'src/app/services/publications.service';
import { Publication } from 'src/app/models/publication';
import { PhotoService } from 'src/app/services/photo.service';
import { ToastService } from 'src/app/services/toast.service';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { ThemeService } from 'src/app/services/theme.service';
import { Camera, CameraResultType, CameraSource } from '@capacitor/camera';
import { HttpErrorHandle } from 'src/app/services/http-error-handle.service';
import { PublicationFolderService } from 'src/app/store/publication-folder.service';
import { FilePicker } from '@capawesome/capacitor-file-picker';
import { checkFileTypeService } from 'src/app/services/checkFileType.service';
import { FileValidatorService } from "src/app/services/file/file-validator.service"
import { MiddlewareServiceService } from "src/app/shared/API/middleware/middleware-service.service"
import { LakefsRepositoryService } from '../../repository/lakefs/lakefs-repository.service';
import { ok, err, Result } from 'neverthrow';

enum  ActionType  {
  newRapid = "1",
  new = "2",
  edit = "3"
}

@Component({
  selector: 'app-new-publication',
  templateUrl: './new-publication.page.html',
  styleUrls: ['./new-publication.page.scss'],
})
export class NewPublicationPage implements OnInit {
  showLoader: boolean;
  pub: Publication = new Publication();

  publicationTitle: string;
  imgUrl: any;

  Defaultimage: any = '';

  Form: FormGroup;
  validateFrom = false

  @Input() publication!: Publication;
  @Input() publicationType: string;
  @Input() folderId: string;
  @Input() documentId: string;

  @Output() closeDesktopComponent = new EventEmitter<any>();
  @Output() openPublicationDetails = new EventEmitter<any>();
  @Output() goBackToViewPublications = new EventEmitter<any>();
  @Output() goBacktoPublicationDetails = new EventEmitter<any>();

  guestPicture: any;

  capturedImage: any = '';
  capturedImageTitle: any = '';
  fileType: string;
  filecontent: boolean;
  captureContent: any;
  seletedContent: PublicationAttachmentEntity[] = []
  displayLimit = 4;
  filesSizeSum = 0;


  publicationFormMV = new PublicationFormMV()

  constructor(
    public photoService: PhotoService,
    private publications: PublicationsService,
    private toastService: ToastService,
    public ThemeService: ThemeService,
    private httpErroHandle: HttpErrorHandle,
    public PublicationFolderService: PublicationFolderService,
    public checkFileType: checkFileTypeService,
    private FileValidatorService: FileValidatorService,
    private MiddlewareServiceService: MiddlewareServiceService,
    private LakefsRepositoryService: LakefsRepositoryService
  ) {
    this.publicationTitle = 'Nova Publicação';

    if (this.publication) {
      this.seletedContent = this.publication.Files;
      this.filecontent = true;
    }
  }

  ngOnInit() {

    this.publication = {
      DateIndex: "",
      DocumentId: 0,
      ProcessId: "",
      Title: "",
      Message: "",
      DatePublication: "",
      Files: [],
      OriginalFileName: "",
    }
    this.pub = this.publication;

    this.setTitle();
    this.setData()
  }

  setData() {
    if (!this.publicationType) {
      setTimeout(() => {
        this.setData()
      }, 500)
    } else {
      // this.pub = this.publication
      // this.publication = null
      this.getPublicationDetail()
    }
  }

  getPublicationDetail() {
    console.log('edit 1', this.publicationType)
    if (this.publicationType != ActionType.new) {
      this.showLoader = true;
      this.publications.GetPublicationWithArrayOfFilesById(this.documentId).subscribe(res => {
        this.publication = {
          DateIndex: res.DateIndex,
          DocumentId: res.DocumentId,
          ProcessId: res.ProcessId,
          Title: res.Title,
          Message: res.Message,
          DatePublication: res.DatePublication,
          Files: res.Files,
          OriginalFileName: res.OriginalFileName,
          FileExtension: res.FileExtension,
        }
        console.log('edit',this.publication)
        this.pub = this.publication;
        this.seletedContent = this.publication.Files;
        this.showLoader = false;
      }, (error) => {
        console.log(error)
        this.showLoader = false;
        this.goBack()
      });
    }
  }

  async takePicture() {
    const capturedImage = await Camera.getPhoto({
      quality: 50,
      // allowEditing: true,
      resultType: CameraResultType.Base64,
      source: CameraSource.Camera
    });

    this.capturedImage = 'data:image/jpeg;base64,' + capturedImage.base64String;
    this.capturedImageTitle = 'foto';

    /* if(validation.isOk) { */
    const compressedImage = await this.compressImageBase64(
      this.capturedImage,
      800, // maxWidth
      800, // maxHeight
      0.9  // quality
    ).then((picture) => {
      let fileObject = {
        FileBase64: picture,
        FileExtension: this.removeTextBeforeSlash('jpeg','/')
      }

      const FileExtension = this.removeTextBeforeSlash('jpeg','/')

      const newAttachment = new PublicationAttachmentEntity(
        {
          base64: picture,
          extension: FileExtension,
          OriginalFileName: "foto",
          FileType: 'image'
        }
      )

      newAttachment.needUpload()

      this.seletedContent.push(newAttachment)

    });
  /* }  else {
    this.toastService._badRequest("Imagem inválida")
  } */
  }

  async laodPicture() {
    const capturedImage = await Camera.getPhoto({
      quality: 90,
      resultType: CameraResultType.Base64,
      source: CameraSource.Photos
    });

    this.fileType = capturedImage.format
    console.log(this.fileType)
    this.capturedImage = 'data:image/jpeg;base64,' + capturedImage.base64String;
    this.capturedImageTitle = 'foto';

    const compressedImage = await this.compressImageBase64(
      this.capturedImage,
      800, // maxWidth
      800, // maxHeight
      0.9  // quality
    ).then((picture) => {
      let fileObject = {
        FileBase64: picture,
        FileExtension: this.removeTextBeforeSlash('jpeg','/')
      }

      const FileExtension = this.removeTextBeforeSlash('jpeg','/')

      const newAttachment = new PublicationAttachmentEntity(
        {
          base64: picture,
          extension: FileExtension,
          OriginalFileName: "foto",
          FileType: 'image'
        }
      )

      newAttachment.needUpload();
      this.seletedContent.push(newAttachment)
    });

  }

  async loadVideo() {

    const result = await FilePicker.pickMedia
      ({
        multiple: true,
      });


    result.files.forEach(async blobFile => {
      if(this.checkFileType.checkFileType(blobFile.mimeType) == 'image' || this.checkFileType.checkFileType(blobFile.mimeType) == 'video') {
        this.convertBlobToBase64(blobFile.blob).then((value) => {
          this.filesSizeSum = this.filesSizeSum + blobFile.size
         if(this.fileSizeToMB(this.filesSizeSum) <= 20) {

          const FileExtension = this.removeTextBeforeSlash(blobFile.mimeType,'/')

          const newAttachment = new PublicationAttachmentEntity(
            {
              base64: value,
              extension: FileExtension,
              blobFile: blobFile,
              FileType: 'video'
            }
          )

          newAttachment.needUpload()

          this.seletedContent.push(newAttachment)
          this.filecontent = true;
         } else {
          if(this.seletedContent.length === 0)
          this.filesSizeSum = 0

          this.httpErroHandle.validationMessagge('filessize');
         }
        })
      } else {
        this.httpErroHandle.validationMessagge('filetype');
      }

    });

    /*       this.capturedImage = 'data:image/jpeg;base64,' +capturedImage.base64String;
      this.capturedImageTitle = 'foto';


      const validation = await this.FileValidatorService.ValidateImage(this.capturedImage)

      if(validation.isOk) {

        const compressedImage = await this.compressImageBase64(
          this.capturedImage,
          800, // maxWidth
          800, // maxHeight
          0.9  // quality
        ).then((picture) => {
          console.log('Selected: ', picture)
          this.capturedImage = picture
        });
      } else {
        this.toastService._badRequest("Imagem inválida")
      } */

  };


  runValidation() {
    this.validateFrom = true
  }

  injectValidation() {

    this.Form = new FormGroup({
      Subject: new FormControl(this.pub.Title, [
        Validators.required,
        // Validators.minLength(4)
      ]),
      Message: new FormControl(this.pub.Message, [
        Validators.required,
        Validators.maxLength(1000)
      ])
    })
  }


  async save() {

    this.injectValidation()
    this.runValidation()

    if (this.Form.invalid) {
      return false
    } else {

    }

    if (this.publicationType == ActionType.edit) {

      if (!this.publication?.OriginalFileName || !this.pub.OriginalFileName) {

        if (this.pub?.OriginalFileName) {
          console.log('this.pub', this.pub)
        }
        throw ('no this.publication.OriginalFileName')

      }

      const loader = this.toastService.loading()

      if (this.seletedContent.length > 0) {

        this.publication = {
          DateIndex: this.publication.DateIndex,
          DocumentId: this.publication.DocumentId,
          ProcessId: this.publication.ProcessId,
          Title: this.pub.Title,
          Message: this.pub.Message,
          DatePublication: this.publication.DatePublication,
          OriginalFileName: this.publication.OriginalFileName || 'foto',
          Files: this.seletedContent,
        }

        try {

          const response = await this.publications.UpdatePublication(this.publication.ProcessId, this.publication).toPromise()

          this.httpErroHandle.httpsSucessMessagge('Editar publicação')
          console.log({ response })

          this.goBack();

        } catch (error) {
          this.httpErroHandle.httpStatusHandle(error)
          if (error.status == 404) {
            this.PublicationFolderService.deletePost(this.publication.ProcessId, this.publication.DocumentId)
            this.goBack();
          }
        } finally {
          loader.remove()
        }

      } else {
      }/*
      else if (!this.PublicationFolderService.PublicationHasImage(this.publication)) { //

        this.publication = {
          DateIndex: this.publication.DateIndex,
          DocumentId: this.publication.DocumentId,
          ProcessId: this.publication.ProcessId,
          Title: this.pub.Title,
          Message: this.pub.Message,
          DatePublication: this.publication.DatePublication,
          OriginalFileName: this.publication.OriginalFileName,
          Files: "data:image/png;base64,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
          FileExtension: 'jpeg',
        }

      } else {
        this.publication = {
          DateIndex: this.publication.DateIndex,
          DocumentId: this.publication.DocumentId,
          ProcessId: this.publication.ProcessId,
          Title: this.pub.Title,
          Message: this.pub.Message,
          DatePublication: this.publication.DatePublication,
          OriginalFileName: this.publication.OriginalFileName,
          Files: this.publication.Files,
          FileExtension: this.publication.FileExtension,
        }

      } */

    }
    else {
      let time = new Date()
      if (this.seletedContent.length > 0) {
        this.publication = {
          DateIndex: time,
          DocumentId: null,
          ProcessId: this.folderId,
          Title: this.pub.Title,
          Message: this.pub.Message,
          DatePublication: time,
          OriginalFileName: this.capturedImageTitle || 'foto',
          Files: this.seletedContent,
        }


        const loader = this.toastService.loading()

        try {

          await this.publications.CreatePublication(this.publication.ProcessId, this.publication).toPromise()
          if (this.publicationTitle == '1') {

          } else if (this.publicationTitle == '2') {
            this.httpErroHandle.httpsSucessMessagge('Criar publicação')
          } else if (this.publicationTitle == '3') {
            this.httpErroHandle.httpsSucessMessagge('Editar publicação')
          }

          this.goBackToViewPublications.emit();
        } catch (error) {
          this.httpErroHandle.httpStatusHandle(error)
        } finally {
          loader.remove()
        }


      } else {

      }

    }
  }

  close() {
    this.goBack();
  }

  clear() {
    this.capturedImageTitle = '';
    this.seletedContent = [];
  }

  deletePublicationImage() {

    this.publication.Files = []
  }

  setTitle() {
    if (this.publicationType == ActionType.newRapid) {
      this.publicationTitle = 'Nova Publicação Rápida';
    }
    else if (this.publicationType == ActionType.new) {
      this.publicationTitle = 'Nova Publicação';
    }
    else if (this.publicationType == ActionType.edit) {
      this.publicationTitle = 'Editar Publicação';
      this.pub = this.publication;
    }
  }

  async goBack() {

    if (this.publicationType == ActionType.new) {
      this.goBackToViewPublications.emit();
    } else {
      this.goBackToViewPublications.emit();
      //this.goBacktoPublicationDetails.emit();
    }

  }

  async compressImageBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
    return new Promise((resolve, reject) => {
      const image = new (window as any).Image();
      image.src = base64String;

      image.onload = async () => {
        const canvas = document.createElement('canvas');
        let newWidth = image.width;
        let newHeight = image.height;

        if (newWidth > maxWidth) {
          newHeight *= maxWidth / newWidth;
          newWidth = maxWidth;
        }

        if (newHeight > maxHeight) {
          newWidth *= maxHeight / newHeight;
          newHeight = maxHeight;
        }

        canvas.width = newWidth;
        canvas.height = newHeight;

        const context = canvas.getContext('2d');
        context?.drawImage(image, 0, 0, newWidth, newHeight);

        const compressedBase64 = canvas.toDataURL('image/jpeg', quality);
        resolve(compressedBase64);
      };

      image.onerror = (error) => {
        reject(error);
      };
    });
  }

  convertBlobToBase64(blob: Blob) {
    return new Promise((resolve, reject) => {
      const reader = new FileReader;
      reader.onerror = reject;
      reader.onload = () => {
        resolve(reader.result)
      }
      reader.readAsDataURL(blob)
    })
  }

  removeTextBeforeSlash(inputString,mark) {
    if (inputString.includes(mark)) {
      const parts = inputString.split(mark);
      return parts.length > 1 ? parts[1] : inputString;
    } else {
      return inputString;
    }
  }

  async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
    console.log(base64String)
    return new Promise(async (resolve, reject) => {
      try {
        // Decode the base64 video string to an ArrayBuffer
        const trimmedBase64 = base64String.trim();
        const videoBuffer = this.base64ToArrayBuffer(this.removeTextBeforeSlash(trimmedBase64, ','));

        // Create a Blob from the ArrayBuffer
        const videoBlob = new Blob([videoBuffer], { type: 'video/mp4' });

        // Create an object URL from the Blob
        const videoObjectUrl = URL.createObjectURL(videoBlob);

        // Create a video element
        const video = document.createElement('video');
        video.src = videoObjectUrl;

        // Wait for the video to load metadata
        video.addEventListener('loadedmetadata', async () => {
          const canvas = document.createElement('canvas');
          let newWidth = video.videoWidth;
          let newHeight = video.videoHeight;

          if (newWidth > maxWidth) {
            newHeight *= maxWidth / newWidth;
            newWidth = maxWidth;
          }

          if (newHeight > maxHeight) {
            newWidth *= maxHeight / newHeight;
            newHeight = maxHeight;
          }

          canvas.width = newWidth;
          canvas.height = newHeight;

          const context = canvas.getContext('2d');

          // Start continuous rendering
          function render() {
            context?.drawImage(video, 0, 0, newWidth, newHeight);
            requestAnimationFrame(render);
          }

          render();

          // Convert the canvas to a Blob
          canvas.toBlob(async (blob) => {
            if (blob) {
              // Read the Blob as an ArrayBuffer
              const compressedVideoBuffer = await this.readBlobAsArrayBuffer(blob);

              // Convert the ArrayBuffer back to base64
              const compressedBase64 = this.arrayBufferToBase64(compressedVideoBuffer);

              resolve(compressedBase64);
            } else {
              reject('Error creating compressed video blob.');
            }
          }, 'video/mp4', 0.5);
        });
      } catch (error) {
        reject(error);
      }
    });
  }



/*   async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
    return new Promise(async (resolve, reject) => {
      try {
        // Decode the base64 video string to an ArrayBuffer
        const videoBuffer = this.base64ToArrayBuffer(this.removeTextBeforeSlash(base64String,','));

        // Create a Blob from the ArrayBuffer
        const videoBlob = new Blob([videoBuffer], { type: 'video/mp4' });

        // Create an object URL from the Blob
        const videoObjectUrl = URL.createObjectURL(videoBlob);

        // Create a video element
        const video = document.createElement('video');

        // Create a source element and set its type attribute
        const source = document.createElement('source');
        source.type = 'video/mp4';

        // Set the source URL
        source.src = videoObjectUrl;

        // Append the source element to the video element
        video.appendChild(source);

        // Wait for the video to load
        video.addEventListener('loadedmetadata', async () => {
          const canvas = document.createElement('canvas');
          let newWidth = video.videoWidth;
          let newHeight = video.videoHeight;

          if (newWidth > maxWidth) {
            newHeight *= maxWidth / newWidth;
            newWidth = maxWidth;
          }

          if (newHeight > maxHeight) {
            newWidth *= maxHeight / newHeight;
            newHeight = maxHeight;
          }

          canvas.width = newWidth;
          canvas.height = newHeight;

          const context = canvas.getContext('2d');

          // Create a function to draw each video frame onto the canvas
          const drawFrame = () => {
            context?.drawImage(video, 0, 0, newWidth, newHeight);

            // Convert the canvas to a Blob with the correct MIME type
            canvas.toBlob(async (blob) => {
              if (blob) {
                // Read the Blob as an ArrayBuffer
                const compressedVideoBuffer = await this.readBlobAsArrayBuffer(blob);

                // Convert the ArrayBuffer back to base64
                const compressedBase64 = this.arrayBufferToBase64(compressedVideoBuffer);

                resolve(compressedBase64);
              } else {
                reject('Error creating compressed video blob.');
              }
            }, 'video/mp4', quality);

            // Request the next video frame
            requestAnimationFrame(drawFrame);
          };

          // Start drawing frames
          drawFrame();

          // Start playing the video
          video.play();
        });

      } catch (error) {
        reject(error);
      }
    });
  } */




 /*  async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
    return new Promise(async (resolve, reject) => {
      try {
        // Decode the base64 video string to an ArrayBuffer
        const videoBuffer = this.base64ToArrayBuffer(this.removeTextBeforeSlash(base64String,','));

        // Create a Blob from the ArrayBuffer
        const videoBlob = new Blob([videoBuffer], { type: 'video/mp4' });

        // Create an object URL from the Blob
        const videoObjectUrl = URL.createObjectURL(videoBlob);

        // Create a video element
        const video = document.createElement('video');
        video.src = videoObjectUrl;

        // Wait for the video to load metadata
        video.addEventListener('loadedmetadata', async () => {
          const canvas = document.createElement('canvas');
          let newWidth = video.videoWidth;
          let newHeight = video.videoHeight;

          if (newWidth > maxWidth) {
            newHeight *= maxWidth / newWidth;
            newWidth = maxWidth;
          }

          if (newHeight > maxHeight) {
            newWidth *= maxHeight / newHeight;
            newHeight = maxHeight;
          }

          canvas.width = newWidth;
          canvas.height = newHeight;

          const context = canvas.getContext('2d');
          context?.drawImage(video, 0, 0, newWidth, newHeight);

          // Convert the canvas to a Blob with the correct MIME type
          canvas.toBlob(async (blob) => {
            if (blob) {
              // Read the Blob as an ArrayBuffer
              const compressedVideoBuffer = await this.readBlobAsArrayBuffer(blob);

              // Convert the ArrayBuffer back to base64
              const compressedBase64 = this.arrayBufferToBase64(compressedVideoBuffer);

              resolve(compressedBase64);
            } else {
              reject('Error creating compressed video blob.');
            }
          }, 'video/mp4', quality);

        });

      } catch (error) {
        reject(error);
      }
    });
  } */


/*   async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
    return new Promise(async (resolve, reject) => {
      try {
        // Decode the base64 video string to an ArrayBuffer

        const trimmedBase64 = base64String.trim();
        console.log(this.removeTextBeforeSlash(trimmedBase64,','))
        const videoBuffer = this.base64ToArrayBuffer(this.removeTextBeforeSlash(trimmedBase64,','));

        // Create a Blob from the ArrayBuffer
        const videoBlob = new Blob([videoBuffer], { type: 'video/mp4' });

        // Create an object URL from the Blob
        const videoObjectUrl = URL.createObjectURL(videoBlob);

        // Create a video element
        const video = document.createElement('video');
        video.src = videoObjectUrl;

        // Wait for the video to load metadata
        video.addEventListener('loadedmetadata', async () => {
          const canvas = document.createElement('canvas');
          let newWidth = video.videoWidth;
          let newHeight = video.videoHeight;

          if (newWidth > maxWidth) {
            newHeight *= maxWidth / newWidth;
            newWidth = maxWidth;
          }

          if (newHeight > maxHeight) {
            newWidth *= maxHeight / newHeight;
            newHeight = maxHeight;
          }

          canvas.width = newWidth;
          canvas.height = newHeight;

          const context = canvas.getContext('2d');
          context?.drawImage(video, 0, 0, newWidth, newHeight);

          // Convert the canvas to a Blob
          canvas.toBlob(async (blob) => {
            if (blob) {
              // Read the Blob as an ArrayBuffer
              const compressedVideoBuffer = await this.readBlobAsArrayBuffer(blob);

              // Convert the ArrayBuffer back to base64
              const compressedBase64 = this.arrayBufferToBase64(compressedVideoBuffer);

              resolve(compressedBase64);
            } else {
              reject('Error creating compressed video blob.');
            }
          }, 'video/mp4', quality);

        });

      } catch (error) {
        reject(error);
      }
    });
  } */

  private base64ToArrayBuffer(base64: string): ArrayBuffer {
    const binaryString = window.atob(base64);
    const len = binaryString.length;
    const bytes = new Uint8Array(len);
    for (let i = 0; i < len; ++i) {
      bytes[i] = binaryString.charCodeAt(i);
    }
    return bytes.buffer;
  }

  private async readBlobAsArrayBuffer(blob: Blob): Promise<ArrayBuffer> {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.onloadend = () => {
        if (reader.result instanceof ArrayBuffer) {
          resolve(reader.result);
        } else {
          reject('Error reading blob as ArrayBuffer.');
        }
      };
      reader.readAsArrayBuffer(blob);
    });
  }

  private arrayBufferToBase64(buffer: ArrayBuffer): string {
    const binary = String.fromCharCode(...new Uint8Array(buffer));
    return btoa(binary);
  }


  fileSizeToMB(sizeInBytes) {
    var sizeInMB = (sizeInBytes / (1024 * 1024)).toFixed(2);
    console.log(sizeInMB + 'MB');
    return parseInt(sizeInMB)
  }

  deleteFromSeletedContent(index) {
    this.seletedContent.splice(index, 1)
  }

}

// class UploadFileUseCase {
//   LakefsRepositoryService:  LakefsRepositoryService = window["LakefsRepositoryService"]
//   constructor() {}
//   execute(attachment: PublicationAttachmentEntity) {

//     const file: File = attachment.blob

//     const chunkSize = 1024 * 100; // Adjust the chunk size as needed
//     const fileSize = file.size;
//     let uploadedSize = 0
//     const totalChunks = Math.ceil(fileSize / chunkSize);
//     let offset = 0;
//     let i = 1;
//     let j = 0;
//     let path;

//     function count () {
//       j++
//       return j
//     }

//     const readAndUploadChunk = async(index: number) => {
//       return new Promise<void>((resolve, reject) => {
//         const chunk = file.slice(offset, offset + chunkSize);
//         const reader = new FileReader();

//         reader.onload = async () => {
//           const blob = new Blob([reader.result as ArrayBuffer]);
//           const formData = new FormData();
//           const file = new File([blob], "test.mp4", { type: blob.type });

//           uploadedSize =+ file.size

//           formData.append("blobFile", file);
//           formData.append("length", totalChunks.toString());
//           formData.append("index", index.toString());
//           formData.append("path", path);

//           try {
//             const response = await this.LakefsRepositoryService.uploadFile(formData).toPromise()

//             console.log({response})

//             resolve()
//           } catch (erro) {
//             reject()
//           }

//         };

//         reader.readAsArrayBuffer(chunk);
//         offset += chunkSize;
//       });
//     }

//     const  loop = async() => {

//       for (let index = 2; index <= totalChunks; index++) {
//         await readAndUploadChunk(index);
//       }

//     }

//      const startUpload = async() => {
//       const index = count();
//       const chunk = file.slice(offset, offset + chunkSize);
//       const reader = new FileReader();

//       reader.onload = async () => {
//         const blob = new Blob([reader.result as ArrayBuffer]);
//         const formData = new FormData();
//         const file = new File([blob], "test.mp4", { type: blob.type });
//         uploadedSize =+ file.size
//         formData.append("blobFile", file);
//         formData.append("length", totalChunks.toString());
//         formData.append("index", index.toString());


//         const response: any = await this.LakefsRepositoryService.uploadFile(formData).toPromise()

//         console.log({ response, index });
//         if (index === 1) {
//           path = response.path;
//         }

//         await loop();
//       };

//       reader.readAsArrayBuffer(chunk);
//       offset += chunkSize;
//     }

//     startUpload();


//   }
// }




class UploadFileUseCase {
  LakefsRepositoryService:  LakefsRepositoryService = window["LakefsRepositoryService"]
  constructor() {}
  async execute(ChucksManager: ChucksManager): Promise<Result<ChucksManager, ChucksManager>> {

    let path;

    function makeFrom({blobFile, index, path}) {

      const formData = new FormData();

      formData.append("blobFile", blobFile);
      formData.append("length", ChucksManager.chunks.totalChunks.toString());
      formData.append("index", index.toString());
      formData.append("path", path);

      return formData
    }

    const readAndUploadChunk = async(index: number) => {

      const chunk = await ChucksManager.chunks.getChunks(index)
      const blob = new Blob([chunk]);
      const blobFile = new File([blob], "test.mp4", { type: blob.type });

      const form = makeFrom({blobFile, index, path})

      return await this.LakefsRepositoryService.uploadFile(form)
    }

    if(!ChucksManager.hasPath()) {

      const initIndex = ChucksManager.uploadsCount + 1
      const chuck = await ChucksManager.chunks.getChunks(initIndex)
      const blob = new Blob([chuck]);
      const blobFile = new File([blob], "test.mp4", { type: blob.type });
      const form = makeFrom({blobFile, index: initIndex, path})

      const uploadRequest = await this.LakefsRepositoryService.uploadFile(form)

      if(uploadRequest.isOk()) {
        path = uploadRequest.value.path
      } else {
        return err(ChucksManager)
      }
    }

    const indexContinuation = ChucksManager.uploadsCount + 1
    for (let index = indexContinuation; index <= ChucksManager.chunks.totalChunks; index++) {
      const uploadRequest = await readAndUploadChunk(index)

      if(uploadRequest.isErr()) {
        return err(ChucksManager)
      }
    }

    return ok(ChucksManager)
  }
}

class PublicationAttachmentEntity {
  FileBase64: string
  FileExtension: string
  FileType: 'image' | 'video'
  OriginalFileName: string
  blobFile: File
  toUpload = false;
  chucksManager : ChucksManager

  constructor({base64, extension, blobFile = null, OriginalFileName = null, FileType}) {
    this.FileBase64 = base64;
    this.FileExtension = extension;
    this.blobFile = blobFile
    this.OriginalFileName = OriginalFileName
    this.FileType = FileType

    this.fixFileBase64();
  }

  fixFileBase64() {
    if(this.FileType == 'image' ) {
      if(!this.FileBase64.startsWith('data:')) {
        this.FileBase64 = 'data:image/jpg;base64,' + this.FileBase64
      }
    } else if (this.FileType == 'video' ) {
      if(!this.FileBase64.startsWith('data:')) {
        this.FileBase64 = 'data:video/mp4;base64,' + this.FileBase64
      }

    }
  }

  needUpload() {
    this.toUpload = true
  }

  setChunkManger (chunks: Chunks) {
    this.chucksManager = new ChucksManager({chunks})
  }

  get hasChunkManager() {
    return this.chucksManager != null
  }
}

interface IPublicationFormModelEntity  {
  DateIndex: any
  DocumentId: any
  ProcessId: any
  Title: any
  Message: any
  DatePublication: any
  Files: PublicationAttachmentEntity[]
}

class PublicationFormModel implements IPublicationFormModelEntity {
  constructor() {}
  DateIndex: any;
  DocumentId: any;
  ProcessId: any;
  Title: any;
  Message: any;
  DatePublication: any;
  OriginalFileName: string;
  Files: PublicationAttachmentEntity[];

  setData(data: IPublicationFormModelEntity) {
    Object.assign(this, data)
  }
}

class PublicationFormMV {

  private UploadFileUseCase = new UploadFileUseCase()
  private form = new PublicationFormModel()

  setDataToFrom(data: IPublicationFormModelEntity) {
    this.form.setData(data)
  }

  private getVideoFiles() {
    return this.form.Files.filter( x => x.FileType == 'video')
  }

  private async upload(PublicationAttachmentEntity: PublicationAttachmentEntity) {

    const fileBlob = PublicationAttachmentEntity.blobFile;
    const fileChunks = new Chunks({chunkSize: 1024 })
    fileChunks.setFile(fileBlob)

    PublicationAttachmentEntity.setChunkManger(fileChunks)


    const ChucksManagers = new ChucksManager({chunks: fileChunks})

    this.UploadFileUseCase.execute(ChucksManagers)
  }

  uploadVideosFiles() {

    const videosFiles = this.getVideoFiles()

    const videosFilesToUploads = videosFiles.filter( e => e.toUpload == true)

    for(const file of videosFilesToUploads) {
      this.upload(file)
    }
  }

}


class Chunks {

  chunkSize: number
  private file: File

  constructor({chunkSize}) {
    this.chunkSize = chunkSize
  }

  get totalChunks () {
    return Math.ceil(this.file.size / this.chunkSize);
  }

  // Function to read a chunk of the file
  readChunk(start: number, end: number): Promise<ArrayBuffer> {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.onload = () => {
        if (reader.result instanceof ArrayBuffer) {
          resolve(reader.result);
        } else {
          reject(new Error("Failed to read chunk"));
        }
      };
      reader.readAsArrayBuffer(this.file.slice(start, end));
    });
  }

  setFile(file: File) {
    this.file = file
  }

  async getChunks(i: number) {
    i--
    if(i < this.totalChunks) {
      const start = i * this.chunkSize;
      const end = Math.min(start + this.chunkSize, this.file.size);
      const chunk = await this.readChunk(start, end);

      return chunk
    }
  }

}

interface IUploadResponse {
  result: Result<string, Error>
  attemp: number
}

class ChucksManager {
  chunks: Chunks
  uploads: IUploadResponse[] = []
  path: string =''

  get uploadsCount() {
    return this.uploads.length
  }

  uploadFunc: Function
  constructor({chunks}) {
    this.chunks = chunks
  }

  setPath(path: string) {
    this.path = path
  }

  hasPath() {
    return this.path != undefined
  }
}