diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json index c7184cd..73e0a6e 100644 --- a/npm-shrinkwrap.json +++ b/npm-shrinkwrap.json @@ -1,6 +1,6 @@ { "name": "ely-by-account", - "version": "1.0.0", + "version": "1.1.6-dev", "dependencies": { "abab": { "version": "1.0.3", @@ -1878,6 +1878,18 @@ "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz", "dev": true }, + "debounce": { + "version": "1.0.0", + "from": "debounce@latest", + "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.0.0.tgz", + "dependencies": { + "date-now": { + "version": "1.0.1", + "from": "date-now@1.0.1", + "resolved": "https://registry.npmjs.org/date-now/-/date-now-1.0.1.tgz" + } + } + }, "debug": { "version": "2.3.2", "from": "debug@>=2.1.1 <3.0.0", diff --git a/package.json b/package.json index f05290c..9664538 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "dependencies": { "babel-polyfill": "^6.3.14", "classnames": "^2.1.3", + "debounce": "^1.0.0", "history": "^3.2.1", "intl": "^1.2.2", "intl-format-cache": "^2.0.4", diff --git a/src/functions.js b/src/functions.js index b275fe0..f630d1f 100644 --- a/src/functions.js +++ b/src/functions.js @@ -46,3 +46,18 @@ export const rAF = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || ((cb) => setTimeout(cb, 1000 / 60)); + +/** + * Returns a function, that, as long as it continues to be invoked, will not + * be triggered. The function will be called after it stops being called for + * N milliseconds. If `immediate` is passed, trigger the function on the + * leading edge, instead of the trailing. The function also has a property 'clear' + * that is a function which will clear the timer to prevent previously scheduled executions. + * + * @source https://github.com/component/debounce + * + * @param {function} function - function to wrap + * @param {number} [timeout=100] - timeout in ms + * @param {bool} [immediate=false] - whether to execute at the beginning + */ +export debounce from 'debounce'; diff --git a/src/index.ejs b/src/index.ejs index 5215c2a..d0d4222 100644 --- a/src/index.ejs +++ b/src/index.ejs @@ -31,19 +31,5 @@ <% for (var chunk in htmlWebpackPlugin.files.chunks) { %> <% } %> - -<% if (htmlWebpackPlugin.options.ga) { - if (!htmlWebpackPlugin.options.ga.id) { - throw new Error('ga.id is required to enable google analytics'); - } -%> - - - - -<% } %> diff --git a/src/index.js b/src/index.js index 5d96a88..827f62c 100644 --- a/src/index.js +++ b/src/index.js @@ -17,7 +17,7 @@ import loader from 'services/loader'; import logger from 'services/logger'; logger.init({ - sentryCdn: window.sentryCdn + sentryCdn: window.SENTRY_CDN }); const store = storeFactory(); @@ -54,6 +54,8 @@ Promise.all([ , document.getElementById('app') ); + + initAnalytics(); }); @@ -92,14 +94,30 @@ function restoreScroll() { }, 200); } -browserHistory.listen(trackPageView); +import { loadScript, debounce } from 'functions'; +const trackPageView = debounce(_trackPageView); +function initAnalytics() { + if (!window.ga) { + const ga = window.ga = function() { + (ga.q = ga.q || []).push(arguments); // eslint-disable-line + }; + ga.l = Date.now(); // eslint-disable-line -function trackPageView(location) { - const ga = window.ga; + if (window.GA_ID) { + // when GA is not available, we will continue to push into array + // for debug purposes + loadScript('https://www.google-analytics.com/analytics.js'); + } - if (!ga) { - return; + ga('create', window.GA_ID, 'auto'); + trackPageView(location); + + browserHistory.listen(trackPageView); } +} + +function _trackPageView(location) { + const ga = window.ga; ga('set', 'page', location.pathname + location.search); ga('send', 'pageview'); diff --git a/webpack.config.js b/webpack.config.js index a9f8c8c..e08e21c 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -107,7 +107,8 @@ const webpackConfig = { plugins: [ new webpack.DefinePlugin({ - 'window.sentryCdn': config.sentryCdn ? JSON.stringify(config.sentryCdn) : undefined, + 'window.SENTRY_CDN': config.sentryCdn ? JSON.stringify(config.sentryCdn) : undefined, + 'window.GA_ID': config.ga && config.ga.id ? JSON.stringify(config.ga.id) : undefined, 'process.env': { NODE_ENV: JSON.stringify(process.env.NODE_ENV), APP_ENV: JSON.stringify(config.environment || process.env.NODE_ENV), @@ -126,8 +127,7 @@ const webpackConfig = { inject: false, minify: { collapseWhitespace: isProduction - }, - ga: config.ga + } }), new webpack.ProvidePlugin({ React: 'react'