Merge pull request #1890 from dvoytenko/access27-events2

Propagate analytics events in access: events and NO data
ampproject · Feb 12, 2016 · e9d7479 · e9d7479
2 parents 18faf2b + ebcd63c
commit e9d7479
Show file tree

Hide file tree

Showing 6 changed files with 337 additions and 3 deletions.
diff --git a/examples/article-access.amp.html b/examples/article-access.amp.html
@@ -147,6 +147,41 @@
   <script async src="./viewer-integr.js"></script>
 </head>
 <body>
+<amp-analytics type="googleanalytics" id="analytics2">
+<script type="application/json">
+{
+  "vars": {
+    "account": "UA-YYYY-Y"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview",
+      "vars": {
+        "title": "Example Pageview"
+      }
+    },
+    "authorizationReceived": {
+      "on": "access-authorization-received",
+      "request": "event",
+      "vars": {
+        "eventCategory": "amp-access",
+        "eventAction": "access-authorization-received"
+      }
+    },
+    "pingbackSent": {
+      "on": "access-pingback-sent",
+      "request": "event",
+      "vars": {
+        "eventCategory": "amp-access",
+        "eventAction": "access-pingback-sent"
+      }
+    }
+  }
+}
+</script>
+</amp-analytics>
+
   <header>
     <div class="brand-logo">
       PublisherLogo

diff --git a/extensions/amp-access/0.1/amp-access.js b/extensions/amp-access/0.1/amp-access.js
@@ -16,13 +16,15 @@
 
 import {all} from '../../../src/promise';
 import {actionServiceFor} from '../../../src/action';
+import {analyticsFor} from '../../../src/analytics';
 import {assert, assertEnumValue} from '../../../src/asserts';
 import {assertHttpsUrl, getSourceOrigin} from '../../../src/url';
 import {cidFor} from '../../../src/cid';
 import {documentStateFor} from '../../../src/document-state';
 import {evaluateAccessExpr} from './access-expr';
 import {getService} from '../../../src/service';
 import {installStyles} from '../../../src/styles';
+import {isExperimentOn} from '../../../src/experiments';
 import {listenOnce} from '../../../src/event-helper';
 import {log} from '../../../src/log';
 import {onDocumentReady} from '../../../src/document-state';
@@ -67,6 +69,9 @@ const AccessType = {
 /** @const */
 const TAG = 'AmpAccess';
 
+/** @const */
+const ANALYTICS_EXPERIMENT = 'amp-access-analytics';
+
 /** @const {number} */
 const VIEW_TIMEOUT = 2000;
 
@@ -89,6 +94,10 @@ export class AccessService {
     /** @const @private {boolean} */
     this.isExperimentOn_ = true;
 
+    /** @const @private {boolean} */
+    this.isAnalyticsExperimentOn_ = (this.isExperimentOn_ &&
+        isExperimentOn(this.win, ANALYTICS_EXPERIMENT));
+
     const accessElement = document.getElementById('amp-access');
 
     /** @const @private {boolean} */
@@ -156,6 +165,13 @@ export class AccessService {
 
     /** @private {?Promise} */
     this.loginPromise_ = null;
+
+    /** @private {!Promise<!InstrumentationService>} */
+    this.analyticsPromise_ = analyticsFor(this.win);
+
+    this.firstAuthorizationPromise_.then(() => {
+      this.analyticsEvent_('access-authorization-received');
+    });
   }
 
   /**
@@ -208,6 +224,18 @@ export class AccessService {
     return this.enabled_;
   }
 
+  /**
+   * @param {string} eventType
+   * @private
+   */
+  analyticsEvent_(eventType) {
+    if (this.isAnalyticsExperimentOn_) {
+      this.analyticsPromise_.then(analytics => {
+        analytics.triggerEvent(eventType);
+      });
+    }
+  }
+
   /**
    * @return {!AccessService}
    * @private
@@ -336,6 +364,7 @@ export class AccessService {
       });
     }).catch(error => {
       log.error(TAG, 'Authorization failed: ', error);
+      this.analyticsEvent_('access-authorization-failed');
       this.toggleTopClass_('amp-access-loading', false);
       this.toggleTopClass_('amp-access-error', true);
     });
@@ -487,6 +516,7 @@ export class AccessService {
     log.fine(TAG, 'start view monitoring');
     this.reportViewPromise_ = this.whenViewed_()
         .then(() => {
+          this.analyticsEvent_('access-viewed');
           // Wait for the first authorization flow to complete.
           return this.firstAuthorizationPromise_;
         })
@@ -561,8 +591,10 @@ export class AccessService {
       });
     }).then(() => {
       log.fine(TAG, 'Pingback complete');
+      this.analyticsEvent_('access-pingback-sent');
     }).catch(error => {
       log.error(TAG, 'Pingback failed: ', error);
+      this.analyticsEvent_('access-pingback-failed');
       throw error;
     });
   }
@@ -603,19 +635,24 @@ export class AccessService {
     assert(this.config_.login, 'Login URL is not configured');
     // Login URL should always be available at this time.
     const loginUrl = assert(this.loginUrl_, 'Login URL is not ready');
+    this.analyticsEvent_('access-login-started');
     this.loginPromise_ = this.openLoginDialog_(loginUrl).then(result => {
       log.fine(TAG, 'Login dialog completed: ', result);
       this.loginPromise_ = null;
       const query = parseQueryString(result);
       const s = query['success'];
       const success = (s == 'true' || s == 'yes' || s == '1');
       if (success) {
+        this.analyticsEvent_('access-login-success');
         this.broadcastReauthorize_();
         // Repeat the authorization flow.
         return this.runAuthorization_();
+      } else {
+        this.analyticsEvent_('access-login-rejected');
       }
     }).catch(reason => {
       log.fine(TAG, 'Login dialog failed: ', reason);
+      this.analyticsEvent_('access-login-failed');
       this.loginPromise_ = null;
       throw reason;
     });