some changes

src/app/pages/publications/new-publication/new-publication.page.ts

@@ -27,6 +27,8 @@ import { FilePicker } from '@capawesome/capacitor-file-picker';
 import { CapacitorVideoPlayer } from 'capacitor-video-player';
 import { CaptureError, CaptureImageOptions, MediaCapture, MediaFile } from '@awesome-cordova-plugins/media-capture/ngx';
 import { Capacitor } from '@capacitor/core';
+import { File } from '@ionic-native/file/ngx';
+import { Media } from '@ionic-native/media/ngx';
 
 const config = {
   quality: 0.5,
@@ -207,48 +209,47 @@ export class NewPublicationPage implements OnInit {
       let options: CaptureImageOptions = { limit: 1 }
       const data = await this.mediaCapture.captureVideo(options)
       this.video = data[0];
-  /*     console.log(this.video)
-      if (result && result.length > 0) {
-        const videoFile = result[0];
-        const copiedVideoPath = await this.copyVideoToDataDirectory(videoFile);
-  
-        if (copiedVideoPath) {
-          const base64Video = await this.convertVideoToBase64(copiedVideoPath);
-          console.log(base64Video);
-        }
-      } */
+      console.log(data)
+      const originalFilePath = 'file:///storage/emulated/0/DCIM/Camera/20231110_125118.mp4';
+      const mediaFile = new Media();
+      mediaFile.create(data[0].fullPath)
+      console.log(mediaFile)
+      this.mediaFileToBase64(data[0])
+        .then((base64Data) => {
+          console.log('Base64 data:', base64Data);
+          // Now you can use the base64 data as needed
+        })
+        .catch((error) => {
+          console.error('Error converting to base64:', error);
+          // Handle errors
+        });
 
 
-
-      /* this.convertVideoToBase64(data[0].fullPath) */
-      /* this.fileType = "video/mp4"
-      await Filesystem.writeFile({
-        path: data[0].name,
-        data: data[0].fullPath,
-        directory: FilesystemDirectory.Data,
-      }).then(async (dir) => {
-        console.log('DIR ', dir)
-        const base64Video = await this.convertVideoToBase64(dir.uri); */
-        let resultUrl = decodeURIComponent('documents://' + data[0].fullPath);
-        Filesystem.readFile({ path: resultUrl, encoding: Encoding.UTF8, })
-
-          .then(async (content) => {
-            console.log(JSON.stringify(content))
-            const base64Data = btoa(content.data);
-
-            console.log(base64Data);
-             this.filecontent = true;
-            this.capturedVideo = "data:video/mp4;base64," + content.data;
-            this.photoOrVideo = false;
-          })
-          .catch((err) => console.error(err));
-     /*  }); */
-
     } catch (error) {
       console.log('record video error: ', error)
     }
   }
 
+  mediaFileToBase64(mediaFile) {
+    return new Promise((resolve, reject) => {
+      // Create a FileReader
+      const reader = new FileReader();
+
+      // Set the callback for when the file is loaded
+      reader.onloadend = () => {
+        resolve(reader.result);
+      };
+
+      // Set the callback for errors
+      reader.onerror = (error) => {
+        reject(error);
+      };
+
+      // Read the file as Data URL (base64)
+      reader.readAsDataURL(mediaFile);
+    });
+  }
+
 
 
   async loadVideo() {
@@ -588,25 +589,25 @@ export class NewPublicationPage implements OnInit {
     })
   }
 
- 
+
   async copyVideoToDataDirectory(videoFile: any): Promise<string | null> {
     try {
       const { uri } = videoFile;
       const fileName = uri.substring(uri.lastIndexOf('/') + 1);
       const targetPath = Directory.Data + fileName; // Set your target directory path
-  
+
       await Filesystem.copy({
         from: uri,
         to: targetPath,
       });
-  
+
       return targetPath;
     } catch (error) {
       console.error(error);
       return null;
     }
   }
-  
+
   async convertVideoToBase64(videoPath: string): Promise<string | null> {
     try {
       const file = await Filesystem.readFile({ path: videoPath, directory: FilesystemDirectory.Data });
@@ -620,6 +621,34 @@ export class NewPublicationPage implements OnInit {
       return null;
     }
   }
-  
+
+  async copyAndReadFile(filePath: string): Promise<string> {
+    try {
+      // Copy the file to the app's data directory
+      const copyResult = await Filesystem.copy({
+        from: filePath,
+        to: '20231110_125118.mp4', // or any desired name
+        directory: Directory.Data,
+      });
+
+      const copiedFilePath = copyResult.uri; // Use 'uri' instead of 'to'
+
+      // Read the copied file as base64
+      const readResult = await Filesystem.readFile({
+        path: copiedFilePath,
+        directory: Directory.Data,
+        encoding: Encoding.UTF8,
+      });
+
+      const base64Data = readResult.data;
+      console.log('Base64 data:', base64Data);
+
+      return base64Data;
+    } catch (error) {
+      console.error('Error copying/reading file:', error);
+      throw error;
+    }
+  }
+
 
 }

src/app/pages/publications/view-publications/view-publications.page.html

@@ -43,12 +43,11 @@
 
       <ion-card *ngFor="let publication of publicationFolderService.publicationList[folderId] let i = index">
         <ion-card-content>
-          <div class="post-img" >
-            <img *ngIf="publication.FileExtension == 'jpeg'" (click)="goToPublicationDetail(publication.DocumentId, publication.ProcessId)" [lazyLoad]="publication.FileBase64">
+          <div (click)="goToPublicationDetail(publication.DocumentId, publication.ProcessId)" class="post-img" >
+            <img *ngIf="publication.FileExtension != 'mp4'" [lazyLoad]="publication.FileBase64">
 
-            <video *ngIf="publication.FileExtension == 'mp4'" playsinline controls
-              preload="auto">
-              <source [src]="'data:video/mp4;base64,'+publication.FileBase6" type="video/mp4">
+            <video *ngIf="publication.FileExtension == 'mp4'"  controls="controls" preload="metadata"  webkit-playsinline="webkit-playsinline">
+              <source src="{{publication.FileBase64}}" type="video/mp4">
             </video>
 
           </div>