From df8a7554629791b194be6e8d536cc9b6836a642d Mon Sep 17 00:00:00 2001 From: johnnyq Date: Sun, 23 Mar 2025 18:08:14 -0400 Subject: [PATCH] Wrap a wait before the DOM is loaded before loading anything calling anything in app.js --- js/app.js | 779 +++++++++++++++++++++++++++--------------------------- 1 file changed, 392 insertions(+), 387 deletions(-) diff --git a/js/app.js b/js/app.js index d30c38e4..7ad81a74 100644 --- a/js/app.js +++ b/js/app.js @@ -1,21 +1,157 @@ -//Prevents resubmit on forms -if(window.history.replaceState){ - window.history.replaceState(null, null, window.location.href); -} +$(document).ready(function() { + //Prevents resubmit on forms + if(window.history.replaceState){ + window.history.replaceState(null, null, window.location.href); + } -// Slide alert up after 4 secs -$("#alert").fadeTo(5000, 500).slideUp(500, function(){ - $("#alert").slideUp(500); -}); + // Slide alert up after 4 secs + $("#alert").fadeTo(5000, 500).slideUp(500, function(){ + $("#alert").slideUp(500); + }); -// Initialize Select2 Elements -$('.select2').select2({ - theme: 'bootstrap4', -}); + // Initialize Select2 Elements + $('.select2').select2({ + theme: 'bootstrap4', + }); -// Initialize TinyMCE -tinymce.init({ - selector: '.tinymce', + // Initialize TinyMCE + tinymce.init({ + selector: '.tinymce', + browser_spellcheck: true, + contextmenu: false, + resize: true, + min_height: 300, + max_height: 600, + promotion: false, + branding: false, + menubar: false, + statusbar: false, + toolbar: [ + { name: 'styles', items: [ 'styles' ] }, + { name: 'formatting', items: [ 'bold', 'italic', 'forecolor' ] }, + { name: 'link', items: [ 'link'] }, + { name: 'lists', items: [ 'bullist', 'numlist' ] }, + { name: 'alignment', items: [ 'alignleft', 'aligncenter', 'alignright', 'alignjustify' ] }, + { name: 'indentation', items: [ 'outdent', 'indent' ] }, + { name: 'table', items: [ 'table' ] }, + { name: 'extra', items: [ 'code', 'fullscreen' ] } + ], + mobile: { + menubar: false, + plugins: 'autosave lists autolink', + toolbar: 'bold italic styles' + }, + convert_urls: false, + plugins: 'link image lists table code codesample fullscreen autoresize', + license_key: 'gpl' + }); + + // Initialize TinyMCE + tinymce.init({ + selector: '.tinymceAI', + browser_spellcheck: true, + contextmenu: false, + resize: true, + min_height: 300, + max_height: 600, + promotion: false, + branding: false, + menubar: false, + statusbar: false, + toolbar: [ + { name: 'styles', items: [ 'styles' ] }, + { name: 'formatting', items: [ 'bold', 'italic', 'forecolor' ] }, + { name: 'link', items: [ 'link'] }, + { name: 'lists', items: [ 'bullist', 'numlist' ] }, + { name: 'alignment', items: [ 'alignleft', 'aligncenter', 'alignright', 'alignjustify' ] }, + { name: 'indentation', items: [ 'outdent', 'indent' ] }, + { name: 'table', items: [ 'table' ] }, + { name: 'extra', items: [ 'code', 'fullscreen' ] }, + { name: 'ai', items: [ 'reword', 'undo', 'redo' ] } + ], + mobile: { + menubar: false, + plugins: 'autosave lists autolink', + toolbar: 'bold italic styles' + }, + convert_urls: false, + plugins: 'link image lists table code codesample fullscreen autoresize', + license_key: 'gpl', + setup: function(editor) { + var rewordButtonApi; + + editor.ui.registry.addButton('reword', { + icon: 'ai', + tooltip: 'Reword Text', + onAction: function() { + var content = editor.getContent(); + + // Disable the Reword button + rewordButtonApi.setEnabled(false); + + // Show the progress indicator + editor.setProgressState(true); + + fetch('post.php?ai_reword', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ text: content }), + }) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .then(data => { + editor.undoManager.transact(function() { + editor.setContent(data.rewordedText || 'Error: Could not reword the text.'); + }); + + // Hide the progress indicator + editor.setProgressState(false); + + // Re-enable the Reword button + rewordButtonApi.setEnabled(true); + + // Optional: Show a success notification + editor.notificationManager.open({ + text: 'Text reworded successfully!', + type: 'success', + timeout: 3000 + }); + }) + .catch(error => { + console.error('Error:', error); + + // Hide the progress indicator + editor.setProgressState(false); + + // Re-enable the Reword button + rewordButtonApi.setEnabled(true); + + // Show an error notification + editor.notificationManager.open({ + text: 'An error occurred while rewording the text.', + type: 'error', + timeout: 5000 + }); + }); + }, + onSetup: function(buttonApi) { + rewordButtonApi = buttonApi; + return function() { + // Cleanup when the editor is destroyed (if necessary) + }; + } + }); + } + }); + + tinymce.init({ + selector: '.tinymceTicket', // Your selector browser_spellcheck: true, contextmenu: false, resize: true, @@ -27,27 +163,45 @@ tinymce.init({ statusbar: false, toolbar: [ { name: 'styles', items: [ 'styles' ] }, - { name: 'formatting', items: [ 'bold', 'italic', 'forecolor' ] }, + { name: 'formatting', items: [ 'bold', 'italic', 'forecolor'] }, { name: 'link', items: [ 'link'] }, { name: 'lists', items: [ 'bullist', 'numlist' ] }, - { name: 'alignment', items: [ 'alignleft', 'aligncenter', 'alignright', 'alignjustify' ] }, { name: 'indentation', items: [ 'outdent', 'indent' ] }, - { name: 'table', items: [ 'table' ] }, - { name: 'extra', items: [ 'code', 'fullscreen' ] } + { name: 'custom', items: ['redactButton'] } // Add custom button to toolbar ], mobile: { - menubar: false, - plugins: 'autosave lists autolink', - toolbar: 'bold italic styles' + menubar: false, + plugins: 'autosave lists autolink', + toolbar: 'bold italic styles' }, convert_urls: false, - plugins: 'link image lists table code codesample fullscreen autoresize', - license_key: 'gpl' -}); + plugins: 'link image lists table code fullscreen autoresize', + license_key: 'gpl', + setup: function(editor) { + // Add custom toolbar button with Font Awesome icon + editor.ui.registry.addButton('redactButton', { + icon: 'permanent-pen', + tooltip: 'Redact', // Tooltip text for the button + onAction: function() { + var selectedText = editor.selection.getContent({ format: 'text' }); -// Initialize TinyMCE -tinymce.init({ - selector: '.tinymceAI', + if (selectedText) { + // Replace the selected text with [REDACTED] in bold red + var newContent = '[REDACTED]'; + + // Replace selected content with the new content + editor.selection.setContent(newContent); + } else { + alert('Please select a word to redact'); + } + } + }); + } + }); + + // Initialize TinyMCE AI + tinymce.init({ + selector: '.tinymceTicketAI', browser_spellcheck: true, contextmenu: false, resize: true, @@ -58,396 +212,247 @@ tinymce.init({ menubar: false, statusbar: false, toolbar: [ - { name: 'styles', items: [ 'styles' ] }, - { name: 'formatting', items: [ 'bold', 'italic', 'forecolor' ] }, - { name: 'link', items: [ 'link'] }, - { name: 'lists', items: [ 'bullist', 'numlist' ] }, - { name: 'alignment', items: [ 'alignleft', 'aligncenter', 'alignright', 'alignjustify' ] }, - { name: 'indentation', items: [ 'outdent', 'indent' ] }, - { name: 'table', items: [ 'table' ] }, - { name: 'extra', items: [ 'code', 'fullscreen' ] }, - { name: 'ai', items: [ 'reword', 'undo', 'redo' ] } + { name: 'styles', items: ['styles'] }, + { name: 'formatting', items: ['bold', 'italic', 'forecolor'] }, + { name: 'link', items: ['link'] }, + { name: 'lists', items: ['bullist', 'numlist'] }, + { name: 'indentation', items: ['outdent', 'indent'] }, + { name: 'ai', items: ['reword', 'undo', 'redo'] }, + { name: 'custom', items: ['redactButton'] } // Add custom redact button to toolbar ], mobile: { - menubar: false, - plugins: 'autosave lists autolink', - toolbar: 'bold italic styles' + menubar: false, + toolbar: 'bold italic styles' }, convert_urls: false, plugins: 'link image lists table code codesample fullscreen autoresize', license_key: 'gpl', setup: function(editor) { - var rewordButtonApi; + var rewordButtonApi; - editor.ui.registry.addButton('reword', { - icon: 'ai', - tooltip: 'Reword Text', - onAction: function() { - var content = editor.getContent(); + // Define the Reword button (AI-related button) + editor.ui.registry.addButton('reword', { + icon: 'ai', // Example icon for AI rewording + tooltip: 'Reword Text', + onAction: function() { + var content = editor.getContent(); - // Disable the Reword button - rewordButtonApi.setEnabled(false); + // Disable the Reword button + rewordButtonApi.setEnabled(false); - // Show the progress indicator - editor.setProgressState(true); + // Show the progress indicator + editor.setProgressState(true); - fetch('post.php?ai_reword', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ text: content }), - }) - .then(response => { - if (!response.ok) { - throw new Error('Network response was not ok'); - } - return response.json(); - }) - .then(data => { - editor.undoManager.transact(function() { - editor.setContent(data.rewordedText || 'Error: Could not reword the text.'); - }); - - // Hide the progress indicator - editor.setProgressState(false); - - // Re-enable the Reword button - rewordButtonApi.setEnabled(true); - - // Optional: Show a success notification - editor.notificationManager.open({ - text: 'Text reworded successfully!', - type: 'success', - timeout: 3000 - }); - }) - .catch(error => { - console.error('Error:', error); - - // Hide the progress indicator - editor.setProgressState(false); - - // Re-enable the Reword button - rewordButtonApi.setEnabled(true); - - // Show an error notification - editor.notificationManager.open({ - text: 'An error occurred while rewording the text.', - type: 'error', - timeout: 5000 - }); - }); + fetch('post.php?ai_reword', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', }, - onSetup: function(buttonApi) { - rewordButtonApi = buttonApi; - return function() { - // Cleanup when the editor is destroyed (if necessary) - }; + body: JSON.stringify({ text: content }), + }) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); } - }); - } -}); + return response.json(); + }) + .then(data => { + editor.undoManager.transact(function() { + editor.setContent(data.rewordedText || 'Error: Could not reword the text.'); + }); -tinymce.init({ - selector: '.tinymceTicket', // Your selector - browser_spellcheck: true, - contextmenu: false, - resize: true, - min_height: 300, - max_height: 600, - promotion: false, - branding: false, - menubar: false, - statusbar: false, - toolbar: [ - { name: 'styles', items: [ 'styles' ] }, - { name: 'formatting', items: [ 'bold', 'italic', 'forecolor'] }, - { name: 'link', items: [ 'link'] }, - { name: 'lists', items: [ 'bullist', 'numlist' ] }, - { name: 'indentation', items: [ 'outdent', 'indent' ] }, - { name: 'custom', items: ['redactButton'] } // Add custom button to toolbar - ], - mobile: { - menubar: false, - plugins: 'autosave lists autolink', - toolbar: 'bold italic styles' - }, - convert_urls: false, - plugins: 'link image lists table code fullscreen autoresize', - license_key: 'gpl', - setup: function(editor) { - // Add custom toolbar button with Font Awesome icon - editor.ui.registry.addButton('redactButton', { - icon: 'permanent-pen', - tooltip: 'Redact', // Tooltip text for the button - onAction: function() { - var selectedText = editor.selection.getContent({ format: 'text' }); + // Hide the progress indicator + editor.setProgressState(false); - if (selectedText) { - // Replace the selected text with [REDACTED] in bold red - var newContent = '[REDACTED]'; - - // Replace selected content with the new content - editor.selection.setContent(newContent); - } else { - alert('Please select a word to redact'); + // Re-enable the Reword button + rewordButtonApi.setEnabled(true); + + // Optional: Show a success notification + editor.notificationManager.open({ + text: 'Text reworded successfully!', + type: 'success', + timeout: 3000 + }); + }) + .catch(error => { + console.error('Error:', error); + + // Hide the progress indicator + editor.setProgressState(false); + + // Re-enable the Reword button + rewordButtonApi.setEnabled(true); + + // Show an error notification + editor.notificationManager.open({ + text: 'An error occurred while rewording the text.', + type: 'error', + timeout: 5000 + }); + }); + }, + onSetup: function(buttonApi) { + rewordButtonApi = buttonApi; + return function() { + // Cleanup when the editor is destroyed (if necessary) + }; } - } - }); - } -}); + }); -// Initialize TinyMCE AI -tinymce.init({ - selector: '.tinymceTicketAI', - browser_spellcheck: true, - contextmenu: false, - resize: true, - min_height: 300, - max_height: 600, - promotion: false, - branding: false, - menubar: false, - statusbar: false, - toolbar: [ - { name: 'styles', items: ['styles'] }, - { name: 'formatting', items: ['bold', 'italic', 'forecolor'] }, - { name: 'link', items: ['link'] }, - { name: 'lists', items: ['bullist', 'numlist'] }, - { name: 'indentation', items: ['outdent', 'indent'] }, - { name: 'ai', items: ['reword', 'undo', 'redo'] }, - { name: 'custom', items: ['redactButton'] } // Add custom redact button to toolbar - ], - mobile: { - menubar: false, - toolbar: 'bold italic styles' - }, - convert_urls: false, - plugins: 'link image lists table code codesample fullscreen autoresize', - license_key: 'gpl', - setup: function(editor) { - var rewordButtonApi; + // Add the Redact button + editor.ui.registry.addButton('redactButton', { + icon: 'permanent-pen', + tooltip: 'Redact Text', // Tooltip text for the button + onAction: function() { + var selectedText = editor.selection.getContent({ format: 'text' }); - // Define the Reword button (AI-related button) - editor.ui.registry.addButton('reword', { - icon: 'ai', // Example icon for AI rewording - tooltip: 'Reword Text', - onAction: function() { - var content = editor.getContent(); - - // Disable the Reword button - rewordButtonApi.setEnabled(false); - - // Show the progress indicator - editor.setProgressState(true); - - fetch('post.php?ai_reword', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ text: content }), - }) - .then(response => { - if (!response.ok) { - throw new Error('Network response was not ok'); + if (selectedText) { + // Replace the selected text with [REDACTED] in bold red + var newContent = '[REDACTED]'; + + // Replace selected content with the new content + editor.selection.setContent(newContent); + } else { + alert('Please select a word to redact'); } - return response.json(); - }) - .then(data => { - editor.undoManager.transact(function() { - editor.setContent(data.rewordedText || 'Error: Could not reword the text.'); - }); - - // Hide the progress indicator - editor.setProgressState(false); - - // Re-enable the Reword button - rewordButtonApi.setEnabled(true); - - // Optional: Show a success notification - editor.notificationManager.open({ - text: 'Text reworded successfully!', - type: 'success', - timeout: 3000 - }); - }) - .catch(error => { - console.error('Error:', error); - - // Hide the progress indicator - editor.setProgressState(false); - - // Re-enable the Reword button - rewordButtonApi.setEnabled(true); - - // Show an error notification - editor.notificationManager.open({ - text: 'An error occurred while rewording the text.', - type: 'error', - timeout: 5000 - }); - }); - }, - onSetup: function(buttonApi) { - rewordButtonApi = buttonApi; - return function() { - // Cleanup when the editor is destroyed (if necessary) - }; - } - }); - - // Add the Redact button - editor.ui.registry.addButton('redactButton', { - icon: 'permanent-pen', - tooltip: 'Redact Text', // Tooltip text for the button - onAction: function() { - var selectedText = editor.selection.getContent({ format: 'text' }); - - if (selectedText) { - // Replace the selected text with [REDACTED] in bold red - var newContent = '[REDACTED]'; - - // Replace selected content with the new content - editor.selection.setContent(newContent); - } else { - alert('Please select a word to redact'); } - } - }); - } -}); + }); + } + }); -// Initialize TinyMCE editor with only a redact button -tinymce.init({ - selector: '.tinymceTicketRedact', - browser_spellcheck: false, + // Initialize TinyMCE editor with only a redact button + tinymce.init({ + selector: '.tinymceTicketRedact', + browser_spellcheck: false, + contextmenu: false, + resize: true, + min_height: 300, + max_height: 500, + promotion: false, + branding: false, + menubar: false, + statusbar: false, + license_key: 'gpl', + readonly: true, + toolbar: '', + }); + + tinymce.init({ + selector: '.tinymceRedact', // Your selector + browser_spellcheck: true, contextmenu: false, resize: true, min_height: 300, - max_height: 500, + max_height: 600, promotion: false, branding: false, menubar: false, statusbar: false, + toolbar: 'redactButton', // Only the redact button in the toolbar + mobile: { + menubar: false, + plugins: 'autosave lists autolink', + toolbar: 'redactButton' // Only the redact button on mobile + }, + convert_urls: false, + plugins: 'link image lists table code fullscreen autoresize', license_key: 'gpl', - readonly: true, - toolbar: '', -}); + setup: function(editor) { + // Disable all text input and backspace/delete actions + editor.on('keydown', function(e) { + // Prevent all key events (including backspace and delete) + e.preventDefault(); + }); -tinymce.init({ - selector: '.tinymceRedact', // Your selector - browser_spellcheck: true, - contextmenu: false, - resize: true, - min_height: 300, - max_height: 600, - promotion: false, - branding: false, - menubar: false, - statusbar: false, - toolbar: 'redactButton', // Only the redact button in the toolbar - mobile: { - menubar: false, - plugins: 'autosave lists autolink', - toolbar: 'redactButton' // Only the redact button on mobile - }, - convert_urls: false, - plugins: 'link image lists table code fullscreen autoresize', - license_key: 'gpl', - setup: function(editor) { - // Disable all text input and backspace/delete actions - editor.on('keydown', function(e) { - // Prevent all key events (including backspace and delete) - e.preventDefault(); - }); + // Add custom toolbar button with Font Awesome icon and label + editor.ui.registry.addButton('redactButton', { + icon: 'permanent-pen', + tooltip: 'Redact', // Tooltip text for the button + text: 'REDACT', // Add the text next to the icon + onAction: function() { + var selectedText = editor.selection.getContent({ format: 'text' }); - // Add custom toolbar button with Font Awesome icon and label - editor.ui.registry.addButton('redactButton', { - icon: 'permanent-pen', - tooltip: 'Redact', // Tooltip text for the button - text: 'REDACT', // Add the text next to the icon - onAction: function() { - var selectedText = editor.selection.getContent({ format: 'text' }); - - if (selectedText) { - // Replace the selected text with [REDACTED] in bold red - var newContent = '[REDACTED]'; - - // Replace selected content with the new content - editor.selection.setContent(newContent); - } else { - alert('Please select a word to redact'); + if (selectedText) { + // Replace the selected text with [REDACTED] in bold red + var newContent = '[REDACTED]'; + + // Replace selected content with the new content + editor.selection.setContent(newContent); + } else { + alert('Please select a word to redact'); + } } - } - }); - } -}); - - - -// DateTime -$('.datetimepicker').datetimepicker({ -}); - -// Data Input Mask -$('[data-mask]').inputmask(); - -// ClipboardJS - -//Fix to allow Clipboard Copying within Bootstrap Modals -//For use in Bootstrap Modals or with any other library that changes the focus you'll want to set the focused element as the container value. -$.fn.modal.Constructor.prototype._enforceFocus = function() {}; - -// Tooltip - -$('button').tooltip({ - trigger: 'click', - placement: 'bottom' -}); - -function setTooltip(btn, message) { - $(btn).tooltip('hide') - .attr('data-original-title', message) - .tooltip('show'); -} - -function hideTooltip(btn) { - setTimeout(function() { - $(btn).tooltip('hide'); - }, 1000); -} - -// Clipboard - -var clipboard = new ClipboardJS('.clipboardjs'); - -clipboard.on('success', function(e) { - setTooltip(e.trigger, 'Copied!'); - hideTooltip(e.trigger); -}); - -clipboard.on('error', function(e) { - setTooltip(e.trigger, 'Failed!'); - hideTooltip(e.trigger); -}); - -// Enable Popovers -$(function () { - $('[data-toggle="popover"]').popover() -}); - -// Data Tables -new DataTable('.dataTables'); - -// Initialize International Phone Input -const inputs = document.querySelectorAll('input[type="tel"]'); -// Loop through all the selected inputs and initialize intlTelInput on each one -inputs.forEach(input => { - window.intlTelInput(input, { - initialCountry: "us", - strictMode: true, - loadUtils: () => import("../plugins/intl-tel-input/js/utils.js") // for formatting/placeholders etc + }); + } }); + + + + // DateTime + $('.datetimepicker').datetimepicker({ + }); + + // Data Input Mask + $('[data-mask]').inputmask(); + + // ClipboardJS + + //Fix to allow Clipboard Copying within Bootstrap Modals + //For use in Bootstrap Modals or with any other library that changes the focus you'll want to set the focused element as the container value. + $.fn.modal.Constructor.prototype._enforceFocus = function() {}; + + // Tooltip + + $('button').tooltip({ + trigger: 'click', + placement: 'bottom' + }); + + function setTooltip(btn, message) { + $(btn).tooltip('hide') + .attr('data-original-title', message) + .tooltip('show'); + } + + function hideTooltip(btn) { + setTimeout(function() { + $(btn).tooltip('hide'); + }, 1000); + } + + // Clipboard + + var clipboard = new ClipboardJS('.clipboardjs'); + + clipboard.on('success', function(e) { + setTooltip(e.trigger, 'Copied!'); + hideTooltip(e.trigger); + }); + + clipboard.on('error', function(e) { + setTooltip(e.trigger, 'Failed!'); + hideTooltip(e.trigger); + }); + + // Enable Popovers + $(function () { + $('[data-toggle="popover"]').popover() + }); + + // Data Tables + new DataTable('.dataTables'); + + + // Initialize International Phone Input + const inputs = document.querySelectorAll('input[type="tel"]'); + + // Loop through all the selected inputs and initialize intlTelInput on each one + inputs.forEach(input => { + window.intlTelInput(input, { + initialCountry: "us", + strictMode: true, + loadUtils: () => import("../plugins/intl-tel-input/js/utils.js") // for formatting/placeholders etc + }); + }); + }); \ No newline at end of file