Add Event Listener

1. Add ad event listener

Use gladsdk.addEventListener() to add an event listener for events occurring during the ad slot rendering.

2. Ad Event Type

Event	Event Type	Description
Ad Load	gladsdk.event.AD_LOADED	Occurs when an ad is loaded in an ad slot
Ad Rendered	gladsdk.event.AD_RENDERED	Occurs when an ad is rendered in an ad slot
Ad Click	gladsdk.event.AD_CLICKED	Occurs when the ad creative rendered in an ad slot is clicked
Ad Impressed	gladsdk.event.AD_IMPRESSED	Occurs when the exposure criteria for the ad creative rendered in the ad slot are met
Ad Error	gladsdk.event.ERROR	Occurs when ad loading fails or execution error occurs
Empty Ad	gladsdk.event.EMPTY	Occurs when there is no ad to be displayed
Ad Mute	gladsdk.event.AD_MUTE_COMPLETED	Occurs when ad mute reason is clicked
Ad Mute State Changed	gladsdk.event.AD_MUTE_STATE_CHANGED	Occurs when ad mute state is changed
Ad Creative Meta Changed	gladsdk.event.CREATIVE_META_CHANGED	Occurs when ad creative meta is changed

warning

AD_RENDERED event is triggered when the ad SDK inserts the ad creative into the DOM.

However, depending on the ad creative, the size of the ad may not be accurate at the time of the RENDERED event.

danger

Ad slots should not be deleted when an Ad error event occurs.

NAM SDK identifies valid ad exposures even when rendering has failed. Therefore, do not remove or hide the ad container by calls such as adSlotElement.remove() nor apply display: none;.

2-1. Getting Ad Information Delivered by Ad Events

By adding ad event listeners for each ad event, you can obtain additional information about the ad received during the ad request, as well as details about errors that occur during ad loading or rendering.

Ad Slot Information

• An instance of the ad slot associated with the ad event.
• Can be accessed via ad.slot.

Ad Slot Size Information

• The ad slot size received from the server response during the ad request.
• The size value set by the ad provider server is delivered, which may differ from the final rendered size of the ad slot.
• Can be accessed via ad.size. For native ads, this may be undefined.

Ad Meta(adContext) Information

• Meta information related to the selected ad, received from the server response during the ad request.
• Can be accessed via ad.adContext and is delivered as a JSON string. If there is no server response value, it will be undefined.

Slot Index (slotIndex) Information

• The index information of the element (slot) inside an ad creative carousel.
• When receiving the AD_CLICKED event, it can be accessed via ad.slotIndex. If the condition is not met, it will be undefined.
  • The slotIndex value is provided only when the adContext response exists, the selected ad's creative type is carousel (including both banner and native types), and a carousel sub-element is clicked.
  • If a non-carousel area is clicked, slotIndex will be undefined.
  • If the carousel sub-element cannot be identified internally, slotIndex will also be undefined.
• slotIndex is a number starting from 0 for the first element.

Ad Mute State Information

• Ad mute state information associated with the AD_MUTE_STATE_CHANGED event. Delivered as the second parameter (muteState) of the event handler.
• The internal ad mute state value is delivered according to the initialization of the ad mute icon by the user and changes in the ad mute reason selection step after clicking the icon.
• If the ad mute icon is not initialized, this state information is not delivered.
• The ad mute state information can have the values: 'init', 'feedbackOn', 'question', or 'result'.

Creative Meta Information

• Creative meta information associated with the CREATIVE_META_CHANGED event. Delivered as the second parameter (creativeMeta) of the event handler.
• If there is information related to the creative that needs to be delivered to the publisher page, it will be provided. If not provided by the creative code, it will not be delivered.

Ad Error Information

• Ad error instance associated with the ERROR and EMPTY error events. Delivered as the second parameter (error) of the event handler.

window.gladsdk = window.gladsdk || { cmd: [] };

window.gladsdk.cmd.push(function () {
  window.gladsdk.addEventListener(window.gladsdk.event.AD_LOADED, function (ad) {
    console.debug(window.gladsdk.event.AD_LOADED);

    var adSlot = ad.slot;
    var adUnitId = adSlot.getAdUnitId();
    var adSlotElementId = adSlot.getAdSlotElementId();
  });

  window.gladsdk.addEventListener(window.gladsdk.event.AD_CLICKED, function (ad) {
    console.debug(window.gladsdk.event.AD_CLICKED);
  });

  window.gladsdk.addEventListener(window.gladsdk.event.AD_IMPRESSED, function (ad) {
    console.debug(window.gladsdk.event.AD_IMPRESSED);
  });

  window.gladsdk.addEventListener(window.gladsdk.event.ERROR, function (ad, error) {
    console.debug(window.gladsdk.event.ERROR);
  });

  window.gladsdk.addEventListener(window.gladsdk.event.AD_MUTE_COMPLETED, function (ad) {
    console.debug(window.gladsdk.event.AD_MUTE_COMPLETED);
  });

  window.gladsdk.addEventListener(window.gladsdk.event.AD_MUTE_STATE_CHANGED, function (ad, muteState) {
    console.debug(window.gladsdk.event.AD_MUTE_STATE_CHANGED, muteState);
  });

  window.gladsdk.addEventListener(window.gladsdk.event.CREATIVE_META_CHANGED, function (ad, creativeMeta) {
    console.debug(window.gladsdk.event.CREATIVE_META_CHANGED, creativeMeta);
  });

  var adSlotInfo = {
    adUnitId: 'WEB_nw_banner-N345765840',
    adSlotElementId: 'division',
  };

  var adSlot = window.gladsdk.defineAdSlot(adSlotInfo);
  window.gladsdk.displayAd(adSlot);
});

3. Remove ad event listener

Removing a specific event listener

Use gladsdk.removeEventListener() to remove a specific event listener.

var listener = function (ad) {
  console.debug(window.gladsdk.event.AD_CLICKED);
}
window.gladsdk.addEventListener(window.gladsdk.event.AD_CLICKED, listener);
window.gladsdk.removeEventListener(window.gladsdk.event.AD_CLICKED, listener);

Removing all event listeners

Use gladsdk.removeAllEventListener() to remove all event listeners.

window.gladsdk.removeAllEventListener();