Adds new "value" attribute that creates a fake element and select its content to clipboard

This commit is contained in:
Zeno Rocha 2015-09-18 16:32:57 -07:00
parent 8780d3c6bb
commit f7d3fb249a
2 changed files with 26 additions and 6 deletions

1
dist/clipboard.min.js vendored Normal file
View File

@ -0,0 +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}();

View File

@ -25,21 +25,40 @@ class Clipboard {
bind(trigger) {
trigger.addEventListener('click', e => {
var value = e.currentTarget.getAttribute('value');
var targetSelector = e.currentTarget.getAttribute('for');
var target = document.getElementById(targetSelector);
if (target.nodeName === 'INPUT' || target.nodeName === 'TEXTAREA') {
target.select();
if (value) {
var fake = document.createElement('input');
fake.value = value;
fake.style.opacity = 0;
fake.style.zIndex = -1;
document.body.appendChild(fake);
fake.select();
}
else {
var range = document.createRange();
range.selectNode(target);
window.getSelection().addRange(range);
if (target) {
if (target.nodeName === 'INPUT' || target.nodeName === 'TEXTAREA') {
target.select();
}
else {
var range = document.createRange();
range.selectNode(target);
window.getSelection().addRange(range);
}
}
try {
document.execCommand('copy');
window.getSelection().removeAllRanges();
if (value) {
document.body.removeChild(fake);
}
}
catch (err) {
console.error(err);