إنشاء موقّت العد التنازلي للإعلان

يرشدك هذا الدليل إلى كيفية إضافة موقّت للعد التنازلي إلى عملية تنفيذ حزمة تطوير برامج HTML5 لإعلانات الوسائط التفاعلية.

المتطلبات الأساسية

يفترض هذا الدليل أنّ لديك عملية تنفيذ ناجحة لحزمة تطوير برامج HTML5 لإعلانات الوسائط التفاعلية. إذا لم يكن لديك حساب، راجِع دليل البدء.

إنشاء الموقّت

لا تتطلّب إضافة موقّت للعد التنازلي إلى مشغّل الفيديو المزوّد بواجهة IMA سوى إضافة بضعة أسطر من JavaScript لاستطلاع سمة 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);
  }
}

جرّبه الآن

اطّلِع على هذا التنفيذ.