Skip to content

Redirecionar usuário para a seção correta da página da IRI ao clicar … #49

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Piazzi merged 1 commit into from
Nov 1, 2021
+109 −52
Merged

Redirecionar usuário para a seção correta da página da IRI ao clicar … #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
49 changes: 34 additions & 15 deletions public/js/Compiler.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,9 +70,9 @@ function removePreviousConsoleMessages() {
function resetVariables() {
previousCells = classes.concat(relations).concat(instances);
(classes = []),
(relations = []),
(instances = []),
(datatypeProperties = []);
(relations = []),
(instances = []),
(datatypeProperties = []);
(warningsCount = 0), (basicErrorsCount = 0), (conceptualErrorsCount = 0);
compilerCounter++;
}
Expand Down Expand Up @@ -306,9 +306,9 @@ function compileClass(classCell) {
// Shows a error message if two classes has the same relation between them more than one time
let connectedRelations = classCell.edges.filter(
(relation) =>
relation.target !== null &&
relation.source !== null &&
relation.getAttribute("label") !== ""
relation.target !== null &&
relation.source !== null &&
relation.getAttribute("label") !== ""
);
for (let i = 0; i < connectedRelations.length; i++) {
for (let j = 0; j < connectedRelations.length; j++) {
Expand Down Expand Up @@ -458,7 +458,7 @@ function compileInstance(instance) {
});
}
*/

}

/**
Expand Down Expand Up @@ -732,6 +732,26 @@ function updateSaveButtonInFrontEnd(saved) {
if (compilerCounter > 1) saveOntology.style.visibility = "visible";
}


/**
* Update the save button error in the front end
*/
function updateSaveButtonErrorInFrontEnd() {
let message = "";
let icon = document.createElement("i");
icon.className = "fa fa-fw fa-cloud-upload";
// Updates the save file button
if (getLanguage() == "pt") message = "Ocorreu um erro ao salvar as alterações";
else message = "An error occurred saving changes";
saveOntology.classList.add("unsaved");
saveOntology.classList.remove("saved");
saveOntology.innerHTML = message;
saveOntology.prepend(icon);

// shows the button only if the user has made chances in the empty diagram
if (compilerCounter > 1) saveOntology.style.visibility = "visible";
}

/**
* Updates the counters in the front end
* @param warningsCount
Expand Down Expand Up @@ -906,7 +926,7 @@ function getCellsNamesById(ids) {
* @param {mxCell} element
*/
function setErrorFlag(element) {
if(element != undefined && !element.style.includes("error=true;"))
if (element != undefined && !element.style.includes("error=true;"))
element.setStyle(element.style + "error=true;");
}

Expand All @@ -918,23 +938,22 @@ function setErrorFlag(element) {
*/
function setElementColor(element) {

if (element.style.includes("error=true;"))
{
if(!element.style.includes("strokeColor=#d73925;")){
if (element.style.includes("error=true;")) {
if (!element.style.includes("strokeColor=#d73925;")) {
editor.graph.setCellStyles(mxConstants.STYLE_STROKECOLOR, '#d73925', [element])
}
}
// remove error flag and return the cell to its default colors
else {
element.setStyle(element.style.replace("error=true;", ""));
let color;
if(element.style.includes('Relation'))
if (element.style.includes('Relation'))
color = '#004C99';
else if(element.style.includes('Class'))
else if (element.style.includes('Class'))
color = '#f39c12';
else if(element.style.includes('Instance'))
else if (element.style.includes('Instance'))
color = '#663399';
else if(element.style.includes('DatatypeProperty'))
else if (element.style.includes('DatatypeProperty'))
color = '#006633';
else
return
Expand Down
70 changes: 36 additions & 34 deletions public/js/OntologyManager.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
var ontologyName = document.getElementById("ontology-name");

function saveName(event){
if(event.key == 'Enter'){
function saveName(event) {
if (event.key == 'Enter') {
document.getElementById('save-ontology').click();
$('.name-input').blur();
}
}

function favoriteOntology(){
function favoriteOntology() {
$.ajax({
/* the route pointing to the post function */
url: '/' + getLanguage() + '/favouriteOntologyIndex',
Expand All @@ -20,22 +20,22 @@ function favoriteOntology(){

dataType: 'JSON',
success: function (data) {
if(data['favourite'] == 1)
if (data['favourite'] == 1)
document.getElementById('favorite-ontology').innerHTML = '<i style="color:#f39c12" class="fa fa-fw fa-star"></i>';
else
else
document.getElementById('favorite-ontology').innerHTML = '<i class="fa fa-fw fa-star-o"></i>';
},

error: function() {
error: function () {
alert('You already have 5 favourite ontologies');
}
})
}

// Request to open an ontology
document.addEventListener("DOMContentLoaded", function() {
document.addEventListener("DOMContentLoaded", function () {
let CSRF_TOKEN = document.querySelector('meta[name="csrf-token"]').getAttribute('content');

// Fires the Ajax request when the button is clicked
// Open the selected ontology
$(".openOntology").click(function () {
Expand All @@ -44,18 +44,18 @@ document.addEventListener("DOMContentLoaded", function() {
url: '/openOntology',
type: 'POST',
/* send the csrf-token and the input to the controller */
data: {_token: CSRF_TOKEN, id: this.getAttribute('id')},
data: { _token: CSRF_TOKEN, id: this.getAttribute('id') },
dataType: 'JSON',
/* remind that 'data' is the response of the OntologyController */
success: function (data) {
let doc = mxUtils.parseXml(data['file']);
editor.setGraphXml(doc.documentElement);

document.getElementsByClassName('name-input').value = data['name'];

document.getElementById('id').value = data['id'];
document.getElementById('name-input').value = data['name'];
document.getElementById('ontology-iri').value = "https://onto4alleditor.com/en/ontologies/"+data['id'];
document.getElementById('ontology-iri').value = "https://onto4alleditor.com/en/ontologies/" + data['id'];
document.getElementById('publication-date').value = data['publication_date'];
document.getElementById('last-uploaded').value = data['last_uploaded'];
document.getElementById('description').value = data['description'];
Expand All @@ -74,37 +74,38 @@ document.addEventListener("DOMContentLoaded", function() {
// Select the namespaces on the <select> tag
$('#namespace-select').val(data['namespace']).trigger('change');


// Select the collaborators on the <select> tag
$('#collaborators-select').val(data['collaborators']).trigger('change');

//Show when the ontology was last updated
document.getElementById('last-update').innerHTML = '<span class="time"><i class="fa fa-clock-o"></i> ' + 'Last update: ' + data['last_update'];
//Update the little star on the navbar
if(data['favourite'] == 1)
if (data['favourite'] == 1)
document.getElementById('favorite-ontology').innerHTML = '<i style="color:#f39c12" class="fa fa-fw fa-star"></i>';
else
else
document.getElementById('favorite-ontology').innerHTML = '<i class="fa fa-fw fa-star-o"></i>';
updateSaveButtonInFrontEnd(true);
},
error: function(jqXHR, textStatus, errorThrown) {
error: function (jqXHR, textStatus, errorThrown) {
console.log(JSON.stringify(jqXHR));
console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
alert('The following error has occurred: ' + JSON.stringify(jqXHR));

updateSaveButtonErrorInFrontEnd();
}
})
});
});


// Request to save the current ontology
document.addEventListener("DOMContentLoaded", function() {
document.addEventListener("DOMContentLoaded", function () {

let CSRF_TOKEN = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
// Fires the Ajax request when the button is clicked

document.getElementById('save-ontology').addEventListener('click', function () {
document.getElementById('save-ontology').innerHTML='<div class="overlay"><i style="color: white !important;" class="fa fa-spinner fa-spin"></i></div>';
document.getElementById('save-ontology').innerHTML = '<div class="overlay"><i style="color: white !important;" class="fa fa-spinner fa-spin"></i></div>';
document.getElementById('save-ontology').style.backgroundColor = "#00a65a";
document.getElementById('save-ontology').style.borderColor = "#00a65a";
$.ajax({
Expand Down Expand Up @@ -142,55 +143,56 @@ document.addEventListener("DOMContentLoaded", function() {
document.getElementById('last-update').innerHTML = '<span class="time"><i class="fa fa-clock-o"></i> ' + 'Last update: ' + data['updated_at'];;
},

error: function(jqXHR, textStatus, errorThrown) {
error: function (jqXHR, textStatus, errorThrown) {
console.log(JSON.stringify(jqXHR));
console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
alert('The following error has occurred: ' + JSON.stringify(jqXHR));

updateSaveButtonErrorInFrontEnd();
}
})
});

});

// Reads the current ontology XML and then writes the report on a string for download
document.addEventListener("DOMContentLoaded", function() {
document.addEventListener("DOMContentLoaded", function () {
document.getElementById('download-ontology-report').addEventListener('click', function () {

let report = '/************* Ontology Report *************/ \n\nClasses:';

// write the classes in the document
classes.forEach(ontologyClass => {
report = report + '\n Class: '+ ontologyClass.value.attributes['label'].value + ' | ID: ' + ontologyClass.id;
report = report + '\n Class: ' + ontologyClass.value.attributes['label'].value + ' | ID: ' + ontologyClass.id;
report = report + '\n Properties:';
for (let i = 0; i < ontologyClass.value.attributes.length; i++)
report = report + '\n - '+ontologyClass.value.attributes[i].name+': '+ ontologyClass.value.attributes[i].value;
report = report+ '\n ----------------------------------------';
for (let i = 0; i < ontologyClass.value.attributes.length; i++)
report = report + '\n - ' + ontologyClass.value.attributes[i].name + ': ' + ontologyClass.value.attributes[i].value;
report = report + '\n ----------------------------------------';
});

report = report + '\nRelations: ';

// write the relations in the document
relations.forEach(relation => {
report = report + '\n Relation: '+ relation.value.attributes['label'].value + ' | ID: ' + relation.id;
report = report + '\n Relation: ' + relation.value.attributes['label'].value + ' | ID: ' + relation.id;
report = report + '\n Properties:';
for (let i = 0; i < relation.value.attributes.length; i++)
report = report + '\n - '+relation.value.attributes[i].name+': '+ relation.value.attributes[i].value;
report = report+ '\n ----------------------------------------';
for (let i = 0; i < relation.value.attributes.length; i++)
report = report + '\n - ' + relation.value.attributes[i].name + ': ' + relation.value.attributes[i].value;
report = report + '\n ----------------------------------------';
});

report = report + '\n\n/************ Made with Onto4ALL ************/';
document.getElementById('download-ontology-report').setAttribute("href", "data:text/plain;charset=UTF-8," + encodeURIComponent(report));
})

});

// Downloads a .txt file containing all the errors that the user made in the current ontology
document.getElementById('download-errors-txt').addEventListener('click', function(){
document.getElementById('download-errors-txt').addEventListener('click', function () {
let consoleMessages = document.getElementsByClassName('direct-chat-text');
let txts = "";
for (let i = 0; i < consoleMessages.length; i++)
for (let i = 0; i < consoleMessages.length; i++)
txts = txts + consoleMessages[i].textContent;

this.href = "data:text/plain;charset=UTF-8," + encodeURIComponent(txts);
});

Expand Down
42 changes: 39 additions & 3 deletions resources/views/ontologies/ontologies-show.blade.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -441,6 +441,8 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>
$xml = str_replace('"', '\"', $ontology->xml_string);
@endphp

<div id="scroll"></div>

@stop

@section('footer')
Expand Down Expand Up @@ -492,6 +494,17 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>
<script src="../../grapheditor/src/js/util/mxUtils.js"></script>
<script src="../../js/Compiler.js"></script>
<script type="text/javascript">
$(document).ready(function() {
if ($(location).attr('hash') != null) {

$($(location).attr('hash')).parent().parent().parent().parent().parent().parent().parent().collapse('show');

$('html, body').animate({
scrollTop: $($(location).attr('hash')).offset().top
}, 'slow');
}
});

var container = document.getElementById("graph");
var graph = new Graph(container, null, null, null, null);

Expand Down Expand Up @@ -552,8 +565,6 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>
$('.informations-annotation:last').find('#versionInfo').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("versionInfo"));

console.log(xmlDoc.getElementsByTagName("mxCell")[i].getAttribute("style"));

if (xmlDoc.getElementsByTagName("object")[i].getAttribute("label") != null) {

// Apenas instancias tem o atributo types
Expand All @@ -563,7 +574,11 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>
newel.show();
$(newel).insertAfter(".informations-instance:last");

$('.informations-instance:last').find('#nome').text(xmlDoc.getElementsByTagName("object")[i].getAttribute(
$('.informations-instance:last').find('#nome').text(xmlDoc.getElementsByTagName("object")[i]
.getAttribute(
"label"));
$('.informations-instance:last').find('#nome').attr('id', xmlDoc.getElementsByTagName("object")[i]
.getAttribute(
"label"));

$('.informations-instance:last').find('#types').val(xmlDoc.getElementsByTagName("object")[i]
Expand Down Expand Up @@ -598,20 +613,31 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>
$(newel).insertAfter(".informations-aresta:last");

$('.informations-aresta:last').find('#nome').text(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("label"));

$('.informations-aresta:last').find('#nome').attr('id', xmlDoc.getElementsByTagName("object")[i]
.getAttribute(
"label"));


$('.informations-aresta:last').find('#SubClassOf').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("SubClassOf"));

$('.informations-aresta:last').find('#DisjointWith').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("DisjointWith"));

$('.informations-aresta:last').find('#Equivalence').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("Equivalence"));

$('.informations-aresta:last').find('#TargetForKey').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("TargetForKey"));

$('.informations-aresta:last').find('#Domain').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("Domain"));

$('.informations-aresta:last').find('#Range').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("Range"));

$('.informations-aresta:last').find('#InverseOf').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("InverseOf"));

Expand All @@ -623,14 +649,24 @@ class="form-control form-textarea"> {{ $ontology->description }}</textarea>

$('.informations-no:last').find('#nome').text(xmlDoc.getElementsByTagName("object")[i].getAttribute(
"label"));

$('.informations-no:last').find('#nome').attr('id', xmlDoc.getElementsByTagName("object")[i]
.getAttribute(
"label"));


$('.informations-no:last').find('#SubClassOf').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("SubClassOf"));

$('.informations-no:last').find('#DisjointWith').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("DisjointWith"));

$('.informations-no:last').find('#Equivalence').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("Equivalence"));

$('.informations-no:last').find('#TargetForKey').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("TargetForKey"));

$('.informations-no:last').find('#Instances').val(xmlDoc.getElementsByTagName("object")[i]
.getAttribute("Instances"));

Expand Down