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://camgroundviews13f7bb-virtualtour.azureedge.net/2bb5776832b6469dbddcc7d5d3eab51f/a13b08a9-71cb-49be-97ab-07e246f06529.m3u8';
var campgroundName = 'Splash RV Resort and Waterpark (FL)';
var showAds = '0';
var odd = '1';
var bEnable = '1';
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 = "https://360cgv-assets.azureedge.net/audio/Lux-Inspira-Baby-Smile.mp3";
var granted = false;
var firstPlay = 0;
const videoAdUrl = "url";
var jsonStr = '[{"PlayerId":1,"Id":33,"Label":"CampgroundViewsJingle.mp3","AudioUrl":"/api/campground/0/360-audio/33","Skip":0,"Loop":0,"Order":1,"Random":0},{"PlayerId":2,"Id":34,"Label":"WelcomeVoice.mp3","AudioUrl":"/api/campground/0/360-audio/34","Skip":0,"Loop":0,"Order":2,"Random":0},{"PlayerId":3,"Id":35,"Label":"DumpingtheTanks.mp3","AudioUrl":"/api/campground/0/360-audio/35","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":36,"Label":"WhydoIhavetocall.mp3","AudioUrl":"/api/campground/0/360-audio/36","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":37,"Label":"FirstComeFirstServed.mp3","AudioUrl":"/api/campground/0/360-audio/37","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":38,"Label":"MyAmericanDream.mp3","AudioUrl":"/api/campground/0/360-audio/38","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":39,"Label":"CampingWeekend.mp3","AudioUrl":"/api/campground/0/360-audio/39","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":19,"Label":"BetweentheLines.mp3","AudioUrl":"/api/campground/0/360-audio/19","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":20,"Label":"LostandFoundButMostlyLost.mp3","AudioUrl":"/api/campground/0/360-audio/20","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":21,"Label":"RollinHome.mp3","AudioUrl":"/api/campground/0/360-audio/21","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":22,"Label":"FasttoCampSlowtoHome.mp3","AudioUrl":"/api/campground/0/360-audio/22","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":23,"Label":"CampgroundViewsAnthem.mp3","AudioUrl":"/api/campground/0/360-audio/23","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":24,"Label":"CampgroundViewsAnthemToo.mp3","AudioUrl":"/api/campground/0/360-audio/24","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":17,"Label":"FreedomontheOpenRoad.mp3","AudioUrl":"/api/campground/0/360-audio/17","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":18,"Label":"ReadytoRoll.mp3","AudioUrl":"/api/campground/0/360-audio/18","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":25,"Label":"CampgroundViewsAdventure.mp3","AudioUrl":"/api/campground/0/360-audio/25","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":49,"Label":"Igetthingsdone.mp3","AudioUrl":"/api/campground/0/360-audio/49","Skip":0,"Loop":0,"Order":3,"Random":1},{"PlayerId":3,"Id":53,"Label":"OurnewRV.mp3","AudioUrl":"/api/campground/0/360-audio/53","Skip":0,"Loop":0,"Order":3,"Random":1}]';
var audios = JSON.parse(jsonStr.replace(/"/g,'"'));
var jsonAdStr = '[{"Id":3,"Label":"15s video - portrait video.mp4","AdUrl":"/api/campground/0/360-ads/3"},{"Id":4,"Label":"N13 New Ad Video - Vince.mp4","AdUrl":"/api/campground/0/360-ads/4"},{"Id":5,"Label":"Garnet - Seelevel Commercial V3 (Compressed).mp4","AdUrl":"/api/campground/0/360-ads/5"}]';
var ads = JSON.parse(jsonAdStr.replace(/"/g,'"'));
;
var i = 0;
var audioPlayer = document.createElement('audio');
audioPlayer.setAttribute('id', 'audioplayer');
audioPlayer.setAttribute('controls', 'true');
audioPlayer.setAttribute('crossorigin', 'anonymous');
audioPlayer.setAttribute('class', 'video-js');
playerDiv.append(audioPlayer);
var player2 = videojs('audioplayer', {
autoplay: false,
loop: false
});
var pluginInData = {
parentId: 2985,
campgroundName: 'Splash RV Resort and Waterpark (FL)',
startDate: new Date(1726358400000),
endDate: new Date(1726531200000),
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 PopUp(){
var popupContainer = document.getElementById("cgvSpeed");
var popupBox = document.createElement('div');
var closeBtn = document.createElement('span');
var popUpCntnt = document.createElement('div');
var fastBtn = document.createElement('button');
var perfectBtn = document.createElement('button');
var slowBtn = document.createElement('button');
popUpCntnt.className = 'popup-content';
popUpCntnt.setAttribute("id", "popup-content-div");
popupBox.className = 'popup-box';
popupBox.setAttribute("id", "popup-box-cntn");
popupBox.appendChild(popUpCntnt);
popUpCntnt.innerHTML = '
';
perfectBtn.setAttribute("id", "perfect-pb-btn");
fastBtn.setAttribute("id", "fast-pb-btn");
slowBtn.setAttribute("id", "slow-pb-btn");
perfectBtn.className = 'popup-btn-speed';
fastBtn.className = 'popup-btn-speed';
slowBtn.className = 'popup-btn-speed';
perfectBtn.innerHTML = 'Perfect';
fastBtn.innerHTML = 'Too Fast';
slowBtn.innerHTML = 'Too Slow';
popUpCntnt.appendChild(fastBtn);
popUpCntnt.appendChild(perfectBtn);
popUpCntnt.appendChild(slowBtn);
closeBtn.className = 'close-btn-popup';
closeBtn.innerHTML = '×';
popupBox.appendChild(closeBtn);
popupContainer.appendChild(popupBox);
closeBtn.addEventListener('click', function() {
var popupBox = document.getElementById("popup-box-cntn");
popupContainer.removeChild(popupBox);
});
fastBtn.addEventListener('click', function() {
var title = document.getElementById('popup-title-text');
title.textContent = 'Is that better?';
const rate = player.playbackRate();
if (rate == 0.75) {
player.playbackRate(0.50);
} else {
player.playbackRate(0.75);
}
if (!player.paused) {
player.pause();
player.play();
}
});
perfectBtn.addEventListener('click', function() {
var popupBox = document.getElementById("popup-box-cntn");
popupContainer.removeChild(popupBox);
firstPlay++;
});
slowBtn.addEventListener('click', function() {
var title = document.getElementById('popup-title-text');
title.textContent = 'Is that better?';
const rate = player.playbackRate();
if (rate == 1.25) {
player.playbackRate(1.50);
} else {
player.playbackRate(1.25);
}
if (!player.paused) {
player.pause();
player.play();
}
});
}
function ThreeSixtyPlayerEvents() {
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
});
}
player2.pause();
});
let qualityLevels = player.qualityLevels();
qualityLevels.on('change', function () {
if (!player.paused) {
player.pause();
player.play();
}
});
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";
if (firstPlay == 0) {
firstPlay++;
} else if (firstPlay == 1) {
setTimeout(function () { PopUp() }, 5000);
var videoEl = document.getElementsByTagName("video")[0];
if (videoEl.currentTime < 1) {
v
}
player2.play();
} else {
player2.play();
}
});
player.on('ended', function () {
gtag("event", "video_stop", {
video_stop: 1
});
});
player.on('volumechange', function () {
if (player.muted()) {
player2.muted(true)
} else {
player2.muted(false);
}
player2.volume(player.volume());
});
player.on('ratechange', 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() {
player.threeSixty(pluginInData);
cgvCInfo.style.display = 'block';
cgvPLink.style.display = 'block';
player.muted(false);
videoUrl = 'https://camgroundviews13f7bb-virtualtour.azureedge.net/2bb5776832b6469dbddcc7d5d3eab51f/a13b08a9-71cb-49be-97ab-07e246f06529.m3u8';
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
ThreeSixtyPlayerEvents();
}
function externalAudioPlayer() {
audioURL = 'https://360.campgroundviews.com' + audios[i].AudioUrl;
player2.src({ src: audioURL, type: 'audio/mp3' });
}
function externalAudioEvents() {
player2.on('ended', function () {
let randomAudio = 1;
if (i === audios.length - 1) {
i = 0;
} else {
i++;
if (audios[i].Random == 0) {
audioURL = 'https://360.campgroundviews.com' + audios[i].AudioUrl;
} else {
do{
randomAudio = randomIntFromInterval(1, audios.length - 1);
}while(audios[randomAudio].Random == 0);
audioURL = 'https://360.campgroundviews.com' + audios[randomAudio].AudioUrl;
}
}
player2.dispose();
var audioPlayer = document.createElement('audio');
audioPlayer.setAttribute('id', 'audioplayer' + i.toString());
audioPlayer.setAttribute('controls', 'true');
audioPlayer.setAttribute('crossorigin', 'anonymous');
audioPlayer.setAttribute('class', 'video-js');
playerDiv.append(audioPlayer);
player2 = videojs('audioplayer' + i.toString(), {
autoplay: false,
muted: player.muted(),
loop: false
});
player2.volume(player.volume());
player2.src({ src: audioURL, type: 'audio/mp3' });
externalAudioEvents();
if (!player.paused()){
player2.play();
} else {
player2.pause();
}
});
}
var videoOptions = {
nativeControlsForTouch: false,
autoplay: false,
fill: true,
muted: false,
preload: "metadata",
poster: "",
playbackRates: [0.5, 0.75, 1, 1.25, 1.5, 2],
inactivityTimeout: 0,
controlBar: {
pictureInPictureToggle: false,
volumePanel: {inline: false},
fullscreenToggle: true,
subsCapsButton: false
},
techOrder: ["html5"],
html5: {
vhs: {
overrideNative: true,
useNetworkInformationApi: true,
enableLowInitialPlaylist: false,
limitRenditionByPlayerDimensions: false,
useDevicePixelRatio: true,
},
nativeAudioTracks: false,
nativeVideoTracks: false,
nativeTextTracks: 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);
}
var adsCount = (ads != undefined || ads != null) ? ads.length : 1;
const preRollIndx = randomIntFromInterval(1, adsCount);
const postRollIndx = randomIntFromInterval(1, adsCount);
if (odd == '2') {
if (ads != undefined || ads != null) {
var bFirst = true;
cgvCInfo.style.display = 'none';
cgvPLink.style.display = 'none';
videoUrl = 'https://360.campgroundviews.com' + ads[preRollIndx-1].AdUrl;
player.muted(false);
player.src({ src: videoUrl, type: 'video/mp4' });
player.on('ready', function() { console.log('ready')});
player.on('play', function () {
gtag("event", "video_ad_play", {
video_ad_play: 1
});
});
player.on('ended', function () {
if(bFirst) {
gtag("event", "video_ad_stop", {
video_ad_stop: 1
});
ThreeSixtyPlayer();
if(bEnable == '1') {
externalAudioPlayer();
externalAudioEvents();
}
bFirst = false;
}
});
} else {
ThreeSixtyPlayer();
if(bEnable == '1') {
externalAudioPlayer();
externalAudioEvents();
}
}
} else if (odd == '3') {
if (ads != undefined || ads != null)
{
var bFirst = true;
cgvCInfo.style.display = 'none';
cgvPLink.style.display = 'none';
videoUrl = 'https://360.campgroundviews.com' + ads[preRollIndx-1].AdUrl;
player.muted(false);
player.src({ src: videoUrl, type: 'video/mp4' });
player.on('play', function () {
gtag("event", "video_ad_play", {
video_ad_play: 1
});
});
player.on('ended', function () {
if (bFirst == true) {
gtag("event", "video_ad_stop", {
video_ad_stop: 1
});
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 = 'https://360.campgroundviews.com' + ads[postRollIndx-1].AdUrl;
//videoUrl = videoAdUrl + "?ad=ads&ad.lib==ads" + postRollIndx + "&ad.postroll=1";
player.src({ src: videoUrl, type: 'video/mp4' });
player.play();
bFirst = true;
player.on('ended', function () {
if (bFirst == true) {
externalAudioPlayer();
ThreeSixtyPlayer();
externalAudioEvents();
bFirst = false;
}
player2.currentTime(0);
});
}
});
} else {
ThreeSixtyPlayer();
if(bEnable == '1') {
externalAudioPlayer();
externalAudioEvents();
}
}
} else {
player.muted(false);
ThreeSixtyPlayer();
player.src({ src: videoUrl, type: 'application/vnd.apple.mpegurl' });
if(bEnable == '1') {
externalAudioPlayer();
externalAudioEvents();
}
}