refactor asset dir, refactor oberver in lib

7 files changed, 151 insertions, 157 deletions

diff --git a/web/public/css/common.css b/web/public/css/common.css
index 84aabfc..8b55268 100644
--- a/web/public/css/common.css
+++ b/web/public/css/common.css
@@ -18,7 +18,7 @@
   font-family: 'Material Icons';
   font-style: normal;
   font-weight: 400;
-  src: url("/public/font/MaterialIcons-Regular.ttf") format('truetype');
+  src: url("/public/font/material-icons.ttf") format('truetype');
 }
 
 @font-face {
diff --git a/web/public/font/MaterialIcons-Regular.ttf b/web/public/font/material-icons.ttf
index 9d09b0f..9d09b0f 100644
--- a/web/public/font/MaterialIcons-Regular.ttf
+++ b/web/public/font/material-icons.ttf
diff --git a/web/public/js/lib.js b/web/public/js/lib.js
index 7647208..55b8161 100644
--- a/web/public/js/lib.js
+++ b/web/public/js/lib.js
@@ -1,77 +1,58 @@
-
-///
-/// document ready functions
-///
-
-let ready = false;
-
-$(function() {
-	ready = true;
-});
-
-var r$ = function(callback) {
-	if (ready) {
-		callback();
-	} else {
-		$(function() {
-			callback();
-		});
-	}
-}
-
 ///
 /// dom observer
 /// checks for elements on the DOM now and added later
 ///
 
-function observe(containerSelector, elementSelector, callback) {
+var $$ = (selector) => {
 
-	r$(() => {
-		$(containerSelector + ' ' + elementSelector).each(function (_, e) {
-			let me = $(e);
-			callback(me);
-		});
+	// add jquery functions that
+	// are used and needed to be used for
+	// $$()
+	const functions = [
+		'on',
+		'click',
+		'submit',
+		'each'
+	];
 
-		var onMutationsObserved = function(mutations) {
-    	    mutations.forEach(function(mutation) {
-    	        if (mutation.addedNodes.length) {
-    	            var elements = $(mutation.addedNodes).find(elementSelector);
-    	            for (var i = 0, len = elements.length; i < len; i++) {
-						let me = elements[i];
-						me = $(me);
-						callback(me);
-    	            }
-    	        }
-    	    });
-    	};
+	let vtable = {};
 
-    	var target = $(containerSelector)[0];
+	for (const name of functions) {
+		vtable[name] = (...params) => {
 
-		if (!target) {
-			console.warn('[observe] didnt find container: ', containerSelector);
-			return;
-		}
+			const onCreate = (me) => {
+				me[name](...params);
+			};
 
-    	var config = { childList: true, subtree: true };
-    	var MutationObserver = window.MutationObserver;
-    	var observer = new MutationObserver(onMutationsObserved);
-    	observer.observe(target, config);
-	});
-}
+			const onMutate = (mutations) => {
+				mutations.forEach((mutation) => {
+					if (!mutation.addedNodes.length) {
+						return;
+					}
+					let elements = $(mutation.addedNodes).find(selector);
+					for (let i = 0, len = elements.length; i < len; i++) {
+						let me = $(elements[i]);
+						onCreate(me);
+					}
+				});
+			};
 
-///
-/// ajax setup
-///
+			$(function() {
+				$(selector).each(function (_ , me) {
+					onCreate($(me));
+				});
 
-let ajaxHeaders = {};
-ajaxHeaders['Content-Type'] = 'application/json';
-if (jwtStr) {
-	ajaxHeaders['Authorization'] = 'Bearer ' + jwtStr
-}
+				let config = { childList: true, subtree: true };
+    			let MutationObserver = window.MutationObserver;
+    			let observer = new MutationObserver(onMutate);
+				observer.observe(document.body, config);
+			});
 
-$.ajaxSetup({
-	headers: ajaxHeaders
-})
+		};
+	}
+
+	return vtable;
+}
 
 ///
 /// ajax error handle
@@ -96,14 +77,29 @@ var errorToast = (xhr) => {
 	})
 }
 
-observe('#toast-container', '.action-close-toast', function(el) {
-	el.on('click', function() {
-		el.parent().remove();
-	});
+$$('.action-close-toast').on('click', function() {
+	$(this).parent().remove();
+});
 
+$$('.action-close-toast').each(function() {
+	let me = $(this);
 	setTimeout(function() {
-		el.parent().remove();
+		me.parent().remove();
 	}, 5000);
 });
 
+///
+/// ajax setup
+///
 
+$.ajaxSetup({
+	headers: (() => {
+		let ajaxHeaders = {};
+		ajaxHeaders['Content-Type'] = 'application/json';
+		if (jwtStr) {
+			ajaxHeaders['Authorization'] = 'Bearer ' + jwtStr
+		}
+		return ajaxHeaders;
+	})(),
+	error: errorToast
+})
diff --git a/web/public/js/shared/modal.js b/web/public/js/modal.js
index 792cd85..2a704f3 100644
--- a/web/public/js/shared/modal.js
+++ b/web/public/js/modal.js
@@ -1,7 +1,3 @@
-$(document).on('click', ".modal-close", (o) => {
-	$(o.target).closest('.modal-container').remove();
-});
-
 const initDrag = (header, modal, container) => {
 	let drag = false;
 
@@ -54,11 +50,16 @@ const initDrag = (header, modal, container) => {
 	container.onmouseup = onEnd;
 };
 
-observe('body', '.modal-header', function(el) {
-	let header = $(el);
+$$('.modal-header').each(function() {
+	let header = $(this);
 	let modal = header.closest('.modal');
 	let container = header.closest('.modal-container');
 	initDrag(
 		header[0], modal[0], container[0]
 	);
+
+	let close = header.find('.modal-close');
+	close.on('click', function() {
+		container.remove();
+	});
 });
diff --git a/web/public/js/post.js b/web/public/js/post.js
new file mode 100644
index 0000000..7e524bb
--- /dev/null
+++ b/web/public/js/post.js
@@ -0,0 +1,81 @@
+
+$$('.action-load-comments').on('click', function() {
+	let me = $(this);
+	let page = me.attr('page');
+	if (!page) {
+		page = '1';
+	}
+	let newPage = Number(page) + 1;
+	me.attr('page', newPage + '');
+
+	let postId = me.attr('postId');
+	let loaded = Number(me.attr('loaded'));
+	let pageSize = Number(me.attr('pageSize'));
+	let commmentCount = Number(me.attr('commentCount'));
+	let commentMax = Number(me.attr('commentMax'));
+
+	let url = '/_util/post/comments?page=' + page + '&id=' + postId + '&max' + commentMax;
+		$.get(url, function (data) {
+		if (data === '') {
+			me.remove();
+			return;
+		}
+
+		$(data).insertBefore(me);
+
+		loaded += pageSize;
+		if (loaded >= commmentCount) {
+			me.remove();
+		} else {
+			me.attr('loaded', loaded + '');
+		}
+	});
+});
+
+$$('#action-load-posts').on('click', function() {
+	let me = $(this);
+	let page = me.attr('page');
+	if (!page) {
+		page = '1';
+	}
+	let newPage = Number(page) + 1;
+	me.attr('page', newPage + '');
+
+	let loaded = Number(me.attr('loaded'));
+	let pageSize = Number(me.attr('pageSize'));
+	let postCount = Number(me.attr('postCount'));
+	let postMax = Number(me.attr('postMax'));
+
+	let url = '/_util/post/posts?page=' + page + '&max=' + postMax;
+	$.get(url, function (data) {
+		if (data === '') {
+			me.remove();
+			return;
+		}
+
+		$(data).insertBefore(me);
+
+		loaded += pageSize;
+		if (loaded >= postCount) {
+			me.remove();
+		} else {
+			me.attr('loaded', loaded + '');
+		}
+	});
+});
+
+$$('.action-new-comment-form').on('submit', function(e) {
+	e.preventDefault();
+	let me = $(this);
+	let input = me.find('.action-new-comment');
+	let content = input.val();
+	let post_id = input.attr('postId');
+	$.ajax({
+		url: '/api/comment',
+		method: 'POST',
+		data: JSON.stringify({ post_id, content }),
+		success: function(_data) {
+			window.location.reload();
+		},
+	});
+});
diff --git a/web/public/js/shared/post.js b/web/public/js/shared/post.js
deleted file mode 100644
index f22dd99..0000000
--- a/web/public/js/shared/post.js
+++ /dev/null
@@ -1,84 +0,0 @@
-observe('#main-content', '.action-load-comments', function(me) {
-	me.on('click', function() {
-		let page = me.attr('page');
-		if (!page) {
-			page = '1';
-		}
-		let newPage = Number(page) + 1;
-		me.attr('page', newPage + '');
-
-		let postId = me.attr('postId');
-		let loaded = Number(me.attr('loaded'));
-		let pageSize = Number(me.attr('pageSize'));
-		let commmentCount = Number(me.attr('commentCount'));
-		let commentMax = Number(me.attr('commentMax'));
-
-		let url = '/_util/post/comments?page=' + page + '&id=' + postId + '&max' + commentMax;
-			$.get(url, function (data) {
-			if (data === '') {
-				me.remove();
-				return;
-			}
-
-			$(data).insertBefore(me);
-
-			loaded += pageSize;
-			if (loaded >= commmentCount) {
-				me.remove();
-			} else {
-				me.attr('loaded', loaded + '');
-			}
-		});
-	});
-});
-
-observe('#main-content', '#action-load-posts', function(me) {
-	me.on('click', function () {
-		let page = me.attr('page');
-		if (!page) {
-			page = '1';
-		}
-		let newPage = Number(page) + 1;
-		me.attr('page', newPage + '');
-
-		let loaded = Number(me.attr('loaded'));
-		let pageSize = Number(me.attr('pageSize'));
-		let postCount = Number(me.attr('postCount'));
-		let postMax = Number(me.attr('postMax'));
-
-		let url = '/_util/post/posts?page=' + page + '&max=' + postMax;
-		$.get(url, function (data) {
-			if (data === '') {
-				me.remove();
-				return;
-			}
-
-			$(data).insertBefore(me);
-
-			loaded += pageSize;
-			if (loaded >= postCount) {
-				me.remove();
-			} else {
-				me.attr('loaded', loaded + '');
-			}
-		});
-	});
-});
-
-observe('#main-content', '.action-new-comment-form', function(me) {
-	me.on('submit', function(e) {
-		e.preventDefault();
-		let input = me.find('.action-new-comment');
-		let content = input.val();
-		let post_id = input.attr('postId');
-		$.ajax({
-			url: '/api/comment',
-			method: 'POST',
-			data: JSON.stringify({ post_id, content }),
-			success: function(_data) {
-				window.location.reload();
-			},
-			error: errorToast
-		});
-	});
-});
diff --git a/web/public/js/jquery-3.7.1.min.js b/web/public/js/thirdparty/jquery.min.js
index 7f37b5d..7f37b5d 100644
--- a/web/public/js/jquery-3.7.1.min.js
+++ b/web/public/js/thirdparty/jquery.min.js