* optimize class structure

.editorconfig

@@ -0,0 +1,21 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+
+[*]
+
+# Change these settings to your own preference
+indent_style = space
+indent_size = 4
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

example/index.html

@@ -54,7 +54,7 @@ <h3>Link metrics <strong>with</strong> href</h3>
         </div>
       </div>
     </div>
-    
+
     <h3>Link metrics <strong>without</strong> href</h3>
     <div class="panel panel-default">
       <div class="panel-body">
@@ -74,7 +74,7 @@ <h3>Link metrics <strong>without</strong> href</h3>
             </p>
           </div>
         </div>
-        
+
       </div>
     </div>
 
@@ -216,8 +216,8 @@ <h4>jQuery</h4>
   m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
   })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
-  ga('create', 'UA-35549406-1', 'none');
+  ga('create', 'UA-17554098-1', 'none');
   ga('send', 'pageview');
 </script>
 </body>
-</html>
+</html>

src/data-metrics.js

@@ -1,68 +1,97 @@
 'use strict';
 
-(function(root) {
-  function DataMetrics() {}
-
-  DataMetrics.prototype = {
-    init: function() {
-      this.addEventListeners();
-    },
-
-    addEventListeners: function() {
-      var self = this;
-      var elements = document.querySelectorAll('*[data-metrics]');
-
-      for (var i = 0; i < elements.length; i++) {
-        if ( elements[i].tagName !== 'FORM' ) {
-          elements[i].onclick = function(e) {
-            self.appendEvent.call(self, e);
-          };
-        } else {
-          elements[i].onsubmit = function(e) {
-            self.appendEvent.call(self, e);
-          };
-        }
-      }
-    },
-
-    appendEvent: function (e) {
-      var elem = e.currentTarget;
-
-      if (!elem.classList.contains('sending-metrics')) {
-        var params = elem.getAttribute('data-metrics').split('|');
-
-        if (params[1] === undefined) params[1] = null;
-        if (params[2] === undefined) params[2] = null;
-
-        this.sendToGA(params[0], params[1], params[2], elem);
-        elem.classList.add('sending-metrics');
-        return false;
-      }
-    },
-
-    sendToGA: function(category, action, label, elem) {
-      var self = this;
-
-      window.ga('send', 'event', category, action, label, { 'hitCallback': function() {
-        if (elem) {
-          self.onEventIsDispatched.call(self, elem);
-        }
-      }});
-    },
+(function (ga) {
+    function DataMetrics() {
+        this.init();
+    }
 
-    onEventIsDispatched: function (elem) {
-      if (elem.getAttribute('href')) {
-        window.location.href = elem.getAttribute('href');
-      } else if (elem.tagName === 'FORM') {
-        elem.submit();
-      }
+    DataMetrics.prototype = {
+        init: function () {
+            this.addEventListeners();
+        },
 
-      elem.classList.remove('sending-metrics');
-    }
-  };
+        addEventListeners: function () {
+            var elements = document.querySelectorAll('*[data-metrics]');
+            for (var i = 0; i < elements.length; i++) {
+                if (!this.isSubmitInput(elements[i])) {
+                    elements[i].addEventListener('click', this.appendEvent.bind(this), false);
+                } else {
+                    elements[i].onsubmit = this.appendEvent.bind(this);
+                }
+            }
+        },
+
+        isSubmitInput: function (elem) {
+            if (elem.tagName === 'FORM') {
+                return true;
+            } else {
+                return false;
+            }
+        },
+
+        isLink: function (elem) {
+            if (elem.getAttribute('href')) {
+                return true;
+            } else {
+                return false;
+            }
+        },
+
+        linkHasBlank: function (elem) {
+            if (elem.getAttribute('target')) {
+                return true;
+            } else {
+                return false;
+            }
+        },
+
+        appendEvent: function (e) {
+            var elem = e.currentTarget;
+
+            if (!elem.classList.contains('sending-metrics')) {
+                var params = elem.getAttribute('data-metrics').split('|');
+
+                if (params[1] === undefined) {
+                    params[1] = null;
+                }
+                if (params[2] === undefined) {
+                    params[2] = null;
+                }
+                this.sendToGA(params[0], params[1], params[2], elem);
+                elem.classList.add('sending-metrics');
+
+                if (!this.isSubmitInput(elem) && !this.linkHasBlank(elem)) {
+                    e.preventDefault();
+                    return false;
+                }
+            }
+        },
+
+        sendToGA: function (category, action, label, elem) {
+            var self = this;
+            window.ga('send', 'event', category, action, label, { 'hitCallback': function () {
+                self.onHitCallback(elem);
+            }});
+        },
+
+        onHitCallback: function (elem) {
+            if (elem) {
+                this.onEventIsDispatched(elem);
+            }
+        },
+
+        onEventIsDispatched: function (elem) {
+            if (this.isLink(elem) && !this.linkHasBlank(elem)) {
+                window.location.href = elem.getAttribute('href');
+            } else if (this.isSubmitInput(elem)) {
+                elem.submit();
+            }
+
+            elem.classList.remove('sending-metrics');
+        }
+    };
 
-  root.dataMetrics = new DataMetrics();
-  root.dataMetrics.init();
+    window.dataMetrics = new DataMetrics();
 
-})(this);
+})(window.ga);