@temple-wallet/extension-ads 10.1.1-dev.1638.1 → 10.1.1-dev.1638.2

package/dist/referrals/index.js

@@ -1,18 +1,189 @@
 'use strict';
 
-var A = require('webextension-polyfill');
+var browser = require('webextension-polyfill');
 var lodash = require('lodash');
-var D = require('axios');
-var U = require('memoizee');
+var axios = require('axios');
+var memoizee = require('memoizee');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var A__default = /*#__PURE__*/_interopDefault(A);
-var D__default = /*#__PURE__*/_interopDefault(D);
-var U__default = /*#__PURE__*/_interopDefault(U);
+var browser__default = /*#__PURE__*/_interopDefault(browser);
+var axios__default = /*#__PURE__*/_interopDefault(axios);
+var memoizee__default = /*#__PURE__*/_interopDefault(memoizee);
 
-var h=(r,t,i)=>new Promise((u,o)=>{var g=e=>{try{a(i.next(e));}catch(s){o(s);}},l=e=>{try{a(i.throw(e));}catch(s){o(s);}},a=e=>e.done?u(e.value):Promise.resolve(e.value).then(g,l);a((i=i.apply(r,t)).next());});var m=process&&process.env&&process.env.NODE_ENV==="development",R=navigator.userAgent.includes("Macintosh"),y=r=>!!r;var x=lodash.memoize(()=>w(window.location.hostname,"www"));function w(r,t){return r.includes(`${t}.`)?r.slice(t.length+1):r}var k="data-tw-referral";function S(r,t,i,u){return h(this,null,function*(){let o=Array.from(document.querySelectorAll("a"));if(!o.length)throw new Error("No anchors found");let g=o.map(e=>{if(e.hasAttribute(k))return null;let s=I(e.href);if(!s||!r.has(s))return null;let d=b(e.href);return d?{iri:d,aElem:e,urlDomain:s}:null}).filter(y);if(!g.length)return void(m&&console.info("Nothing to replace"));let l=g.map(e=>e.iri),a=yield A__default.default.runtime.sendMessage({type:i.FetchReferrals,links:l});if(!a.data.length)return void(m&&console.info("No referrals received"));m&&console.info("Replacing",a.data.length,"referralas");for(let{iri:e,aElem:s,urlDomain:d}of g){let p=a.data.find(f=>f.iri===e),n=p==null?void 0:p.trackingLink;if(!n){m&&console.warn("No affiliate link for",s);continue}let c=p.imageUrl;L({iri:e,aElem:s,urlDomain:d,referralUrl:n,imageUrl:c},t,i,u);}})}function L(r,t,i,u){var p;let{aElem:o,urlDomain:g,referralUrl:l,imageUrl:a}=r,e=o.href,s=u?v(u,l):l;if(m&&console.info("Replacing referral:",e,"to",l,"for anchor:",o),o.setAttribute(k,"set"),o.onclick=n=>{n.preventDefault(),m&&console.log("Referral clicked:",e,"->",l),A__default.default.runtime.sendMessage({type:i.ReferralClick,urlDomain:g,pageDomain:x()});let c=n.button===1||(R?n.metaKey:n.ctrlKey);window.open(s,c?"_blank":"_self");},o.oncontextmenu=()=>{o.href=s;let n=()=>{o.href=e,window.removeEventListener("focus",n);};window.addEventListener("focus",n);},!a)return;let d=x();for(let n of t){if(new RegExp(n.hostRegExStr).test(d)===!1)continue;let c=n.aChildSelector?o.querySelector(n.aChildSelector):null;if(c||(c=n.aMatchSelector&&o.matches(n.aMatchSelector)?o:null),!c)continue;let f=document.createElement("img");f.src=a,f.height=(p=n.iconHeight)!=null?p:20,f.style.display="inline-block",f.style.marginLeft="6px",f.style.verticalAlign="middle",c.appendChild(f);return}}function v(r,t){let i=new URL(r);return i.searchParams.set("url",t),i.toString()}function I(r){try{return w(new URL(r).hostname,"www")}catch(t){return null}}function b(r){try{let t=new URL(r);return t.origin+t.pathname}catch(t){return null}}var T=class{constructor(t,i="https://api.takeads.com"){this.publicKey=t;this.apiUrl=i;this.axios=D__default.default.create({baseURL:i,headers:{Authorization:`Bearer ${this.publicKey}`},adapter:"fetch"});}affiliateLinks(t,i){return h(this,null,function*(){return (yield this.axios.put("/v1/product/monetize-api/v2/resolve",{iris:t,subId:i,withImages:!0})).data})}},C=U__default.default(r=>new T(r),{max:2});
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
-exports.buildTakeadsClient = C;
-exports.getCurrentPageDomain = x;
-exports.processAnchors = S;
+// src/utils.ts
+var IS_DEV = process && process.env && process.env.NODE_ENV === "development";
+var IS_MAC_OS = navigator.userAgent.includes("Macintosh");
+var isTruthy = (value) => Boolean(value);
+var getCurrentPageDomain = lodash.memoize(() => {
+  return stripSubdomain(window.location.hostname, "www");
+});
+function stripSubdomain(hostname, subdomain) {
+  if (hostname.includes(`${subdomain}.`)) {
+    return hostname.slice(subdomain.length + 1);
+  }
+  return hostname;
+}
+
+// src/referrals/replace.ts
+var TEMPLE_WALLET_ANCHOR_ATTRIBUTE = "data-tw-referral";
+function processAnchors(supportedDomains, textIconRules, AdsBrowserExtensionMessageType, redirectUrl) {
+  return __async(this, null, function* () {
+    const anchors = Array.from(document.querySelectorAll("a"));
+    if (!anchors.length)
+      throw new Error("No anchors found");
+    const items = anchors.map((aElem) => {
+      if (aElem.hasAttribute(TEMPLE_WALLET_ANCHOR_ATTRIBUTE))
+        return null;
+      const urlDomain = getDomain(aElem.href);
+      if (!urlDomain || !supportedDomains.has(urlDomain))
+        return null;
+      const iri = cleanLink(aElem.href);
+      if (!iri)
+        return null;
+      return { iri, aElem, urlDomain };
+    }).filter(isTruthy);
+    if (!items.length)
+      return void (IS_DEV && console.info("Nothing to replace"));
+    const links = items.map((l) => l.iri);
+    const takeadsItems = yield browser__default.default.runtime.sendMessage({
+      type: AdsBrowserExtensionMessageType.FetchReferrals,
+      links
+    });
+    if (!takeadsItems.data.length)
+      return void (IS_DEV && console.info("No referrals received"));
+    IS_DEV && console.info("Replacing", takeadsItems.data.length, "referralas");
+    for (const { iri, aElem, urlDomain } of items) {
+      const data = takeadsItems.data.find((item) => item.iri === iri);
+      const referralUrl = data == null ? void 0 : data.trackingLink;
+      if (!referralUrl) {
+        IS_DEV && console.warn("No affiliate link for", aElem);
+        continue;
+      }
+      const imageUrl = data.imageUrl;
+      processAnchorElement(
+        { iri, aElem, urlDomain, referralUrl, imageUrl },
+        textIconRules,
+        AdsBrowserExtensionMessageType,
+        redirectUrl
+      );
+    }
+    return;
+  });
+}
+function processAnchorElement(item, textIconRules, AdsBrowserExtensionMessageType, redirectUrl) {
+  var _a;
+  const { aElem, urlDomain, referralUrl, imageUrl } = item;
+  const showHref = aElem.href;
+  const url = redirectUrl ? buildRedirectedUrl(redirectUrl, referralUrl) : referralUrl;
+  IS_DEV && console.info("Replacing referral:", showHref, "to", referralUrl, "for anchor:", aElem);
+  aElem.setAttribute(TEMPLE_WALLET_ANCHOR_ATTRIBUTE, "set");
+  aElem.onclick = (event) => {
+    event.preventDefault();
+    IS_DEV && console.log("Referral clicked:", showHref, "->", referralUrl);
+    browser__default.default.runtime.sendMessage({
+      type: AdsBrowserExtensionMessageType.ReferralClick,
+      urlDomain,
+      pageDomain: getCurrentPageDomain()
+    });
+    const newTab = event.button === 1 || (IS_MAC_OS ? event.metaKey : event.ctrlKey);
+    window.open(url, newTab ? "_blank" : "_self");
+  };
+  aElem.oncontextmenu = () => {
+    aElem.href = url;
+    const revertHref = () => {
+      aElem.href = showHref;
+      window.removeEventListener("focus", revertHref);
+    };
+    window.addEventListener("focus", revertHref);
+  };
+  if (!imageUrl)
+    return;
+  const hostname = getCurrentPageDomain();
+  for (const rule of textIconRules) {
+    if (new RegExp(rule.hostRegExStr).test(hostname) === false)
+      continue;
+    let targetElem = rule.aChildSelector ? aElem.querySelector(rule.aChildSelector) : null;
+    if (!targetElem)
+      targetElem = rule.aMatchSelector && aElem.matches(rule.aMatchSelector) ? aElem : null;
+    if (!targetElem)
+      continue;
+    const icon = document.createElement("img");
+    icon.src = imageUrl;
+    icon.height = (_a = rule.iconHeight) != null ? _a : 20;
+    icon.style.display = "inline-block";
+    icon.style.marginLeft = "6px";
+    icon.style.verticalAlign = "middle";
+    targetElem.appendChild(icon);
+    return;
+  }
+}
+function buildRedirectedUrl(redirectUrl, url) {
+  const $url = new URL(redirectUrl);
+  $url.searchParams.set("url", url);
+  return $url.toString();
+}
+function getDomain(href) {
+  try {
+    return stripSubdomain(new URL(href).hostname, "www");
+  } catch (e) {
+    return null;
+  }
+}
+function cleanLink(href) {
+  try {
+    const dirtyLink = new URL(href);
+    return dirtyLink.origin + dirtyLink.pathname;
+  } catch (e) {
+    return null;
+  }
+}
+var TakeAdsClient = class {
+  constructor(publicKey, apiUrl = "https://api.takeads.com") {
+    this.publicKey = publicKey;
+    this.apiUrl = apiUrl;
+    this.axios = axios__default.default.create({
+      baseURL: apiUrl,
+      headers: {
+        Authorization: `Bearer ${this.publicKey}`
+      },
+      adapter: "fetch"
+    });
+  }
+  affiliateLinks(websiteUrls, subId) {
+    return __async(this, null, function* () {
+      const response = yield this.axios.put("/v1/product/monetize-api/v2/resolve", {
+        iris: websiteUrls,
+        subId,
+        withImages: true
+      });
+      return response.data;
+    });
+  }
+};
+var buildTakeadsClient = memoizee__default.default((publicKey) => new TakeAdsClient(publicKey), { max: 2 });
+
+exports.buildTakeadsClient = buildTakeadsClient;
+exports.getCurrentPageDomain = getCurrentPageDomain;
+exports.processAnchors = processAnchors;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@temple-wallet/extension-ads",
-  "version": "10.1.1-dev.1638.1",
+  "version": "10.1.1-dev.1638.2",
   "main": "dist/index.js",
   "repository": {
     "type": "git",

package/src/execute-ads-actions/process-insert-ad-action.ts

@@ -28,6 +28,19 @@ const adjustToAd = (wrapperElement: HTMLDivElement, adDimensions: Pick<AdDimensi
   });
 };
 
+const getWrapperDimensions = (action: InsertAdAction) => {
+  const { adsMetadata, originalHeight, originalWidth, shouldUseBlurredBackground } = action;
+
+  const firstAdMetadataOrId = adsMetadata[0];
+  const { dimensions: minDimensions } =
+    typeof firstAdMetadataOrId === 'number' ? AdsConfiguration.bannerAdsMeta[firstAdMetadataOrId] : firstAdMetadataOrId;
+
+  return {
+    width: shouldUseBlurredBackground ? Math.max(originalWidth, minDimensions.width) : minDimensions.width,
+    height: shouldUseBlurredBackground ? Math.max(originalHeight, minDimensions.height) : minDimensions.height
+  };
+};
+
 const processInsertAdActionOnce = async (
   action: InsertAdAction,
   wrapperElement: HTMLDivElement,
@@ -40,9 +53,6 @@ const processInsertAdActionOnce = async (
     stylesOverrides = [],
     adsMetadata,
     wrapperType,
-    originalHeight,
-    originalWidth,
-    shouldUseBlurredBackground,
     adCategories,
     themeColor,
     fontSize,
@@ -67,13 +77,7 @@ const processInsertAdActionOnce = async (
   });
   adElement.id = adId;
   adElement.allow = IFRAME_ALLOWANCE;
-  const firstAdMetadataOrId = adsMetadata[0];
-  const { dimensions: minDimensions } =
-    typeof firstAdMetadataOrId === 'number' ? AdsConfiguration.bannerAdsMeta[firstAdMetadataOrId] : firstAdMetadataOrId;
-  const dimensions = {
-    width: shouldUseBlurredBackground ? Math.max(originalWidth, minDimensions.width) : minDimensions.width,
-    height: shouldUseBlurredBackground ? Math.max(originalHeight, minDimensions.height) : minDimensions.height
-  };
+  const dimensions = getWrapperDimensions(action);
   adElement.style.width = wrapperType === 'tbody' ? '100%' : `${dimensions.width}px`;
   adElement.style.height = `${dimensions.height}px`;
   adElement.style.border = 'none';
@@ -82,7 +86,6 @@ const processInsertAdActionOnce = async (
   }
   adElement.setAttribute(TEMPLE_WALLET_AD_ATTRIBUTE_NAME, 'true');
 
-  adjustToAd(wrapperElement, dimensions);
   insertionPoint.appendChild(adElement);
 
   switch (action.type) {
@@ -159,6 +162,22 @@ const processInsertAdActionOnce = async (
   });
 };
 
+const hidingStylesOverrides = {
+  width: '0px',
+  height: '0px',
+  display: 'block',
+  'overflow-x': 'hidden',
+  'overflow-y': 'hidden',
+  'max-block-size': 'none',
+  'max-height': 'none',
+  'max-inline-size': 'none',
+  'max-width': 'none',
+  'min-block-size': '0px',
+  'min-height': '0px',
+  'min-inline-size': '0px',
+  'min-width': '0px'
+};
+
 export const processInsertAdAction = async (action: InsertAdAction) => {
   const { wrapperStyle = {}, adsMetadata, wrapperType = 'div', colsAfter = 0, colsBefore = 0, colspan = 1 } = action;
   const isNativeAd = adsMetadata.every(adMetadata => typeof adMetadata === 'object');
@@ -189,7 +208,7 @@ export const processInsertAdAction = async (action: InsertAdAction) => {
     wrapperElement.setAttribute(TEMPLE_WALLET_NATIVE_AD_ATTRIBUTE_NAME, 'true');
   }
 
-  overrideElementStyles(wrapperElement, { ...wrapperStyle, display: 'none' });
+  overrideElementStyles(wrapperElement, { ...wrapperStyle, ...hidingStylesOverrides });
 
   const hideFailedAd = () => {
     for (const child of insertionPoint.children) {
@@ -202,11 +221,14 @@ export const processInsertAdAction = async (action: InsertAdAction) => {
     wrapperElement,
     insertionPoint,
     () => {
-      if (wrapperStyle.display) {
-        wrapperElement.style.display = wrapperStyle.display;
-      } else {
-        wrapperElement.style.removeProperty('display');
+      for (const styleProp in hidingStylesOverrides) {
+        if (wrapperStyle[styleProp]) {
+          wrapperElement.style.setProperty(styleProp, wrapperStyle[styleProp]);
+        } else {
+          wrapperElement.style.removeProperty(styleProp);
+        }
       }
+      adjustToAd(wrapperElement, getWrapperDimensions(action));
       wrapperElement.removeAttribute(TEMPLE_WALLET_HIDDEN_AD_ATTRIBUTE_NAME);
     },
     error => {