From dcedddcad68fd1cf64eb61f7046561b83261eb67 Mon Sep 17 00:00:00 2001 From: johnnyq Date: Tue, 19 Nov 2024 15:33:14 -0500 Subject: [PATCH] Moved AI Reword Buttons to the WYSISYG toolbar, Seperated Document and ticket toolbars. Ticket Toolbar has items related to tickets while document has additional items related to documents --- admin_settings_ai.php | 6 +- blank.php | 4 + client_asset_bulk_add_ticket_modal.php | 13 +- client_document_add_modal.php | 13 +- client_document_edit_modal.php | 16 +- js/app.js | 237 +++++++++++++++++++++---- recurring_ticket_add_modal.php | 2 +- ticket.php | 6 +- ticket_add_modal.php | 13 +- 9 files changed, 214 insertions(+), 96 deletions(-) diff --git a/admin_settings_ai.php b/admin_settings_ai.php index e36f1464..91eba539 100644 --- a/admin_settings_ai.php +++ b/admin_settings_ai.php @@ -63,10 +63,8 @@ require_once "inc_all_admin.php";
-

Test Input Text to Reword

- - - +
Test AI Rewording
+
diff --git a/blank.php b/blank.php index 7e7356ed..2e83e0bf 100644 --- a/blank.php +++ b/blank.php @@ -39,7 +39,11 @@ echo getUserAgent();
+ + + + -
- +
-
- - -
- -
- -
- -
diff --git a/client_document_add_modal.php b/client_document_add_modal.php index 0f43c3f8..f493fb11 100644 --- a/client_document_add_modal.php +++ b/client_document_add_modal.php @@ -15,20 +15,9 @@
-
- +
- -
- - -
- -
- -
-
diff --git a/client_document_edit_modal.php b/client_document_edit_modal.php index 0a313042..4a6904d7 100644 --- a/client_document_edit_modal.php +++ b/client_document_edit_modal.php @@ -18,22 +18,10 @@
-
- +
- -
- - -
- -
- -
- - - +
diff --git a/js/app.js b/js/app.js index d45bb760..ca1e78a3 100644 --- a/js/app.js +++ b/js/app.js @@ -42,9 +42,9 @@ tinymce.init({ plugins: 'link image lists table code codesample fullscreen autoresize', }); -// Initialize TinyMCE AI +// Initialize TinyMCE tinymce.init({ - selector: '.tinymceai', + selector: '.tinymceAI', browser_spellcheck: true, contextmenu: false, resize: true, @@ -55,7 +55,140 @@ tinymce.init({ menubar: false, statusbar: false, toolbar: [ - 'styles bold italic forecolor bullist numlist alignleft aligncenter alignright alignjustify outdent indent table code fullscreen' + { name: 'styles', items: [ 'styles' ] }, + { name: 'formatting', items: [ 'bold', 'italic', 'forecolor' ] }, + { 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' + }, + plugins: 'link image lists table code codesample fullscreen autoresize', + 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', + 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' ] } + ], + mobile: { + menubar: false, + plugins: 'autosave lists autolink', + toolbar: 'bold italic styles' + }, + plugins: 'link image lists table code fullscreen autoresize', + +}); + +// 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' ] } ], mobile: { menubar: false, @@ -63,42 +196,74 @@ tinymce.init({ }, plugins: 'link image lists table code codesample fullscreen autoresize', setup: function(editor) { - var previousContent = ''; // Initialize previousContent outside the event listener - document.getElementById('rewordButton').addEventListener('click', function() { - var content = editor.getContent(); - previousContent = content; // Store the current content before rewording - var rewordButton = document.getElementById('rewordButton'); - var undoButton = document.getElementById('undoButton'); + var rewordButtonApi; - // Disable the Reword button and show loading state - rewordButton.disabled = true; - rewordButton.innerText = 'Processing...'; + editor.ui.registry.addButton('reword', { + icon: 'ai', + tooltip: 'Reword Text', + onAction: function() { + var content = editor.getContent(); - fetch('post.php?ai_reword', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ text: content }), - }) - .then(response => response.json()) - .then(data => { - editor.setContent(data.rewordedText || 'Error: Could not reword the text.'); - rewordButton.disabled = false; - rewordButton.innerText = 'Reword'; // Reset button text - undoButton.style.display = 'inline'; // Show the Undo button - }) - .catch(error => { - console.error('Error:', error); - rewordButton.disabled = false; - rewordButton.innerText = 'Reword'; // Reset button text - }); + // Disable the Reword button + rewordButtonApi.setEnabled(false); - // Setup the Undo button click event only once, not every time the reword button is clicked - undoButton.onclick = function() { - editor.setContent(previousContent); - this.style.display = 'none'; // Hide the Undo button again - }; + // 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) + }; + } }); } }); diff --git a/recurring_ticket_add_modal.php b/recurring_ticket_add_modal.php index 5605b1be..8413d940 100644 --- a/recurring_ticket_add_modal.php +++ b/recurring_ticket_add_modal.php @@ -45,7 +45,7 @@
- +
diff --git a/ticket.php b/ticket.php index dffe0a99..90527662 100644 --- a/ticket.php +++ b/ticket.php @@ -624,7 +624,7 @@ if (isset($_GET['ticket_id'])) {
- +
@@ -674,10 +674,6 @@ if (isset($_GET['ticket_id'])) {
- - - -
diff --git a/ticket_add_modal.php b/ticket_add_modal.php index 35f21f62..02016067 100644 --- a/ticket_add_modal.php +++ b/ticket_add_modal.php @@ -112,21 +112,10 @@
-
- +
-
- - -
- -
- -
- -