Merge branch 'develop'

Author: pilgreen

lib/locker.js demo/locker.jslib/locker.js renamed to demo/locker.js

@@ -20,6 +20,8 @@ const locker = {
         return "News/Local//";
       case "zone.carousel":
         return true;
+      case "zone.zeeto":
+        return true;
       default: 
         return undefined;
     }
@@ -28,7 +30,7 @@ const locker = {
   // user info
   user: {
     isSubscriber() {
-      return true;
+      return false;
     },
 
     isLoggedIn() {
@@ -61,6 +63,12 @@ const locker = {
       case "zones":
         window.mi.zones = window.mi.zones || {};
         return window.mi.zones;
+      case "analytics":
+        return {
+          addEventToQueue: function(obj) {
+            console.log("adding event:", obj);
+          }
+        }
       default:
         // nothing
     }

demo/section/index.html

@@ -15,7 +15,7 @@
     <link rel="stylesheet" href="/demo/demo.css">
 
     <script type="module">
-      import locker from "/lib/locker.js";
+      import locker from "../locker.js";
       import distributeZones from "/index.js";
 
       distributeZones(locker);

demo/story/index.html

@@ -15,7 +15,7 @@
     <link rel="stylesheet" href="/demo/demo.css">
 
     <script type="module">
-      import locker from "/lib/locker.js";
+      import locker from "../locker.js";
       import distributeZones from "/index.js";
 
       // Mimic the Yozons implementation

index.js

@@ -8,22 +8,24 @@ import * as story from "./lib/story.js";
 import * as homepage from "./lib/homepage.js";
 
 function distributeZones(locker) {
-  // Add the communication bridge and vip method to the zones API
+  // Set the locker for future use
+  Object.assign(zones.locker, locker);
+
+  // Add the communication bridge 
   locker.getYozonsLocker("zones").changes = zones.changes;
-  locker.getYozonsLocker("zones").getValidInsertionPoints = zones.getValidInsertionPoints;
 
   // Give the performance team a promise
   return new Promise((resolve, reject) => {
     locker.executeWhenDOMReady(() => {
       switch(locker.pageType) {
         case "sectfront":
-          section.render(locker);
+          section.render();
           break;
         case "story":
-          story.render(locker);
+          story.render();
           break;
         case "homepage":
-          homepage.render(locker);
+          homepage.render();
           break;
         default:
           reject("not a matching page type");

lib/homepage.js

@@ -8,8 +8,9 @@
 
 import * as zones from "./zones.js";
 
-export function render(locker) {
+export function render() {
   // Locker configs
+  const locker = zones.locker;
   const market = locker.getConfig("marketInfo.domain");
 
   // Community Events (iPublish)

lib/section.js

@@ -4,7 +4,8 @@
 
 import * as zones from "./zones.js";
 
-export function render(locker) {
+export function render() {
+  const locker = zones.locker;
   const subscriber = locker.user.isSubscriber();
   const cards = [...document.querySelectorAll(".grid > .card")];
 

lib/story.js

@@ -4,7 +4,9 @@
 
 import * as zones from "./zones.js";
 
-export async function render(locker) {
+export async function render() {
+  const locker = zones.locker;
+
   // If ads are disabled bail
   if(!locker.areAdsAllowed()) {
     zones.log("none", "ads are disabled for this page");
@@ -65,6 +67,29 @@ export async function render(locker) {
     }
   }
 
+  /*
+   * Non Subscriber changes
+   */
+
+  if(!subscriber) {
+    if(locker.getConfig("zone.zeeto")) {
+      let zeeto = new zones.Zone("zone-zeeto-contests");
+      zeeto.dataset.market = market;
+      zeeto.zephr("zone-zeeto-contests", market);
+      zeeto.after("zone-el-101");
+
+      // Track the impression
+      zones.track("zeeto-contest-zone", "zeeto impression");
+
+      // Track a click
+      zeeto.element.addEventListener("clicked", (e) => {
+        zones.track("zeeto-contest-zone", "zeeto clicked");
+        location.assign(e.detail.url);
+      });
+    }
+  }
+
+  // Distribute and render
   zones.distribute(cadence);
   zones.render()
 }

lib/zones.js

@@ -10,6 +10,9 @@ let fragment = new DocumentFragment();
 // Changes map
 export const changes = new Map();
 
+// Locker
+export const locker = {};
+
 // Zone class
 export class Zone {
 
@@ -270,6 +273,28 @@ export function log(id, msg) {
   changes.set(id, msg);
 }
 
+
+/*
+ * Tracks a feature flag in Amplitude
+ * @param key {string} the key for the feature
+ * @param msg {string} the event message
+ * @param flush {bool} flush now
+ */
+
+export function track(key, msg, flush = true) {
+  const analytics = locker.getYozonsLocker("analytics");
+
+  analytics.addEventToQueue({
+    eventProperties: {
+      action_performed: msg,
+      flag_key: key,
+      variant: "on"
+    },
+    eventType: "$exposure",
+    flushNow: flush
+  });
+}
+
 /*
  * Identifies valid insertion points for zones in story bodies
  * @returns {array} all valid paragraph elements