Bu kılavuzda, HTML5 IMA SDK uygulamasına geri sayım zamanlayıcı ekleme hakkında bilgi verilmektedir.
Ön koşullar
Bu kılavuzda, çalışan bir HTML5 IMA SDK uygulamanız olduğu varsayılmaktadır. Başlamadıysanız Başlangıç kılavuzuna bakın.
Zamanlayıcı oluşturuluyor
IMA özellikli video oynatıcınıza geri sayım zamanlayıcı eklemek için AdsManager örneğinin remainingTime özelliğini yoklamak için yalnızca birkaç satır JavaScript eklemeniz gerekir. adsManager.remainingTime öğesini kontrol etmek için saniyede bir işlev çağırmak üzere setInterval() yöntemini kullanırız.
// Global countdown timer
var countdownTimer;
...
function onAdsManagerLoaded(adsManagerLoadedEvent) {
adsManager = adsManagerLoadedEvent.getAdsManager(
videoElement);
...
adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
onContentResumeRequested);
adsManager.addEventListener(
google.ima.AdEvent.Type.STARTED,
onAdsStarted);
}
...
function onAdsStarted(adEvent) {
countdownTimer = setInterval(function() {
var timeRemaining = adsManager.getRemainingTime();
// Update UI with timeRemaining
}, 1000);
}
...
function onContentResumeRequested(adEvent) {
...
if (countdownTimer) {
clearInterval(countdownTimer);
}
}
Deneyin
Aşağıda çalışan bir uygulama görebilirsiniz.