[HTMX Miniframework] Compiler for htmx - Work in Progress

htmx-compilers.js

/**
 * -- HTMX Mini Framework
 * @see https://eager.io/blog/how-to-decide-when-your-code-should-run/
 * @see https://stackoverflow.com/a/44057187/814031
 */

;
(function() {
	var results = []

	window.App = {
		functions: {},

		/**
		 * Add function
		 * @param {string}   name can be body[data-path] for sitespecific JS or selector for global js
		 * @param {Function} fn   function to execute becomes fn(name)
		 */
		addFunction: function(name, fn) {
			this.functions[name] = fn;
		},

		init: function() {
			console.log('init');
			for (var name in this.functions) {

				var result = this.functions[name](name);
				if (result) {
					results.push(result);
				}
			}
		},

		destroy: function() {
			console.log('destroy');
			for (var i = 0; i < results.length; i++) {
				var result = results[i];
				if (typeof result.destroy === 'function') {
					result.destroy();
				}
			}
			results = [];
		}
	}

	document.addEventListener('htmx:load', function() {
		window.App.init.call(window.App)
	})

	document.addEventListener('htmx:beforeOnLoad', window.App.destroy)

})();

window.App.addFunction('body', function(element) {

	console.log('run your 3rd party code')

	return {
		destroy: function() {
			console.log('tear down the 3rd party lib')
		}
	}

});