Outbound click tracking

Clicks on listing links to be tracked via google-analytics
End users may disable google analytics to opt-out of tracking

r2/Makefile

@@ -21,7 +21,7 @@
 ################################################################################
 
 # Javascript files to be compressified
-js_sources           = jquery.json.js jquery.reddit.js reddit.js base.js ui.core.js ui.datepicker.js sponsored.js jquery.flot.js jquery.lazyload.js compact.js blogbutton.js flair.js
+js_sources           = jquery.json.js jquery.reddit.js reddit.js base.js ui.core.js ui.datepicker.js sponsored.js jquery.flot.js jquery.lazyload.js compact.js blogbutton.js flair.js analytics.js
 js_targets           = button.js jquery.flot.js sponsored.js
 localized_js_targets = reddit.js mobile.js
 localized_js_outputs = $(localized_js_targets:.js=.*.js)

r2/r2/lib/js.py

@@ -183,6 +183,7 @@ def use(self):
     "jquery.json.js",
     "jquery.reddit.js",
     "base.js",
+    "analytics.js",
     "flair.js",
     "reddit.js",
 )

r2/r2/public/static/js/analytics.js

@@ -0,0 +1,42 @@
+/* Analytics, such as event tracking for google analytics */
+$(function() {
+
+    function recordOutboundLink(link) {
+        /* category/action/label are essentially "tags" used by
+           google analytics */
+        var category = "outbound link";
+        var action = link.attr("domain");
+        var label = link.attr("srcurl") || link.attr("href");
+
+        /* Find the parent link <div> for info on promoted/self/etc */
+        var link_entry = link.thing();
+
+        if (link_entry.hasClass("selflink")){
+            category = "internal link";
+        }
+
+        if (link_entry.hasClass("promotedlink")){
+            category += " promoted";
+        }
+
+        _gaq.push(['_trackEvent', category, action, label]);
+    }
+
+    $("body").delegate("div.link .entry .title a.title, div.link a.thumbnail",
+                       "mouseup", function(e) {
+        switch (e.which){
+            /* Record left and middle clicks */
+            case 1:
+            /* CAUTION - left click case falls through to middle click */
+            case 2:
+                recordOutboundLink($(this));
+                break;
+            default:
+                /* right-clicks and non-standard clicks ignored; no way to
+                   know if context menu is used to pull up new tab or not */
+                break;
+        }
+
+    });
+
+});

r2/r2/public/static/js/reddit.js

@@ -623,10 +623,11 @@ function updateEventHandlers(thing) {
                     text = title.html();
                 }
 
-                $(this).find("a.title").attr("href", tracker.click).end()
-                    .find("a.thumbnail").attr("href", tracker.click).end()
-                    .find("img.promote-pixel")
-                    .attr("src", tracker.show);
+                save_href($(this).find("a.title"))
+                    .attr("href", tracker.click).end();
+                save_href($(this).find("a.thumbnail"))
+                    .attr("href", tracker.click).end();
+                $(this).find("img.promote-pixel").attr("src", tracker.show);
 
                 if ($.browser.msie) {
                     if (text != title.html()) {
@@ -1409,3 +1410,10 @@ function highlight_new_comments(period) {
     }
   }
 }
+
+function save_href(link) {
+  if (!link.attr("srcurl")){
+    link.attr("srcurl", link.attr("href"));
+  }
+  return link;
+}

r2/r2/templates/link.html

@@ -44,6 +44,9 @@
      %if not (getattr(thing, "trial_mode", None) and thing.is_self):
        href="${thing.href_url}"
      %endif
+     %if thing.domain:
+       domain="${thing.domain}"
+     %endif
      %if thing.nofollow:
        rel="nofollow"
      %endif
@@ -53,7 +56,7 @@
        target="_top"
      %endif
      %if thing.mousedown_url:
-       onmousedown="this.href='${thing.mousedown_url}'"
+       onmousedown="save_href($(this));this.href='${thing.mousedown_url}'"
      %endif
      %if thing.link_child and getattr(thing, "media_override", False):
        onclick="return expando_child(this)"

r2/r2/templates/link.htmllite

@@ -56,7 +56,7 @@
          target="_top"
        %endif
        %if thing.mousedown_url:
-         onmousedown="this.href='${thing.mousedown_url}'"
+         onmousedown="save_href($(this));this.href='${thing.mousedown_url}'"
        %endif
        >
       ${thing.title}

r2/r2/templates/printable.html

@@ -56,6 +56,11 @@
       cls = thing.render_class.__name__.lower()
    else:
       cls = thing.lookups[0].__class__.__name__.lower()
+
+   if getattr(thing, "is_self", False):
+      selflink = "selflink"
+   else:
+      selflink = ""
 
    if thing.show_spam:
      rowclass = thing.rowstyle + " spam"
@@ -70,7 +75,7 @@
    if hasattr(thing, "hidden") and thing.hidden:
      rowclass += " hidden"
  %>
-<div class="${self.thing_css_class(thing)} ${rowclass} ${unsafe(cls)}"
+<div class="${self.thing_css_class(thing)} ${rowclass} ${unsafe(cls)} ${selflink}"
      ${thing.display} onclick="click_thing(this)">
   <p class="parent">
     ${self.ParentDiv()}