function UndoListener(options) {
	if (!options.el instanceof HTMLElement) return;
	this.el = options.el;
	this.callback = options.callback || function() {};
	this.init();
}

UndoListener.prototype = {
	constructor: UndoListener,
	addListeners: function() {
		this.listeners = {
			keydown: e => (this.expectedChange = this.eventChecker(e)),
			cut: e => (this.expectedChange = true),
			paste: e => (this.expectedChange = true)
		};
		return this.listen(true);
	},
	addObserver: function() {
		this.observer = new MutationObserver(mt => {
			console.log("expectedChange", this.expectedChange);
			if (!this.expectedChange) {
				this.expectedChange = true;
				this.observer.disconnect();
				this.callback.call(this.el, {
					original: [...mt].shift().oldValue,
					current: this.el.innerText
				});
				this.addObserver();
			}
			this.expectedChange = false;
		});

		this.observer.observe(this.el, {
			characterData: true,
			subtree: true,
			characterDataOldValue: true
		});
		return this;
	},
	destroy: function() {
		this.observer.disconnect();
		return this.listen(false);
	},
	eventChecker: function(event) {
		return !(~['z', 'y'].indexOf(event.key) && (event.ctrlKey || event.metaKey));
	},
	init: function() {
		this.expectedChange = false;
		this.addListeners().addObserver();
		return this;
	},
	listen: function(bool) {
		Object.keys(this.listeners).forEach(type =>
			this.el[bool ? 'addEventListener' : 'removeEventListener'](type, this.listeners[type])
		);
		return this;
	}
};

// just a reference to the checkbox; not needed for the contstructor
var checkbox = document.getElementById("event");

// instantiate the listener on the element with a callback
var catcher = new UndoListener({
	// element to listen to
	el: document.querySelector(".container"),
	// callback to fire once undo/redo has fired, sends an object with original and current values
	callback: function(val) {
		console.log("callback fired", val);
		checkbox.checked = true;
	}
});