CODEWITHSUNDEEP
angularionic2
ANISUNDAR
ANISUNDAR

Reputation: 807

Ionic 2 Play cctv Video

I have developed the App using ionic framework and cordova.

I need play CCTV video.

Below my Collections

 {
  "0" : {
    "ACCESS_USERS" : [ {
      "FLAT_ID" : "1_1",
      "USER_ID" : "1"
    }, {
      "FLAT_ID" : "4",
      "USER_ID" : "6"
    }, {
      "FLAT_ID" : "5",
      "USER_ID" : "7"
    } ],
    "APART_ID" : "2",
    "CAMERA_ACCESS_CODE" : "1234",
    "CAMERA_ACCESS_URL" : "http://192.168.0.200",
    "CAMERA_CODE" : "G1_C1",
    "CAMERA_NAME" : "Ground floor entrance camera 1",
    "CAMERA_PASSWORD" : "admin",
    "CAMERA_STATUS" : "1",
    "CAMERA_USERNAME" : "admin"
  }

}

I have no idea.

Kindly advice me,

Thanks.

Upvotes: 1

Views: 271

Answers (1)

Spanchal
Spanchal

Reputation: 495

install this plugin in ionic project.

ionic cordova plugin add cordova-plugin-streaming-media
npm install --save @ionic-native/streaming-media

using your collection make one live streaming URL.

demo URL = 'http://www.sample-videos.com/video/mp4/720/big_buck_bunny_720p_30mb.mp4'

=========================== .ts =================================

import { NavController, ToastController } from 'ionic-angular';
import { StreamingMedia, StreamingVideoOptions, StreamingAudioOptions } from '@ionic-native/streaming-media';

constructor(public navCtrl: NavController,
          public toastCtrl: ToastController,
          private streamingMedia: StreamingMedia) { }

startVideo(){
let options: StreamingVideoOptions = {
  successCallback: () => { this.tost('Video played'); },
  errorCallback: (e) => { this.tost(JSON.stringify(e)); },
  orientation: 'landscape',
// orientation: 'portrait'
};

this.streamingMedia.playVideo(**'YOUR_LIVE_STREAMING_URL'**, options);
}

tost(message){

let toast = this.toastCtrl.create({
  message: message,
  duration: 3000
});
toast.present();

}

========================= HTML ======================

<ion-card>
<button ion-button (click)="startVideo()">Start Video</button>
</ion-card>

Upvotes: 1

Related Questions