var isIOSEmulator = navigator.appVersion.includes('iPad') || navigator.appVersion.includes('iPhone') || navigator.appVersion.includes('iPod') ? true : false;
var isIPhone = (navigator.appVersion.includes('iPhone')) || (/iPhone/.test(navigator.platform));
var isIOSDevice = (/iPad|iPhone|iPod/.test(navigator.platform) || isIOSEmulator ||
(navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)) &&
!window.MSStream;
var videoUrl = 'https://360virtualtour-usct.streaming.media.azure.net/15b72a6b-e4e9-4864-b42c-267862e83469/Video-Video-79c0922d59aa43b8acbf.ism/manifest(format=m3u8-aapl)';
var campgroundName = 'Rifle Gap State Park';
var showAds = '0';
var odd = '2';
var downlink = navigator.connection != undefined ? navigator.connection.downlink : 0.5;
var computedBandwidth = downlink * 1000000;
var datePicker = document.getElementById("cgvDatesPicker");
var search = document.getElementById("cgvSearch");
var adsLibrary = ['ads', 'ads2', 'ads3', 'ads4', 'ads5'];
var cgvCInfo = document.getElementById("cgvCampgroundInfo");
var cgvPLink = document.getElementById("cgvPoweredLink");
var playerDiv = document.getElementById('playerContainer');
var audioURL = "/audio/Lux-Inspira-Baby-Smile.mp3";
var granted = false;
const videoAdUrl = "https://content.uplynk.com/f01dbe73de764fe7834be9bf14065b92.m3u8";
var pluginInData = {
parentId: 2828,
campgroundName: 'Rifle Gap State Park',
startDate: new Date(1714953600000),
endDate: new Date(1715126400000),
datePicker: datePicker,
search: search,
resourcesCdnEndpoint: 'https://360cgv-assets.azureedge.net',
playerHost: 'https://360.campgroundviews.com',
supportsAvailability: false,
pinTimelineRangeSec: 5,
isPhone: isIOSDevice
}
function iOSPermission() {
if (typeof(DeviceOrientationEvent) !== "undefined" && typeof (DeviceOrientationEvent).requestPermission === "function") {
if (granted == false) {
DeviceOrientationEvent.requestPermission()
.then(response => {
if (response == "granted") {
window.addEventListener("deviceorientation", (e) => { });
granted = true;
}
}).catch(console.error)
}
} else {
//do nothing
}
}
function randomIntFromInterval(min, max) { // min and max included
return Math.floor(Math.random() * (max - min + 1) + min)
}
function ThreeSixtyPlayerEvents() {
player.threeSixty(pluginInData);
player.on('pause', function () {
var videoEl = document.getElementsByTagName("video")[0];
if (videoEl.currentTime < 1) {
document.querySelector(".vjs-big-play-button").style.opacity = "1";
document.querySelector(".vjs-big-play-button").style.visibility = "visible";
document.querySelector(".vjs-big-play-button").style.display = "block";
}
if (videoEl.currentTime > 1) {
gtag("event", "video_pause", {
paused: 1
});
}
});
player.on('play', function () {
document.querySelector(".vjs-big-play-button").style.opacity = "0";
document.querySelector(".vjs-big-play-button").style.visibility = "hidden";
document.querySelector(".vjs-big-play-button").style.display = "none";
var videoEl = document.getElementsByTagName("video")[0];
if (videoEl.currentTime < 1) {
gtag("event", "video_play", {
video_play: 1
});
}
});
player.on('ratechange', function () {
player.pause();
player.play();
});
let qualityLevels = player.qualityLevels();
qualityLevels.on('change', function () {
if (!player.paused) {
player.pause();
player.play();
}
});
if (isIOSDevice) {
player.on('enterFullWindow', function (e) {
var renderedCanvas = document.getElementsByTagName("canvas")[0];
if (player.isFullscreen()) {
var parentEl = renderedCanvas.parentElement;
var postionInfo = parentEl.getBoundingClientRect();
renderedCanvas.setAttribute("width", postionInfo.width.toString());
renderedCanvas.setAttribute("height", postionInfo.height.toString());
}
});
player.on('exitFullWindow', function (e) {
var renderedCanvas = document.getElementsByTagName("canvas")[0];
if (!player.isFullscreen()) {
var parentEl = renderedCanvas.parentElement;
var postionInfo = parentEl.getBoundingClientRect();
renderedCanvas.setAttribute("width", postionInfo.width.toString());
renderedCanvas.setAttribute("height", postionInfo.height.toString());
}
});
}
player.addChild('BigPlayButton');
if (!isIPhone) {
player.qualitySelectorHls({
displayCurrentQuality: true,
placementIndex: 2,
vjsIconClass: "vjs-icon-hd"
});
}
}
function ThreeSixtyPlayer() {
cgvCInfo.style.display = 'block';
cgvPLink.style.display = 'block';
player.muted(true);
ThreeSixtyPlayerEvents();
videoUrl = 'https://360virtualtour-usct.streaming.media.azure.net/15b72a6b-e4e9-4864-b42c-267862e83469/Video-Video-79c0922d59aa43b8acbf.ism/manifest(format=m3u8-aapl)';
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
}
var videoOptions = {
nativeControlsForTouch: false,
fill: true,
muted: true,
preload: "metadata",
poster: "",
autoplay: false,
playbackRates: [0.5, 0.75, 1, 1.25, 1.5, 2],
inactivityTimeout: 0,
controlBar: {
pictureInPictureToggle: false,
volumePanel: false,
fullscreenToggle: true
},
techOrder: ["html5"],
html5: {
vhs: {
overrideNative: true,
useNetworkInformationApi: true,
enableLowInitialPlaylist: false,
limitRenditionByPlayerDimensions: false,
useDevicePixelRatio: true,
},
nativeAudioTracks: false,
nativeVideoTracks: false,
},
preferFullWindow: isIOSDevice,
fullscreen: {
options: { navigationUI: 'show' }
},
plugins: {
hotkeys: {
volumeStep: 0.1,
seekStep: 5,
enableModifiersForNumbers: false,
enableNumbers: false
}
}
};
var player = videojs('player', videoOptions, function () {
this.off(this.tech_, "mousedown", this.handleTechClick_);
cgvCInfo.innerHTML = campgroundName;
cgvPLink.innerHTML = "Powered by Campground Views";
datePicker.style.height = '100%';
datePicker.style.width = document.getElementById("playerContainer").style.width;
});
if (isIOSDevice) {
var btnOrientation = document.createElement('button');
btnOrientation.setAttribute('id', 'request');
btnOrientation.setAttribute('class', 'orientation-button');
btnOrientation.innerHTML = 'Request device orientation access';
btnOrientation.addEventListener('click', iOSPermission);
playerDiv.append(btnOrientation);
}
if (odd == '2') {
const preRollIndx = randomIntFromInterval(1, 5);
cgvCInfo.style.display = 'none';
cgvPLink.style.display = 'none';
videoUrl = videoAdUrl + "?ad=ads&ad.lib=ads" + preRollIndx + "&ad.preroll=1";
player.muted(false);
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
player.on('ready', function() { console.log('ready')});
player.on('ended', function () {
ThreeSixtyPlayer();
});
} else if (odd == '3') {
const preRollIndx = randomIntFromInterval(1, 5);
const postRollIndx = randomIntFromInterval(1, 5);
var bFirst = true;
cgvCInfo.style.display = 'none';
cgvPLink.style.display = 'none';
videoUrl = videoAdUrl + "?ad=ads&ad.lib=ads" + preRollIndx + "&ad.preroll=1";
player.muted(false);
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
player.on('ended', function () {
if (bFirst == true) {
ThreeSixtyPlayer();
bFirst = false;
} else {
player2.dispose();
player.dispose();
var videoPlayer = document.createElement('video');
videoPlayer.setAttribute('id', 'player2');
videoPlayer.setAttribute('controls', 'true');
videoPlayer.setAttribute('playsInline', 'true');
videoPlayer.setAttribute('crossorigin', 'anonymous');
videoPlayer.setAttribute('class', 'video-js');
var cgvPoweredLink = document.createElement('div');
cgvPoweredLink.setAttribute('id', 'cgvPoweredLink');
var cgvCampgroundInfo = document.createElement('div');
cgvCampgroundInfo.setAttribute('id', 'cgvCampgroundInfo');
var cgvDatesPicker = document.createElement('div');
cgvDatesPicker.setAttribute('id', 'cgvDatesPicker');
var cgvSearch = document.createElement('div');
cgvSearch.setAttribute('id', 'cgvSearch');
playerDiv.append(videoPlayer);
playerDiv.append(cgvPoweredLink);
playerDiv.append(cgvCampgroundInfo);
playerDiv.append(cgvDatesPicker);
playerDiv.append(cgvSearch);
player = videojs('player2', videoOptions, function () {
this.off(this.tech_, "mousedown", this.handleTechClick_);
cgvCInfo.innerHTML = campgroundName;
cgvPLink.innerHTML = "Powered by Campground Views";
datePicker.style.height = '100%';
datePicker.style.width = document.getElementById("playerContainer").style.width;
});
//
cgvCInfo.style.display = 'none';
cgvPLink.style.display = 'none';
//
player.muted(false);
videoUrl = videoAdUrl + "?ad=ads&ad.lib==ads" + postRollIndx + "&ad.postroll=1";
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
player.play();
bFirst = true;
player.on('ended', function () {
if (bFirst == true) {
ThreeSixtyPlayer();
bFirst = false;
}
player2.currentTime(0);
});
}
});
} else {
player.muted(true);
ThreeSixtyPlayer();
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
player.on('ready', function() { console.log('ready')});
}