Code4HK Badge CSS and HTML and Ga Tracking code

code4hk-badge-analyticsjs.js

//https://developers.google.com/analytics/devguides/collection/analyticsjs/events


var downloadLink = document.getElementById('#code4hk-badge-link');
addListener(downloadLink, 'click', function() {
  ga('send', 'event', 'link', 'click', 'code4hk-badge-link');
});


/**
 * Utility to wrap the different behaviors between W3C-compliant browsers
 * and IE when adding event handlers.
 *
 * @param {Object} element Object on which to attach the event listener.
 * @param {string} type A string representing the event type to listen for
 *     (e.g. load, click, etc.).
 * @param {function()} callback The function that receives the notification.
 */
function addListener(element, type, callback) {
 if (element.addEventListener) element.addEventListener(type, callback);
 else if (element.attachEvent) element.attachEvent('on' + type, callback);
}

code4hk-badge-angular-ga-old.js

if ($window._gaq) {
    $scope.$on('$viewContentLoaded', function(event) {
        var code4hkLink = angular.element(document.querySelector('#code4hk-badge-link'));
        code4hkLink.on('click', function() {
            $window._gaq.push(['_trackEvent', 'link', 'click', 'code4hk-badge-link']);
        });
    });
}

code4hk-badge.css

#code4hk-badge a{background:#000;color:#fff;text-decoration:none;font-family:arial, sans-serif;text-align:center;font-weight:bold;padding:5px 40px;font-size:1.2rem;line-height:2rem;position:relative;transition:0.5s;}#code4hk-badge a:hover{background:#060;color:#fff;}#code4hk-badge a::before,#code4hk-badge a::after{content:"";width:100%;display:block;position:absolute;top:1px;left:0;height:1px;background:#fff;}#code4hk-badge a::after{bottom:1px;top:auto;}@media screen and (min-width:800px){#code4hk-badge{position:absolute;display:block;top:0;left:0;width:200px;overflow:hidden;height:200px;}#code4hk-badge a{width:200px;position:absolute;top:4em;left:-4em;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);box-shadow:4px 4px 10px rgba(0,0,0,0.8);}}

code4hk-badge.html

<link rel="stylesheet" type="text/css" href="//gist.githubusercontent.com/vincentlaucy/9393952/raw/e9fa6b36b594337018a6e3c8ad86fab6130bb854/code4hk-badge.css">
<span style="" id="code4hk-badge"><a id="code4hk-badge-link" href="http://www.code4.hk"> Code for Hong Kong </a></span>

TODO: migrate to code4hk github

Pushed to code4hk-commons https://github.com/code4hk/commons