var playbackController;
function buildTopBar(controller) {
var topBar = document.querySelector('.bottombar.topbar');
var playBackButton = topBar.querySelector('.playBackButton');
var playForwardButton = topBar.querySelector('.playForwardButton');
playBackButton.addEventListener('click', controller.playBackwardTrigger);
playForwardButton.addEventListener('click', controller.playForwardTrigger);
topBar.style.display = 'block';
}
function startCameras() {
var cameras = document.getElementsByClassName('camera');
var event = new Event('click');
for (var a = 0; a < cameras.length; a++) {
cameras\[a\].dispatchEvent(event);
}
}
function Controls(playbackControllerId) {
this.play = function (speed) {
XPMobileSDK.changeMultipleStreams({
PlaybackControllerId: playbackControllerId,
Speed: typeof speed == 'number' ? speed : 1
}, function (parameters) { });
};
this.pause = function () {
this.play(0);
};
this.goToTime = function (timestamp) {
XPMobileSDK.changeMultipleStreams({
PlaybackControllerId: playbackControllerId,
SeekType: 'Time',
Time: timestamp
}, function (parameters) { });
};
}
function Controller() {
var id;
var videoConnection;
var playbackSpeed = 0;
var controls;
var self = this;
function createPlaybackControllerCallback(connection) {
var connectionResponse = connection.response;
videoConnection = connection;
id = connection.response.parameters.PlaybackControllerId;
var videoConnectionObserver = {
videoConnectionReceivedFrame: onReceivedFrame,
videoConnectionTemporaryDown: function () { },
videoConnectionRecovered: function () { },
videoConnectionNotAvailable: function () { }
};
videoConnection.addObserver(videoConnectionObserver);
if (videoConnection.getState() == XPMobileSDK.library.VideoConnectionState.notOpened) {
videoConnection.open();
}
controls = new Controls(id);
buildTopBar(self);
startCameras();
}
document.getElementById('dropdown-list').addEventListener('change', function () {
// Create a new playback controller when the dropdown value changes
createPlaybackController();
});
function createPlaybackController() {
// Convert the ISO timestamp to milliseconds since the epoch
var initialTimestamp = Date.parse('2023-11-28T06:58:42.327Z');
XPMobileSDK.createPlaybackController(
{
SeekType: 'Time',
Time: initialTimestamp
},
createPlaybackControllerCallback,
function (error) {}
);
}
var timeStamp;
function onReceivedFrame(frame) {
if (frame.hasPlaybackInformation) {
onPlaybackEvents(frame.currentPlaybackEvents);
}
timeStamp = frame.timestamp;
updateTime(frame.timestamp);
}
function onPlaybackEvents(playbackEvents) {
if (playbackEvents & XPMobileSDK.library.ItemHeaderParser.PlaybackFlags.Stopped) {
// onPlaybackStopped();
}
if (playbackEvents & XPMobileSDK.library.ItemHeaderParser.PlaybackFlags.Forward) {
// onPlaybackForward();
}
if (playbackEvents & XPMobileSDK.library.ItemHeaderParser.PlaybackFlags.Backward) {
// onPlaybackBackwards();
}
}
/\*\*
* Updates time element
*/
function updateTime(timestamp) {
playbackTimestamp = timestamp;
var date = new Date(timestamp);
var hours = date.getUTCHours();
var minutes = ('0' + date.getUTCMinutes()).slice(-2);
var seconds = ('0' + date.getUTCSeconds()).slice(-2);
var formattedTime = hours + ':' + minutes + ':' + seconds;
document.querySelector('.topbar .playTimeIndex').innerHTML = formattedTime;
}
/\*\*
* Change video speed
*/
function playbackChangeSpeed(speed) {
if (!videoConnection || speed == playbackSpeed) return;
speed = Math.round(speed);
controls.play(speed);
if (speed == 0) {
playbackSpeed = 0;
}
else if (speed < 0) {
playbackSpeed = -1;
}
else if (speed > 0) {
playbackSpeed = 1;
}
updatePlaybackButtons();
}
I have a button in UI on click of that I tried to call the goToTime() Function but I’m facing the error at self.getId = function () { return id; } ID not found