Skip to content

Commit

Permalink
Merge pull request #654 from daviferreira/custom-events-fix
Browse files Browse the repository at this point in the history 
Make custom events not require 'registering' before triggering
  • Loading branch information
@j0k3r
j0k3r committed May 30, 2015
2 parents ad3cdf5 + 0c6504b commit 9ecee36
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 37 deletions.
12 changes: 12 additions & 0 deletions spec/events.spec.js
View file
Expand Up @@ -42,6 +42,18 @@ describe('Events TestCase', function () {
});
});

describe('Custom Events', function () {
it('should be attachable and triggerable if they are not built-in events', function () {
var editor = this.newMediumEditor('.editor'),
spy = jasmine.createSpy('handler'),
tempData = { temp: 'data' };
editor.subscribe('myIncredibleEvent', spy);
expect(spy).not.toHaveBeenCalled();
editor.trigger('myIncredibleEvent', tempData, editor.elements[0]);
expect(spy).toHaveBeenCalledWith(tempData, editor.elements[0]);
});
});

describe('Custom Focus/Blur Listener', function () {
it('should be called and passed the editable element when the editable gets focus', function () {
var editor = this.newMediumEditor('.editor'),
Expand Down
13 changes: 3 additions & 10 deletions src/js/core.js
View file
Expand Up @@ -450,14 +450,6 @@ function MediumEditor(elements, options) {
name;
this.commands = [];

// add toolbar custom events to the list of known events by the editor
// we need to have this for the initialization of extensions
// initToolbar is called after initCommands
// add toolbar custom events to the list of known events by the editor
this.createEvent('showToolbar');
this.createEvent('hideToolbar');
this.createEvent('positionToolbar');

buttons.forEach(function (buttonName) {
if (extensions[buttonName]) {
ext = initExtension(extensions[buttonName], buttonName, this);
Expand Down Expand Up @@ -688,8 +680,9 @@ function MediumEditor(elements, options) {
this.events.detachCustomEvent(event, listener);
},

createEvent: function (event) {
this.events.defineCustomEvent(event);
createEvent: function () {
Util.warn('.createEvent() has been deprecated and is no longer needed. ' +
'You can attach and trigger custom events without calling this method. This will be removed in v5.0.0');
},

trigger: function (name, data, editable) {
Expand Down
31 changes: 4 additions & 27 deletions src/js/events.js
View file
Expand Up @@ -54,13 +54,10 @@ var Events;
// custom events
attachCustomEvent: function (event, listener) {
this.setupListener(event);
// If we don't support this custom event, don't do anything
if (this.listeners[event]) {
if (!this.customEvents[event]) {
this.customEvents[event] = [];
}
this.customEvents[event].push(listener);
if (!this.customEvents[event]) {
this.customEvents[event] = [];
}
this.customEvents[event].push(listener);
},

detachCustomEvent: function (event, listener) {
Expand All @@ -71,10 +68,6 @@ var Events;
}
},

defineCustomEvent: function (event) {
this.listeners[event] = true;
},

indexOfCustomListener: function (event, listener) {
if (!this.customEvents[event] || !this.customEvents[event].length) {
return -1;
Expand Down Expand Up @@ -212,17 +205,14 @@ var Events;
this.attachDOMEvent(this.options.ownerDocument.body, 'mousedown', this.handleBodyMousedown.bind(this), true);
this.attachDOMEvent(this.options.ownerDocument.body, 'click', this.handleBodyClick.bind(this), true);
this.attachDOMEvent(this.options.ownerDocument.body, 'focus', this.handleBodyFocus.bind(this), true);
this.listeners[name] = true;
break;
case 'blur':
// Detecting when focus is lost
this.setupListener('externalInteraction');
this.listeners[name] = true;
break;
case 'focus':
// Detecting when focus moves into some part of MediumEditor
this.setupListener('externalInteraction');
this.listeners[name] = true;
break;
case 'editableInput':
// setup cache for knowing when the content has changed
Expand All @@ -245,89 +235,76 @@ var Events;
// Listen to calls to execCommand
this.attachToExecCommand();
}

this.listeners[name] = true;
break;
case 'editableClick':
// Detecting click in the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'click', this.handleClick.bind(this));
}.bind(this));
this.listeners[name] = true;
break;
case 'editableBlur':
// Detecting blur in the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'blur', this.handleBlur.bind(this));
}.bind(this));
this.listeners[name] = true;
break;
case 'editableKeypress':
// Detecting keypress in the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'keypress', this.handleKeypress.bind(this));
}.bind(this));
this.listeners[name] = true;
break;
case 'editableKeyup':
// Detecting keyup in the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'keyup', this.handleKeyup.bind(this));
}.bind(this));
this.listeners[name] = true;
break;
case 'editableKeydown':
// Detecting keydown on the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'keydown', this.handleKeydown.bind(this));
}.bind(this));
this.listeners[name] = true;
break;
case 'editableKeydownEnter':
// Detecting keydown for ENTER on the contenteditables
this.setupListener('editableKeydown');
this.listeners[name] = true;
break;
case 'editableKeydownTab':
// Detecting keydown for TAB on the contenteditable
this.setupListener('editableKeydown');
this.listeners[name] = true;
break;
case 'editableKeydownDelete':
// Detecting keydown for DELETE/BACKSPACE on the contenteditables
this.setupListener('editableKeydown');
this.listeners[name] = true;
break;
case 'editableMouseover':
// Detecting mouseover on the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'mouseover', this.handleMouseover.bind(this));
}, this);
this.listeners[name] = true;
break;
case 'editableDrag':
// Detecting dragover and dragleave on the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'dragover', this.handleDragging.bind(this));
this.attachDOMEvent(element, 'dragleave', this.handleDragging.bind(this));
}, this);
this.listeners[name] = true;
break;
case 'editableDrop':
// Detecting drop on the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'drop', this.handleDrop.bind(this));
}, this);
this.listeners[name] = true;
break;
case 'editablePaste':
// Detecting paste on the contenteditables
this.base.elements.forEach(function (element) {
this.attachDOMEvent(element, 'paste', this.handlePaste.bind(this));
}, this);
this.listeners[name] = true;
break;
}
this.listeners[name] = true;
},

focusElement: function (element) {
Expand Down

0 comments on commit 9ecee36

Please sign in to comment.