Media

Our Media module stands out as a potent tool for efficient and secure management and sharing of your image and video content. This module streamlines the process of uploading multimedia files to cloud storage, offering a hassle-free experience.

Primary Benefit

• Seamlessly integrates with your workflow through its user-friendly API, reducing the need for manual database management.

• Eliminates the complexities of setting up databases and managing AWS servers, allowing you to focus on your core tasks

Note: There is no file size limitation for uploads via the SDK

Adding Module

Capacitor

npm install @trunpm/truvideo-capacitor-media-sdk --registry=https://registry.npmjs.org/ --//registry.npmjs.org/:_authToken=<YOUR_TOKEN>

Import the following dependency in your file, here you will use these function.

TSX

import {  
    MediaBuilder, 
    type UploadCompleteEventData, 
    type UploadErrorEvent, 
    type UploadProgressEvent 
} from '@trunpm/truvideo-capacitor-media-sdk';

Create Upload Callback -

The uploadMedia function emits several events during the upload process. These events can be listened to using the NativeEventEmitter from React Native.

• onProgress: Emitted to indicate the progress of the upload.

• onError: Emitted if there is an error during the upload.

• onComplete: Emitted when the upload is complete.

JSX

// Upload
const uploadCallbacks = {
  onProgress: (event: UploadProgressEvent) => {
    console.log(`[uploadMediaItems] Upload Progress | ID: ${event.id}, Progress: ${event.progress}%`);
  },
  onComplete: (event: UploadCompleteEventData) => {
    console.log(`[uploadMediaItems] Upload Complete | ID: ${event.id}, Type: ${event.fileType}`);
  },
  onError: (event: UploadErrorEvent) => {
    console.error(`[uploadMediaItems] Upload Error | ID: ${event.id}, Error: ${event.error}`);
  },
}

Returned Result With Upload

interface UploadCompleteEventData {
  id: string;
  createdDate?: string;
  remoteId?: string;
  uploadedFileURL?: string;
  metaData?: string; 
  tags?: string;
  transcriptionURL?: string;
  transcriptionLength?: number;
  fileType?: string;
}

Upload Media

TruVideoMediaSdk contains all function required to manage the media module. UploadFile function upload’s a one file at a time i.e. photo or video by taking, URI of the local file path, tag, metaData and it will return promise. Promise that resolves with the response from the server upon successful upload, or rejects with an error if the upload fails.

JSX

const result = new MediaBuilder(item.filePath);
console.log(`[uploadMediaItems] Initialized MediaBuilder for ${item.filePath}`);

// Set tags
result.setTag("key", "value");
result.setTag("color", "red");
result.setTag("orderNumber", "123");

// Set metadata
result.setMetaData("key", "value");
result.setMetaData("key1", "1");
result.setMetaData("key2", "[4,5,6]");

// Build request
const request = await result.build();
console.log("[uploadMediaItems] Built upload request");

// uploadCallbacks obbject from previous step 
await request.upload(uploadCallbacks);
console.log(`[uploadMediaItems] Upload finished for: ${item.filePath}`);

Search Media

search function will give the list uploaded media with respect to tags, page, pageSize and type

const searchData : SearchPaginationData = 
    search(
        tags: Map<string, string>,
        page: number,
        pageSize: number,
        type?: MediaType
    );
    
// media type 
enum MediaType {
  IMAGE,
  VIDEO,
  AUDIO,
  PDF,
}

SearchPaginationData :

interface SearchPaginationData {
    data : SearchData[];
    totalPages : number;
    totalElements : number;
    numberOfElements : number;
    size : number;
    number : number;
    first : boolean;
    empty : boolean;
    last : boolean;
}

Search Data :

interface SearchData {
    id: string;
    createdAt: string;
    remoteId: string;
    uploadedFileURL: string;
    tags : any;
    metaData : any;
    transcriptionURL: string;
    transcriptionLength: number;
    fileType: string;    
    thumbnailUrl: string;
    previewUrl : string;
}

GetAllRequest

This function will provide all the requests created for Upload Builder

• Input Params

var status : UploadRequestStatus | undefined = undefined // for all status 

// for specific status 
enum UploadRequestStatus {
  UPLOADING,
  IDLE,
  ERROR,
  PAUSED,
  COMPLETED,
  CANCELED,
  SYNCHRONIZING,
}

• Function Utilisation

const requests : MediaData[]  = await getAllFileUploadRequests(status);

GetRequestById

This function will return exact request associated with the id

const request : MediaData = getFileUploadRequestById(id : string);

MediaData

export interface MediaData {
    id: string;
    filePath: string;
    fileType: string;
    durationMilliseconds: number;
    remoteId: string;
    remoteURL: string;
    transcriptionURL: string;
    transcriptionLength: number;
    status: string;
    progress: number;
}