record video on diferente divice solved

android/app/src/main/AndroidManifest.xml

@@ -19,7 +19,8 @@
     android:roundIcon="@mipmap/ic_launcher_round"
     android:supportsRtl="true"
     android:theme="@style/AppTheme"
-    android:usesCleartextTraffic="true">
+    android:usesCleartextTraffic="true"
+    android:requestLegacyExternalStorage="true">
 
     <activity
       android:name=".MainActivity"

src/app/shared/publication/new-publication/new-publication.page.html

@@ -100,41 +100,26 @@
     </div>
 
 
-    <!-- Current -->
-  <!--   <div *ngIf="!captureContent">
-      <div class="ion-item-container-no-border mb-20"
-        *ngIf="publication && !( publication.FileBase64 == 'data:image/jpg;base64,null' || publication.FileBase64 == '' ) && !capturedImage">
-         <ion-label class="attached-title pb-10">Fotografia Anexada</ion-label>
-        <div class="d-flex justify-content-between">
-          <div class="d-flex">
-            <ion-thumbnail slot="start">
-              <ion-img [(ngModel)]="publication.FileBase64" name="image" ngDefaultControl
-                [src]="publication.FileBase64"></ion-img>
-            </ion-thumbnail>
 
-            <ion-label class="pl-10">
-              <p>{{publication.OriginalFileName}}.{{publication.FileExtension}}</p>
-              <p hidden>size</p>
-            </ion-label>
-          </div>
-          <button class="btn-no-color" (click)="deletePublicationImage()">
-            <ion-icon name="close"></ion-icon>
-          </button>
-        </div>
-      </div>
-    </div> -->
 
-    <div class="hide-desktop">
-      <ion-label (click)="loadVideo()">
+    <div style="display: flex;">
+      <div (click)="chossePhotoOrVideo()">
         <div class="attach-icon">
-          <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-add-photo.svg"></ion-icon>
+          <ion-icon *ngIf="ThemeService.currentTheme == 'default' "
+            src="assets/images/icons-add-photo.svg"></ion-icon>
           <ion-icon *ngIf="ThemeService.currentTheme == 'gov' "
             src="assets/images/theme/gov/icons-add-photo.svg"></ion-icon>
+
         </div>
-        <div class="attach-document cursor-pointer">
-          <ion-label>Tirar Fotografia</ion-label>
+        <div class="attach-document">
+          <ion-label>Câmera</ion-label>
         </div>
-      </ion-label>
+      </div>
+    </div>
+   
+    <div *ngIf="photoOrVideo" class="container-multiselect pt-10" style="width: 200px;">
+      <button id="container-multiselect" class="multiselect-button" (click)="takePicture()">Fotografia</button>
+      <button id="container-multiselect" class="multiselect-button" (click)="startVideoRecording()">Video</button>
     </div>
 
     <div >
@@ -145,7 +130,7 @@
             src="assets/images/theme/gov/icons-add-photos.svg"></ion-icon>
         </div>
         <div class="attach-document cursor-pointer">
-          <ion-label>Anexar Fotografia</ion-label>
+          <ion-label>Galeria</ion-label>
         </div>
       </ion-label>
     </div>

src/app/shared/publication/new-publication/new-publication.page.scss

@@ -156,6 +156,10 @@ font-size: rem(25);
   display: block;
 }
 
+.container-multiselect {
+  display: grid;
+}
+
 
 
 

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

@@ -16,6 +16,9 @@ import { LakefsRepositoryService } from '../../repository/lakefs/lakefs-reposito
 import { ok, err, Result } from 'neverthrow';
 import { SocketConnectionMCRService } from "src/app/services/socket-connection-mcr.service"
 import { CMAPIService } from "src/app/shared/repository/CMAPI/cmapi.service";
+import { CaptureError, CaptureImageOptions, MediaCapture, MediaFile } from '@awesome-cordova-plugins/media-capture/ngx';
+import { Filesystem, Directory, Encoding, FilesystemDirectory } from '@capacitor/filesystem';
+import { Platform } from '@ionic/angular';
 
 enum ActionType {
   newRapid = "1",
@@ -60,6 +63,8 @@ export class NewPublicationPage implements OnInit {
   seletedContent: PublicationAttachmentEntity[] = []
   displayLimit = 4;
   filesSizeSum = 0;
+  photoOrVideo: boolean = false;
+  video: any;
 
 
   publicationFormMV = new PublicationFormMV()
@@ -76,7 +81,10 @@ export class NewPublicationPage implements OnInit {
     private MiddlewareServiceService: MiddlewareServiceService,
     private LakefsRepositoryService: LakefsRepositoryService,
     private SocketConnectionMCRService: SocketConnectionMCRService,
-    private CMAPIService: CMAPIService
+    private CMAPIService: CMAPIService,
+    private mediaCapture: MediaCapture,
+    private httpErrorHandle: HttpErrorHandle,
+    private platform: Platform,
   ) {
     this.publicationTitle = 'Nova Publicação';
 
@@ -134,9 +142,9 @@ export class NewPublicationPage implements OnInit {
           OriginalFileName: res.OriginalFileName,
           FileExtension: res.FileExtension,
         }
-        console.log('edit',this.publication)
+        console.log('edit', this.publication)
         this.pub = this.publication;
-        this.seletedContent = this.publication.Files.map( e => {
+        this.seletedContent = this.publication.Files.map(e => {
           return new PublicationAttachmentEntity(
             {
               base64: e.FileBase64,
@@ -173,12 +181,13 @@ export class NewPublicationPage implements OnInit {
       800, // maxHeight
       0.9  // quality
     ).then((picture) => {
+      this.photoOrVideo = false;
       let fileObject = {
         FileBase64: picture,
-        FileExtension: this.removeTextBeforeSlash('jpeg','/')
+        FileExtension: this.removeTextBeforeSlash('jpeg', '/')
       }
 
-      const FileExtension = this.removeTextBeforeSlash('jpeg','/')
+      const FileExtension = this.removeTextBeforeSlash('jpeg', '/')
 
       const newAttachment = new PublicationAttachmentEntity(
         {
@@ -219,10 +228,10 @@ export class NewPublicationPage implements OnInit {
     ).then((picture) => {
       let fileObject = {
         FileBase64: picture,
-        FileExtension: this.removeTextBeforeSlash('jpeg','/')
+        FileExtension: this.removeTextBeforeSlash('jpeg', '/')
       }
 
-      const FileExtension = this.removeTextBeforeSlash('jpeg','/')
+      const FileExtension = this.removeTextBeforeSlash('jpeg', '/')
 
       const newAttachment = new PublicationAttachmentEntity(
         {
@@ -246,14 +255,18 @@ export class NewPublicationPage implements OnInit {
         multiple: true,
       });
 
+      console.log(result)
 
     result.files.forEach(async blobFile => {
-      if(this.checkFileType.checkFileType(blobFile.mimeType) == 'image' || this.checkFileType.checkFileType(blobFile.mimeType) == 'video') {
+      console.log(blobFile)
+      if (this.checkFileType.checkFileType(blobFile.mimeType) == 'image' || this.checkFileType.checkFileType(blobFile.mimeType) == 'video') {
+        console.log()
         this.convertBlobToBase64(blobFile.blob).then((value) => {
-          this.filesSizeSum = this.filesSizeSum + blobFile.size
-         if(this.fileSizeToMB(this.filesSizeSum) <= 20) {
 
-          const FileExtension = this.removeTextBeforeSlash(blobFile.mimeType,'/')
+          this.filesSizeSum = this.filesSizeSum + blobFile.size
+          if (this.fileSizeToMB(this.filesSizeSum) <= 20) {
+
+            const FileExtension = this.removeTextBeforeSlash(blobFile.mimeType, '/')
 
             const file = new File([blobFile.blob], blobFile.name);
 
@@ -269,9 +282,10 @@ export class NewPublicationPage implements OnInit {
             newAttachment.needUpload()
 
             this.seletedContent.push(newAttachment)
+            console.log(this.seletedContent)
             this.filecontent = true;
           } else {
-          if(this.seletedContent.length === 0)
+            if (this.seletedContent.length === 0)
               this.filesSizeSum = 0
 
             this.httpErroHandle.validationMessagge('filessize');
@@ -338,7 +352,7 @@ export class NewPublicationPage implements OnInit {
     }
 
 
-    if(this.seletedContent.length == 0) {
+    if (this.seletedContent.length == 0) {
 
       const newAttachment = new PublicationAttachmentEntity(
         {
@@ -370,7 +384,7 @@ export class NewPublicationPage implements OnInit {
         }
 
 
-        this.publication.Files = this.publication.Files.map( e => ({
+        this.publication.Files = this.publication.Files.map(e => ({
           FileBase64: e.FileBase64,
           FileExtension: e.FileExtension,
           OriginalFileName: 'foto'
@@ -417,7 +431,7 @@ export class NewPublicationPage implements OnInit {
 
 
 
-        this.publication.Files = this.publication.Files.map( e => ({
+        this.publication.Files = this.publication.Files.map(e => ({
           FileBase64: e.FileBase64,
           FileExtension: e.FileExtension,
           OriginalFileName: 'foto'
@@ -529,6 +543,7 @@ export class NewPublicationPage implements OnInit {
   }
 
   convertBlobToBase64(blob: Blob) {
+    console.log('Convert blob ',blob)
     return new Promise((resolve, reject) => {
       const reader = new FileReader;
       reader.onerror = reject;
@@ -539,7 +554,7 @@ export class NewPublicationPage implements OnInit {
     })
   }
 
-  removeTextBeforeSlash(inputString,mark) {
+  removeTextBeforeSlash(inputString, mark) {
     if (inputString.includes(mark)) {
       const parts = inputString.split(mark);
       return parts.length > 1 ? parts[1] : inputString;
@@ -618,7 +633,7 @@ export class NewPublicationPage implements OnInit {
 
 
 
-/*   async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
+  /*   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
@@ -765,7 +780,7 @@ export class NewPublicationPage implements OnInit {
    } */
 
 
-/*   async compressVideoBase64(base64String: string, maxWidth: number, maxHeight: number, quality: number): Promise<string> {
+  /*   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
@@ -890,6 +905,58 @@ export class NewPublicationPage implements OnInit {
     this.publicationFormMV.uploadVideosFiles()
 
   }
+
+  chossePhotoOrVideo() {
+    this.photoOrVideo = !this.photoOrVideo
+  }
+
+  async startVideoRecording() {
+    try {
+      let options: CaptureImageOptions = { limit: 1 }
+      const data: any = await this.mediaCapture.captureVideo(options)
+      this.video = data[0];
+      console.log(data)
+      data.forEach(async element => {
+        this.filesSizeSum = this.filesSizeSum + element.size
+        if (this.fileSizeToMB(this.filesSizeSum) <= 20) {
+          const savedFile = await Filesystem.copy({
+            from: element.fullPath,  // directory prop removed, Capacitor parses filename for us
+            to: "video.mp4",
+            toDirectory: FilesystemDirectory.Data
+          });
+          console.log(savedFile.uri)
+          Filesystem.readFile({ path: savedFile.uri })
+
+            .then(async (content) => {
+              this.filecontent = true;
+              let fileObject = new PublicationAttachmentEntity({
+                base64: content.data,
+                extension: 'mp4',
+                OriginalFileName: 'record',
+                FileType: 'video'
+
+              }
+              )
+              this.seletedContent.push(fileObject)
+            })
+            .catch((err) => console.error(err));
+        } else {
+          if (this.seletedContent.length === 0)
+            this.filesSizeSum = 0
+
+          this.httpErrorHandle.validationMessagge('filessize')
+        }
+
+      });
+    } catch (error) {
+      console.log('record video error: ', error)
+    }
+  }
+
+  checkTableDivice() {
+    if (!this.platform.is('desktop'))
+      return true;
+  }
 }
 
 // class UploadFileUseCase {
@@ -995,31 +1062,31 @@ export class NewPublicationPage implements OnInit {
 
 class UploadFileUseCase {
   CMAPIService: CMAPIService = window["CMAPIService"]
-  constructor() {}
+  constructor() { }
   async execute(ChucksManager: ChucksManager): Promise<Result<ChucksManager, ChucksManager>> {
 
     let path: string;
     const length = ChucksManager.chunks.totalChunks.toString()
 
-    const readAndUploadChunk = async(index: number) => {
+    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 });
 
-      return await this.CMAPIService.FileContent({length, path: ChucksManager.path, index, blobFile})
+      return await this.CMAPIService.FileContent({ length, path: ChucksManager.path, index, blobFile })
     }
 
-    if(!ChucksManager.hasPath()) {
+    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 uploadRequest = await this.CMAPIService.FileContent({length, path:ChucksManager.path, index: initIndex, blobFile})
+      const uploadRequest = await this.CMAPIService.FileContent({ length, path: ChucksManager.path, index: initIndex, blobFile })
 
-      if(uploadRequest.isOk()) {
+      if (uploadRequest.isOk()) {
 
         path = uploadRequest.value.data
 
@@ -1034,7 +1101,7 @@ class UploadFileUseCase {
     for (let index = indexContinuation; index <= ChucksManager.chunks.totalChunks; index++) {
       const uploadRequest = await readAndUploadChunk(index)
 
-      if(uploadRequest.isErr()) {
+      if (uploadRequest.isErr()) {
         return err(ChucksManager)
       } else {
         ChucksManager.setResponse(index, uploadRequest.value as any)
@@ -1052,9 +1119,9 @@ class PublicationAttachmentEntity {
   OriginalFileName: string
   blobFile: File
   toUpload = false;
-  chucksManager : ChucksManager
+  chucksManager: ChucksManager
 
-  constructor({base64, extension, blobFile = null, OriginalFileName = null, FileType}) {
+  constructor({ base64, extension, blobFile = null, OriginalFileName = null, FileType }) {
     this.FileBase64 = base64;
     this.FileExtension = extension;
     this.blobFile = blobFile
@@ -1065,12 +1132,12 @@ class PublicationAttachmentEntity {
   }
 
   fixFileBase64() {
-    if(this.FileType == 'image' ) {
-      if(!this.FileBase64.startsWith('data:')) {
+    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.startsWith('http')) {
+    } else if (this.FileType == 'video') {
+      if (!this.FileBase64.startsWith('data:') && !this.FileBase64.startsWith('http')) {
         this.FileBase64 = 'data:video/mp4;base64,' + this.FileBase64
       }
 
@@ -1081,8 +1148,8 @@ class PublicationAttachmentEntity {
     this.toUpload = true
   }
 
-  setChunkManger (chunks: Chunks) {
-    this.chucksManager = new ChucksManager({chunks})
+  setChunkManger(chunks: Chunks) {
+    this.chucksManager = new ChucksManager({ chunks })
   }
 
   get hasChunkManager() {
@@ -1101,7 +1168,7 @@ interface IPublicationFormModelEntity  {
 }
 
 class PublicationFormModel implements IPublicationFormModelEntity {
-  constructor() {}
+  constructor() { }
   DateIndex: any;
   DocumentId: any;
   ProcessId: any;
@@ -1126,18 +1193,18 @@ class PublicationFormMV {
   }
 
   private getVideoFiles() {
-    return this.form.Files.filter( x => x.FileType == 'video')
+    return this.form.Files.filter(x => x.FileType == 'video')
   }
 
   private async upload(PublicationAttachmentEntity: PublicationAttachmentEntity) {
 
     const fileBlob = PublicationAttachmentEntity.blobFile;
-    const fileChunks = new Chunks({chunkSize: 100 })
+    const fileChunks = new Chunks({ chunkSize: 100 })
     fileChunks.setFile(fileBlob)
 
     PublicationAttachmentEntity.setChunkManger(fileChunks)
 
-    const ChucksManagers = new ChucksManager({chunks: fileChunks})
+    const ChucksManagers = new ChucksManager({ chunks: fileChunks })
 
     this.UploadFileUseCase.execute(ChucksManagers)
   }
@@ -1146,9 +1213,9 @@ class PublicationFormMV {
 
     const videosFiles = this.getVideoFiles()
 
-    const videosFilesToUploads = videosFiles.filter( e => e.toUpload == true)
+    const videosFilesToUploads = videosFiles.filter(e => e.toUpload == true)
 
-    for(const file of videosFilesToUploads) {
+    for (const file of videosFilesToUploads) {
       this.upload(file)
     }
   }
@@ -1161,11 +1228,11 @@ class Chunks {
   chunkSize: number
   private file: File
 
-  constructor({chunkSize}) {
+  constructor({ chunkSize }) {
     this.chunkSize = chunkSize * 1024
   }
 
-  get totalChunks () {
+  get totalChunks() {
     return Math.ceil(this.file.size / this.chunkSize);
   }
 
@@ -1193,7 +1260,7 @@ class Chunks {
 
   async getChunks(i: number) {
     i--
-    if(i < this.totalChunks) {
+    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);
@@ -1211,7 +1278,7 @@ interface IUploadResponse {
 
 class ChucksManager {
   chunks: Chunks
-  uploads: {[key: string]: IUploadResponse } = {}
+  uploads: { [key: string]: IUploadResponse } = {}
   path: string = undefined
 
   get uploadsCount() {
@@ -1219,7 +1286,7 @@ class ChucksManager {
   }
 
   uploadFunc: Function
-  constructor({chunks}) {
+  constructor({ chunks }) {
     this.chunks = chunks
   }
 
@@ -1234,4 +1301,7 @@ class ChucksManager {
   setResponse(index, UploadResponse) {
     this.uploads[index] = UploadResponse
   }
+
 }
+
+

src/environments/environment.prod.ts

@@ -4,4 +4,4 @@ import { doneITProd } from './suport/doneIt'
 import { DevDev } from './suport/dev'
 
 
-export const environment: Environment = DevDev;
+export const environment: Environment = oaprProd;