choreograph-create-pixel 1.4.1 → 1.4.2

package/README.md

@@ -1,6 +1,6 @@
 # Choreograph Create Pixel
 
-This library lets you apply best practises to [Create](https://www.lemonpi.io/) pixel development and implementation.
+This library lets you apply best practises to [Create](https://create.choreograph.com/) pixel development and implementation.
 
 ## Features
 
@@ -11,25 +11,25 @@ This library lets you apply best practises to [Create](https://www.lemonpi.io/)
 - [x] User interaction triggers
 - [x] [Console debugger](#debugging)
 
-### Scraper pixels
+### Scraper pixel
 
 <small>Type: `scraper`</small>
 
-Scraper pixels are used to scrape (collect) data from websites, and store that data as products within an advertiser's product store.
+A scraper pixel is used to scrape (collect) data from websites, and store that data as products within an advertiser's product store.
 
 ### Segment pixels
 
 <small>Types: `viewed`, `basketed` and `purchased`</small>
 
-Products in ads are shown by recommendation. Segment pixels determine this recommendation on a consumer level, by storing a **cookie** at different moments or events during the consumer's journey.
+Products in ads are sorted by recommendation. Segment pixels determine this recommendation on a consumer level, by storing a **cookie** at different moments or events during the consumer's journey.
 
 ### Post-click pixels
 
 <small>Types: `attribution` and `conversion`</small>
 
-Post-click conversion attribution tracks which clicked creative variant attributed to a website conversion. The **attribution** pixel collects the creative's impression ID from the URL (`ccpid` query parameter) on the landing page, and the **conversion** pixel logs this ID as a performance metric in Create when a user performed a conversion, like a purchase.
+Post-click conversion attribution tracks which clicked creative variant from an ad attributed to a website conversion. The **attribution** pixel collects and stores (through [`localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)) the creative's impression ID from the landing URL's `ccpid` query parameter, and the **conversion** pixel logs this ID as a performance metric in Create whenever a user performed a conversion, like a purchase.
 
-## Quickstart
+## Quick start
 
 The following theoretical snippet includes all pixel types, can be embedded on every page of _example.com_, and will automatically determine which pixel to enable and disable through continuous URL validation.
 
@@ -38,7 +38,7 @@ The following theoretical snippet includes all pixel types, can be embedded on e
 ```js
 import Pixel from "choreograph-create-pixel";
 
-// Scraper pixel
+// Scraper pixel example
 new Pixel({
   advertiser: 0,
   type: "scraper",
@@ -59,7 +59,7 @@ new Pixel({
   },
 });
 
-// Viewed segment pixel
+// Viewed segment pixel example
 new Pixel({
   advertiser: 0,
   type: "viewed",
@@ -69,7 +69,7 @@ new Pixel({
   scrape: () => window.dataLayer[0].product.sku,
 });
 
-// Basketed segment pixel
+// Basketed segment pixel example
 new Pixel({
   advertiser: 0,
   type: "basketed",
@@ -85,7 +85,7 @@ new Pixel({
   scrape: (element) => element.getAttribute("data-sku"),
 });
 
-// Purchased segment pixel
+// Purchased segment pixel example
 new Pixel({
   advertiser: 0,
   type: "purchased",
@@ -100,7 +100,7 @@ new Pixel({
   scrape: () => window.dataLayer[0].cart.map((product) => product.sku),
 });
 
-// Attribution post-click pixel
+// Attribution post-click pixel example
 new Pixel({
   advertiser: 0,
   type: "attribution",
@@ -112,7 +112,7 @@ new Pixel({
   url: /example\.com\/products\/\d/,
 });
 
-// Conversion post-click pixel
+// Conversion post-click pixel example
 new Pixel({
   advertiser: 0,
   type: "conversion",

package/dist/bundle.cjs.js

@@ -1,4 +1,4 @@
-/*! choreograph-create-pixel v1.4.1 2023/02/01 */
+/*! choreograph-create-pixel v1.4.2 2024/08/27 */
 'use strict';
 
 class ChoreographCreatePixel {
@@ -85,8 +85,8 @@ class ChoreographCreatePixel {
     if (!this.config.debug || this.logs.includes(message)) return;
 
     const args = [
-      `%c⸬ create%c ${this.config.icons[this.config.type]} ${this.config.type}${
-        this.config.label ? ` (${this.config.label})` : ""
+      `%c⸬ create%c ${this.config.icons[this.config.type]} ${
+        this.config.type
       } %c${message}`,
       "background:black;color:white;border-radius:3px;padding:3px 6px",
       "font-weight:bold",
@@ -196,6 +196,7 @@ class ChoreographCreatePixel {
       }
     }
 
+    // TO-DO: Move this to each method's end? Pageview conversions are currently recursive
     setTimeout(() => this.cycle(), 750);
   }
 
@@ -212,16 +213,18 @@ class ChoreographCreatePixel {
     const storageItemLabel = `choreograph-${this.config.label}`;
     const storedCcpid = localStorage.getItem(storageItemLabel);
     if (storedCcpid !== ccpid) localStorage.setItem(storageItemLabel, ccpid);
-    this.log("success", "Successful!", ccpid);
+    this.log("success", `Stored CCPID "${ccpid}" for "${this.config.label}"`);
   }
 
   convert() {
-    const ccpid = localStorage.getItem(`choreograph-${this.config.label}`);
+    const label = `choreograph-${this.config.label}`;
+    const ccpid = localStorage.getItem(label);
 
     if (!ccpid)
       return this.log("warn", `"${this.config.label}" attribution not present`);
 
     this.send(ccpid);
+    localStorage.removeItem(label);
   }
 
   scrape(element) {
@@ -294,113 +297,128 @@ class ChoreographCreatePixel {
   }
 
   send(data) {
+    let payload;
     let url;
+    let method = "GET";
 
     switch (this.config.type) {
-      case "scraper":
+      case "scraper": {
+        const { sku } = data;
+        delete data.sku;
+
+        payload = {
+          "advertiser-id": this.config.advertiser,
+          sku,
+          fields: data,
+        };
+
         url = `https://d.lemonpi.io/scrapes${
           this.config.debug ? "?validate=true" : ""
         }`;
 
+        method = "POST";
         break;
+      }
 
-      case "conversion":
-        url = `https://content.lemonpi.io/track/event?e=${encodeURIComponent(
-          JSON.stringify({
-            version: 1,
-            type: "conversion",
-            name: this.config.label,
-            "conversion-attribution-id": data,
-            "advertiser-id": this.config.advertiser,
-          })
-        )}`;
-
-        break;
+      case "viewed":
+      case "basketed":
+      case "purchased":
+        payload = {
+          "event-type": `product-${this.config.type}`,
+          sku: data,
+        };
 
-      default:
         url = `https://d.lemonpi.io/a/${
           this.config.advertiser
-        }/product/event?e=${encodeURIComponent(
-          JSON.stringify({
-            "event-type": `product-${this.config.type}`,
-            sku: data,
-          })
+        }/product/event?e=${encodeURIComponent(JSON.stringify(payload))}`;
+
+        break;
+
+      case "conversion":
+        payload = {
+          version: 1,
+          type: "conversion",
+          name: this.config.label,
+          "conversion-attribution-id": data,
+          "advertiser-id": this.config.advertiser,
+        };
+
+        url = `https://content.lemonpi.io/track/event?e=${encodeURIComponent(
+          JSON.stringify(payload)
         )}`;
 
         break;
     }
 
-    if (this.config.type !== "scraper" && !this.config.debug)
+    if (
+      ["viewed", "basketed", "purchased"].includes(this.config.type) &&
+      !this.config.debug
+    ) {
       new Image().src = url;
-    else
-      fetch(
-        url,
-        this.config.type === "scraper"
-          ? {
-              method: "POST",
-              headers: { "Content-Type": "application/json" },
-              body: JSON.stringify({
-                "advertiser-id": this.config.advertiser,
-                sku: data.sku,
-                fields: { ...data, sku: undefined },
-              }),
-            }
-          : null
+      return;
+    }
+
+    fetch(
+      url,
+      method === "POST"
+        ? {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(payload),
+          }
+        : null
+    )
+      .then((response) =>
+        response
+          .json()
+          .then((result) => {
+            if (response.ok) {
+              this.log("warn", "Successful, with warnings. Details:", {
+                payload,
+                result,
+              });
+
+              try {
+                this.config.after(data);
+              } catch (error) {
+                this.log("error", error.message, {
+                  after: this.config.after,
+                });
+              }
+            } else
+              this.log(
+                "error",
+                `Failed: ${response.status} (${response.statusText}). Details:`,
+                { payload, result }
+              );
+
+            this.logs.length = 0;
+          })
+          .catch(() => {
+            if (response.ok) {
+              this.log("success", "Successful!", { payload });
+
+              try {
+                this.config.after(data);
+              } catch (error) {
+                this.log("error", error.message, {
+                  after: this.config.after,
+                });
+              }
+            } else
+              this.log(
+                "error",
+                `Failed: ${response.status} (${response.statusText}). Details:`,
+                { payload, response }
+              );
+
+            this.logs.length = 0;
+          })
       )
-        .then((response) =>
-          response
-            .json()
-            .then((result) => {
-              if (response.ok) {
-                this.log("warn", "Successful, with warnings. Details:", result);
-
-                try {
-                  this.config.after(data);
-                } catch (error) {
-                  this.log("error", error.message, {
-                    after: this.config.after,
-                  });
-                }
-              } else
-                this.log(
-                  "error",
-                  `Failed: ${response.status} (${response.statusText}). Details:`,
-                  result
-                );
-
-              this.logs.length = 0;
-            })
-            .catch(() => {
-              if (response.ok) {
-                this.log(
-                  "success",
-                  "Successful!",
-                  ["viewed", "basketed", "purchased"].includes(this.config.type)
-                    ? { sku: data }
-                    : data
-                );
-
-                try {
-                  this.config.after(data);
-                } catch (error) {
-                  this.log("error", error.message, {
-                    after: this.config.after,
-                  });
-                }
-              } else
-                this.log(
-                  "error",
-                  `Failed: ${response.status} (${response.statusText}). Details:`,
-                  response
-                );
-
-              this.logs.length = 0;
-            })
-        )
-        .catch((error) => {
-          this.log("error", `Failed: ${error.message}`);
-          this.logs.length = 0;
-        });
+      .catch((error) => {
+        this.log("error", `Failed: ${error.message}`, { payload });
+        this.logs.length = 0;
+      });
   }
 }
 

package/dist/bundle.esm.js

@@ -1,4 +1,4 @@
-/*! choreograph-create-pixel v1.4.1 2023/02/01 */
+/*! choreograph-create-pixel v1.4.2 2024/08/27 */
 class ChoreographCreatePixel {
   constructor(userConfig) {
     this.previouslyScrapedHash = null;
@@ -83,8 +83,8 @@ class ChoreographCreatePixel {
     if (!this.config.debug || this.logs.includes(message)) return;
 
     const args = [
-      `%c⸬ create%c ${this.config.icons[this.config.type]} ${this.config.type}${
-        this.config.label ? ` (${this.config.label})` : ""
+      `%c⸬ create%c ${this.config.icons[this.config.type]} ${
+        this.config.type
       } %c${message}`,
       "background:black;color:white;border-radius:3px;padding:3px 6px",
       "font-weight:bold",
@@ -194,6 +194,7 @@ class ChoreographCreatePixel {
       }
     }
 
+    // TO-DO: Move this to each method's end? Pageview conversions are currently recursive
     setTimeout(() => this.cycle(), 750);
   }
 
@@ -210,16 +211,18 @@ class ChoreographCreatePixel {
     const storageItemLabel = `choreograph-${this.config.label}`;
     const storedCcpid = localStorage.getItem(storageItemLabel);
     if (storedCcpid !== ccpid) localStorage.setItem(storageItemLabel, ccpid);
-    this.log("success", "Successful!", ccpid);
+    this.log("success", `Stored CCPID "${ccpid}" for "${this.config.label}"`);
   }
 
   convert() {
-    const ccpid = localStorage.getItem(`choreograph-${this.config.label}`);
+    const label = `choreograph-${this.config.label}`;
+    const ccpid = localStorage.getItem(label);
 
     if (!ccpid)
       return this.log("warn", `"${this.config.label}" attribution not present`);
 
     this.send(ccpid);
+    localStorage.removeItem(label);
   }
 
   scrape(element) {
@@ -292,113 +295,128 @@ class ChoreographCreatePixel {
   }
 
   send(data) {
+    let payload;
     let url;
+    let method = "GET";
 
     switch (this.config.type) {
-      case "scraper":
+      case "scraper": {
+        const { sku } = data;
+        delete data.sku;
+
+        payload = {
+          "advertiser-id": this.config.advertiser,
+          sku,
+          fields: data,
+        };
+
         url = `https://d.lemonpi.io/scrapes${
           this.config.debug ? "?validate=true" : ""
         }`;
 
+        method = "POST";
         break;
+      }
 
-      case "conversion":
-        url = `https://content.lemonpi.io/track/event?e=${encodeURIComponent(
-          JSON.stringify({
-            version: 1,
-            type: "conversion",
-            name: this.config.label,
-            "conversion-attribution-id": data,
-            "advertiser-id": this.config.advertiser,
-          })
-        )}`;
-
-        break;
+      case "viewed":
+      case "basketed":
+      case "purchased":
+        payload = {
+          "event-type": `product-${this.config.type}`,
+          sku: data,
+        };
 
-      default:
         url = `https://d.lemonpi.io/a/${
           this.config.advertiser
-        }/product/event?e=${encodeURIComponent(
-          JSON.stringify({
-            "event-type": `product-${this.config.type}`,
-            sku: data,
-          })
+        }/product/event?e=${encodeURIComponent(JSON.stringify(payload))}`;
+
+        break;
+
+      case "conversion":
+        payload = {
+          version: 1,
+          type: "conversion",
+          name: this.config.label,
+          "conversion-attribution-id": data,
+          "advertiser-id": this.config.advertiser,
+        };
+
+        url = `https://content.lemonpi.io/track/event?e=${encodeURIComponent(
+          JSON.stringify(payload)
         )}`;
 
         break;
     }
 
-    if (this.config.type !== "scraper" && !this.config.debug)
+    if (
+      ["viewed", "basketed", "purchased"].includes(this.config.type) &&
+      !this.config.debug
+    ) {
       new Image().src = url;
-    else
-      fetch(
-        url,
-        this.config.type === "scraper"
-          ? {
-              method: "POST",
-              headers: { "Content-Type": "application/json" },
-              body: JSON.stringify({
-                "advertiser-id": this.config.advertiser,
-                sku: data.sku,
-                fields: { ...data, sku: undefined },
-              }),
-            }
-          : null
+      return;
+    }
+
+    fetch(
+      url,
+      method === "POST"
+        ? {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(payload),
+          }
+        : null
+    )
+      .then((response) =>
+        response
+          .json()
+          .then((result) => {
+            if (response.ok) {
+              this.log("warn", "Successful, with warnings. Details:", {
+                payload,
+                result,
+              });
+
+              try {
+                this.config.after(data);
+              } catch (error) {
+                this.log("error", error.message, {
+                  after: this.config.after,
+                });
+              }
+            } else
+              this.log(
+                "error",
+                `Failed: ${response.status} (${response.statusText}). Details:`,
+                { payload, result }
+              );
+
+            this.logs.length = 0;
+          })
+          .catch(() => {
+            if (response.ok) {
+              this.log("success", "Successful!", { payload });
+
+              try {
+                this.config.after(data);
+              } catch (error) {
+                this.log("error", error.message, {
+                  after: this.config.after,
+                });
+              }
+            } else
+              this.log(
+                "error",
+                `Failed: ${response.status} (${response.statusText}). Details:`,
+                { payload, response }
+              );
+
+            this.logs.length = 0;
+          })
       )
-        .then((response) =>
-          response
-            .json()
-            .then((result) => {
-              if (response.ok) {
-                this.log("warn", "Successful, with warnings. Details:", result);
-
-                try {
-                  this.config.after(data);
-                } catch (error) {
-                  this.log("error", error.message, {
-                    after: this.config.after,
-                  });
-                }
-              } else
-                this.log(
-                  "error",
-                  `Failed: ${response.status} (${response.statusText}). Details:`,
-                  result
-                );
-
-              this.logs.length = 0;
-            })
-            .catch(() => {
-              if (response.ok) {
-                this.log(
-                  "success",
-                  "Successful!",
-                  ["viewed", "basketed", "purchased"].includes(this.config.type)
-                    ? { sku: data }
-                    : data
-                );
-
-                try {
-                  this.config.after(data);
-                } catch (error) {
-                  this.log("error", error.message, {
-                    after: this.config.after,
-                  });
-                }
-              } else
-                this.log(
-                  "error",
-                  `Failed: ${response.status} (${response.statusText}). Details:`,
-                  response
-                );
-
-              this.logs.length = 0;
-            })
-        )
-        .catch((error) => {
-          this.log("error", `Failed: ${error.message}`);
-          this.logs.length = 0;
-        });
+      .catch((error) => {
+        this.log("error", `Failed: ${error.message}`, { payload });
+        this.logs.length = 0;
+      });
   }
 }
 

package/dist/bundle.iife.min.js

@@ -1,2 +1,2 @@
-/*! choreograph-create-pixel v1.4.1 2023/02/01 */
-var ChoreographCreatePixel=function(){"use strict";function e(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function t(t){for(var r=1;r<arguments.length;r++){var i=null!=arguments[r]?arguments[r]:{};r%2?e(Object(i),!0).forEach((function(e){n(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):e(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function r(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,i(n.key),n)}}function n(e,t,r){return(t=i(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function i(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}var o=function(){function e(r){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.previouslyScrapedHash=null,this.logs=[],this.config=t({colors:{error:"red",warn:"orange",success:"green"},icons:{scraper:"📚",viewed:"👀",basketed:"🛒",purchased:"🧾",attribution:"🔖",conversion:"📈"},debug:/(pixel|lemonpi)_debug/i.test(location.href),before:function(e,t){return t(e)},after:function(){},optional:[]},r),this.validateConfig()&&this.cycle()}var i,o,c;return i=e,o=[{key:"log",value:function(e,t){var r,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;if(this.config.debug&&!this.logs.includes(t)){var i=["%c⸬ create%c ".concat(this.config.icons[this.config.type]," ").concat(this.config.type).concat(this.config.label?" (".concat(this.config.label,")"):""," %c").concat(t),"background:black;color:white;border-radius:3px;padding:3px 6px","font-weight:bold","color:".concat(this.config.colors[e])];n&&i.push(n),(r=console).info.apply(r,i),this.logs.push(t)}}},{key:"validateConfig",value:function(){if("number"!=typeof this.config.advertiser)this.log("error","Please use a number",{advertiser:this.config.advertiser});else if(["scraper","viewed","basketed","purchased","attribution","conversion"].includes(this.config.type))if(["attribution","conversion"].includes(this.config.type)&&"string"!=typeof this.config.label)this.log("error","Please use a string",{label:this.config.label});else if(this.config.url instanceof RegExp){if(["attribution","conversion"].includes(this.config.type)||this.config.scrape)return!0;this.log("error","Please provide something to scrape",{scrape:this.config.scrape})}else this.log("error","Please use a regular expression",{url:this.config.url});else this.log("error","Please use scraper, viewed, basketed, purchased, attribution or conversion",{type:this.config.type})}},{key:"cycle",value:function(){var e=this;if(this.config.url.test(location.href))if("scraper"===this.config.type&&document.querySelector('html[class*="translated-"]'))this.log("warn","This page has been translated by the browser, and won't be scraped");else if(this.config.trigger){var t="create-".concat(this.config.type,"-").concat(this.config.trigger.event);try{var r="string"==typeof this.config.trigger.elements?document.querySelectorAll(this.config.trigger.elements):this.config.trigger.elements();r.forEach||(r=[r]),r.forEach((function(r){r.hasAttribute(t)||(r.addEventListener(e.config.trigger.event,(function(){return"conversion"===e.config.type?e.convert():e.scrape(r)})),r.setAttribute(t,""))}))}catch(e){this.log("error",e.message,{"trigger.elements":this.config.trigger.elements})}}else switch(this.config.type){case"attribution":this.attribute();break;case"conversion":this.convert();break;default:this.scrape()}else this.log("warn",'URL pattern does not match "'.concat(location.href,'"'),{url:this.config.url});setTimeout((function(){return e.cycle()}),750)}},{key:"attribute",value:function(){var e=this.constructor.getQueryParameter("ccpid");if(!e)return this.log("warn","ccpid query parameter not present");if(!/^[0-9a-f]{20}$/.test(e))return this.log("error","ccpid query parameter is not formatted correctly");var t="choreograph-".concat(this.config.label);localStorage.getItem(t)!==e&&localStorage.setItem(t,e),this.log("success","Successful!",e)}},{key:"convert",value:function(){var e=localStorage.getItem("choreograph-".concat(this.config.label));if(!e)return this.log("warn",'"'.concat(this.config.label,'" attribution not present'));this.send(e)}},{key:"scrape",value:function(e){var r,i=this,o=!1,c=function(t,r){var c=t;if("function"==typeof c)try{c=c(e)}catch(e){if(i.config.optional.includes(r))return;i.log("error",e.message,n({},r?"scrape.".concat(r):"scrape",c)),o=!0}return"string"==typeof c&&(c=c.replace(/\s+/g," ").trim()),null!=c&&""!==c||i.config.optional.includes(r)||(i.log("error","Value is empty",n({},r?"scrape.".concat(r):"scrape",c)),o=!0),c};r="scraper"!==this.config.type?c(this.config.scrape):Object.keys(this.config.scrape).reduce((function(e,r){return t(t({},e),{},n({},r,c(i.config.scrape[r],r)))}),{});var s=JSON.stringify(r);if(!o&&this.previouslyScrapedHash!==s){try{this.config.before(r,(function(e){Array.isArray(e)?e.forEach((function(e){return i.send(e)})):i.send(e)}))}catch(e){this.log("error",e.message,{before:this.config.before})}this.previouslyScrapedHash=s,this.logs.length=0}}},{key:"send",value:function(e){var r,n=this;switch(this.config.type){case"scraper":r="https://d.lemonpi.io/scrapes".concat(this.config.debug?"?validate=true":"");break;case"conversion":r="https://content.lemonpi.io/track/event?e=".concat(encodeURIComponent(JSON.stringify({version:1,type:"conversion",name:this.config.label,"conversion-attribution-id":e,"advertiser-id":this.config.advertiser})));break;default:r="https://d.lemonpi.io/a/".concat(this.config.advertiser,"/product/event?e=").concat(encodeURIComponent(JSON.stringify({"event-type":"product-".concat(this.config.type),sku:e})))}"scraper"===this.config.type||this.config.debug?fetch(r,"scraper"===this.config.type?{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({"advertiser-id":this.config.advertiser,sku:e.sku,fields:t(t({},e),{},{sku:void 0})})}:null).then((function(t){return t.json().then((function(r){if(t.ok){n.log("warn","Successful, with warnings. Details:",r);try{n.config.after(e)}catch(e){n.log("error",e.message,{after:n.config.after})}}else n.log("error","Failed: ".concat(t.status," (").concat(t.statusText,"). Details:"),r);n.logs.length=0})).catch((function(){if(t.ok){n.log("success","Successful!",["viewed","basketed","purchased"].includes(n.config.type)?{sku:e}:e);try{n.config.after(e)}catch(e){n.log("error",e.message,{after:n.config.after})}}else n.log("error","Failed: ".concat(t.status," (").concat(t.statusText,"). Details:"),t);n.logs.length=0}))})).catch((function(e){n.log("error","Failed: ".concat(e.message)),n.logs.length=0})):(new Image).src=r}}],c=[{key:"getUrl",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.allowedQueryParameters,r=void 0===t?[]:t,n=e.allowHash,i=void 0!==n&&n,o="".concat(location.protocol,"//").concat(location.host).concat(location.pathname),c=new URLSearchParams(location.search);return r.reduce((function(e,t){var r=e?"&":"?",n=encodeURI(t),i=c.get(t);return null!=i?(o+="".concat(r).concat(n).concat(""===i?"":"=".concat(encodeURI(i))),!0):e}),!1),i&&(o+=location.hash),o}},{key:"getAllPathSegments",value:function(){return location.pathname.split("/").filter((function(e){return e})).map((function(e){return decodeURI(e)}))}},{key:"getPathSegment",value:function(e){return this.getAllPathSegments()[e]}},{key:"getAllQueryParameters",value:function(){return location.search.replace(/^\?/,"").split("&").filter((function(e){return e})).reduce((function(e,r){return t(t({},e),{},n({},decodeURI(r.split("=")[0]),decodeURI(r.split("=")[1]||"")))}),{})}},{key:"getQueryParameter",value:function(e){return this.getAllQueryParameters()[e]}}],o&&r(i.prototype,o),c&&r(i,c),Object.defineProperty(i,"prototype",{writable:!1}),e}();return o}();
+/*! choreograph-create-pixel v1.4.2 2024/08/27 */
+var ChoreographCreatePixel=function(){"use strict";function e(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function t(t){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?e(Object(o),!0).forEach((function(e){n(t,e,o[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):e(Object(o)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))}))}return t}function r(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,o(n.key),n)}}function n(e,t,r){return(t=o(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function o(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}var i=function(){function e(r){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.previouslyScrapedHash=null,this.logs=[],this.config=t({colors:{error:"red",warn:"orange",success:"green"},icons:{scraper:"📚",viewed:"👀",basketed:"🛒",purchased:"🧾",attribution:"🔖",conversion:"📈"},debug:/(pixel|lemonpi)_debug/i.test(location.href),before:function(e,t){return t(e)},after:function(){},optional:[]},r),this.validateConfig()&&this.cycle()}var o,i,c;return o=e,i=[{key:"log",value:function(e,t){var r,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;if(this.config.debug&&!this.logs.includes(t)){var o=["%c⸬ create%c ".concat(this.config.icons[this.config.type]," ").concat(this.config.type," %c").concat(t),"background:black;color:white;border-radius:3px;padding:3px 6px","font-weight:bold","color:".concat(this.config.colors[e])];n&&o.push(n),(r=console).info.apply(r,o),this.logs.push(t)}}},{key:"validateConfig",value:function(){if("number"!=typeof this.config.advertiser)this.log("error","Please use a number",{advertiser:this.config.advertiser});else if(["scraper","viewed","basketed","purchased","attribution","conversion"].includes(this.config.type))if(["attribution","conversion"].includes(this.config.type)&&"string"!=typeof this.config.label)this.log("error","Please use a string",{label:this.config.label});else if(this.config.url instanceof RegExp){if(["attribution","conversion"].includes(this.config.type)||this.config.scrape)return!0;this.log("error","Please provide something to scrape",{scrape:this.config.scrape})}else this.log("error","Please use a regular expression",{url:this.config.url});else this.log("error","Please use scraper, viewed, basketed, purchased, attribution or conversion",{type:this.config.type})}},{key:"cycle",value:function(){var e=this;if(this.config.url.test(location.href))if("scraper"===this.config.type&&document.querySelector('html[class*="translated-"]'))this.log("warn","This page has been translated by the browser, and won't be scraped");else if(this.config.trigger){var t="create-".concat(this.config.type,"-").concat(this.config.trigger.event);try{var r="string"==typeof this.config.trigger.elements?document.querySelectorAll(this.config.trigger.elements):this.config.trigger.elements();r.forEach||(r=[r]),r.forEach((function(r){r.hasAttribute(t)||(r.addEventListener(e.config.trigger.event,(function(){return"conversion"===e.config.type?e.convert():e.scrape(r)})),r.setAttribute(t,""))}))}catch(e){this.log("error",e.message,{"trigger.elements":this.config.trigger.elements})}}else switch(this.config.type){case"attribution":this.attribute();break;case"conversion":this.convert();break;default:this.scrape()}else this.log("warn",'URL pattern does not match "'.concat(location.href,'"'),{url:this.config.url});setTimeout((function(){return e.cycle()}),750)}},{key:"attribute",value:function(){var e=this.constructor.getQueryParameter("ccpid");if(!e)return this.log("warn","ccpid query parameter not present");if(!/^[0-9a-f]{20}$/.test(e))return this.log("error","ccpid query parameter is not formatted correctly");var t="choreograph-".concat(this.config.label);localStorage.getItem(t)!==e&&localStorage.setItem(t,e),this.log("success",'Stored CCPID "'.concat(e,'" for "').concat(this.config.label,'"'))}},{key:"convert",value:function(){var e="choreograph-".concat(this.config.label),t=localStorage.getItem(e);if(!t)return this.log("warn",'"'.concat(this.config.label,'" attribution not present'));this.send(t),localStorage.removeItem(e)}},{key:"scrape",value:function(e){var r,o=this,i=!1,c=function(t,r){var c=t;if("function"==typeof c)try{c=c(e)}catch(e){if(o.config.optional.includes(r))return;o.log("error",e.message,n({},r?"scrape.".concat(r):"scrape",c)),i=!0}return"string"==typeof c&&(c=c.replace(/\s+/g," ").trim()),null!=c&&""!==c||o.config.optional.includes(r)||(o.log("error","Value is empty",n({},r?"scrape.".concat(r):"scrape",c)),i=!0),c};r="scraper"!==this.config.type?c(this.config.scrape):Object.keys(this.config.scrape).reduce((function(e,r){return t(t({},e),{},n({},r,c(o.config.scrape[r],r)))}),{});var a=JSON.stringify(r);if(!i&&this.previouslyScrapedHash!==a){try{this.config.before(r,(function(e){Array.isArray(e)?e.forEach((function(e){return o.send(e)})):o.send(e)}))}catch(e){this.log("error",e.message,{before:this.config.before})}this.previouslyScrapedHash=a,this.logs.length=0}}},{key:"send",value:function(e){var t,r,n=this,o="GET";switch(this.config.type){case"scraper":var i=e.sku;delete e.sku,t={"advertiser-id":this.config.advertiser,sku:i,fields:e},r="https://d.lemonpi.io/scrapes".concat(this.config.debug?"?validate=true":""),o="POST";break;case"viewed":case"basketed":case"purchased":t={"event-type":"product-".concat(this.config.type),sku:e},r="https://d.lemonpi.io/a/".concat(this.config.advertiser,"/product/event?e=").concat(encodeURIComponent(JSON.stringify(t)));break;case"conversion":t={version:1,type:"conversion",name:this.config.label,"conversion-attribution-id":e,"advertiser-id":this.config.advertiser},r="https://content.lemonpi.io/track/event?e=".concat(encodeURIComponent(JSON.stringify(t)))}!["viewed","basketed","purchased"].includes(this.config.type)||this.config.debug?fetch(r,"POST"===o?{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)}:null).then((function(r){return r.json().then((function(o){if(r.ok){n.log("warn","Successful, with warnings. Details:",{payload:t,result:o});try{n.config.after(e)}catch(e){n.log("error",e.message,{after:n.config.after})}}else n.log("error","Failed: ".concat(r.status," (").concat(r.statusText,"). Details:"),{payload:t,result:o});n.logs.length=0})).catch((function(){if(r.ok){n.log("success","Successful!",{payload:t});try{n.config.after(e)}catch(e){n.log("error",e.message,{after:n.config.after})}}else n.log("error","Failed: ".concat(r.status," (").concat(r.statusText,"). Details:"),{payload:t,response:r});n.logs.length=0}))})).catch((function(e){n.log("error","Failed: ".concat(e.message),{payload:t}),n.logs.length=0})):(new Image).src=r}}],c=[{key:"getUrl",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.allowedQueryParameters,r=void 0===t?[]:t,n=e.allowHash,o=void 0!==n&&n,i="".concat(location.protocol,"//").concat(location.host).concat(location.pathname),c=new URLSearchParams(location.search);return r.reduce((function(e,t){var r=e?"&":"?",n=encodeURI(t),o=c.get(t);return null!=o?(i+="".concat(r).concat(n).concat(""===o?"":"=".concat(encodeURI(o))),!0):e}),!1),o&&(i+=location.hash),i}},{key:"getAllPathSegments",value:function(){return location.pathname.split("/").filter((function(e){return e})).map((function(e){return decodeURI(e)}))}},{key:"getPathSegment",value:function(e){return this.getAllPathSegments()[e]}},{key:"getAllQueryParameters",value:function(){return location.search.replace(/^\?/,"").split("&").filter((function(e){return e})).reduce((function(e,r){return t(t({},e),{},n({},decodeURI(r.split("=")[0]),decodeURI(r.split("=")[1]||"")))}),{})}},{key:"getQueryParameter",value:function(e){return this.getAllQueryParameters()[e]}}],i&&r(o.prototype,i),c&&r(o,c),Object.defineProperty(o,"prototype",{writable:!1}),e}();return i}();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "choreograph-create-pixel",
   "description": "This library lets you apply best practises to Choreograph Create pixel development and implementation.",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "type": "module",
   "keywords": [
     "wpp",
@@ -11,9 +11,9 @@
     "opendc",
     "greenhouse"
   ],
-  "author": "Rick Stevens <rick.stevens@choreograph.com> (https://lemonpi.io)",
+  "author": "Rick Stevens <rick.stevens@choreograph.com> (https://create.choreograph.com)",
   "repository": "gitlab:2sixty/choreograph-create/solutions/choreograph-create-pixel",
-  "homepage": "https://lemonpi.io",
+  "homepage": "https://create.choreograph.com",
   "license": "ISC",
   "main": "dist/bundle.cjs.js",
   "module": "dist/bundle.esm.js",