Emits event on base class instead of each element for better performance

This commit is contained in:
Zeno Rocha
2015-09-24 18:13:23 -07:00
parent ced945f11a
commit 3610bfa08c
4 changed files with 17 additions and 27 deletions

File diff suppressed because one or more lines are too long

View File

@ -9,8 +9,8 @@
"cut"
],
"dependencies": {
"custom-event": "^1.0.0",
"delegate-events": "^1.1.1"
"delegate-events": "^1.1.1",
"tiny-emitter": "^1.0.0"
},
"devDependencies": {
"babelify": "^6.3.0",

View File

@ -1,5 +1,3 @@
var CustomEvent = require('custom-event');
/**
* Inner class which performs selection and copy operations.
*/
@ -10,6 +8,7 @@ class ClipboardAction {
*/
constructor(options) {
this.action = options.action;
this.host = options.host;
this.target = options.target;
this.text = options.text;
this.trigger = options.trigger;
@ -85,33 +84,22 @@ class ClipboardAction {
*/
handleResult(succeeded) {
if (succeeded) {
this.fireEvent('success', {
this.host.emit('success', {
action: this.action,
text: this.selectedText,
trigger: this.trigger,
clearSelection: this.clearSelection.bind(this)
});
}
else {
this.fireEvent('error', {
this.host.emit('error', {
action: this.action,
trigger: this.trigger,
clearSelection: this.clearSelection.bind(this)
});
}
}
/**
* Emits a custom event into the `trigger` element.
* @param {String} type
* @param {*} detail
*/
fireEvent(type, detail) {
let event = new CustomEvent(type, {
detail: detail
});
this.trigger.dispatchEvent(event);
}
/**
* Removes current selection and focus from `target` element.
*/

View File

@ -1,20 +1,21 @@
var ClipboardAction = require('./clipboard-action');
var Delegate = require('dom-delegate').Delegate;
const ClipboardAction = require('./clipboard-action');
const Delegate = require('dom-delegate').Delegate;
const Emitter = require('tiny-emitter');
/**
* Base class which takes a selector, delegates a click event to it,
* and instantiates a new `ClipboardAction` on each click.
*/
class Clipboard {
class Clipboard extends Emitter {
/**
* Delegates a click event to the passed selector.
* Delegates a click event on the passed selector.
* @param {String} selector
*/
constructor(selector) {
this.selector = selector;
super();
let delegate = new Delegate(document.body);
delegate.on('click', this.selector, (e) => this.initialize(e));
delegate.on('click', selector, (e) => this.initialize(e));
}
/**
@ -26,7 +27,8 @@ class Clipboard {
action : e.target.getAttribute('data-action'),
target : e.target.getAttribute('data-target'),
text : e.target.getAttribute('data-text'),
trigger : e.target
trigger : e.target,
host : this
});
}
}