diff --git a/packages/core/bin/server/steps/store.js b/packages/core/bin/server/steps/store.js index 769e1ab04..72f2a4145 100644 --- a/packages/core/bin/server/steps/store.js +++ b/packages/core/bin/server/steps/store.js @@ -1,16 +1,16 @@ const path = require("path"), - shell = require("shelljs"), - yn = require("yn"); + shell = require("shelljs"), + yn = require("yn"); let everDetect = false; -module.exports = function(config) { +module.exports = function (config) { const {NODE_ENV, paths} = config; const {appPath, serverPath} = paths; const resolve = require(path.join(serverPath, "helpers/resolve")), - title = require(path.join(serverPath, "helpers/title")); + title = require(path.join(serverPath, "helpers/title")); title(`${everDetect ? "Re-initializing" : "Initializing"} Redux Store`, "🏪"); everDetect = true; @@ -25,6 +25,7 @@ module.exports = function(config) { CANON_LANGUAGES: LANGUAGES, CANON_LANGUAGE_DEFAULT: LANGUAGE_DEFAULT, CANON_LOGINS: process.env.CANON_LOGINS || false, + CANON_GOOGLE_OPTIMIZE: process.env.CANON_GOOGLE_OPTIMIZE || false, CANON_LOGLOCALE: process.env.CANON_LOGLOCALE, CANON_LOGREDUX: process.env.CANON_LOGREDUX, CANON_PORT: process.env.CANON_PORT || 3300, diff --git a/packages/core/src/client.jsx b/packages/core/src/client.jsx index e792be562..61011fdfd 100644 --- a/packages/core/src/client.jsx +++ b/packages/core/src/client.jsx @@ -49,7 +49,7 @@ import defaultTranslations from "./i18n/canon"; import CanonProvider from "./CanonProvider"; const {locale, resources} = window.__INITIAL_STATE__.i18n; -const {CANON_LOGLOCALE, NODE_ENV} = window.__INITIAL_STATE__.env; +const {CANON_LOGLOCALE, NODE_ENV, CANON_GOOGLE_OPTIMIZE} = window.__INITIAL_STATE__.env; const name = window.__APP_NAME__; const resourceObj = {canon: {[name]: defaultTranslations}}; @@ -132,6 +132,13 @@ function renderMiddleware() { const chunks = props.components.filter(comp => comp && comp.preload && comp.load); const {action, hash, pathname, query, search, state} = location; + //Launch Optimize activation event if client side navigation + function launchOptimizeEvent() { + if (CANON_GOOGLE_OPTIMIZE && !window.__SSR__ && window.dataLayer) { + window.dataLayer.push({'event': 'optimize.activate'}); + } + } + /** */ function postRender() { if (!window.__SSR__) { @@ -153,6 +160,7 @@ function renderMiddleware() { if (action !== "REPLACE" || !Object.keys(query).length) { selectAll(".d3plus-tooltip").remove(); + launchOptimizeEvent(); if (window.__SSR__ || state === "HASH" || !needs.length && !chunks.length) { postRender(); window.__SSR__ = false; @@ -184,7 +192,7 @@ function renderMiddleware() { } } - return ; + return ; } }; diff --git a/packages/core/src/helpers/services.js b/packages/core/src/helpers/services.js index 0a38ebe8d..3d0583d23 100644 --- a/packages/core/src/helpers/services.js +++ b/packages/core/src/helpers/services.js @@ -1,44 +1,47 @@ import {titleCase} from "d3plus-text"; const serviceJavaScript = { - FACEBOOK_PIXEL: id => `!function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){ + FACEBOOK_PIXEL: id => `!function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){ n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments)}; if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0'; n.queue=[];t=b.createElement(e);t.async=!0; t.src=v;s=b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t,s)}(window,document,'script', 'https://connect.facebook.net/en_US/fbevents.js'); fbq('init', '${id}'); fbq('track', 'PageView');`, - GOOGLE_TAG_MANAGER: id => `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': + GOOGLE_TAG_MANAGER: id => `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','${id}');`, - GOOGLE_ANALYTICS: id => `(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ + GOOGLE_ANALYTICS: id => `(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ${id.split(",").map((key, i) => `ga('create', '${key}', 'auto', 'tracker${i + 1}');`).join("\n ")} ${id.split(",").map((key, i) => `ga('tracker${i + 1}.send', 'pageview');`).join("\n ")}`, - HOTJAR: id => `(function(h,o,t,j,a,r){ + HOTJAR: id => `(function(h,o,t,j,a,r){ h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)}; h._hjSettings={hjid:${id},hjsv:6}; a=o.getElementsByTagName('head')[0]; r=o.createElement('script');r.async=1; r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv; a.appendChild(r); - })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');`, - GOOGLE_OPTIMIZE: id => `(function(w,d, optimizeId){ - var script = d.createElement('script'); - script.src = "https://www.googleoptimize.com/optimize.js?id="+optimizeId; - d.head.prepend(script); - })(window, document, "${id}")` + })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');` }; const serviceHeadTag = { - GOOGLE_OPTIMIZE: id => `` + GOOGLE_OPTIMIZE: id => ` + + + ` } const serviceHTML = { - GOOGLE_TAG_MANAGER: id => `