From 0565e8d6a917dc5d9745146bf922bb3a0fffb8ef Mon Sep 17 00:00:00 2001 From: justcool393 Date: Sun, 23 Jul 2023 10:33:03 -0500 Subject: [PATCH] submitFormAjax is different enough from postToast to be annoying we'll just factor out the toast generation code for now and leave it for the future to deal with. --- files/assets/js/header.js | 96 +++++++++++++++++++---------------- files/assets/js/userpage_v.js | 32 ++---------- 2 files changed, 55 insertions(+), 73 deletions(-) diff --git a/files/assets/js/header.js b/files/assets/js/header.js index 8fe21973b..b15805b6e 100644 --- a/files/assets/js/header.js +++ b/files/assets/js/header.js @@ -81,6 +81,56 @@ function expandDesktopImage(image) { document.getElementById("desktop-expanded-image-wrap-link").href = image; }; + +function showToastFromXhr(xhr, callbackFn) { // If callbackFn is specified, we'll try to use that first + var message = null; + + if (callbackFn !== null) { + try { + const result = callbackFn(xhr); + if (typeof result === 'string' && result !== null) { + message = result; + } + } catch (e) { + console.error("Failed to run callback function for postToast", e, xhr); + } + } + + let data; + try { + data = JSON.parse(xhr.response); + } catch (e) { + console.error("Failed to parse response as JSON", e); + if (message === null) return; + } + + if (xhr.status >= 200 && xhr.status < 300 && data && data['message']) { + const toastPostSuccessTextElement = document.getElementById("toast-post-success-text"); + if (message !== null) { + message = data["message"]; + } + if (message === null) { + message = "Success!"; + } + toastPostSuccessTextElement.innerText = message; + bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-success')).show(); + callbackFn(xhr); + } else { + const toastPostErrorTextElement = document.getElementById('toast-post-error-text'); + if (message != null && data) { + if (data["details"]) { + message = data["details"]; + } else if (data["error"]) { + message = data["error"]; + } else { + message = "Error, please try again later."; + } + } + if (messageOverride) toastPostErrorTextElement.innerText = message; + bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')).show(); + } +} + function postToast(targetElement, url, method, data, callbackFn) { if (targetElement) { // disable element to avoid repeated requests t.disabled = true; @@ -99,51 +149,7 @@ function postToast(targetElement, url, method, data, callbackFn) { } xhr.onload = function() { - let data; - try { - data = JSON.parse(xhr.response); - } catch (e) { - console.error("Failed to parse response as JSON", e); - } - - var message = null; - - if (callbackFn !== null) { - try { - const result = callbackFn(xhr); - if (typeof result === 'string' && result !== null) { - message = result; - } - } catch (e) { - console.error("Failed to run callback function for postToast", e, xhr); - } - } - - if (xhr.status >= 200 && xhr.status < 300 && data && data['message']) { - const toastPostSuccessTextElement = document.getElementById("toast-post-success-text"); - if (message !== null) { - message = data["message"]; - } - if (message === null) { - message = "Success!"; - } - toastPostSuccessTextElement.innerText = message; - bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-success')).show(); - callbackFn(xhr); - } else { - const toastPostErrorTextElement = document.getElementById('toast-post-error-text'); - if (message != null && data) { - if (data["details"]) { - message = data["details"]; - } else if (data["error"]) { - message = data["error"]; - } else { - message = "Error, please try again later."; - } - } - if (messageOverride) toastPostErrorTextElement.innerText = message; - bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')).show(); - } + showToastFromXhr(xhr, callbackFn); } setTimeout(() => { diff --git a/files/assets/js/userpage_v.js b/files/assets/js/userpage_v.js index c6acb319b..5492f15ba 100644 --- a/files/assets/js/userpage_v.js +++ b/files/assets/js/userpage_v.js @@ -75,6 +75,7 @@ function transferBux(mobile=false) { } function submitFormAjax(e) { + e.preventDefault(); document.getElementById('message').classList.add('d-none'); document.getElementById('message-mobile').classList.add('d-none'); document.getElementById('message-preview').classList.add('d-none'); @@ -82,7 +83,7 @@ function submitFormAjax(e) { const form = e.target; const xhr = new XMLHttpRequest(); - e.preventDefault(); + // TODO: partially combine with postToast? formData = new FormData(form); @@ -98,34 +99,9 @@ function submitFormAjax(e) { xhr.setRequestHeader('xhr', 'xhr'); xhr.onload = function() { - if (xhr.status >= 200 && xhr.status < 300) { - let data = JSON.parse(xhr.response); - try { - document.getElementById('toast-post-success-text').innerText = data["message"]; - } catch(e) { - document.getElementById('toast-post-success-text').innerText = "Action successful!"; - } - var myToast = bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-success')); - myToast.show(); - return true - } else { - document.getElementById('toast-post-error-text').innerText = "Error, please try again later." - try { - let data=JSON.parse(xhr.response); - var myToast = bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')); - myToast.show(); - if (data && data["error"]) document.getElementById('toast-post-error-text').innerText = data["error"]; - if (data && data["details"]) document.getElementById('toast-post-error-text').innerText = data["details"]; - } catch(e) { - var myToast = bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-success')); - myToast.hide(); - var myToast = bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')); - myToast.show(); - } - } + showToastFromXhr(xhr, null); }; xhr.send(formData); - - return false + return false; }