ایجاد تایمر شمارش معکوس تبلیغات

ما تایمر شمارش معکوس داخلی را که HTML5 IMA SDK از طریق UIElements ارائه می‌کند، توصیه می‌کنیم. اگر همچنان می‌خواهید برنامه خود را پیاده‌سازی کنید، مراحل زیر را دنبال کنید.

این راهنما شما را با افزودن یک تایمر شمارش معکوس به پیاده سازی HTML5 IMA SDK راهنمایی می کند.

پیش نیازها

این راهنما فرض می‌کند که شما یک پیاده‌سازی HTML5 IMA SDK دارید. اگر این کار را نمی کنید، به راهنمای شروع مراجعه کنید.

ایجاد تایمر

افزودن یک تایمر شمارش معکوس به پخش‌کننده ویدیوی دارای IMA شما فقط نیاز به افزودن چند خط جاوا اسکریپت برای نظرسنجی ویژگی remainingTime در نمونه AdsManager دارد. ما از متد setInterval() برای فراخوانی یک تابع در هر ثانیه برای بررسی adsManager.remainingTime استفاده می کنیم.

// 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);
  }
}
  

آن را امتحان کنید

در زیر می توانید یک پیاده سازی کار را مشاهده کنید.