Media.net Adapter Improvements

modules/medianetBidAdapter.js

@@ -4,6 +4,11 @@ import { config } from 'src/config';
 
 const BIDDER_CODE = 'medianet';
 const BID_URL = '//prebid.media.net/rtb/prebid';
+const SLOT_VISIBILITY = {
+  NOT_DETERMINED: 0,
+  ABOVE_THE_FOLD: 1,
+  BELOW_THE_FOLD: 2
+};
 
 $$PREBID_GLOBAL$$.medianetGlobals = {};
 
@@ -71,6 +76,31 @@ function getSize(size) {
   }
 }
 
+function getWindowSize() {
+  return {
+    w: window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || -1,
+    h: window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || -1
+  }
+}
+
+function getCoordinates(id) {
+  const element = document.getElementById(id);
+  if (element && element.getBoundingClientRect) {
+    const rect = element.getBoundingClientRect();
+    let coordinates = {};
+    coordinates.top_left = {
+      y: rect.top,
+      x: rect.left
+    };
+    coordinates.bottom_right = {
+      y: rect.bottom,
+      x: rect.right
+    };
+    return coordinates
+  }
+  return null;
+}
+
 function extParams(params, gdpr) {
   let ext = {
     customer_id: params.cid,
@@ -80,6 +110,10 @@ function extParams(params, gdpr) {
   if (ext.gdpr_applies) {
     ext.gdpr_consent_string = gdpr.consentString || '';
   }
+  let windowSize = spec.getWindowSize();
+  if (windowSize.w !== -1 && windowSize.h !== -1) {
+    ext.screen = windowSize;
+  }
   return ext;
 }
 
@@ -102,9 +136,64 @@ function slotParams(bidRequest) {
   if (bidFloor) {
     params.bidfloor = bidFloor;
   }
+  const coordinates = getCoordinates(bidRequest.adUnitCode);
+  if (coordinates) {
+    let normCoordinates = normalizeCoordinates(coordinates);
+    params.ext.coordinates = normCoordinates;
+    params.ext.viewability = getSlotVisibility(coordinates.top_left, getMinSize(params.banner));
+    if (getSlotVisibility(normCoordinates.top_left, getMinSize(params.banner)) > 0.5) {
+      params.ext.visibility = SLOT_VISIBILITY.ABOVE_THE_FOLD;
+    } else {
+      params.ext.visibility = SLOT_VISIBILITY.BELOW_THE_FOLD;
+    }
+  } else {
+    params.ext.visibility = SLOT_VISIBILITY.NOT_DETERMINED;
+  }
+
   return params;
 }
 
+function getMinSize(sizes) {
+  return sizes.reduce((min, size) => size.h * size.w < min.h * min.w ? size : min);
+}
+
+function getSlotVisibility(topLeft, size) {
+  let maxArea = size.w * size.h;
+  let windowSize = spec.getWindowSize();
+  let bottomRight = {
+    x: topLeft.x + size.w,
+    y: topLeft.y + size.h
+  };
+  if (maxArea === 0 || windowSize.w === -1 || windowSize.h === -1) {
+    return 0;
+  }
+
+  return getOverlapArea(topLeft, bottomRight, {x: 0, y: 0}, {x: windowSize.w, y: windowSize.h}) / maxArea;
+}
+
+// find the overlapping area between two rectangles
+function getOverlapArea(topLeft1, bottomRight1, topLeft2, bottomRight2) {
+  // If no overlap, return 0
+  if ((topLeft1.x > bottomRight2.x || bottomRight1.x < topLeft2.x) || (topLeft1.y > bottomRight2.y || bottomRight1.y < topLeft2.y)) {
+    return 0;
+  }
+  // return overlapping area : [ min of rightmost/bottommost co-ordinates ] - [ max of leftmost/topmost co-ordinates ]
+  return ((Math.min(bottomRight1.x, bottomRight2.x) - Math.max(topLeft1.x, topLeft2.x)) * (Math.min(bottomRight1.y, bottomRight2.y) - Math.max(topLeft1.y, topLeft2.y)));
+}
+
+function normalizeCoordinates(coordinates) {
+  return {
+    top_left: {
+      x: coordinates.top_left.x + window.pageXOffset,
+      y: coordinates.top_left.y + window.pageYOffset,
+    },
+    bottom_right: {
+      x: coordinates.bottom_right.x + window.pageXOffset,
+      y: coordinates.bottom_right.y + window.pageYOffset,
+    }
+  }
+}
+
 function generatePayload(bidRequests, bidderRequests) {
   return {
     site: siteDetails(bidRequests[0].params.site),
@@ -204,6 +293,8 @@ export const spec = {
     if (syncOptions.pixelEnabled) {
       return filterUrlsByType(cookieSyncUrls, 'image');
     }
-  }
+  },
+
+  getWindowSize,
 };
 registerBidder(spec);