diff src/sceditor.js @ 18:1334920263a2

remove more object-oriented code
author Franklin Schmidt <fschmidt@gmail.com>
date Mon, 08 Aug 2022 16:20:23 -0600
parents a199722647d0
children 13df5ac9b34b
line wrap: on
line diff
--- a/src/sceditor.js	Mon Aug 08 12:28:55 2022 -0600
+++ b/src/sceditor.js	Mon Aug 08 16:20:23 2022 -0600
@@ -264,7 +264,7 @@
 	}
 
 	/**
-	 * For on() and off() if to add/remove the event
+	 * For onEvent() and offEvent() if to add/remove the event
 	 * to the capture phase
 	 *
 	 * @type {boolean}
@@ -284,10 +284,10 @@
 	 * @param {string} [selector]
 	 * @param {function(Object)} fn
 	 * @param {boolean} [capture=false]
-	 * @see off()
+	 * @see offEvent()
 	 */
 	// eslint-disable-next-line max-params
-	function on(node, events, selector, fn, capture) {
+	function onEvent(node, events, selector, fn, capture) {
 		events.split(' ').forEach(function (event) {
 			var handler;
 
@@ -296,7 +296,7 @@
 					var target = e.target;
 					while (target && target !== node) {
 						if (is(target, selector)) {
-							fn.call(target, e);
+							fn(target, e);
 							return;
 						}
 
@@ -322,10 +322,10 @@
 	 * @param {string} [selector]
 	 * @param {function(Object)} fn
 	 * @param {boolean} [capture=false]
-	 * @see on()
+	 * @see onEvent()
 	 */
 	// eslint-disable-next-line max-params
-	function off(node, events, selector, fn, capture) {
+	function offEvent(node, events, selector, fn, capture) {
 		events.split(' ').forEach(function (event) {
 			var handler;
 
@@ -481,8 +481,13 @@
 		var result = false;
 
 		if (node && node.nodeType === ELEMENT_NODE) {
-			result = (node.matches || node.msMatchesSelector ||
-				node.webkitMatchesSelector).call(node, selector);
+			if(node.matches) {
+				result = node.matches(selector);
+			} else if(node.msMatchesSelector) {
+				result = node.msMatchesSelector(selector);
+			} else if(node.webkitMatchesSelector) {
+				result = node.webkitMatchesSelector(selector);
+			}
 		}
 
 		return result;
@@ -2037,8 +2042,8 @@
 			_dropDown: function (editor, caller, callback) {
 				var	content = createElement('div');
 
-				on(content, 'click', 'a', function (e) {
-					callback(data(this, 'font'));
+				onEvent(content, 'click', 'a', function (target, e) {
+					callback(data(target, 'font'));
 					editor.closeDropDown(true);
 					e.preventDefault();
 				});
@@ -2064,8 +2069,8 @@
 			_dropDown: function (editor, caller, callback) {
 				var	content = createElement('div');
 
-				on(content, 'click', 'a', function (e) {
-					callback(data(this, 'size'));
+				onEvent(content, 'click', 'a', function (target, e) {
+					callback(data(target, 'size'));
 					editor.closeDropDown(true);
 					e.preventDefault();
 				});
@@ -2112,8 +2117,8 @@
 
 				appendChild(content, parseHTML(cmd._htmlCache));
 
-				on(content, 'click', 'a', function (e) {
-					callback(data(this, 'color'));
+				onEvent(content, 'click', 'a', function (target, e) {
+					callback(data(target, 'color'));
 					editor.closeDropDown(true);
 					e.preventDefault();
 				});
@@ -2172,7 +2177,7 @@
 					insert: editor._('Insert')
 				}, true));
 
-				on(content, 'click', '.button', function (e) {
+				onEvent(content, 'click', '.button', function (target, e) {
 					val = find(content, '#txt')[0].value;
 
 					if (val) {
@@ -2284,7 +2289,7 @@
 					insert: editor._('Insert')
 				}, true));
 
-				on(content, 'click', '.button', function (e) {
+				onEvent(content, 'click', '.button', function (target, e) {
 					var	rows = Number(find(content, '#rows')[0].value),
 						cols = Number(find(content, '#cols')[0].value),
 						html = '<table>';
@@ -2348,7 +2353,7 @@
 
 				urlInput.value = selected;
 
-				on(content, 'click', '.button', function (e) {
+				onEvent(content, 'click', '.button', function (target, e) {
 					if (urlInput.value) {
 						cb(
 							urlInput.value,
@@ -2402,7 +2407,7 @@
 					insert: editor._('Insert')
 				}, true));
 
-				on(content, 'click', '.button', function (e) {
+				onEvent(content, 'click', '.button', function (target, e) {
 					var email = find(content, '#email')[0].value;
 
 					if (email) {
@@ -2450,7 +2455,7 @@
 
 				var linkInput = find(content, '#link')[0];
 
-				function insertUrl(e) {
+				function insertUrl(target,e) {
 					if (linkInput.value) {
 						cb(linkInput.value, find(content, '#des')[0].value);
 					}
@@ -2459,8 +2464,8 @@
 					e.preventDefault();
 				}
 
-				on(content, 'click', '.button', insertUrl);
-				on(content, 'keypress', function (e) {
+				onEvent(content, 'click', '.button', insertUrl);
+				onEvent(content, 'keypress', function (target, e) {
 					// 13 = enter key
 					if (e.which === 13 && linkInput.value) {
 						insertUrl(e);
@@ -2558,8 +2563,8 @@
 
 					perLine = Math.sqrt(Object.keys(emoticons).length);
 
-					on(content, 'click', 'img', function (e) {
-						editor.insert(startSpace + attr(this, 'alt') + endSpace,
+					onEvent(content, 'click', 'img', function (target, e) {
+						editor.insert(startSpace + attr(target, 'alt') + endSpace,
 							null, false).closeDropDown(true);
 
 						e.preventDefault();
@@ -2586,7 +2591,7 @@
 						appendChild(moreLink,
 							document.createTextNode(editor._('More')));
 
-						on(moreLink, 'click', function (e) {
+						onEvent(moreLink, 'click', function (e) {
 							editor.createDropDown(
 								caller, 'more-emoticons', createContent(true)
 							);
@@ -2619,7 +2624,7 @@
 					insert: editor._('Insert')
 				}, true));
 
-				on(content, 'click', '.button', function (e) {
+				onEvent(content, 'click', '.button', function (target, e) {
 					var val = find(content, '#link')[0].value;
 					var idMatch = val.match(/(?:v=|v\/|embed\/|youtu.be\/)?([a-zA-Z0-9_-]{11})/);
 					var timeMatch = val.match(/[&|?](?:star)?t=((\d+[hms]?){1,3})/);
@@ -5882,7 +5887,7 @@
 			updateActiveButtons();
 
 			var loaded = function () {
-				off(globalWin, 'load', loaded);
+				offEvent(globalWin, 'load', loaded);
 
 				if (options.autofocus) {
 					autofocus(!!options.autofocusEnd);
@@ -5896,7 +5901,7 @@
 					format.onReady.call(base);
 				}
 			};
-			on(globalWin, 'load', loaded);
+			onEvent(globalWin, 'load', loaded);
 			if (globalDoc.readyState === 'complete') {
 				loaded();
 			}
@@ -5985,7 +5990,7 @@
 			// iframe overflow fix for iOS
 			if (ios) {
 				height(wysiwygBody, '100%');
-				on(wysiwygBody, 'touchend', base.focus);
+				onEvent(wysiwygBody, 'touchend', base.focus);
 			}
 
 			var tabIndex = attr(original, 'tabindex');
@@ -6014,8 +6019,8 @@
 		initOptions = function () {
 			// auto-update original textbox on blur if option set to true
 			if (options.autoUpdate) {
-				on(wysiwygBody, 'blur', autoUpdate);
-				on(sourceEditor, 'blur', autoUpdate);
+				onEvent(wysiwygBody, 'blur', autoUpdate);
+				onEvent(sourceEditor, 'blur', autoUpdate);
 			}
 
 			if (options.rtl === null) {
@@ -6026,8 +6031,8 @@
 
 			if (options.autoExpand) {
 				// Need to update when images (or anything else) loads
-				on(wysiwygBody, 'load', autoExpand, EVENT_CAPTURE);
-				on(wysiwygBody, 'input keyup', autoExpand);
+				onEvent(wysiwygBody, 'load', autoExpand, EVENT_CAPTURE);
+				onEvent(wysiwygBody, 'input keyup', autoExpand);
 			}
 
 			if (options.resizeEnabled) {
@@ -6051,55 +6056,55 @@
 				'selectionchange' :
 				'keyup focus blur contextmenu mouseup touchend click';
 
-			on(globalDoc, 'click', handleDocumentClick);
+			onEvent(globalDoc, 'click', handleDocumentClick);
 
 			if (form) {
-				on(form, 'reset', handleFormReset);
-				on(form, 'submit', base.updateOriginal, EVENT_CAPTURE);
-			}
-
-			on(window, 'pagehide', base.updateOriginal);
-			on(window, 'pageshow', handleFormReset);
-			on(wysiwygBody, 'keypress', handleKeyPress);
-			on(wysiwygBody, 'keydown', handleKeyDown);
-			on(wysiwygBody, 'keydown', handleBackSpace);
-			on(wysiwygBody, 'keyup', appendNewLine);
-			on(wysiwygBody, 'blur', valueChangedBlur);
-			on(wysiwygBody, 'keyup', valueChangedKeyUp);
-			on(wysiwygBody, 'paste', handlePasteEvt);
-			on(wysiwygBody, 'cut copy', handleCutCopyEvt);
-			on(wysiwygBody, compositionEvents, handleComposition);
-			on(wysiwygBody, checkSelectionEvents, checkSelectionChanged);
-			on(wysiwygBody, eventsToForward, handleEvent);
+				onEvent(form, 'reset', handleFormReset);
+				onEvent(form, 'submit', base.updateOriginal, EVENT_CAPTURE);
+			}
+
+			onEvent(window, 'pagehide', base.updateOriginal);
+			onEvent(window, 'pageshow', handleFormReset);
+			onEvent(wysiwygBody, 'keypress', handleKeyPress);
+			onEvent(wysiwygBody, 'keydown', handleKeyDown);
+			onEvent(wysiwygBody, 'keydown', handleBackSpace);
+			onEvent(wysiwygBody, 'keyup', appendNewLine);
+			onEvent(wysiwygBody, 'blur', valueChangedBlur);
+			onEvent(wysiwygBody, 'keyup', valueChangedKeyUp);
+			onEvent(wysiwygBody, 'paste', handlePasteEvt);
+			onEvent(wysiwygBody, 'cut copy', handleCutCopyEvt);
+			onEvent(wysiwygBody, compositionEvents, handleComposition);
+			onEvent(wysiwygBody, checkSelectionEvents, checkSelectionChanged);
+			onEvent(wysiwygBody, eventsToForward, handleEvent);
 
 			if (options.emoticonsCompat && globalWin.getSelection) {
-				on(wysiwygBody, 'keyup', emoticonsCheckWhitespace);
-			}
-
-			on(wysiwygBody, 'blur', function () {
+				onEvent(wysiwygBody, 'keyup', emoticonsCheckWhitespace);
+			}
+
+			onEvent(wysiwygBody, 'blur', function () {
 				if (!base.val()) {
 					addClass(wysiwygBody, 'placeholder');
 				}
 			});
 
-			on(wysiwygBody, 'focus', function () {
+			onEvent(wysiwygBody, 'focus', function () {
 				removeClass(wysiwygBody, 'placeholder');
 			});
 
-			on(sourceEditor, 'blur', valueChangedBlur);
-			on(sourceEditor, 'keyup', valueChangedKeyUp);
-			on(sourceEditor, 'keydown', handleKeyDown);
-			on(sourceEditor, compositionEvents, handleComposition);
-			on(sourceEditor, eventsToForward, handleEvent);
-
-			on(wysiwygDocument, 'mousedown', handleMouseDown);
-			on(wysiwygDocument, checkSelectionEvents, checkSelectionChanged);
-			on(wysiwygDocument, 'keyup', appendNewLine);
-
-			on(editorContainer, 'selectionchanged', checkNodeChanged);
-			on(editorContainer, 'selectionchanged', updateActiveButtons);
+			onEvent(sourceEditor, 'blur', valueChangedBlur);
+			onEvent(sourceEditor, 'keyup', valueChangedKeyUp);
+			onEvent(sourceEditor, 'keydown', handleKeyDown);
+			onEvent(sourceEditor, compositionEvents, handleComposition);
+			onEvent(sourceEditor, eventsToForward, handleEvent);
+
+			onEvent(wysiwygDocument, 'mousedown', handleMouseDown);
+			onEvent(wysiwygDocument, checkSelectionEvents, checkSelectionChanged);
+			onEvent(wysiwygDocument, 'keyup', appendNewLine);
+
+			onEvent(editorContainer, 'selectionchanged', checkNodeChanged);
+			onEvent(editorContainer, 'selectionchanged', updateActiveButtons);
 			// Custom events to forward
-			on(
+			onEvent(
 				editorContainer,
 				'selectionchanged valuechanged nodechanged pasteraw paste',
 				handleEvent
@@ -6154,7 +6159,7 @@
 					button._sceTxtMode = !!command.txtExec;
 					button._sceWysiwygMode = !!command.exec;
 					toggleClass(button, 'disabled', !command.exec);
-					on(button, 'click', function (e) {
+					onEvent(button, 'click', function (e) {
 						if (!hasClass(button, 'disabled')) {
 							handleCommand(button, command);
 						}
@@ -6163,7 +6168,7 @@
 						e.preventDefault();
 					});
 					// Prevent editor losing focus when button clicked
-					on(button, 'mousedown', function (e) {
+					onEvent(button, 'mousedown', function (e) {
 						base.closeDropDown();
 						e.preventDefault();
 					});
@@ -6291,8 +6296,8 @@
 
 				hide(cover);
 				removeClass(editorContainer, 'resizing');
-				off(globalDoc, moveEvents, mouseMoveFunc);
-				off(globalDoc, endEvents, mouseUpFunc);
+				offEvent(globalDoc, moveEvents, mouseMoveFunc);
+				offEvent(globalDoc, endEvents, mouseUpFunc);
 
 				e.preventDefault();
 			};
@@ -6309,7 +6314,7 @@
 			appendChild(editorContainer, cover);
 			hide(cover);
 
-			on(grip, 'touchstart mousedown', function (e) {
+			onEvent(grip, 'touchstart mousedown', function (e) {
 				// iOS uses window.event
 				if (e.type === 'touchstart') {
 					e      = globalWin.event;
@@ -6326,8 +6331,8 @@
 
 				addClass(editorContainer, 'resizing');
 				show(cover);
-				on(globalDoc, moveEvents, mouseMoveFunc);
-				on(globalDoc, endEvents, mouseUpFunc);
+				onEvent(globalDoc, moveEvents, mouseMoveFunc);
+				onEvent(globalDoc, endEvents, mouseUpFunc);
 
 				e.preventDefault();
 			});
@@ -6791,16 +6796,16 @@
 				remove(dropdown);
 			}
 
-			off(globalDoc, 'click', handleDocumentClick);
+			offEvent(globalDoc, 'click', handleDocumentClick);
 
 			var form = original.form;
 			if (form) {
-				off(form, 'reset', handleFormReset);
-				off(form, 'submit', base.updateOriginal, EVENT_CAPTURE);
-			}
-
-			off(window, 'pagehide', base.updateOriginal);
-			off(window, 'pageshow', handleFormReset);
+				offEvent(form, 'reset', handleFormReset);
+				offEvent(form, 'submit', base.updateOriginal, EVENT_CAPTURE);
+			}
+
+			offEvent(window, 'pagehide', base.updateOriginal);
+			offEvent(window, 'pageshow', handleFormReset);
 			remove(sourceEditor);
 			remove(toolbar);
 			remove(editorContainer);
@@ -6848,7 +6853,7 @@
 			css(dropdown, dropDownCss);
 			appendChild(dropdown, content);
 			appendChild(editorContainer, dropdown);
-			on(dropdown, 'click focusin', function (e) {
+			onEvent(dropdown, 'click focusin', function (e) {
 				// stop clicks within the dropdown from being handled
 				e.stopPropagation();
 			});
@@ -8433,7 +8438,7 @@
 			options.emoticonsEnabled = enable;
 
 			if (enable) {
-				on(wysiwygBody, 'keypress', emoticonsKeyPress);
+				onEvent(wysiwygBody, 'keypress', emoticonsKeyPress);
 
 				if (!base.sourceMode()) {
 					rangeHelper.saveRange();
@@ -8453,7 +8458,7 @@
 					img.parentNode.replaceChild(textNode, img);
 				});
 
-				off(wysiwygBody, 'keypress', emoticonsKeyPress);
+				offEvent(wysiwygBody, 'keypress', emoticonsKeyPress);
 
 				triggerValueChanged();
 			}