@lowentry/utils 0.1.1 → 0.2.2

package/LeUtils.js

@@ -1,19 +1,52 @@
-import FastDeepEqual from 'fast-deep-equal';
-import {ISSET, IS_OBJECT, STRING, INT, FLOAT, FLOAT_ANY, INT_LAX} from './LeTypes.js';
+import {ISSET, IS_OBJECT, STRING, INT_LAX, FLOAT_LAX, INT_LAX_ANY, FLOAT_LAX_ANY} from './LeTypes.js';
 
 
-export const LeUtils = {
-	equals:FastDeepEqual,
-	
-	getCleanErrorMessage:
-		(error) =>
+/**
+ * @param {LeUtils~TransactionalValue} transactionalValue
+ */
+const checkTransactionalValue = (transactionalValue) =>
+{
+	if(!LeUtils.isTransactionalValueValid(transactionalValue))
+	{
+		console.error('The given value is not a valid TransactionalValue:');
+		console.error(transactionalValue);
+		throw new Error('The given value is not a valid TransactionalValue');
+	}
+};
+
+/**
+ * @param {LeUtils~TransactionalValue} transactionalValue
+ * @param {string} changeId
+ * @returns {{index:number, value:*}|null}
+ */
+const findTransactionalValueChange = (transactionalValue, changeId) =>
+{
+	for(let i = 0; i < transactionalValue.changes.length; i++)
+	{
+		const change = transactionalValue.changes[i];
+		if(change.id === changeId)
 		{
-			const message = STRING(((typeof error === 'string') ? error : (error.message ?? JSON.stringify(error))));
-			const messageParts = message.split('threw an error:');
-			return messageParts[messageParts.length - 1].trim();
-		},
-	
-	/** expects a version string like "1.2.3" or "1.2.3 r0" **/
+			return {index:i, value:change.value};
+		}
+	}
+	return null;
+};
+
+
+export const LeUtils = {
+	/**
+	 * Parses the given version string, and returns an object with the major, minor, and patch numbers, as well as some comparison functions.
+	 *
+	 * Expects a version string such as:
+	 * - "1"
+	 * - "1.2"
+	 * - "1.2.3"
+	 * - "1.2.3 anything"
+	 * - "1.2.3-anything"
+	 *
+	 * @param {string|*} versionString
+	 * @returns {{major: (number),  minor: (number),  patch: (number),  toString: (function(): string),  equals: (function(string|*): boolean),  smallerThan: (function(string|*): boolean),  smallerThanOrEquals: (function(string|*): boolean),  largerThan: (function(string|*): boolean),  largerThanOrEquals: (function(string|*): boolean)}}
+	 */
 	parseVersionString:
 		(versionString) =>
 		{
@@ -104,6 +137,15 @@ export const LeUtils = {
 			return THIS;
 		},
 	
+	/**
+	 * Returns true if the array or object contains the given value.
+	 *
+	 * Values are compared by casting both of them to a string.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {*} value
+	 * @returns {boolean}
+	 */
 	contains:
 		(array, value) =>
 		{
@@ -124,6 +166,15 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * Returns true if the array or object contains the given value.
+	 *
+	 * Values are compared by casting both of them to a string, and then lowercasing them.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {*} value
+	 * @returns {boolean}
+	 */
 	containsCaseInsensitive:
 		(array, value) =>
 		{
@@ -144,6 +195,187 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * Returns true if the array or object contains all the given values.
+	 *
+	 * Values are compared by casting both of them to a string.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsAll:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return false;
+			}
+			let result = true;
+			LeUtils.each(values, function(value)
+			{
+				if(!LeUtils.contains(array, value))
+				{
+					result = false;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * Returns true if the array or object contains all the given values.
+	 *
+	 * Values are compared by casting both of them to a string, and then lowercasing them.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsAllCaseInsensitive:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return false;
+			}
+			let result = true;
+			LeUtils.each(values, function(value)
+			{
+				if(!LeUtils.containsCaseInsensitive(array, value))
+				{
+					result = false;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * Returns true if the array or object contains any of the given values.
+	 *
+	 * Values are compared by casting both of them to a string.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsAny:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return false;
+			}
+			let result = false;
+			LeUtils.each(values, function(value)
+			{
+				if(LeUtils.contains(array, value))
+				{
+					result = true;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * Returns true if the array or object contains any of the given values.
+	 *
+	 * Values are compared by casting both of them to a string, and then lowercasing them.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsAnyCaseInsensitive:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return false;
+			}
+			let result = false;
+			LeUtils.each(values, function(value)
+			{
+				if(LeUtils.containsCaseInsensitive(array, value))
+				{
+					result = true;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * Returns true if the array or object contains none of the given values.
+	 *
+	 * Values are compared by casting both of them to a string.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsNone:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return true;
+			}
+			let result = true;
+			LeUtils.each(values, function(value)
+			{
+				if(LeUtils.contains(array, value))
+				{
+					result = false;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * Returns true if the array or object contains none of the given values.
+	 *
+	 * Values are compared by casting both of them to a string, and then lowercasing them.
+	 *
+	 * @param {array|object|Function} array
+	 * @param {array|object|Function} values
+	 * @returns {boolean}
+	 */
+	containsNoneCaseInsensitive:
+		(array, values) =>
+		{
+			if(!array)
+			{
+				return true;
+			}
+			let result = true;
+			LeUtils.each(values, function(value)
+			{
+				if(LeUtils.containsCaseInsensitive(array, value))
+				{
+					result = false;
+					return false;
+				}
+			});
+			return result;
+		},
+	
+	/**
+	 * @callback LeUtils~__eachCallback
+	 * @param {*} value
+	 * @param {*} index
+	 */
+	/**
+	 * Loops through each element in the given array or object, and calls the callback for each element.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__eachCallback} callback
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]|object|Function}
+	 */
 	each:
 		(elements, callback, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -180,6 +412,115 @@ export const LeUtils = {
 			return elements;
 		},
 	
+	/**
+	 * Like LeUtils.each(), except that it expects an async callback.
+	 *
+	 * @param {*[]|object|function} elements
+	 * @param {LeUtils~__eachCallback} asyncCallback
+	 * @param {number} [optionalParallelCount]
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]|object|function}
+	 */
+	eachAsync:
+		(() =>
+		{
+			const eachAsyncParallel = async (elements, asyncCallback, optionalParallelCount, optionalSkipHasOwnPropertyCheck) =>
+			{
+				let promises = [];
+				let doBreak = false;
+				await LeUtils.eachAsync(elements, async (element, index) =>
+				{
+					while(promises.length > optionalParallelCount)
+					{
+						let newPromises = [];
+						LeUtils.each(promises, (promise) =>
+						{
+							if(!promise.__lowentry_utils__promise_is_done__)
+							{
+								newPromises.push(promise);
+							}
+						});
+						promises = newPromises;
+						if(promises.length > optionalParallelCount)
+						{
+							await Promise.any(promises);
+						}
+					}
+					
+					if(doBreak)
+					{
+						return false;
+					}
+					
+					const promise = (async () =>
+					{
+						if((await asyncCallback.call(element, element, index)) === false)
+						{
+							doBreak = true;
+						}
+						promise.__lowentry_utils__promise_is_done__ = true;
+					})();
+					promises.push(promise);
+				}, optionalSkipHasOwnPropertyCheck);
+				await Promise.all(promises);
+				return elements;
+			};
+			
+			return async (elements, asyncCallback, parallelCount = 1, optionalSkipHasOwnPropertyCheck = false) =>
+			{
+				if((elements !== null) && (typeof elements !== 'undefined'))
+				{
+					parallelCount = INT_LAX(parallelCount);
+					if(parallelCount > 1)
+					{
+						return await eachAsyncParallel(elements, asyncCallback, parallelCount, optionalSkipHasOwnPropertyCheck);
+					}
+					
+					if(Array.isArray(elements))
+					{
+						for(let index = 0; index < elements.length; index++)
+						{
+							if((await asyncCallback.call(elements[index], elements[index], index)) === false)
+							{
+								break;
+							}
+						}
+					}
+					else if((typeof elements === 'object') || (typeof elements === 'function'))
+					{
+						for(let index in elements)
+						{
+							if((optionalSkipHasOwnPropertyCheck === true) || Object.prototype.hasOwnProperty.call(elements, index))
+							{
+								if((await asyncCallback.call(elements[index], elements[index], index)) === false)
+								{
+									break;
+								}
+							}
+						}
+					}
+					else
+					{
+						console.warn('Executed LeUtils.eachAsync() on an invalid type: [' + (typeof elements) + ']', elements);
+					}
+				}
+				return elements;
+			};
+		})(),
+	
+	/**
+	 * @callback LeUtils~__filterCallback
+	 * @param {*} value
+	 * @param {*} index
+	 */
+	/**
+	 * Loops through the given elements, and returns a new array or object, with only the elements that didn't return false from the callback.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__filterCallback} callback
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]|object|Function}
+	 */
 	filter:
 		(elements, callback, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -220,6 +561,19 @@ export const LeUtils = {
 			return elements;
 		},
 	
+	/**
+	 * @callback LeUtils~__mapCallback
+	 * @param {*} value
+	 * @param {*} index
+	 */
+	/**
+	 * Loops through the given elements, and returns a new array or object, with the elements that were returned from the callback.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__mapCallback} callback
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]|object|Function}
+	 */
 	map:
 		(elements, callback, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -254,6 +608,19 @@ export const LeUtils = {
 			return elements;
 		},
 	
+	/**
+	 * @callback LeUtils~__mapToArrayCallback
+	 * @param {*} value
+	 * @param {*} index
+	 */
+	/**
+	 * Loops through the given elements, and returns a new array, with the elements that were returned from the callback. Always returns an array.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__mapToArrayCallback} callback
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]}
+	 */
 	mapToArray:
 		(elements, callback, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -285,6 +652,20 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * @callback LeUtils~__mapToArraySortedCallback
+	 * @param {*} value
+	 * @param {*} index
+	 */
+	/**
+	 * Loops through the given elements, and returns a new array, with the elements that were returned from the callback. The elements will be sorted by the result from the given comparator. Always returns an array.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__sortKeysComparatorCallback} comparator
+	 * @param {LeUtils~__mapToArraySortedCallback} callback
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]}
+	 */
 	mapToArraySorted:
 		(elements, comparator, callback, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -297,6 +678,19 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * @callback LeUtils~__sortKeysComparatorCallback
+	 * @param {*} elementA
+	 * @param {*} elementB
+	 */
+	/**
+	 * Loops through the given elements, and returns a new array, with the keys from the given elements, sorted by the result from the given comparator. Always returns an array.
+	 *
+	 * @param {*[]|object|Function} elements
+	 * @param {LeUtils~__sortKeysComparatorCallback} comparator
+	 * @param {boolean} [optionalSkipHasOwnPropertyCheck]
+	 * @returns {*[]}
+	 */
 	sortKeys:
 		(elements, comparator, optionalSkipHasOwnPropertyCheck = false) =>
 		{
@@ -329,57 +723,14 @@ export const LeUtils = {
 			return keys;
 		},
 	
-	compare:
-		(a, b) =>
-		{
-			if(a < b)
-			{
-				return -1;
-			}
-			if(a > b)
-			{
-				return 1;
-			}
-			return 0;
-		},
-	
-	compareNumbers:
-		(a, b) => a - b,
-	
-	compareNumericStrings:
-		(a, b) =>
-		{
-			a = STRING(a).trim();
-			b = STRING(b).trim();
-			if(a.length === b.length)
-			{
-				return (a < b) ? -1 : ((a > b) ? 1 : 0);
-			}
-			return (a.length < b.length) ? -1 : 1;
-		},
-	
-	isEmptyObject:
-		(obj) =>
-		{
-			// noinspection LoopStatementThatDoesntLoopJS
-			for(let name in obj)
-			{
-				return false;
-			}
-			return true;
-		},
-	
-	getObjectFieldsCount:
-		(obj) =>
-		{
-			let count = 0;
-			for(let name in obj)
-			{
-				count++;
-			}
-			return count;
-		},
-	
+	/**
+	 * Turns the given value(s) into a 1 dimensional array.
+	 *
+	 * Does the same thing as Array.flat(Infinity).
+	 *
+	 * @param {*} array
+	 * @returns {*[]}
+	 */
 	flattenArray:
 		(() =>
 		{
@@ -411,11 +762,97 @@ export const LeUtils = {
 			};
 		})(),
 	
-	isGeneratorFunction:
-		(() =>
-		{
-			const GeneratorFunction = function* ()
-			{
+	/**
+	 * Compares two values. Primarily used for sorting.
+	 *
+	 * @param {*} a
+	 * @param {*} b
+	 * @returns {number}
+	 */
+	compare:
+		(a, b) => (a < b) ? -1 : ((a > b) ? 1 : 0),
+	
+	/**
+	 * Compares two numbers. Primarily used for sorting.
+	 *
+	 * @param {number} a
+	 * @param {number} b
+	 * @returns {number}
+	 */
+	compareNumbers:
+		(a, b) => a - b,
+	
+	/**
+	 * Compares two numeric strings. Primarily used for sorting.
+	 *
+	 * @param {string|number} a
+	 * @param {string|number} b
+	 * @returns {number}
+	 */
+	compareNumericStrings:
+		(a, b) =>
+		{
+			a = STRING(a).trim();
+			b = STRING(b).trim();
+			if(a.length === b.length)
+			{
+				return (a < b) ? -1 : ((a > b) ? 1 : 0);
+			}
+			return (a.length < b.length) ? -1 : 1;
+		},
+	
+	/**
+	 * Returns true if the given object is empty, false otherwise.
+	 *
+	 * @param {object} obj
+	 * @param [optionalSkipHasOwnPropertyCheck]
+	 * @returns {boolean}
+	 */
+	isEmptyObject:
+		(obj, optionalSkipHasOwnPropertyCheck = false) =>
+		{
+			for(let field in obj)
+			{
+				if((optionalSkipHasOwnPropertyCheck === true) || Object.prototype.hasOwnProperty.call(obj, field))
+				{
+					return false;
+				}
+			}
+			return true;
+		},
+	
+	/**
+	 * Returns the number of fields in the given object.
+	 *
+	 * @param {object} obj
+	 * @param [optionalSkipHasOwnPropertyCheck]
+	 * @returns {number}
+	 */
+	getObjectFieldsCount:
+		(obj, optionalSkipHasOwnPropertyCheck = false) =>
+		{
+			let count = 0;
+			for(let field in obj)
+			{
+				if((optionalSkipHasOwnPropertyCheck === true) || Object.prototype.hasOwnProperty.call(obj, field))
+				{
+					count++;
+				}
+			}
+			return count;
+		},
+	
+	/**
+	 * Returns true if the given function is a generator function (like: "function* (){}"), returns false otherwise.
+	 *
+	 * @param {Function} func
+	 * @returns {boolean}
+	 */
+	isGeneratorFunction:
+		(() =>
+		{
+			const GeneratorFunction = function* ()
+			{
 			}.constructor;
 			
 			const AsyncGeneratorFunction = async function* ()
@@ -426,7 +863,7 @@ export const LeUtils = {
 			{
 			}.constructor;
 			
-			const PossibleGeneratorFunctionNames = Array.from(new Set(['GeneratorFunction', 'AsyncFunction', 'AsyncGeneratorFunction', GeneratorFunction.name, GeneratorFunction.displayName, AsyncGeneratorFunction.name, AsyncGeneratorFunction.displayName])).filter(function(element)
+			const PossibleGeneratorFunctionNames = Array.from(new Set(['GeneratorFunction', 'AsyncFunction', 'AsyncGeneratorFunction', GeneratorFunction.name, GeneratorFunction.displayName, AsyncGeneratorFunction.name, AsyncGeneratorFunction.displayName])).filter((element) =>
 			{
 				return (element && (element !== RegularFunction.name) && (element !== RegularFunction.displayName));
 			});
@@ -446,10 +883,70 @@ export const LeUtils = {
 			};
 		})(),
 	
+	/**
+	 * @callback LeUtils~__setTimeoutCallback
+	 * @param {number} deltaTime
+	 */
+	/**
+	 * Executes the callback after the given number of milliseconds. Passes the elapsed time in seconds to the callback.
+	 *
+	 * To cancel the timeout, call remove() on the result of this function (example: "const timeoutHandler = LeUtils.setTimeout((deltaTime)=>{}, 1000); timeoutHandler.remove();")
+	 *
+	 * @param {LeUtils~__setTimeoutCallback} callback ([number] deltaTime)
+	 * @param {number} ms
+	 * @returns {{remove:Function}}
+	 */
+	setTimeout:
+		(callback, ms) =>
+		{
+			ms = FLOAT_LAX(ms);
+			
+			let lastTime = performance.now();
+			let handler = setTimeout(() =>
+			{
+				const currentTime = performance.now();
+				try
+				{
+					callback((currentTime - lastTime) / 1000);
+				}
+				catch(e)
+				{
+					console.error(e);
+				}
+				lastTime = currentTime;
+			}, ms);
+			
+			return {
+				remove:
+					() =>
+					{
+						if(handler !== null)
+						{
+							clearTimeout(handler);
+							handler = null;
+						}
+					},
+			};
+		},
+	
+	/**
+	 * @callback LeUtils~__setIntervalCallback
+	 * @param {number} deltaTime
+	 */
+	/**
+	 * Executes the callback every given number of milliseconds. Passes the time difference in seconds between the last frame and now to it.
+	 *
+	 * To remove the interval, call remove() on the result of this function (example: "const intervalHandler = LeUtils.setInterval((deltaTime)=>{}, 1000); intervalHandler.remove();")
+	 *
+	 * @param {LeUtils~__setIntervalCallback} callback ([number] deltaTime)
+	 * @param {number} [intervalMs]
+	 * @param {boolean} [fireImmediately]
+	 * @returns {{remove:Function}}
+	 */
 	setInterval:
-		(callback, intervalMs, fireImmediately) =>
+		(callback, intervalMs = 1000, fireImmediately = false) =>
 		{
-			intervalMs = FLOAT_ANY(intervalMs, 1000);
+			intervalMs = FLOAT_LAX_ANY(intervalMs, 1000);
 			
 			if(fireImmediately)
 			{
@@ -466,7 +963,7 @@ export const LeUtils = {
 			let lastTime = performance.now();
 			let handler = setInterval(() =>
 			{
-				let currentTime = performance.now();
+				const currentTime = performance.now();
 				try
 				{
 					callback((currentTime - lastTime) / 1000);
@@ -491,34 +988,36 @@ export const LeUtils = {
 			};
 		},
 	
-	setAnimationFrameInterval:
-		(callback, intervalFrames, fireImmediately) =>
+	/**
+	 * @callback LeUtils~__setAnimationFrameTimeoutCallback
+	 * @param {number} deltaTime
+	 */
+	/**
+	 * Executes the callback after the given number of frames. Passes the elapsed time in seconds to the callback.
+	 *
+	 * To cancel the timeout, call remove() on the result of this function (example: "const timeoutHandler = LeUtils.setAnimationFrameTimeout((deltaTime){}, 5); timeoutHandler.remove();")
+	 *
+	 * @param {LeUtils~__setAnimationFrameTimeoutCallback} callback ([number] deltaTime)
+	 * @param {number} [frames]
+	 * @returns {{remove:Function}}
+	 */
+	setAnimationFrameTimeout:
+		(callback, frames = 1) =>
 		{
-			intervalFrames = INT(intervalFrames);
-			
-			if(fireImmediately)
-			{
-				try
-				{
-					callback(0);
-				}
-				catch(e)
-				{
-					console.error(e);
-				}
-			}
+			frames = INT_LAX_ANY(frames, 1);
 			
 			let run = true;
 			let requestAnimationFrameId = null;
 			let lastTime = performance.now();
-			let frames = intervalFrames;
 			const tick = () =>
 			{
 				if(run)
 				{
 					if(frames <= 0)
 					{
-						let currentTime = performance.now();
+						run = false;
+						requestAnimationFrameId = null;
+						const currentTime = performance.now();
 						try
 						{
 							callback((currentTime - lastTime) / 1000);
@@ -528,17 +1027,13 @@ export const LeUtils = {
 							console.error(e);
 						}
 						lastTime = currentTime;
-						frames = intervalFrames;
+						return;
 					}
 					frames--;
-					
-					if(run)
-					{
-						requestAnimationFrameId = window?.requestAnimationFrame(tick);
-					}
+					requestAnimationFrameId = (typeof window === 'undefined') ? setTimeout(tick, 1000 / 60) : requestAnimationFrame(tick);
 				}
 			};
-			window?.requestAnimationFrame(tick);
+			tick();
 			
 			return {
 				remove:
@@ -547,43 +1042,75 @@ export const LeUtils = {
 						run = false;
 						if(requestAnimationFrameId !== null)
 						{
-							cancelAnimationFrame(requestAnimationFrameId);
+							(typeof window === 'undefined') ? clearTimeout(requestAnimationFrameId) : cancelAnimationFrame(requestAnimationFrameId);
 							requestAnimationFrameId = null;
 						}
 					},
 			};
 		},
 	
-	setAnimationFrameTimeout:
-		(callback, frames) =>
+	/**
+	 * @callback LeUtils~__setAnimationFrameIntervalCallback
+	 * @param {number} deltaTime
+	 */
+	/**
+	 * Executes the callback every given number of frames. Passes the time difference in seconds between the last frame and now to it.
+	 *
+	 * To remove the interval, call remove() on the result of this function (example: "const intervalHandler = LeUtils.setAnimationFrameInterval((deltaTime)=>{}, 5); intervalHandler.remove();")
+	 *
+	 * @param {LeUtils~__setAnimationFrameIntervalCallback} callback ([number] deltaTime)
+	 * @param {number} [intervalFrames]
+	 * @param {boolean} [fireImmediately]
+	 * @returns {{remove:Function}}
+	 */
+	setAnimationFrameInterval:
+		(callback, intervalFrames = 1, fireImmediately = false) =>
 		{
-			frames = INT(frames);
+			intervalFrames = INT_LAX_ANY(intervalFrames, 1);
+			
+			if(fireImmediately)
+			{
+				try
+				{
+					callback(0);
+				}
+				catch(e)
+				{
+					console.error(e);
+				}
+			}
 			
 			let run = true;
 			let requestAnimationFrameId = null;
+			let lastTime = performance.now();
+			let frames = intervalFrames;
 			const tick = () =>
 			{
 				if(run)
 				{
 					if(frames <= 0)
 					{
-						run = false;
-						requestAnimationFrameId = null;
+						let currentTime = performance.now();
 						try
 						{
-							callback();
+							callback((currentTime - lastTime) / 1000);
 						}
 						catch(e)
 						{
 							console.error(e);
 						}
-						return;
+						lastTime = currentTime;
+						frames = intervalFrames;
 					}
 					frames--;
-					requestAnimationFrameId = window?.requestAnimationFrame(tick);
+					
+					if(run)
+					{
+						requestAnimationFrameId = (typeof window === 'undefined') ? setTimeout(tick, 1000 / 60) : requestAnimationFrame(tick);
+					}
 				}
 			};
-			tick();
+			(typeof window === 'undefined') ? setTimeout(tick, 1000 / 60) : requestAnimationFrame(tick);
 			
 			return {
 				remove:
@@ -592,35 +1119,45 @@ export const LeUtils = {
 						run = false;
 						if(requestAnimationFrameId !== null)
 						{
-							cancelAnimationFrame(requestAnimationFrameId);
+							(typeof window === 'undefined') ? clearTimeout(requestAnimationFrameId) : cancelAnimationFrame(requestAnimationFrameId);
 							requestAnimationFrameId = null;
 						}
 					},
 			};
 		},
 	
-	capitalize:
-		(string) =>
+	/**
+	 * Returns a promise, which will be resolved after the given number of milliseconds.
+	 *
+	 * @param {number} ms
+	 * @returns {Promise}
+	 */
+	promiseTimeout:
+		(ms) =>
 		{
-			string = STRING(string).trim();
-			if(string.length <= 0)
+			ms = FLOAT_LAX(ms);
+			if(ms <= 0)
 			{
-				return string;
+				return new Promise(resolve => resolve());
 			}
-			return string.charAt(0).toUpperCase() + string.slice(1);
+			return new Promise(resolve => setTimeout(resolve, ms));
 		},
 	
-	stopPropagation:
-		(callback) =>
+	/**
+	 * Returns a promise, which will be resolved after the given number of frames.
+	 *
+	 * @param {number} frames
+	 * @returns {Promise}
+	 */
+	promiseAnimationFrameTimeout:
+		(frames) =>
 		{
-			return (event) =>
+			frames = INT_LAX(frames);
+			if(frames <= 0)
 			{
-				event.stopPropagation();
-				if(typeof callback !== 'undefined')
-				{
-					callback();
-				}
-			};
+				return new Promise(resolve => resolve());
+			}
+			return new Promise(resolve => LeUtils.setAnimationFrameTimeout(resolve, frames));
 		},
 	
 	/**
@@ -631,13 +1168,19 @@ export const LeUtils = {
 	 * - Mobile: True
 	 * - Tablet: False
 	 * - Desktop: False
+	 *
+	 * @returns {boolean}
 	 */
 	platformIsMobile:
 		() =>
 		{
+			if(typeof window === 'undefined')
+			{
+				return false;
+			}
 			// noinspection JSDeprecatedSymbols, JSUnresolvedReference
 			/** navigator.userAgentData.mobile doesn't return the correct value on some platforms, so this is a work-around, code from:  http://detectmobilebrowsers.com **/
-			const a = STRING(window?.navigator?.userAgent || window?.navigator?.vendor || window?.opera || '');
+			const a = STRING(window.navigator?.userAgent || window.navigator?.vendor || window.opera || '');
 			const b = a.substring(0, 4);
 			return !!(
 				/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series([46])0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i
@@ -650,24 +1193,43 @@ export const LeUtils = {
 	/**
 	 * Returns true if the user has a cursor (mouse, touchpad, etc).
 	 * In this context, a cursor is defined as an input device that can hover over elements without necessarily interacting with them.
+	 *
+	 * @returns {boolean}
 	 */
 	platformHasCursor:
 		() =>
 		{
-			return !LeUtils.platformIsMobile() && !window?.matchMedia('(any-hover: none)')?.matches;
+			if(typeof window === 'undefined')
+			{
+				return true;
+			}
+			return !LeUtils.platformIsMobile() && !window.matchMedia('(any-hover: none)')?.matches;
 		},
 	
-	promiseTimeout:
-		(timeoutMs) =>
+	/**
+	 * Returns the given string, with the first character capitalized.
+	 *
+	 * @param {String} string
+	 * @returns {string}
+	 */
+	capitalize:
+		(string) =>
 		{
-			timeoutMs = FLOAT(timeoutMs);
-			if(timeoutMs <= 0)
+			string = STRING(string).trim();
+			if(string.length <= 0)
 			{
-				return new Promise(resolve => resolve());
+				return string;
 			}
-			return new Promise(resolve => setTimeout(resolve, timeoutMs));
+			return string.charAt(0).toUpperCase() + string.slice(1);
 		},
 	
+	/**
+	 * Returns true if the given string ends with any of the given characters or words.
+	 *
+	 * @param {string} string
+	 * @param {string|string[]} endingCharsStringOrArray
+	 * @returns {boolean}
+	 */
 	endsWithAny:
 		(string, endingCharsStringOrArray) =>
 		{
@@ -693,6 +1255,13 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * Returns true if the given string starts with any of the given characters or words.
+	 *
+	 * @param {string} string
+	 * @param {string|string[]} startingCharsStringOrArray
+	 * @returns {boolean}
+	 */
 	startsWithAny:
 		(string, startingCharsStringOrArray) =>
 		{
@@ -718,6 +1287,12 @@ export const LeUtils = {
 			return result;
 		},
 	
+	/**
+	 * Trims the end of the given string, by removing the given characters from it.
+	 *
+	 * @param {string} string
+	 * @param {string|string[]} trimCharsStringOrArray
+	 */
 	trimEnd:
 		(string, trimCharsStringOrArray) =>
 		{
@@ -749,6 +1324,12 @@ export const LeUtils = {
 			return string;
 		},
 	
+	/**
+	 * Trims the start of the given string, by removing the given characters from it.
+	 *
+	 * @param {string} string
+	 * @param {string|string[]} trimCharsStringOrArray
+	 */
 	trimStart:
 		(string, trimCharsStringOrArray) =>
 		{
@@ -780,10 +1361,22 @@ export const LeUtils = {
 			return string;
 		},
 	
+	/**
+	 * Trims the start and end of the given string, by removing the given characters from it.
+	 *
+	 * @param {string} string
+	 * @param {string|string[]} trimCharsStringOrArray
+	 */
 	trim:
 		(string, trimCharsStringOrArray) => LeUtils.trimEnd(LeUtils.trimStart(string, trimCharsStringOrArray), trimCharsStringOrArray),
 	
-	cleanupSentence:
+	/**
+	 * Returns the given string, trims the start and end, and makes sure it ends with a valid sentence ending character (such as !?;.).
+	 *
+	 * @param {string} sentence
+	 * @returns {string}
+	 */
+	purgeSentence:
 		(sentence) =>
 		{
 			sentence = LeUtils.trimEnd(STRING(sentence).trim(), '.: \r\n\t');
@@ -791,6 +1384,60 @@ export const LeUtils = {
 			return sentence;
 		},
 	
+	/**
+	 * Attempts to obtain and return an error message from the given error, regardless of what is passed to this function.
+	 *
+	 * @param {*} error
+	 * @returns {string}
+	 */
+	purgeErrorMessage:
+		(error) =>
+		{
+			const message = STRING(((typeof error === 'string') ? error : (error.message ?? JSON.stringify(error))));
+			const messageParts = message.split('threw an error:');
+			return messageParts[messageParts.length - 1].trim();
+		},
+	
+	/**
+	 * Generates all permutations of the given names.
+	 *
+	 * For example, if you pass "foo" and "bar", it will return:
+	 * - foobar
+	 * - fooBar
+	 * - FooBar
+	 * - foo-bar
+	 * - foo_bar
+	 *
+	 * @param {string} names
+	 * @returns {string[]}
+	 */
+	generateNamePermutations:
+		(...names) =>
+		{
+			names = LeUtils.flattenArray(names)
+				.map(name => STRING(name).trim().toLowerCase())
+				.filter(name => (name.length > 0));
+			let results = [];
+			if(names.length > 0)
+			{
+				results.push(names.join('')); //foobar
+				results.push(names.map(LeUtils.capitalize).join('')); //FooBar
+			}
+			if(names.length > 1)
+			{
+				results.push([names[0]].concat(names.slice(1).map(LeUtils.capitalize)).join('')); //fooBar
+				results.push(names.join('-')); //foo-bar
+				results.push(names.join('_')); //foo_bar
+			}
+			return results;
+		},
+	
+	/**
+	 * Increases the given numeric string by 1, this allows you to increase a numeric string without a limit.
+	 *
+	 * @param {string} string
+	 * @returns {string}
+	 */
 	increaseNumericStringByOne:
 		(string) =>
 		{
@@ -832,6 +1479,11 @@ export const LeUtils = {
 			return string;
 		},
 	
+	/**
+	 * Generates a string that is guaranteed to be unique (across the entire frontend).
+	 *
+	 * @returns {string}
+	 */
 	uniqueId:
 		(() =>
 		{
@@ -881,10 +1533,1055 @@ export const LeUtils = {
 			};
 		})(),
 	
+	/**
+	 * Returns a data URL of a 1x1 transparent pixel.
+	 *
+	 * @returns {string}
+	 */
 	getEmptyImageSrc:
 		() =>
 		{
 			// noinspection SpellCheckingInspection
 			return 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';
 		},
+	
+	/**
+	 * Calculates and returns the percentage of the part and total ((part / total) * 100).
+	 *
+	 * @param {number|string} part
+	 * @param {number|string} total
+	 * @returns {number}
+	 */
+	getPercentage:
+		(part, total) =>
+		{
+			part = FLOAT_LAX(part);
+			total = FLOAT_LAX(total);
+			if(total <= 0)
+			{
+				return 100;
+			}
+			return Math.max(0, Math.min(100, ((part / total) * 100)));
+		},
+	
+	/**
+	 * Returns the pixels of the given Image object.
+	 *
+	 * @param {HTMLImageElement} image
+	 * @returns {Uint8ClampedArray}
+	 */
+	getImagePixels:
+		(image) =>
+		{
+			if(!document)
+			{
+				return new Uint8ClampedArray();
+			}
+			const canvas = document.createElement('canvas');
+			document.body.appendChild(canvas);
+			try
+			{
+				const ctx = canvas.getContext('2d');
+				const width = Math.floor(image.width);
+				const height = Math.floor(image.height);
+				if((width <= 0) || (height <= 0))
+				{
+					canvas.width = 1;
+					canvas.height = 1;
+				}
+				else
+				{
+					canvas.width = width;
+					canvas.height = height;
+					ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
+				}
+				return ctx.getImageData(0, 0, canvas.width, canvas.height).data;
+			}
+			finally
+			{
+				canvas.parentNode.removeChild(canvas);
+			}
+		},
+	
+	/**
+	 * Returns the data URL (mimetype "image/png") of a colored version of the given Image object.
+	 *
+	 * @param {HTMLImageElement} image
+	 * @param {string} color
+	 * @returns {string}
+	 */
+	getColoredImage:
+		(image, color) =>
+		{
+			if(!document)
+			{
+				return LeUtils.getEmptyImageSrc();
+			}
+			const canvas = document.createElement('canvas');
+			document.body.appendChild(canvas);
+			try
+			{
+				const ctx = canvas.getContext('2d');
+				const width = Math.floor(image.width);
+				const height = Math.floor(image.height);
+				if((width <= 0) || (height <= 0))
+				{
+					canvas.width = 1;
+					canvas.height = 1;
+				}
+				else
+				{
+					canvas.width = width;
+					canvas.height = height;
+					ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
+				}
+				ctx.globalCompositeOperation = 'source-in';
+				ctx.fillStyle = color;
+				ctx.fillRect(0, 0, canvas.width, canvas.height);
+				return canvas.toDataURL('image/png');
+			}
+			finally
+			{
+				canvas.parentNode.removeChild(canvas);
+			}
+		},
+	
+	/**
+	 * Returns the hex color of the given RGB(A).
+	 *
+	 * @param {number[]} rgb
+	 * @returns {string}
+	 */
+	rgbToHex:
+		(rgb) =>
+		{
+			return '#' + rgb.map((x) =>
+			{
+				const hex = x.toString(16);
+				return ((hex.length === 1) ? '0' + hex : hex);
+			}).join('');
+		},
+	
+	/**
+	 * Returns the RGB(A) of the given hex color.
+	 *
+	 * @param {string} hexstring
+	 * @returns {number[]}
+	 */
+	hexToRgb:
+		(hexstring) =>
+		{
+			hexstring = hexstring.replace(/[^0-9A-F]/gi, '');
+			const hasAlpha = ((hexstring.length === 4) || (hexstring.length === 8));
+			while(hexstring.length < 6)
+			{
+				hexstring = hexstring.replace(/(.)/g, '$1$1');
+			}
+			const result = hexstring.match(/\w{2}/g).map((a) => parseInt(a, 16));
+			return [
+				result[0],
+				result[1],
+				result[2],
+				...(hasAlpha ? [result[3]] : []),
+			];
+		},
+	
+	/**
+	 * Returns the HSL(A) of the given RGB(A).
+	 *
+	 * @param {number[]} rgb
+	 * @returns {number[]}
+	 */
+	rgbToHsl:
+		(rgb) =>
+		{
+			const r = rgb[0] / 255;
+			const g = rgb[1] / 255;
+			const b = rgb[2] / 255;
+			const max = Math.max(r, g, b);
+			const min = Math.min(r, g, b);
+			let h, s, l = (max + min) / 2;
+			if(max === min)
+			{
+				h = s = 0;
+			}
+			else
+			{
+				const d = max - min;
+				s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+				switch(max)
+				{
+					case r:
+						h = (g - b) / d + (g < b ? 6 : 0);
+						break;
+					case g:
+						h = (b - r) / d + 2;
+						break;
+					case b:
+						h = (r - g) / d + 4;
+						break;
+				}
+				h /= 6;
+			}
+			return [h, s, l, ...((rgb.length >= 4) ? [rgb[3] / 255] : [])];
+		},
+	
+	/**
+	 * Returns the RGB(A) of the given HSL(A).
+	 *
+	 * @param {number[]} hsl
+	 * @returns {number[]}
+	 */
+	hslToRgb:
+		(() =>
+		{
+			const hue2rgb = (p, q, t) =>
+			{
+				if(t < 0)
+				{
+					t += 1;
+				}
+				if(t > 1)
+				{
+					t -= 1;
+				}
+				if(t < 1 / 6)
+				{
+					return p + (q - p) * 6 * t;
+				}
+				if(t < 1 / 2)
+				{
+					return q;
+				}
+				if(t < 2 / 3)
+				{
+					return p + (q - p) * (2 / 3 - t) * 6;
+				}
+				return p;
+			};
+			return (hsl) =>
+			{
+				const h = hsl[0];
+				const s = hsl[1];
+				const l = hsl[2];
+				let r, g, b;
+				if(s === 0)
+				{
+					r = g = b = l;
+				}
+				else
+				{
+					const q = (l < 0.5) ? (l * (1 + s)) : (l + s - (l * s));
+					const p = (2 * l) - q;
+					r = hue2rgb(p, q, h + (1 / 3));
+					g = hue2rgb(p, q, h);
+					b = hue2rgb(p, q, h - (1 / 3));
+				}
+				return [r * 255, g * 255, b * 255, ...((hsl.length >= 4) ? [hsl[3] * 255] : [])].map((c) => Math.max(0, Math.min(255, Math.round(c))));
+			};
+		})(),
+	
+	/**
+	 * Returns the LAB(A) of the given RGB(A).
+	 *
+	 * @param {number[]} rgb
+	 * @returns {number[]}
+	 */
+	rgbToLab:
+		(rgb) =>
+		{
+			let r = rgb[0] / 255;
+			let g = rgb[1] / 255;
+			let b = rgb[2] / 255;
+			r = (r > 0.04045) ? Math.pow((r + 0.055) / 1.055, 2.4) : (r / 12.92);
+			g = (g > 0.04045) ? Math.pow((g + 0.055) / 1.055, 2.4) : (g / 12.92);
+			b = (b > 0.04045) ? Math.pow((b + 0.055) / 1.055, 2.4) : (b / 12.92);
+			let x = ((r * 0.4124) + (g * 0.3576) + (b * 0.1805)) / 0.95047;
+			let y = ((r * 0.2126) + (g * 0.7152) + (b * 0.0722));
+			let z = ((r * 0.0193) + (g * 0.1192) + (b * 0.9505)) / 1.08883;
+			x = (x > 0.008856) ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116);
+			y = (y > 0.008856) ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116);
+			z = (z > 0.008856) ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116);
+			return [(116 * y) - 16, 500 * (x - y), 200 * (y - z), ...((rgb.length >= 4) ? [rgb[3] / 255] : [])];
+		},
+	
+	/**
+	 * Returns the difference (calculated with DeltaE) of the LAB values of the given RGB values.
+	 *
+	 * Returns a number:
+	 *
+	 * <pre>
+	 *   < 1.0    is not perceptible by human eyes
+	 *     1-2    is perceptible through close observation
+	 *     2-10   is perceptible at a glance
+	 *     11-49  is more similar than opposite
+	 *     100    is exactly the opposite color
+	 * </pre>
+	 *
+	 * @param {number[]} rgbA
+	 * @param {number[]} rgbB
+	 * @returns {number}
+	 */
+	getDifferenceBetweenRgb:
+		(rgbA, rgbB) =>
+		{
+			const labA = LeUtils.rgbToLab(rgbA);
+			const labB = LeUtils.rgbToLab(rgbB);
+			return LeUtils.getDifferenceBetweenLab(labA, labB);
+		},
+	
+	/**
+	 * Returns the difference (calculated with DeltaE) of the given LAB values. Ignores the Alpha channel.
+	 *
+	 * Returns a number:
+	 *
+	 * <pre>
+	 *   < 1.0    is not perceptible by human eyes
+	 *     1-2    is perceptible through close observation
+	 *     2-10   is perceptible at a glance
+	 *     11-49  is more similar than opposite
+	 *     100    is exactly the opposite color
+	 * </pre>
+	 *
+	 * @param {number[]} labA
+	 * @param {number[]} labB
+	 * @returns {number}
+	 */
+	getDifferenceBetweenLab:
+		(labA, labB) =>
+		{
+			const deltaL = labA[0] - labB[0];
+			const deltaA = labA[1] - labB[1];
+			const deltaB = labA[2] - labB[2];
+			const c1 = Math.sqrt(labA[1] * labA[1] + labA[2] * labA[2]);
+			const c2 = Math.sqrt(labB[1] * labB[1] + labB[2] * labB[2]);
+			const deltaC = c1 - c2;
+			let deltaH = deltaA * deltaA + deltaB * deltaB - deltaC * deltaC;
+			deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
+			const sc = 1.0 + 0.045 * c1;
+			const sh = 1.0 + 0.015 * c1;
+			const deltaLKlsl = deltaL / (1.0);
+			const deltaCkcsc = deltaC / (sc);
+			const deltaHkhsh = deltaH / (sh);
+			const i = deltaLKlsl * deltaLKlsl + deltaCkcsc * deltaCkcsc + deltaHkhsh * deltaHkhsh;
+			return (i < 0) ? 0 : Math.sqrt(i);
+		},
+	
+	/**
+	 * Returns the RGB(A) of the given RGB(A) values, based on the given percentage (0-100).
+	 * This allows you to define a gradient of colors to fade in between, rather than just having a start and an end color.
+	 *
+	 * Usage:
+	 *
+	 * <pre>
+	 * LeUtils.getRgbOfGradient({
+	 *   0:  [255, 0,   0],
+	 *   33: [255, 255, 0],
+	 *   66: [0,   255, 0],
+	 *   100:[0,   255, 255],
+	 * }, 45.1234);
+	 * </pre>
+	 *
+	 * @param {{[percentage]: number[]}} gradient
+	 * @param {number} percentage
+	 * @returns {number[]}
+	 */
+	getRgbOfGradient:
+		(gradient, percentage) =>
+		{
+			percentage = Math.max(0, Math.min(100, FLOAT_LAX(percentage)));
+			
+			let closest = null;
+			LeUtils.each(gradient, (color, percent) =>
+			{
+				percent = INT_LAX(percent);
+				if(closest === null)
+				{
+					closest = [percent, Math.abs(percentage - percent)];
+				}
+				else
+				{
+					const difference = Math.abs(percentage - percent);
+					if(difference < closest[1])
+					{
+						closest = [percent, difference];
+					}
+				}
+			});
+			if(closest === null)
+			{
+				return null;
+			}
+			closest = closest[0];
+			
+			let higher = 99999;
+			let lower = -99999;
+			LeUtils.each(gradient, (color, percent) =>
+			{
+				percent = INT_LAX(percent);
+				if(percent < closest)
+				{
+					if(percent > lower)
+					{
+						lower = percent;
+					}
+				}
+				if(percent > closest)
+				{
+					if(percent < higher)
+					{
+						higher = percent;
+					}
+				}
+			});
+			if(higher === 99999)
+			{
+				higher = null;
+			}
+			if(lower === -99999)
+			{
+				lower = null;
+			}
+			
+			if(((higher === null) && (lower === null)) || (higher === lower))
+			{
+				return gradient[closest];
+			}
+			else if((higher !== null) && (lower !== null))
+			{
+				const higherDifference = Math.abs(higher - percentage);
+				const lowerDifference = Math.abs(percentage - lower);
+				if(higherDifference > lowerDifference)
+				{
+					higher = closest;
+				}
+				else
+				{
+					lower = closest;
+				}
+			}
+			else if(lower === null)
+			{
+				lower = closest;
+			}
+			else
+			{
+				higher = closest;
+			}
+			
+			if(lower > higher)
+			{
+				const tmp = higher;
+				higher = lower;
+				lower = tmp;
+			}
+			
+			const total = (higher - lower);
+			const part = (percentage - lower);
+			return LeUtils.getRgbBetween(gradient[lower], gradient[higher], ((part / total) * 100));
+		},
+	
+	/**
+	 * Returns the RGB(A) between the two given RGB(A) values, based on the given percentage (0-100).
+	 *
+	 * @param {number[]} startRgb
+	 * @param {number[]} endRgb
+	 * @param {number} percentage
+	 * @returns {number[]}
+	 */
+	getRgbBetween:
+		(startRgb, endRgb, percentage) =>
+		{
+			percentage = FLOAT_LAX(percentage);
+			const partEnd = Math.max(0, Math.min(1, (percentage / 100.0)));
+			const partStart = (1 - partEnd);
+			const length = Math.min(startRgb.length, endRgb.length);
+			let result = [];
+			for(let i = 0; i < length; i++)
+			{
+				result.push(Math.max(0, Math.min(255, Math.round((startRgb[i] * partStart) + (endRgb[i] * partEnd)))));
+			}
+			return result;
+		},
+	
+	/**
+	 * An implementation of the btoa function, which should work in all environments.
+	 *
+	 * @param {string} string
+	 * @returns {string}
+	 */
+	btoa:
+		(string) =>
+		{
+			if(typeof btoa === 'function')
+			{
+				return btoa(string);
+			}
+			return Buffer.from(string).toString('base64');
+		},
+	
+	/**
+	 * An implementation of the atob function, which should work in all environments.
+	 *
+	 * @param {string} base64string
+	 * @returns {string}
+	 */
+	atob:
+		(base64string) =>
+		{
+			if(typeof atob === 'function')
+			{
+				return atob(base64string);
+			}
+			return Buffer.from(base64string, 'base64').toString();
+		},
+	
+	/**
+	 * Encodes a UTF-8 string into a base64 string.
+	 *
+	 * @param {string} string
+	 * @returns {string}
+	 */
+	utf8ToBase64:
+		(string) =>
+		{
+			return LeUtils.btoa(encodeURIComponent(string).replace(/%([0-9A-F]{2})/g, (match, p1) => String.fromCharCode(parseInt(p1, 16))));
+		},
+	
+	/**
+	 * Decodes a base64 string back into a UTF-8 string.
+	 *
+	 * @param {string} base64string
+	 * @returns {string}
+	 */
+	base64ToUtf8:
+		(base64string) =>
+		{
+			return decodeURIComponent(LeUtils.atob(base64string.trim()).split('').map((c) => '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)).join(''));
+		},
+	
+	/**
+	 * Converts a base64 string into a hex string.
+	 *
+	 * @param {string} base64string
+	 * @returns {string}
+	 */
+	base64ToHex:
+		(base64string) =>
+		{
+			return LeUtils.atob(base64string.trim()).split('').map((c) => ('0' + c.charCodeAt(0).toString(16)).slice(-2)).join('');
+		},
+	
+	/**
+	 * Converts a hex string into a base64 string.
+	 *
+	 * @param {string} hexstring
+	 * @returns {string}
+	 */
+	hexToBase64:
+		(hexstring) =>
+		{
+			return LeUtils.btoa(hexstring.replace(/[^0-9A-F]/gi, '').match(/\w{2}/g).map((a) => String.fromCharCode(parseInt(a, 16))).join(''));
+		},
+	
+	/**
+	 * Converts a base64 string into bytes (Uint8Array).
+	 *
+	 * @param {string} base64string
+	 * @returns {Uint8Array}
+	 */
+	base64ToBytes:
+		(base64string) =>
+		{
+			const binary = LeUtils.atob(base64string.trim());
+			const len = binary.length;
+			let data = new Uint8Array(len);
+			for(let i = 0; i < len; i++)
+			{
+				data[i] = binary.charCodeAt(i);
+			}
+			return data;
+		},
+	
+	/**
+	 * Converts bytes into a base64 string.
+	 *
+	 * @param {ArrayLike<number>|ArrayBufferLike} arraybuffer
+	 * @returns {string}
+	 */
+	bytesToBase64:
+		(arraybuffer) =>
+		{
+			const bytes = new Uint8Array(arraybuffer);
+			const len = bytes.byteLength;
+			let binary = '';
+			for(let i = 0; i < len; i++)
+			{
+				binary += String.fromCharCode(bytes[i]);
+			}
+			return LeUtils.btoa(binary);
+		},
+	
+	/**
+	 * Downloads the given base64 string as a file.
+	 *
+	 * @param {string} base64string
+	 * @param {string} [fileName]
+	 * @param {string} [mimeType]
+	 */
+	downloadFile:
+		(base64string, fileName, mimeType) =>
+		{
+			const link = document.createElement('a');
+			link.setAttribute('download', (typeof fileName === 'string') ? fileName : 'file');
+			link.href = 'data:' + mimeType + ';base64,' + base64string;
+			link.setAttribute('target', '_blank');
+			link.click();
+		},
+	
+	/**
+	 * Loads the value from the browser, returns undefined if the value doesn't exist.
+	 *
+	 * @param {string} id
+	 * @returns {*}
+	 */
+	localStorageGet:
+		(id) =>
+		{
+			if(typeof window === 'undefined')
+			{
+				return;
+			}
+			let result = window.localStorage.getItem('LeUtils_' + id);
+			if(typeof result !== 'string')
+			{
+				return;
+			}
+			try
+			{
+				result = JSON.parse(result);
+				if(typeof result['-'] !== 'undefined')
+				{
+					return result['-'];
+				}
+			}
+			catch(e)
+			{
+			}
+		},
+	
+	/**
+	 * Saves the given data in the browser.
+	 *
+	 * @param {string} id
+	 * @param {*} data
+	 */
+	localStorageSet:
+		(id, data) =>
+		{
+			if(typeof window === 'undefined')
+			{
+				return;
+			}
+			if(typeof data === 'undefined')
+			{
+				window.localStorage.removeItem('LeUtils_' + id);
+				return;
+			}
+			window.localStorage.setItem('LeUtils_' + id, JSON.stringify({'-':data}));
+		},
+	
+	/**
+	 * Removes the data from the browser.
+	 *
+	 * @param {string} id
+	 */
+	localStorageRemove:
+		(id) =>
+		{
+			if(typeof window === 'undefined')
+			{
+				return;
+			}
+			window.localStorage.removeItem('LeUtils_' + id);
+		},
+	
+	/**
+	 * Creates and returns a new TreeSet.
+	 * A TreeSet is a set of elements, sorted by a comparator.
+	 * Binary search is used to find elements, which makes it very fast to find elements.
+	 *
+	 * The comparator is also used to determine if two values are equal to each other.
+	 * This way, you can have values that aren't the same be treated as if they are. This can be used to deal with issues such as floating point errors for example.
+	 *
+	 * @param {*[]} elements
+	 * @param {Function} comparator
+	 * @returns {{getElements: (function(): *[]),  getComparator: (function(): Function),  size: (function(): number),  isEmpty: (function(): boolean),  contains: (function(*): boolean),  first: (function(): *|undefined),  last: (function(): *|undefined),  pollFirst: (function(): *|undefined),  pollLast: (function(): *|undefined),  add: function(*),  addAll: function(*[]|object),  getEqualValue: (function(*): (*)),  getEqualValueOrAdd: (function(*): (*))}}
+	 */
+	createTreeSet:
+		(elements, comparator) =>
+		{
+			comparator = comparator || LeUtils.compare;
+			elements = elements || [];
+			elements.sort(comparator);
+			
+			/**
+			 * Performs a binary search on the elements, and returns the result.
+			 *
+			 * @param {*} value
+			 * @returns {{found: boolean,  index: number,  value: *|undefined}}
+			 */
+			const binarySearch = (value) =>
+			{
+				let low = 0;
+				let high = elements.length - 1;
+				while(low <= high)
+				{
+					const mid = Math.floor((low + high) / 2);
+					const midValue = elements[mid];
+					const cmp = comparator(midValue, value);
+					if(cmp < 0)
+					{
+						low = mid + 1;
+					}
+					else if(cmp > 0)
+					{
+						high = mid - 1;
+					}
+					else
+					{
+						return {found:true, index:mid, value:midValue};
+					}
+				}
+				return {found:false, index:low, value:undefined};
+			};
+			
+			const treeSet = {
+				/**
+				 * Returns the elements of the set.
+				 *
+				 * @returns {*[]}
+				 */
+				getElements:
+					() => elements,
+				
+				/**
+				 * Returns the comparator of the set.
+				 *
+				 * @returns {Function}
+				 */
+				getComparator:
+					() => comparator,
+				
+				/**
+				 * Returns the size of the set.
+				 *
+				 * @returns {number}
+				 */
+				size:
+					() => elements.length,
+				
+				/**
+				 * Returns true if the set is empty, false otherwise.
+				 *
+				 * @returns {boolean}
+				 */
+				isEmpty:
+					() => (elements.length <= 0),
+				
+				/**
+				 * Returns true if the set contains a value that is equal to the given value, returns false otherwise.
+				 *
+				 * @param {*} value
+				 * @returns {boolean}
+				 */
+				contains:
+					(value) => binarySearch(value).found,
+				
+				/**
+				 * Returns the first element of the set, or undefined if it is empty.
+				 *
+				 * @returns {*|undefined}
+				 */
+				first:
+					() => (elements.length > 0) ? elements[0] : undefined,
+				
+				/**
+				 * Returns the last element of the set, or undefined if it is empty.
+				 *
+				 * @returns {*|undefined}
+				 */
+				last:
+					() => (elements.length > 0) ? elements[elements.length - 1] : undefined,
+				
+				/**
+				 * Removes and returns the first element of the set, or undefined if it is empty.
+				 *
+				 * @returns {*|undefined}
+				 */
+				pollFirst:
+					() => (elements.length > 0) ? elements.splice(0, 1)[0] : undefined,
+				
+				/**
+				 * Removes and returns the last element of the set, or undefined if it is empty.
+				 *
+				 * @returns {*|undefined}
+				 */
+				pollLast:
+					() => (elements.length > 0) ? elements.splice(elements.length - 1, 1)[0] : undefined,
+				
+				/**
+				 * Adds the given value to the set. Will only do so if no equal value already exists.
+				 *
+				 * @param {*} value
+				 */
+				add:
+					(value) =>
+					{
+						const result = binarySearch(value);
+						if(result.found)
+						{
+							return;
+						}
+						elements.splice(result.index, 0, value);
+					},
+				
+				/**
+				 * Adds all the given values to the set. Will only do so if no equal value already exists.
+				 *
+				 * @param {*[]|object} values
+				 */
+				addAll:
+					(values) =>
+					{
+						LeUtils.each(values, treeSet.add);
+					},
+				
+				/**
+				 * Returns an equal value that's already in the tree set, or undefined if no equal values in it exist.
+				 *
+				 * @param {*} value
+				 * @returns {*|undefined}
+				 */
+				getEqualValue:
+					(value) =>
+					{
+						const result = binarySearch(value);
+						if(result.found)
+						{
+							return result.value;
+						}
+						return undefined;
+					},
+				
+				/**
+				 * Returns an equal value that's already in the tree set. If no equal values in it exist, the given value will be added and returned.
+				 *
+				 * @param {*} value
+				 * @returns {*}
+				 */
+				getEqualValueOrAdd:
+					(value) =>
+					{
+						const result = binarySearch(value);
+						if(result.found)
+						{
+							return result.value;
+						}
+						elements.splice(result.index, 0, value);
+						return value;
+					},
+			};
+			return treeSet;
+		},
+	
+	/**
+	 * @typedef {Object} LeUtils~TransactionalValue
+	 * @property {*} value
+	 * @property {{id:string, value:*}[]} changes
+	 */
+	/**
+	 * Creates and returns a new TransactionalValue object.
+	 * With a TransactionalValue, you can keep track of changes to a value, and commit or cancel them.
+	 *
+	 * Multiple uncommitted changes can be made at the same time, the last change will be the one that overwrites older changes.
+	 * If that change is cancelled, the previous change will be the one that overwrites older changes.
+	 * This allows you to make multiple unconfirmed changes, and confirm or cancel each of them individually at any time.
+	 *
+	 * @param {*} [value]
+	 * @returns {LeUtils~TransactionalValue}
+	 */
+	createTransactionalValue:
+		(value) =>
+		{
+			if(typeof value === 'undefined')
+			{
+				value = null;
+			}
+			return {value:value, changes:[]};
+		},
+	
+	/**
+	 * Returns true if the given value is a valid TransactionalValue, returns false if it isn't.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @returns {boolean}
+	 */
+	isTransactionalValueValid:
+		(transactionalValue) =>
+		{
+			return ((typeof transactionalValue === 'object') && ('value' in transactionalValue) && ('changes' in transactionalValue) && Array.isArray(transactionalValue.changes));
+		},
+	
+	/**
+	 * Returns true if the given value is a TransactionalValue, false otherwise.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @returns {string}
+	 */
+	transactionalValueToString:
+		(transactionalValue) =>
+		{
+			if(!LeUtils.isTransactionalValueValid(transactionalValue))
+			{
+				return transactionalValue + '';
+			}
+			if(transactionalValue.changes.length <= 0)
+			{
+				return '' + transactionalValue.value;
+			}
+			let valuesString = '' + transactionalValue.value;
+			for(let i = 0; i < transactionalValue.changes.length; i++)
+			{
+				valuesString += ' -> ' + transactionalValue.changes[i].value;
+			}
+			return transactionalValue.changes[transactionalValue.changes.length - 1].value + ' (' + valuesString + ')';
+		},
+	
+	/**
+	 * Sets the committed value of the given TransactionalValue to the given value. Clears out the previously uncommitted changes.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @param {*} value
+	 */
+	transactionSetAndCommit:
+		(transactionalValue, value) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			if(typeof value === 'undefined')
+			{
+				value = null;
+			}
+			transactionalValue.value = value;
+			transactionalValue.changes = [];
+		},
+	
+	/**
+	 * Sets the value of the given TransactionalValue to the given value, without yet committing it, meaning it can be committed or cancelled later.
+	 * It returns the ID of the change, which can be used to commit or cancel the change later.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @param {*} value
+	 * @returns {string}
+	 */
+	transactionSetWithoutCommitting:
+		(transactionalValue, value) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			if(typeof value === 'undefined')
+			{
+				value = null;
+			}
+			const id = LeUtils.uniqueId();
+			transactionalValue.changes.push({id:id, value:value});
+			return id;
+		},
+	
+	/**
+	 * Commits the change with the given ID, making it the new committed value.
+	 * Returns true if the change was found and committed, returns false if it was already overwritten by a newer committed change.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @param {string} changeId
+	 * @returns {boolean}
+	 */
+	transactionCommitChange:
+		(transactionalValue, changeId) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			const change = findTransactionalValueChange(transactionalValue, changeId);
+			if(change === null)
+			{
+				return false;
+			}
+			transactionalValue.value = change.value;
+			transactionalValue.changes.splice(0, change.index + 1);
+			return true;
+		},
+	
+	/**
+	 * Cancels the change with the given ID, removing it from the uncommitted changes.
+	 * Returns true if the change was found and removed, returns false if it was already overwritten by a newer committed change.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @param {string} changeId
+	 * @returns {boolean}
+	 */
+	transactionCancelChange:
+		(transactionalValue, changeId) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			const change = findTransactionalValueChange(transactionalValue, changeId);
+			if(change === null)
+			{
+				return false;
+			}
+			transactionalValue.changes.splice(change.index, 1);
+			return true;
+		},
+	
+	/**
+	 * Returns true if the change was found, meaning it can still make a difference to the final committed value of this TransactionalValue.
+	 * Returns false if it was already overwritten by a newer committed change, meaning that this change can no longer make a difference to the final committed value of this TransactionalValue.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @param {string} changeId
+	 * @returns {boolean}
+	 */
+	transactionIsChangeRelevant:
+		(transactionalValue, changeId) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			return (findTransactionalValueChange(transactionalValue, changeId) !== null);
+		},
+	
+	/**
+	 * Returns the committed value of the given TransactionalValue.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @returns {*}
+	 */
+	transactionGetCommittedValue:
+		(transactionalValue) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			return transactionalValue.value;
+		},
+	
+	/**
+	 * Returns the value (including any uncommitted changes made to it) of the given TransactionalValue.
+	 *
+	 * @param {LeUtils~TransactionalValue} transactionalValue
+	 * @returns {*}
+	 */
+	transactionGetValue:
+		(transactionalValue) =>
+		{
+			checkTransactionalValue(transactionalValue);
+			if(transactionalValue.changes.length <= 0)
+			{
+				return transactionalValue.value;
+			}
+			return transactionalValue.changes[transactionalValue.changes.length - 1].value;
+		},
 };