Ridotte le clausole secondo LiDa continua

This commit is contained in:
Luca Trupiano 2022-10-21 12:01:53 +02:00
parent f67f38399b
commit 5896481f4d
2 changed files with 88 additions and 73 deletions

View File

@ -59,6 +59,7 @@
<form>
<div class="tab-content border-right border-left border-bottom" id="cla-TabContent">
<div class="tab-pane fade show active p-2 bg-white" id="cla0" role="tabpanel" aria-labelledby="cla0-tab">
<div class="form-inline input-group p-1 pb-2" action="">
<div class="input-group-prepend">
<label class="input-group-text"><ion-icon name="document-text"></ion-icon></label>
@ -69,52 +70,16 @@
<option disabled value="testo">il testo</option>
</select>
<input type="text" class="form-control" id="queryText" placeholder="stelle" aria-describedby="name-desc" name="query">
<div class="btn-group pl-1" role="group" aria-label="Bottone ricerca">
<div class="btn-group pl-2" role="group" aria-label="Bottone ricerca">
<label class="input-group-text"><ion-icon name="search-circle"></ion-icon></label>
<button type="submit" class="btn btn-outline-primary">Cerca</button>
</div>
</div>
</div>
<div id="cla-Advanced" style="display: none">
<div class="text-muted p-1">
Applicando le clausole:
</div>
<div class=" px-2 pb-2 pt-1 m-2 mx-3 border bg-light" id="cla-list">
<div class="row ml-0 justify-content-between"><div class="pb-1 small font-weight-bold text-muted">AND</div></div>
<ul id="sortable0" class="condLIand list-group ui-sortable">
<li id="H-cla0" class="list-group-item align-items-center ui-state-default ui-state-disabled border text-muted bg-white ui-state-disabled-opacity-06">Nessuna clausola aggiunta.</li>
</ul>
</div>
<div class="btn-group p-1 my-3" role="group" aria-label="Bottoni menu clausole">
<label class="input-group-text"><ion-icon name="filter-circle"></ion-icon></label>
<div class="btn-group dropright" role="group">
<button id="btnGroupDrop1" type="button" class="btn btn-sm btn-outline-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Aggiungi clausola di tipo: </button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
<a class="dropdown-item" id="Grammaticale" href="#"><span class="text-lida8">Categoria grammaticale</span></a>
<a class="dropdown-item" id="Sintattico" href="#"><span class="text-lida9">Tipo sintattico</span></a>
<a class="dropdown-item" id="Metafore" href="#"><span class="text-lida3">Metafore</span></a>
<a class="dropdown-item" id="Dialoghi" href="#"><span class="text-lida4">Dialoghi</span></a>
<a class="dropdown-item" id="Struttura" href="#"><span class="text-lida5">Struttura testo</span></a>
</div>
</div>
</div>
<div class="btn-group p-1 my-3" role="group" aria-label="Bottoni menu logiche">
<label class="input-group-text"><ion-icon name="cog"></ion-icon></label>
<div class="btn-group dropright" role="group">
<button id="btnGroupDrop2" type="button" class="btn btn-sm btn-outline-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Aggiungi condizione logica: </button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop2" style="">
<a class="dropdown-item" id="andCond" href="#"><span class="text-muted bg-lida10">AND</span></a>
<a class="dropdown-item" id="orCond" href="#"><span class="text-muted bg-lida11">OR</span></a>
</div>
</div>
</div>
</div>
<div class="row p-1 ml-2 mt-2 align-items-end justify-content-between">
<div class="col">
<div class="custom-control custom-switch px-3 bd-highlight">
<input type="checkbox" class="custom-control-input" name="avanzata-attiva" aria-label="attiva" id="advanSW">
<input type="checkbox" class="custom-control-input" name="avanzata-attiva" aria-label="Ricerca avanzata" id="advanSW">
<label class="custom-control-label" for="advanSW"><div class="pb-1 text-muted">Ricerca avanzata</div></label>
</div>
</div>
@ -124,6 +89,43 @@
<ion-icon name="cloud-upload-outline"></ion-icon> <ion-icon name="cloud-download-outline"></ion-icon></span>
</div>
</div>
<div id="cla-Advanced" style="display: none">
<div class="btn-group p-1 my-3" role="group" aria-label="Bottoni menu clausole">
<label class="input-group-text"><ion-icon name="filter-circle"></ion-icon></label>
<div class="btn-group dropright" role="group">
<button id="btnGroupDrop1" type="button" class="btn btn-sm btn-outline-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Aggiungi clausola di tipo: </button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
<a class="dropdown-item" id="Grammaticale" href="#"><span class="text-lida9">Categoria grammaticale</span></a>
<a class="dropdown-item" id="Sintattico" href="#"><span class="text-lida3">Tipo sintattico</span></a>
<a class="dropdown-item" id="Metafore" href="#"><span class="text-lida5">Metafore</span></a>
</div>
</div>
</div>
<div class="btn-group p-1 my-3" role="group" aria-label="Bottoni menu logiche">
<label class="input-group-text"><ion-icon name="cog"></ion-icon></label>
<div class="btn-group dropright" role="group">
<button id="btnGroupDrop2" type="button" class="btn btn-sm btn-outline-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Aggiungi condizione logica: </button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop2" style="">
<a class="dropdown-item" id="andCond" href="#"><span class="text-muted bg-lida10">AND</span></a>
<a class="dropdown-item" id="orCond" href="#"><span class="text-muted bg-lida11">OR</span></a>
</div>
</div>
</div>
<div class="text-muted p-1">
Definisci i filtri usando le clausole e le condizioni logiche:
</div>
<div class=" px-2 pb-2 pt-1 m-2 mx-3 border bg-light" id="cla-list">
<div class="row ml-0 justify-content-between"><div class="pb-1 small font-weight-bold text-muted">AND</div></div>
<ul id="sortable0" class="condLIand list-group ui-sortable">
<li id="H-cla0" class="list-group-item align-items-center ui-state-default ui-state-disabled border text-muted bg-white ui-state-disabled-opacity-06">Nessuna clausola aggiunta.</li>
</ul>
</div>
</div>
</div>
</div>

View File

@ -188,7 +188,7 @@ $(document).ready(function() {
var reader = new FileReader();
reader.onload = function(data){
queryJson = JSON.parse(data.target.result)
$("#sparqlquery").val(data.target.result);
//$("#sparqlquery").val(data.target.result);
makeUpGui(queryJson);
};
if (file) {reader.readAsText(file);}
@ -223,12 +223,13 @@ $(document).ready(function() {
// Evento: click sul checkbox di Ricerca avanzata
$('#cla-TabContent').on('click', '#advanSW', function() {
console.log($(this).prop('checked'));
console.log($("#cla-TabContent"));
if ($(this).prop('checked')) {
$("#cla-Advanced").attr('style', "display: block;");
queryJson.QueryAvanzata = "1";
} else {
$("#cla-Advanced").attr('style', "display: none;");
queryJson.QueryAvanzata = "0";
//resetAdvGui();
}
});
@ -424,7 +425,7 @@ $(document).ready(function() {
var guiLogicString = ``;
var execQuery = ``;
var queryFields = []; // Contiene le intestazioni di colonna della tabella dei risultati
var queryJson = JSON.parse('{"EsprLogica":"","LogicaGui":""}');
var queryJson = JSON.parse('{"EsprLogica":"", "LogicaGui":"", "QueryAvanzata": "0"}');
queryJson.LiDaVersion = "1.0";
queryJson.Clausola0 = JSON.parse('{"queryText": "", "lemma_forma": "lemma", "TipoClausola": "0", "Attiva": "0"}');
@ -501,7 +502,7 @@ $(document).ready(function() {
// se non cambio l'id della select react non rileva l'evento onchange:
$('#cla' + tabID + " #grammtypes").attr("id","grammtypes" + tabID);
claListLen++;
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Grammaticale"><span class="small font-weight-bold text-lida8">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Grammaticale</span></a></li>'));
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Grammaticale"><span class="small font-weight-bold text-lida9">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Grammaticale</span></a></li>'));
}
// Funzione di creazione delle subclausole grammaticali basate sul valore scelto
@ -619,15 +620,15 @@ $(document).ready(function() {
clone.removeAttribute("style");
$('#cla-TabContent').append(clone);
claListLen++;
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Sintattico"><span class="small font-weight-bold text-lida9">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Sintattico</span></a></li>'));
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Sintattico"><span class="small font-weight-bold text-lida3">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Sintattico</span></a></li>'));
}
// Funzione di creazione del tab delle clausole metafore
function addMetaCla(active){
tabID++;
$('#cla-TabContent').append($('<div class="tab-pane fade p-2 bg-white" data-claActive="' + active + '" id="cla' + tabID + '" role="tabpanel" aria-labelledby="cla' + tabID + '-tab" data-claType="Metafore">' + iconCheckAndClose + '<div class="text-muted form-group px-1 pb-1">Clausola <span class="text-lida3">Metafore</span> - non ancora implementata</div></div>'));
$('#cla-TabContent').append($('<div class="tab-pane fade p-2 bg-white" data-claActive="' + active + '" id="cla' + tabID + '" role="tabpanel" aria-labelledby="cla' + tabID + '-tab" data-claType="Metafore">' + iconCheckAndClose + '<div class="text-muted form-group px-1 pb-1">Clausola <span class="text-lida5">Metafore</span> - non ancora implementata</div></div>'));
claListLen++;
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Metafore"><span class="small font-weight-bold text-lida3">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Metafore</span></a></li>'));
$('#tab-list').append($('<li class="nav-item" role="presentation"><a class="nav-link" id="cla' + tabID + '-tab" data-toggle="tab" href="#cla' + tabID + '" role="tab" aria-controls="cla' + tabID + '" aria-selected="false" data-claType="Metafore"><span class="small font-weight-bold text-lida5">' + iconFilter + '&nbsp;&nbsp;' + claListLen + '. Metafore</span></a></li>'));
}
// Funzione di creazione del tab delle clausole dialoghi
@ -680,13 +681,13 @@ $(document).ready(function() {
var claType = $(this).find('a').attr("data-claType");
switch (claType) {
case "Grammaticale":
textClassType = "text-lida8";
textClassType = "text-lida9";
break;
case "Sintattico":
textClassType = "text-lida9";
textClassType = "text-lida3";
break;
case "Metafore":
textClassType = "text-lida3";
textClassType = "text-lida5";
break;
case "Dialoghi":
textClassType = "text-lida4";
@ -787,7 +788,6 @@ $(document).ready(function() {
$(sortableNum).append(LItext);
};
queryJson["Clausola" + len] = JSON.parse(jsonTextToParse + '}');
}
// Funzione di refresh dei placeholders e attivazione/disattivazione bottoni nelle liste sortable
@ -871,7 +871,7 @@ $(document).ready(function() {
});
logicExprString = parseCond("#sortable0", "AND", 0);
guiLogicString = parseCond("#sortable0", "AND", 1);
$("#sparqlquery").val(logicExprString);
//$("#sparqlquery").val(logicExprString);
queryJson.EsprLogica = logicExprString.split(' ');
queryJson.LogicaGui = guiLogicString.split(' ');
};
@ -890,21 +890,21 @@ $(document).ready(function() {
};
// Funzione di parsing delle clausole e delle condizioni logiche
function parseCond(sortableList, condType, gui){
function parseCond(sortableList, condType, forGui){
var condText = "";
var items = $(sortableList).children("li");
var itemsText = [];
$(items).each(function() {
if ($(this).hasClass("condLIand")) {
var andID = "#" + $(this).children("ul").attr("id");
var andText = parseCond(andID, "AND", gui);
var andText = parseCond(andID, "AND", forGui);
if (andText.length){
itemsText.push(andText);
};
};
if ($(this).hasClass("condLIor")) {
var orID = "#" + $(this).children("ul").attr("id");
var orText = parseCond(orID, "OR", gui);
var orText = parseCond(orID, "OR", forGui);
if (orText.length){
itemsText.push(orText);
};
@ -912,7 +912,7 @@ $(document).ready(function() {
if ($(this).hasClass("claLI")) {
var claText = $(this).find(".clatext").text();
var claNum = "Clausola" + claText.substr(0,claText.indexOf('.'));
if (gui || ($(this).find("input")[0].checked == true)){
if (forGui || ($(this).find("input")[0].checked == true)){
itemsText.push(claNum);
};
};
@ -922,7 +922,7 @@ $(document).ready(function() {
case 0:
break;
case 1:
if (gui) {
if (forGui) {
condText = "( " + condType + " " + itemsText[0] + " )";
} else {
condText += itemsText[0];
@ -951,21 +951,16 @@ $(document).ready(function() {
//$("#risultatitesto").val(queryJson["LogicaGui"]);
// 1. verifica json legit --> TO DO
// -------------------
// Pulizia interfaccia:
var tabsContent=$("#cla-TabContent").find(".tab-pane:not(:first)");
var tabs=$("#tab-list li:not(:first)");
if ($(tabsContent).length) {
$(tabsContent).each(function(){
$(this).remove();
});
$(tabs).each(function(){
$(this).remove();
});
// Pulizia ricerca avanzata:
resetAdvGui();
// Imposta checkbox:
if (queryJson["QueryAvanzata"] == 1) {
$("#cla-Advanced").attr('style', "display: block;");
$("#advanSW").prop("checked", true);
} else {
$("#cla-Advanced").attr('style', "display: none;");
$("#advanSW").prop("checked", false);
};
claListLen = 0;
condListLen = 0;
tabID = 0;
$('#sortable0').html(emptyClaList);
// Rigenerazione Clausola0:
if (queryJson["Clausola0"].Attiva) {
$("#cla0 #lemma_forma").val(queryJson["Clausola0"].lemma_forma);
@ -1000,7 +995,7 @@ $(document).ready(function() {
claParent.push([guiLogicString[i].replace("Clausola", ""), treeLevel[treeLevel.length - 1]]);
};
};
$(claParent).each(function(){ // rigenero le clausole nei tab
$(claParent).each(function(){ // rigenero le clausole nei tab PRIMA, per poter POI ricostruire la lista nel tab principale
var itm = $(this)[0]
if (itm != "OR" && itm != "AND") {
clau2Make = queryJson["Clausola" + itm].TipoClausola;
@ -1060,6 +1055,24 @@ $(document).ready(function() {
};
});
};
function resetAdvGui() {
var tabsContent=$("#cla-TabContent").find(".tab-pane:not(:first)");
var tabs=$("#tab-list li:not(:first)");
if ($(tabsContent).length) {
$(tabsContent).each(function(){
$(this).remove();
});
$(tabs).each(function(){
$(this).remove();
});
};
claListLen = 0;
condListLen = 0;
tabID = 0;
$('#sortable0').html(emptyClaList);
};
});