Add limited GA to the buyers guide

[Pomax]

Addresses some of the events in #1925, but not done in a real sense.

Added:

• support link click event
• "copy link" click event

note that bg-main.js does not import and init product-analytics.js yet

[Pomax]

@alanmoo @mmmavis hopefully this is enough to just finish up on

[alanmoo]

This looks like a reasonable start- I'm fine landing it to get some sort of GA in there.

[Pomax]

Might as well use document.getElementById if we're using it that much, since it's considerably faster than querySelector.

[Pomax]

If we're repeating code this much, it's probably better to make this a single action, and then trigger them for each element:

function addAnalytics(elementId, category, action, label, beacon) {
  let element  = document.getElementById(elementId);
  if (element) {
    let opts = { category, action, label };
    if (beacon) { opts.transport = `beacon`; }
    element.onclick = () => ReactGA.event(opts); // <= this is... probably bad?
  } else {
    // we can warn about the fact that an expected element does not exist, here
  }
}

...

addAnalytics(`nav-social-button-fb`, `site`, `share tap`, `share site to facebook`, true);
// etc

Note the "this is probably bad", though, because onclick is a plain property: if something else sets an onclick first, that is now lost, and if something else sets an onclick later, that will remove the GA binding, so ideally we use addEventListener...

[mmmavis]

nave typo?

[mmmavis]

Are we tracking clicks on mobile as well? If so let's add id to elements on mobile version.

[Pomax]

👍 let me add those

[mmmavis]

extra ` here

rereview passed