mirror of https://github.com/itflow-org/itflow
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
This commit is contained in:
parent
9d44d3e849
commit
dcedddcad6
|
|
@ -63,10 +63,8 @@ require_once "inc_all_admin.php";
|
|||
</form>
|
||||
|
||||
<div class="mt-5">
|
||||
<h1>Test Input Text to Reword</h1>
|
||||
<textarea id="textInput" class="form-control tinymceai mb-3" rows="10"></textarea>
|
||||
<button id="rewordButton" class="btn btn-primary"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
<h5>Test AI Rewording</h5>
|
||||
<textarea id="textInput" class="form-control tinymceAI mb-3" rows="10"></textarea>
|
||||
</div>
|
||||
|
||||
<script src="js/ai_reword.js"></script>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,11 @@ echo getUserAgent();
|
|||
|
||||
<?php echo randomString(100); ?>
|
||||
<br>
|
||||
<textarea class="tinymceTest"></textarea>
|
||||
|
||||
<textarea class="tinymce"></textarea>
|
||||
|
||||
<textarea class="tinymceTicket"></textarea>
|
||||
<?php
|
||||
// show the current Date and Time
|
||||
$date_time = date('Y-m-d H:i:s');
|
||||
|
|
|
|||
|
|
@ -22,21 +22,10 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<?php if($config_ai_enable) { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymceai" id="textInput" name="bulk_details"></textarea>
|
||||
<textarea class="form-control tinymceTicket<?php if($config_ai_enable) { echo "AI"; } ?>" id="textInput" name="bulk_details"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<button id="rewordButton" class="btn btn-primary" type="button"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary" type="button" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
</div>
|
||||
<?php } else { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce" rows="5" name="bulk_details"></textarea>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col">
|
||||
|
|
|
|||
|
|
@ -15,20 +15,9 @@
|
|||
<input type="text" class="form-control" name="name" placeholder="Name" required autofocus>
|
||||
</div>
|
||||
|
||||
<?php if($config_ai_enable) { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymceai" id="textInput" name="content"></textarea>
|
||||
<textarea class="form-control tinymce<?php if($config_ai_enable) { echo "AI"; } ?>" id="textInput" name="content"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<button id="rewordButton" class="btn btn-primary" type="button"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary" type="button" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
</div>
|
||||
<?php } else { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce" name="content"></textarea>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="folderSelect">Select Folder</label>
|
||||
|
|
|
|||
|
|
@ -18,22 +18,10 @@
|
|||
<input type="text" class="form-control" name="name" value="<?php echo $document_name; ?>" placeholder="Name" required>
|
||||
</div>
|
||||
|
||||
<?php if($config_ai_enable) { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymceai" id="textInput" name="content"><?php echo $document_content; ?></textarea>
|
||||
<textarea class="form-control tinymce<?php if($config_ai_enable) { echo "AI"; } ?>" id="textInput" name="content"><?php echo $document_content; ?></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<button id="rewordButton" class="btn btn-primary" type="button"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary" type="button" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
</div>
|
||||
<?php } else { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce" name="content"><?php echo $document_content; ?></textarea>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
|
|
|
|||
237
js/app.js
237
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)
|
||||
};
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce" name="details"></textarea>
|
||||
<textarea class="form-control tinymceTicket<?php if($config_ai_enable) { echo "AI"; } ?>" id="textInput" name="details"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
|
|
|
|||
|
|
@ -624,7 +624,7 @@ if (isset($_GET['ticket_id'])) {
|
|||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce<?php if ($config_ai_enable) { echo "ai"; } ?>" id="textInput" name="ticket_reply" placeholder="Type a response"></textarea>
|
||||
<textarea class="form-control tinymceTicket<?php if ($config_ai_enable) { echo "AI"; } ?>" id="textInput" name="ticket_reply" placeholder="Type a response"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
|
|
@ -674,10 +674,6 @@ if (isset($_GET['ticket_id'])) {
|
|||
|
||||
<div class="col-md-3">
|
||||
<div class="btn-toolbar float-right">
|
||||
<?php if ($config_ai_enable) { ?>
|
||||
<button id="rewordButton" class="btn btn-secondary ml-3" type="button"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary ml-3" type="button" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
<?php } ?>
|
||||
<button type="submit" id="ticket_add_reply" name="add_ticket_reply" class="btn btn-success ml-3"><i class="fas fa-check mr-2"></i>Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -112,21 +112,10 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<?php if($config_ai_enable) { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymceai" id="detailsInput" name="details"></textarea>
|
||||
<textarea class="form-control tinymceTicket<?php if($config_ai_enable) { echo "AI"; } ?>" id="detailsInput" name="details"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<button id="rewordButton" class="btn btn-primary" type="button"><i class="fas fa-fw fa-robot mr-2"></i>Reword</button>
|
||||
<button id="undoButton" class="btn btn-secondary" type="button" style="display:none;"><i class="fas fa-fw fa-redo-alt mr-2"></i>Undo</button>
|
||||
</div>
|
||||
<?php } else { ?>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control tinymce" id="detailsInput" rows="5" name="details"></textarea>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col">
|
||||
|
|
|
|||
Loading…
Reference in New Issue