- Move global config files to globals iso global folder, as the name global conflicts with python language
- Creation of Traicie Vancancy Definition specialist - Allow to invoke non-interaction specialists from withing Evie's mgmt interface (eveai_app) - Improvements to crewai specialized classes - Introduction to json editor for showing specialists arguments and results in a better way - Introduction of more complex pagination (adding extra arguments) by adding a global 'get_pagination_html' - Allow follow-up of ChatSession / Specialist execution - Improvement in logging of Specialists (but needs to be finished)
This commit is contained in:
@@ -17,6 +17,188 @@
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/10.1.0/jsoneditor.min.css" rel="stylesheet" type="text/css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/10.1.0/jsoneditor.min.js"></script>
|
||||
|
||||
<script>
|
||||
window.EveAI = window.EveAI || {};
|
||||
|
||||
// Centraal beheer van JSONEditor instanties
|
||||
window.EveAI.JsonEditors = {
|
||||
instances: {},
|
||||
|
||||
// Initialiseer een nieuwe JSONEditor
|
||||
initialize: function(containerId, data, options = {}) {
|
||||
const container = document.getElementById(containerId);
|
||||
|
||||
if (!container) {
|
||||
console.error(`Container with ID ${containerId} not found`);
|
||||
return null;
|
||||
}
|
||||
|
||||
if (this.instances[containerId]) {
|
||||
console.log(`JSONEditor for ${containerId} already initialized`);
|
||||
return this.instances[containerId];
|
||||
}
|
||||
|
||||
// Bepaal of de editor in read-only modus moet worden weergegeven
|
||||
const isReadOnly = options.readOnly === true;
|
||||
|
||||
// Standaard opties
|
||||
const defaultOptions = {
|
||||
mode: isReadOnly ? 'tree' : 'tree', // Gebruik 'tree' voor read-only om expand/collapse te behouden
|
||||
modes: isReadOnly ? ['tree', 'view'] : ['tree', 'code', 'view'], // Voeg 'tree' toe aan read-only modes
|
||||
search: true,
|
||||
navigationBar: false,
|
||||
mainMenuBar: true, // Behoud menubar voor expand/collapse knoppen
|
||||
statusBar: !isReadOnly // Verberg alleen statusbar in read-only modus
|
||||
};
|
||||
|
||||
// Als expliciet onEditable=false is ingesteld, zorg ervoor dat de editor read-only is
|
||||
if (options.onEditable === false || options.onEditable && typeof options.onEditable === 'function') {
|
||||
defaultOptions.onEditable = function() { return false; };
|
||||
}
|
||||
|
||||
// Combineer standaard opties met aangepaste opties
|
||||
const editorOptions = {...defaultOptions, ...options};
|
||||
|
||||
try {
|
||||
const editor = new JSONEditor(container, editorOptions, data);
|
||||
container.classList.add('jsoneditor-initialized');
|
||||
|
||||
// Voeg read-only klasse toe indien nodig
|
||||
if (isReadOnly) {
|
||||
container.classList.add('jsoneditor-readonly-mode');
|
||||
} else {
|
||||
container.classList.add('jsoneditor-edit-mode');
|
||||
}
|
||||
|
||||
this.instances[containerId] = editor;
|
||||
return editor;
|
||||
} catch (e) {
|
||||
console.error(`Error initializing JSONEditor for ${containerId}:`, e);
|
||||
container.innerHTML = `<div class="alert alert-danger p-3">
|
||||
<strong>Error loading JSON data:</strong><br>${e.message}
|
||||
</div>`;
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
// Initialiseer een read-only JSONEditor (handige functie)
|
||||
initializeReadOnly: function(containerId, data, additionalOptions = {}) {
|
||||
const readOnlyOptions = {
|
||||
readOnly: true,
|
||||
mode: 'tree', // Gebruik tree mode voor navigatie
|
||||
modes: ['tree', 'view'], // Beperk tot tree en view
|
||||
expandAll: true, // Alles openklappen bij initialisatie
|
||||
onEditable: function() { return false; }
|
||||
};
|
||||
|
||||
// Combineer read-only opties met eventuele aanvullende opties
|
||||
const options = {...readOnlyOptions, ...additionalOptions};
|
||||
|
||||
return this.initialize(containerId, data, options);
|
||||
},
|
||||
|
||||
// Haal een bestaande instantie op of maak een nieuwe aan
|
||||
get: function(containerId, data, options = {}) {
|
||||
if (this.instances[containerId]) {
|
||||
return this.instances[containerId];
|
||||
}
|
||||
|
||||
return this.initialize(containerId, data, options);
|
||||
},
|
||||
|
||||
// Verwijder een instantie
|
||||
destroy: function(containerId) {
|
||||
if (this.instances[containerId]) {
|
||||
this.instances[containerId].destroy();
|
||||
delete this.instances[containerId];
|
||||
|
||||
const container = document.getElementById(containerId);
|
||||
if (container) {
|
||||
container.classList.remove('jsoneditor-initialized');
|
||||
container.classList.remove('jsoneditor-readonly-mode');
|
||||
container.classList.remove('jsoneditor-edit-mode');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Zoek en initialiseer standaard JSON editors bij DOMContentLoaded
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize tooltips
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl)
|
||||
});
|
||||
|
||||
// Initialiseer JSON editors voor tekstgebieden met de klasse 'json-editor'
|
||||
document.querySelectorAll('.json-editor').forEach(function(textarea) {
|
||||
// Controleer of er een bijbehorende container is
|
||||
const containerId = textarea.id + '-editor';
|
||||
const container = document.getElementById(containerId);
|
||||
|
||||
if (container) {
|
||||
try {
|
||||
// Parse de JSON-data uit het tekstgebied
|
||||
const data = textarea.value ? JSON.parse(textarea.value) : {};
|
||||
|
||||
// Controleer of de editor in read-only modus moet worden getoond
|
||||
const isReadOnly = textarea.readOnly || textarea.hasAttribute('readonly') ||
|
||||
textarea.classList.contains('readonly');
|
||||
|
||||
// Bepaal de juiste editor-opties op basis van de read-only status
|
||||
const editorOptions = {
|
||||
mode: isReadOnly ? 'tree' : 'code', // Gebruik tree voor read-only
|
||||
modes: isReadOnly ? ['tree', 'view'] : ['code', 'tree'],
|
||||
readOnly: isReadOnly,
|
||||
onEditable: function() { return !isReadOnly; },
|
||||
onChangeText: isReadOnly ? undefined : function(jsonString) {
|
||||
textarea.value = jsonString;
|
||||
}
|
||||
};
|
||||
|
||||
// Initialiseer de editor
|
||||
const editor = window.EveAI.JsonEditors.initialize(containerId, data, editorOptions);
|
||||
|
||||
// Voeg validatie toe als het een bewerkbare editor is
|
||||
if (!isReadOnly && editor) {
|
||||
editor.validate().then(function(errors) {
|
||||
if (errors.length) {
|
||||
container.style.border = '2px solid red';
|
||||
} else {
|
||||
container.style.border = '1px solid #ccc';
|
||||
}
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Error parsing initial JSON:', e);
|
||||
container.innerHTML = `<div class="alert alert-danger p-3">
|
||||
<strong>Error loading JSON data:</strong><br>${e.message}
|
||||
</div>`;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Initialiseer JSON editors voor containers met de klasse 'json-viewer' (alleen-lezen)
|
||||
document.querySelectorAll('.json-viewer').forEach(function(container) {
|
||||
const dataElement = document.getElementById(container.id + '-data');
|
||||
|
||||
if (dataElement) {
|
||||
try {
|
||||
// Parse de JSON-data
|
||||
const data = dataElement.textContent ? JSON.parse(dataElement.textContent) : {};
|
||||
|
||||
// Initialiseer een read-only editor met tree-mode voor navigatie
|
||||
window.EveAI.JsonEditors.initializeReadOnly(container.id, data);
|
||||
} catch (e) {
|
||||
console.error('Error parsing JSON for viewer:', e);
|
||||
container.innerHTML = `<div class="alert alert-danger p-3">
|
||||
<strong>Error loading JSON data:</strong><br>${e.message}
|
||||
</div>`;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize tooltips
|
||||
@@ -156,6 +338,24 @@ function validateTableSelection(formId) {
|
||||
return true;
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
// Maak tabelrijen klikbaar (voor tabellen met radio-buttons)
|
||||
$(document).on('click', 'table tbody tr', function(e) {
|
||||
// Voorkom dat dit gedrag optreedt als er direct op de radio-button of een link wordt geklikt
|
||||
if (!$(e.target).is('input[type="radio"], a')) {
|
||||
// Vind de radio-button in deze rij
|
||||
const radio = $(this).find('input[type="radio"]');
|
||||
// Selecteer de radio-button
|
||||
radio.prop('checked', true);
|
||||
// Voeg visuele feedback toe voor de gebruiker
|
||||
$('table tbody tr').removeClass('table-active');
|
||||
$(this).addClass('table-active');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.json-editor-container {
|
||||
height: 400px;
|
||||
|
||||
Reference in New Issue
Block a user