বিজ্ঞাপন ম্যানেজার ক্লাস তৈরি করুন

ads_manager.js এ, IMA SDK StreamManager-এর জন্য একটি র‍্যাপার ক্লাস সংজ্ঞায়িত করুন যা স্ট্রিম অনুরোধ করে, বিজ্ঞাপন পড ম্যানিফেস্ট পায়, IMA স্ট্রিম ইভেন্ট শোনে এবং IMA SDK-তে ইএমএসজি ইভেন্ট পাস করে।

ads_manager.js এ, IMA HbbTV নমুনা অ্যাপ নিম্নলিখিত পদ্ধতিগুলি সেট আপ করে:

  • requestStream()
  • onStreamEvent()
  • onEmsgEvent()
  • loadAdPodManifest()

বিজ্ঞাপন ম্যানেজার শুরু করুন

বিজ্ঞাপন ম্যানেজার ক্লাস শুরু করুন এবং IMA স্ট্রিম ইভেন্টের জন্য শ্রোতাদের সেট করুন। এই কলে, VideoPlayer.setEmsgEventHandler() পদ্ধতির সাথে emsg ইভেন্ট হ্যান্ডলার সেট করুন।

/**
 * Wraps IMA SDK ad stream manager.
 * @param {!VideoPlayer} videoPlayer Reference an instance of the wrapper from
 * video_player.js.
 */
var AdManager = function(videoPlayer) {
  this.streamData = null;
  this.videoPlayer = videoPlayer;
  // Ad UI is not supported for HBBTV, so no 'adUiElement' is passed in the
  // StreamManager constructor.
  this.streamManager = new google.ima.dai.api.StreamManager(
      this.videoPlayer.videoElement);
  this.streamManager.addEventListener(
      [
        google.ima.dai.api.StreamEvent.Type.STREAM_INITIALIZED,
        google.ima.dai.api.StreamEvent.Type.ERROR,
        google.ima.dai.api.StreamEvent.Type.CLICK,
        google.ima.dai.api.StreamEvent.Type.STARTED,
        google.ima.dai.api.StreamEvent.Type.FIRST_QUARTILE,
        google.ima.dai.api.StreamEvent.Type.MIDPOINT,
        google.ima.dai.api.StreamEvent.Type.THIRD_QUARTILE,
        google.ima.dai.api.StreamEvent.Type.COMPLETE,
        google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED,
        google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED,
        google.ima.dai.api.StreamEvent.Type.AD_PROGRESS,
        google.ima.dai.api.StreamEvent.Type.PAUSED,
        google.ima.dai.api.StreamEvent.Type.RESUMED
      ],
      this.onStreamEvent.bind(this),
      false);

  this.videoPlayer.setEmsgEventHandler(this.onEmsgEvent, this);
};
ads_manager.js

একটি বিজ্ঞাপন পড স্ট্রিম জন্য একটি অনুরোধ করুন

আপনার Google অ্যাড ম্যানেজার নেটওয়ার্ক কোড এবং স্ট্রিমের কাস্টম সম্পদ কী ব্যবহার করে একটি PodStreamRequest অবজেক্ট তৈরি করতে AdManager.requestStream() পদ্ধতি তৈরি করুন। নিম্নলিখিত স্ট্রিম প্যারামিটার সহ IMA নমুনা DASH পড পরিবেশন স্ট্রীম ব্যবহার করে আপনার HbbTV অ্যাপ পরীক্ষা করুন:

  • নেটওয়ার্ক কোড : '21775744923'
  • কাস্টম সম্পদ কী : 'hbbtv-dash' 
/**
 * Makes a pod stream request.
 * @param {string} networkCode The network code.
 * @param {string} customAssetKey The custom asset key.
 */
AdManager.prototype.requestStream = function(networkCode, customAssetKey) {
  var streamRequest = new google.ima.dai.api.PodStreamRequest();
  streamRequest.networkCode = networkCode;
  streamRequest.customAssetKey = customAssetKey;
  streamRequest.format = 'dash';
  debugView.log('AdsManager: make PodStreamRequest');
  this.streamManager.requestStream(streamRequest);
};
ads_manager.js

বিজ্ঞাপন স্ট্রিম ইভেন্ট শুনুন

IMA স্ট্রীম ইভেন্ট, STREAM_INITIALIZED , AD_BREAK_STARTED , এবং AD_BREAK_ENDED এ আপনার অ্যাপের প্রতিক্রিয়া পরিচালনা করতে AdManager.onStreamEvent() পদ্ধতি তৈরি করুন।

/**
 * Handles IMA playback events.
 * @param {!Event} event The event object.
 */
AdManager.prototype.onStreamEvent = function(event) {
  switch (event.type) {
    // Once the stream response data is received, generate pod manifest url
    // for the video stream.
    case google.ima.dai.api.StreamEvent.Type.STREAM_INITIALIZED:
      debugView.log('IMA SDK: stream initialized');
      this.streamData = event.getStreamData();
      break;
    case google.ima.dai.api.StreamEvent.Type.ERROR:
      break;
    // Hide video controls while ad is playing.
    case google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED:
      debugView.log('IMA SDK: ad break started');
      this.adPlaying = true;
      this.adBreakStarted = true;
      break;
    // Show video controls when ad ends.
    case google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED:
      debugView.log('IMA SDK: ad break ended');
      this.adPlaying = false;
      this.adBreakStarted = false;
      break;
    // Update ad countdown timers.
    case google.ima.dai.api.StreamEvent.Type.AD_PROGRESS:
      break;
    default:
      debugView.log('IMA SDK: ' + event.type);
      break;
  }
};
ads_manager.js

বিজ্ঞাপন স্ট্রিম মেটাডেটা পরিচালনা করুন

IMA-তে emsg ইভেন্টের তথ্য পাঠাতে, StreamManager.processMetadata() পদ্ধতি ব্যবহার করে AdManager.onEmsgEvent() পদ্ধতি তৈরি করুন। ভিডিও প্লেয়ার ক্লাস এই পদ্ধতিটিকে VideoPlayer.setEmsgEventHandler() পদ্ধতির সাথে কল করে।

/**
 * Callback on Emsg event.
 * Instructs IMA SDK to fire back VAST events accordingly.
 * @param {!Event} event The event object.
 */
AdManager.prototype.onEmsgEvent = function(event) {
  var data = event.event.messageData;
  var pts = event.event.calculatedPresentationTime;
  if ((data instanceof Uint8Array) && data.byteLength > 0) {
    this.streamManager.processMetadata('ID3', data, pts);
  }
};
ads_manager.js

বিজ্ঞাপন পড ম্যানিফেস্ট লোড করুন

ভিডিও প্লেয়ারের সাথে অ্যাড পড ম্যানিফেস্ট প্রিলোড করতে AdManager.loadAdPodManifest() পদ্ধতি তৈরি করুন। পদ্ধতিতে কাঠামো ব্যবহার করে ম্যানিফেস্ট ইউআরএল তৈরি করুন: DASH পড ম্যানিফেস্ট ।

/**
 * Creates DAI pod url and instructs video player to load manifest.
 * @param {string} networkCode The network code.
 * @param {string} customAssetKey The custom asset key.
 * @param {number} podDuration The duration of the ad pod.
 */
AdManager.prototype.loadAdPodManifest =
    function(networkCode, customAssetKey, podDuration) {
  if (!this.streamData) {
    debugView.log('IMA SDK: No DAI pod session registered.');
    return;
  }

  var MANIFEST_BASE_URL = 'https://dai.google.com/linear/pods/v1/dash/network/';
  // Method: DASH pod manifest reference docs:
  // https://developers.google.com/ad-manager/dynamic-ad-insertion/api/pod-serving/reference/live#method_dash_pod_manifest
  var manifestUrl = MANIFEST_BASE_URL + networkCode + '/custom_asset/' +
    customAssetKey + '/stream/' + this.streamData.streamId + '/pod/' +
    this.getPodId() + '/manifest.mpd?pd=' + podDuration;
  this.videoPlayer.preload(manifestUrl);
};
ads_manager.js

HbbTV নমুনা অ্যাপটি এলোমেলোভাবে তৈরি করা অনন্য podId ব্যবহার করে। প্রোডাকশন অ্যাপে, podId হল একটি পূর্ণসংখ্যা যা একটি থেকে শুরু হয় এবং প্রতিটি বিজ্ঞাপন বিরতির জন্য একটি করে বৃদ্ধি পায়। নিশ্চিত করুন যে বিজ্ঞাপন বিরতির সমস্ত দর্শকদের জন্য podId একই মান। একটি podId পেতে, আমরা প্রারম্ভিক বিজ্ঞাপন বিরতি বিজ্ঞপ্তি (EABN) API ব্যবহার করার পরামর্শ দিই। একটি উৎপাদন পরিবেশে, HbbTV স্ট্রীম ইভেন্ট AD_BREAK_ANNOUNCE এ podId এবং podDuration অন্তর্ভুক্ত করুন।

এরপরে, আপনার HbbTV অ্যাপের জন্য প্রধান অ্যাপ্লিকেশন ক্লাস তৈরি করুন যা HbbTV সম্প্রচারের সাথে ইন্টারঅ্যাক্ট করে।

পূর্ববর্তী
প্লেয়ার ক্লাস সেট আপ করুন
পরবর্তী
অ্যাপ্লিকেশন ক্লাস তৈরি করুন