Breaks code into multiple methods (arrow functions ❤️)

README.md

@@ -35,9 +35,11 @@ Another way of doing it is to copy the content from an `<input>` or `<textarea`>
 
 ## Browser Support
 
+This project relies on both [Select API](https://developer.mozilla.org/en-US/docs/Web/API/Selection) and [execCommand API](https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand). When combined, they're supported in the following browsers.
+
 | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/chrome/chrome_64x64.png" width="48px" height="48px" alt="Chrome logo"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/firefox/firefox_64x64.png" width="48px" height="48px" alt="Firefox logo"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/internet-explorer/internet-explorer_64x64.png" width="48px" height="48px" alt="Internet Explorer logo"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/opera/opera_64x64.png" width="48px" height="48px" alt="Opera logo"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/safari/safari_64x64.png" width="48px" height="48px" alt="Safari logo"> |
 |:---:|:---:|:---:|:---:|:---:|
-| 42+ ✔ | 41+ ✔ | 9+ ✔ | 29+ ✔ | ✘ |
+| 42+ ✔ | 41+ ✔ | 9+ ✔ | 29+ ✔ | Nope ✘ |
 
 ## License
 

dist/clipboard.min.js

@@ -1 +1 @@
-"use strict";function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function a(a,b){for(var c=0;c<b.length;c++){var d=b[c];d.enumerable=d.enumerable||!1,d.configurable=!0,"value"in d&&(d.writable=!0),Object.defineProperty(a,d.key,d)}}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),Clipboard=function(){function a(b){_classCallCheck(this,a),this._triggers=b,this.init()}return _createClass(a,[{key:"init",value:function(){[].forEach.call(this.triggers,this.bind)}},{key:"bind",value:function(a){a.addEventListener("click",function(a){var b=a.currentTarget.getAttribute("value"),c=a.currentTarget.getAttribute("for"),d=document.getElementById(c);if(b){var e=document.createElement("input");e.value=b,e.style.opacity=0,e.style.zIndex=-1,document.body.appendChild(e),e.select()}if(d)if("INPUT"===d.nodeName||"TEXTAREA"===d.nodeName)d.select();else{var f=document.createRange();f.selectNode(d),window.getSelection().addRange(f)}try{document.execCommand("copy"),window.getSelection().removeAllRanges(),b&&document.body.removeChild(e)}catch(g){console.error(g)}a.preventDefault()})}},{key:"triggers",get:function(){return document.querySelectorAll(this._triggers)},set:function(a){return this._triggers=a}}]),a}();
+"use strict";function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function a(a,b){for(var c=0;c<b.length;c++){var d=b[c];d.enumerable=d.enumerable||!1,d.configurable=!0,"value"in d&&(d.writable=!0),Object.defineProperty(a,d.key,d)}}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),Clipboard=function(){function a(b){_classCallCheck(this,a),this._triggers=b,this.init()}return _createClass(a,[{key:"init",value:function(){var a=this;[].forEach.call(this.triggers,function(b){return a.bind(b)})}},{key:"bind",value:function(a){var b=this;a.addEventListener("click",function(a){return b.select(a)})}},{key:"select",value:function(a){var b=a.currentTarget.getAttribute("value"),c=a.currentTarget.getAttribute("for");b?this.selectValue(b):c?this.selectTarget(c):console.error('No "for" or "value" attributes'),a.preventDefault()}},{key:"selectValue",value:function(a){var b=document.createElement("input");b.value=a,b.style.opacity=0,b.style.zIndex=-1,document.body.appendChild(b),b.select(),this.copy(),document.body.removeChild(b)}},{key:"selectTarget",value:function(a){var b=document.getElementById(a);if("INPUT"===b.nodeName||"TEXTAREA"===b.nodeName)b.select();else{var c=document.createRange();c.selectNode(b),window.getSelection().addRange(c)}this.copy()}},{key:"copy",value:function(){try{document.execCommand("copy"),window.getSelection().removeAllRanges()}catch(a){console.error(a)}}},{key:"triggers",get:function(){return document.querySelectorAll(this._triggers)},set:function(a){return this._triggers=a}}]),a}();

src/clipboard.js

@@ -20,51 +20,67 @@ class Clipboard {
     // Methods
 
     init() {
-        [].forEach.call(this.triggers, this.bind);
+        [].forEach.call(this.triggers, (trigger) => this.bind(trigger));
     }
 
     bind(trigger) {
-        trigger.addEventListener('click', e => {
+        trigger.addEventListener('click', (e) => this.select(e));
-            var value = e.currentTarget.getAttribute('value');
+    }
-            var targetSelector = e.currentTarget.getAttribute('for');
-            var target = document.getElementById(targetSelector);
 
-            if (value) {
+    select(e) {
-                var fake = document.createElement('input');
+        var valueAttr  = e.currentTarget.getAttribute('value');
+        var targetAttr = e.currentTarget.getAttribute('for');
 
-                fake.value = value;
+        if (valueAttr) {
-                fake.style.opacity = 0;
+            this.selectValue(valueAttr);
-                fake.style.zIndex = -1;
+        }
+        else if (targetAttr) {
+            this.selectTarget(targetAttr);
+        }
+        else {
+            console.error('Missing "for" or "value" attribute');
+        }
 
-                document.body.appendChild(fake);
+        e.preventDefault();
+    }
 
-                fake.select();
+    selectValue(valueAttr) {
-            }
+        var fake = document.createElement('input');
 
-            if (target) {
+        fake.value = valueAttr;
-                if (target.nodeName === 'INPUT' || target.nodeName === 'TEXTAREA') {
+        fake.style.opacity = 0;
-                    target.select();
+        fake.style.zIndex = -1;
-                }
-                else {
-                    var range = document.createRange();
-                    range.selectNode(target);
-                    window.getSelection().addRange(range);
-                }
-            }
 
-            try {
+        document.body.appendChild(fake);
-                document.execCommand('copy');
-                window.getSelection().removeAllRanges();
 
-                if (value) {
+        fake.select();
-                    document.body.removeChild(fake);
+        this.copy();
-                }
-            }
-            catch (err) {
-                console.error(err);
-            }
 
-            e.preventDefault();
+        document.body.removeChild(fake);
-        });
+    }
+
+    selectTarget(targetAttr) {
+        var target = document.getElementById(targetAttr);
+
+        if (target.nodeName === 'INPUT' || target.nodeName === 'TEXTAREA') {
+            target.select();
+        }
+        else {
+            var range = document.createRange();
+            range.selectNode(target);
+            window.getSelection().addRange(range);
+        }
+
+        this.copy();
+    }
+
+    copy() {
+        try {
+            document.execCommand('copy');
+            window.getSelection().removeAllRanges();
+        }
+        catch (err) {
+            console.error(err);
+        }
     }
 }