Skip to content

Instantly share code, notes, and snippets.

@ptvandi

ptvandi/ign.html

Created July 12, 2019 21:53
Show Gist options
  • Save ptvandi/81daf65d1ea4d54c97a02ffbaa26fb60 to your computer and use it in GitHub Desktop.
Save ptvandi/81daf65d1ea4d54c97a02ffbaa26fb60 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
ign.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>IGN</title>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
background: black;
}
#container {
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
}
#ptv-root {
height: auto !important;
}
</style>
<script src="//unpkg.com/react@15.4.1/dist/react-with-addons.js"></script>
<script src="//unpkg.com/react-dom@15.4.1/dist/react-dom.js"></script>
<script src="//apps.ign.com/video-player/release/6.4.4/test.ae9bf4ce.js"></script>
<script src="//unpkg.com/url-search-params@0.6.1/build/url-search-params.js"></script>
<script src="/common/utils.js"></script>
<script src="//cdn.promethean.tv/sdk/latest/ptv.js"></script>
</head>
<body onload="onLoad()">
<div id="container">
<div id="ign-player"></div>
</div>
<script>
/* eslint-disable */
function onLoad() {
var params = Utils.getQueryParams();
var sdkConfig = Object.assign({}, params, {
playerType: PTV.TYPES.PLAYERS.IGN
});
/************************************************************************
* Copy IGN code from provided demo.
*
* http://apps.ign.com/video-player/release/6.4.4/test.html?videoId=46f52fb88dfe32149c116586d24ca629
/**********************************************************************/
var urlParams = new URLSearchParams(window.location.search);
window.testParams = {
prefetchVideo: urlParams.get('prefetchVideo') !== null,
videoId: urlParams.get('videoId') || '096c9d9f95411fedbe5ef6bb5a0adba6',
videoId2: urlParams.get('videoId2') || false,
playerMode: urlParams.get('mode') || 'hls',
margins: urlParams.get('margins') !== null,
autoplay: urlParams.get('autoplay') !== null,
muted: urlParams.get('muted') !== null,
skipInitialAd: urlParams.get('skipInitialAd') !== null,
il: urlParams.get('il') !== null,
loop: urlParams.get('loop') !== null,
mutedPrerollDelay: urlParams.get('mutedPrerollDelay') || 3,
enableMutedPreroll: urlParams.get('enableMutedPreroll') !== null,
playerId: urlParams.get('playerId') || '',
nextVideoId: urlParams.get('nextVideoId') || false,
nextTitle: urlParams.get('nextTitle') || false,
nextThumbnail: urlParams.get('nextThumbnail') || false,
playerId: urlParams.get('playerId') || '',
}
console.warn('Test page parameters: ', testParams);
if (window.testParams.il) {
window._zd_il = 1;
}
function createPlayerConfig(containerId, video) {
var playerConfig = {
container: document.getElementById(containerId),
config: {
player: window.testParams.playerMode === 'hls' ? {
mode: 'hls',
preferredRendition: 'auto'
} : {
mode: 'progressive',
preferredRendition: '540'
},
mux: {
debug: false,
data: {
property_key: 'IGN-DEV:OXPYSIJYVD8T8YW',
experiment_name: 'v6_test'
}
},
autoplay: window.testParams.autoplay,
muted: window.testParams.muted,
analytics: {
pageType: 'wikis',
playerContext: 'Debug V6 Page'
},
user: {
userId: '12345',
nickname: 'Jsmith',
adsDisabled: false
},
showRecircScreen: true,
skipInitialAd: window.testParams.skipInitialAd,
enableSkippablePreroll: true,
moatPartnerCode: 'ignimajsint947428450867',
video: video,
mutedPrerollDelay: window.testParams.mutedPrerollDelay,
enableMutedPreroll: window.testParams.enableMutedPreroll,
playerId: window.testParams.playerId,
nextVideoId: window.testParams.nextVideoId,
nextTitle: window.testParams.nextTitle,
nextThumbnail: window.testParams.nextThumbnail,
playerId: window.testParams.playerId,
}
};
if (window.testParams.loop) {
try {
var loopConfig = JSON.parse(urlParams.get('loop'));
} catch (e) {
var loopConfig = JSON.parse(atob(urlParams.get('loop')));
}
playerConfig.config.loop = loopConfig;
}
return playerConfig;
}
if (window.testParams.prefetchVideo) {
fetch('https://apis.ign.com/video/v3/videos/' + window.testParams.videoId)
.then(function (res) { return res.json(); })
.then(function (video) {
// Switch over to passing in a video object to allow this use case to be tested
window.player = new VideoPlayer(createPlayerConfig('ign-player', video));
});
} else {
window.player = new VideoPlayer(createPlayerConfig('ign-player'));
window.player.setVideo({ videoId: window.testParams.videoId });
}
if (window.testParams.margins) {
document.querySelector('body').classList.add('margins');
}
window.player.once('play', function () {
if (window.testParams.skipInitialAd) {
window.player.cacheVideo({});
}
});
/*********************************************************************/
window.app = new PTV(window.player, sdkConfig);
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment