From e3721c6a6c5d5391f9a0c1b2c20d45e1dbda7f18 Mon Sep 17 00:00:00 2001
From: nicola <nicola@mbpdiniolaaloia.lan>
Date: Tue, 28 Nov 2023 20:34:13 +0100
Subject: [PATCH] Integrato con Luca index_4_4_test.html ci sono alcuni
problemi di visualizzazione e di funzionamento.
---
index_4.4_test.html | 56 +++++-----
js/cesareBrowse.js | 248 ++++++++++++++++++++++++--------------------
2 files changed, 163 insertions(+), 141 deletions(-)
diff --git a/index_4.4_test.html b/index_4.4_test.html
index 6cb733b..b909920 100644
--- a/index_4.4_test.html
+++ b/index_4.4_test.html
@@ -482,36 +482,35 @@
<div class="tab-content visInfo w-100 d-flex bg-lida-vis" id="vis-TabContent" style="flex-direction: column;">
<div class="tab-pane fade show active p-0 bg-lida-vis" id="vis0" role="tabpanel" aria-labelledby="vis0-tab">
- <div id='displaynote' class="p-2">
+<div id='displaynote' class="p-2">
-<div class="card card-body well well-sm m-1 p-0">
-
- <div class="d-flex align-content-start flex-nowrap text-muted mt-1">
- <div class="p-2">
+<div class="card card-body well well-sm m-1 p-0" id= "CardCommenti">
+ <div class="d-flex align-content-start flex-nowrap text-muted mt-1" id= "VersoCommento">
+ <div class="p-2" >
<b>Inferno</b><i>, Canto I Verso 1 - Dante Alighieri, Convivio IV, xxiii, 9-11</i>
</div>
<div class="ml-auto p-1 pr-2">
- <span class="h6">
- <button id="collapseBtnNoteX"
- class="btn btn-sm btn-outline-primary bg-light collapseNote border rounded text-primary px-1 pb-0 show"
- data-toggle="collapse" data-target="#collapseNoteX"
- aria-expanded="true" aria-controls="collapseNoteX">
- <ion-icon name="archive"></ion-icon>
- </button>
- <button id="closeNoteX"
- class="btn btn-sm btn-outline-primary bg-light closeNote border rounded text-primary px-1 pb-0"
- style="z-index: 1000">
- <ion-icon name="close-circle"></ion-icon>
- </button>
- </span>
-
+ <span class="h6">
+ <button id="collapseBtnNoteX"
+ class="btn btn-sm btn-outline-primary bg-light collapseNote border rounded text-primary px-1 pb-0 show"
+ data-toggle="collapse" data-target="#collapseNoteX"
+ aria-expanded="true" aria-controls="collapseNoteX">
+ <ion-icon name="archive"></ion-icon>
+ </button>
+ <button id="closeNoteX"
+ class="btn btn-sm btn-outline-primary bg-light closeNote border rounded text-primary px-1 pb-0"
+ style="z-index: 1000">
+ <ion-icon name="close-circle"></ion-icon>
+ </button>
+ </span>
</div>
</div>
- <div id="collapseNoteX" class="collapse show"
- aria-labelledby="headingCX" data-parent="#sortable0">
- <div class="card-body p-0 mx-1 mb-1 bg-lida11 border rounded"
- id="claBodyxX1Xx"></div>
+<div id="collapseNoteX" class="collapse show"
+ aria-labelledby="headingCX" data-parent="#sortable0">
+ <div class="card-body p-0 mx-1 mb-1 bg-lida11 border rounded"
+ id="claBodyxX1Xx">
+ </div>
<div class="d-flex align-content-start flex-wrap text-muted">
<div class="p-2"><b>Autore:</b> <a href="http://www.wikidata.org/entity/Q1067" target="_blank"><i>Dante Alighieri</i>, </a></div>
@@ -561,14 +560,9 @@
</div>
</div>
</div>
-
-
- </div>
-
-
-</div>
-
- </div>
+</div> <!-- Fine collapseNoteX -->
+</div> <!-- Fine card div -->
+</div> <!-- Fine displaynote div -->
</div>
<div class="tab-pane fade p-0 bg-lida-vis" id="vis1" role="tabpanel" aria-labelledby="vis1-tab">
<div id='displayinfo' class="p-3"><span>Visualizza struttura periodo</span>
diff --git a/js/cesareBrowse.js b/js/cesareBrowse.js
index 407ee43..08a9f5e 100644
--- a/js/cesareBrowse.js
+++ b/js/cesareBrowse.js
@@ -900,138 +900,166 @@ function resetFrasi(){
case "3": cantica = "Paradiso";
}
- var commentArea = $('#displaynote');
+ var commentArea = $('#CardCommenti');
commentArea.empty()
- var spanComment = $('<span />');
- var id = cid.substr(9);
- var nomeAutore = "";
- var titoloFonte = "";
- var luogoFonte = "";
- var commentoCommentatore = [];
- var urlCommento = "";
- var esitoCommento = "";
- var position = 0;
- var autoreCommento = "";
-
+ var id = cid.substr(9);
+ var collapseNote;
+ var claBody = $('<div class="card-body p-0 mx-1 mb-1 bg-lida11 border rounded" id="claBodyxX1Xx">');
+
for (var pos in commentsArray){
var comments = commentsArray[pos]
if (comments.verso == id){
- spanComment.append('<b>'+cantica+'</b><i>'+", Canto " + getRoman(parcid[2])+" Verso "+ parcid[3]+"</i><br>");
- if (comments.NomeAutoreCitazione == null){
- nomeAutore = 'riferimento';
- }
- else{
- nomeAutore = comments.NomeAutoreCitazione;
- }
- if (comments.AutoreCitazione != null){
- spanComment.append('<b>Autore:</b><a href="'+comments.AutoreCitazione+'" target="_blank"> <i>'+nomeAutore+ '</i>, </a>');
- }else{
- spanComment.append('<b>Autore:</b> <i>'+nomeAutore+'</i>');
-
- }
- if(comments.TitoloFonteCitazione == null){
- titoloFonte = "riferimento";
- }else{
- titoloFonte = comments.TitoloFonteCitazione;
- }
- if (comments.FonteCitazione != null){
- spanComment.append('<b>Fonte:</b> <a href="'+comments.FonteCitazione+'" target="_blank"><i> '+titoloFonte +'</i>, </a>');
- }else{
- spanComment.append('<b>Fonte:</b><i> '+titoloFonte +'</i>');
-
- }
- if(comments.LuogoFonteCitazione == null){
- luogoFonte = "riferimento";
- }else{
- luogoFonte = comments.LuogoFonteCitazione;
- }
- if (comments.URLFonteCitazione != null){
- spanComment.append('<b>Luogo Fonte:</b><a href="'+comments.URLFonteCitazione+'"target="_blank"<i> ' + luogoFonte+'</i>, </a><br>');
- }else{
- spanComment.append('<b>Luogo Fonte:</b><i> ' + luogoFonte+'</i><br>');
-
+ createNoteHeader(commentArea, comments, id, cantica, parcid);
+ collapseNote = $('<div id="collapseNote"'+id+ 'class="collapse show"'+
+ 'aria-labelledby="headingCX" data-parent="#sortable0">');
+ collapseNote.append(claBody);
+
+ if (comments.TestoFonteCitazione != null && comments.TestoFonteCitazione != "nan"){
+ createModule(commentArea,"Testo della fonte: ", comments.TestoFonteCitazione, "1", id)
}
if (comments.NaturaRiferimento != null){
- spanComment.append("<b>Natura Riferimento:</b><i> " + comments.NaturaRiferimento+"</i><br>");
+ createModule(commentArea,"Tipo Riferimento: ", comments.NaturaRiferimento, "2", id)
}
if (comments.commentario != null){
- spanComment.append("<b>Commentario:</b><i> " + comments.commentario+"</i><br>");
+ createModule(commentArea,"Commentatore: ", comments.commentario, "3", id)
}
if (comments.RapportoSoggettoOggetto != null){
- spanComment.append("<b>Rapporto Soggetto/Oggetto: </b><i>" + comments.RapportoSoggettoOggetto+"</i><br>");
+ createModule(commentArea,"Rapporto Testo/Fonte: ", comments.RapportoSoggettoOggetto, "4", id)
}
if (comments.RapportoCommentoCommentatoreText != null && comments.RapportoCommentoCommentatoreText != "nan"){
- commentoCommentatore = comments.RapportoCommentoCommentatoreText.split(',');
- urlCommento = commentoCommentatore[0];
- position = urlCommento.indexOf("https");
- urlCommento = urlCommento.substring(position)
- //urlCommento = urlCommento.replaceAll("'","");
- urlCommento = urlCommento.replaceAll("'","");
- //urlCommento = urlCommento.replaceAll(',',"");
- esitoCommento = commentoCommentatore[3];
- esitoCommento = esitoCommento.replace("'Rapporto': ","")
- //esitoCommento = esitoCommento.replaceAll('"',"");
- esitoCommento = esitoCommento.replaceAll("'","");
- esitoCommento = esitoCommento.replaceAll('}',"");
- autoreCommento = commentoCommentatore[1];
- autoreCommento = autoreCommento.replace(" 'Autore':","")
- autoreCommento = autoreCommento.replaceAll("'","");
- if (autoreCommento == ""){
- autoreCommento = "Commento"
- }
- if (esitoCommento == ""){
- esitoCommento = "Rapporto nullo"
- }
- if(urlCommento == ""){
- spanComment.append('<b>Rapporto Commento/Commentatore: [</b>Commento nullo, '+esitoCommento+'] <br>');
- }else{
- spanComment.append('<b>Rapporto Commento/Commentatore: [</b><a href="'+urlCommento+'"target="_blank"<i>'+ autoreCommento +'</i></a>, '+esitoCommento+'] <br>');
- }
+ createModuleCommentatore (commentArea, comments.RapportoCommentoCommentatoreText, "5", id)
}
+
if (comments.annotazione != null && comments.annotazione != "nan"){
- var spanForm = $('<form />');
- spanComment.append(spanForm);
- var spanDiv = $('<div />');
- spanDiv.attr('class', ' form-group pt-2');
- spanForm.append(spanDiv);
- spanDiv.append('<label for="comment"><b>Annotazione:</b></label>');
- spanDiv.append('<textarea readonly class="form-control" rows="2" id="annotazione"+comments.verso name="text">'+comments.annotazione+'</textarea>');
-
+ createModule(commentArea,"Annotazione: ", comments.annotazione, "6", id)
+ }
if (comments.frammentoNota != null && comments.frammentoNota != "nan"){
- var spanForm = $('<form />');
- spanComment.append(spanForm);
- var spanDiv = $('<div />');
- spanDiv.attr('class', ' form-group');
- spanForm.append(spanDiv);
- spanDiv.append('<label for="comment"><b>Frammento Nota:</b></label>');
- spanDiv.append('<textarea readonly class="form-control" rows="2" id="frammentoNota"+comments.verso name="text">'+comments.frammentoNota+'</textarea>');
- }
- if (comments.TestoFonteCitazione != null && comments.TestoFonteCitazione != "nan"){
- var spanForm = $('<form />');
- spanComment.append(spanForm);
- var spanDiv = $('<div />');
- spanDiv.attr('class', ' form-group');
- spanForm.append(spanDiv);
- spanDiv.append('<label for="comment"><b>Testo Fonte:</b></label>');
- spanDiv.append('<textarea readonly class="form-control" rows="2" id="TestoFonteCitazione"+comments.verso name="text">'+comments.TestoFonteCitazione+'</textarea>');
+ createModule(commentArea,"Nota: ", comments.frammentoNota, "7", id)
}
+
if (comments.NotaFonteCitazione != null && comments.NotaFonteCitazione != "nan" && comments.NotaFonteCitazione != ""){
- var spanForm = $('<form />');
- spanComment.append(spanForm);
- var spanDiv = $('<div />');
- spanDiv.attr('class', ' form-group');
- spanForm.append(spanDiv);
- spanDiv.append('<label for="comment"><b>Nota Fonte:</b></label>');
- spanDiv.append('<textarea readonly class="form-control" rows="2" id="NotaFonteCitazione"+comments.verso name="text">'+comments.NotaFonteCitazione+'</textarea>');
+ createModule(commentArea,"Nota dell'annotatore: ", comments.NotaFonteCitazione, "8", id)
}
- }
- spanComment.append('<hr class="pt-0 center text-dark bg-dark" style="width: 35%;">');
-
+ commentArea.append('<hr class="pt-0 center text-dark bg-dark" style="width: 100%;">');
}
}
- spanComment.appendTo(commentArea);
$('#tab-list #vis0-tab').tab('show')
})
+
+ function createNoteHeader(headerDiv, comments, id, cantica, parcid){
+ var nomeAutore = "";
+ var titoloFonte = "";
+ var luogoFonte = "";
+ var commentHeader = $('<div class="d-flex align-content-start flex-nowrap text-muted mt-1" id= commentoVerso' + id + ' >')
+ var rigaNota = $('<div class="p-2" >');
+ var spanButtons = $('<span class="h6">');
+ var buttons = $('<div class="ml-auto p-1 pr-2">')
+ var collapseButton = $('<button id="collapseBtnNote'+id+'"'+
+ 'class="btn btn-sm btn-outline-primary bg-light collapseNote border rounded text-primary px-1 pb-0 show"'+
+ 'data-toggle="collapse" data-target="#collapseNote'+id+'"'+
+ 'aria-expanded="true" aria-controls="collapseNote'+id+'">'+
+ '<ion-icon name="archive"></ion-icon>');
+ var closeButton = $('<button id="closeNote'+id+'"'+
+ 'class="btn btn-sm btn-outline-primary bg-light closeNote border rounded text-primary px-1 pb-0"'+
+ 'style="z-index: 1000">'+
+ '<ion-icon name="close-circle"></ion-icon>');
+
+ rigaNota.append('<b>' + cantica + '</b><i>' + ", Canto " + getRoman(parcid[2]) + " Verso " + parcid[3] + "</i> - ");
+ collapseButton.appendTo(spanButtons);
+ closeButton.appendTo(spanButtons);
+ spanButtons.appendTo(buttons)
+
+ if (comments.NomeAutoreCitazione == null) {
+ nomeAutore = 'riferimento';
+ }
+ else {
+ nomeAutore = comments.NomeAutoreCitazione;
+ }
+ if (comments.AutoreCitazione != null) {
+ rigaNota.append('<b>Autore della fonte:</b><a href="' + comments.AutoreCitazione + '" target="_blank"> <i>' + nomeAutore + '</i>, </a>');
+ } else {
+ rigaNota.append('<b>Autore della fonte:</b> <i>' + nomeAutore + '</i>');
+ }
+ if (comments.TitoloFonteCitazione == null) {
+ titoloFonte = "riferimento";
+ } else {
+ titoloFonte = comments.TitoloFonteCitazione;
+ }
+ if (comments.FonteCitazione != null) {
+ rigaNota.append('<b>Fonte:</b> <a href="' + comments.FonteCitazione + '" target="_blank"><i> ' + titoloFonte + '</i>, </a>');
+ } else {
+ rigaNota.append('<b>Fonte:</b><i> ' + titoloFonte + '</i>');
+ }
+ if (comments.LuogoFonteCitazione == null) {
+ luogoFonte = "riferimento";
+ } else {
+ luogoFonte = comments.LuogoFonteCitazione;
+ }
+ if (comments.URLFonteCitazione != null) {
+ rigaNota.append('<b>Coordinate della Fonte:</b><a href="' + comments.URLFonteCitazione + '"target="_blank"<i> ' + luogoFonte + '</i>, </a><br>');
+ } else {
+ rigaNota.append('<b>Coordinate della Fonte:</b><i> ' + luogoFonte + '</i><br>');
+
+ }
+ rigaNota.appendTo(commentHeader);
+ buttons.appendTo(commentHeader);
+
+ commentHeader.appendTo(headerDiv);
+ }
+
+ function createModule(commentArea,label, testo, num, id){
+ var divModule = $('<div class="module pb-0">');
+ var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+'" aria-expanded="false">')
+ var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">');
+ var divTesto = $('<div class="p-2">')
+ var nota = '<b>'+label+'</b>'+testo;
+ divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+'" role="button"></a>')
+ divTesto.append(nota);
+ divContent.append(divTesto);
+ divNote.append(divContent)
+ divModule.append(divNote);
+ divModule.appendTo(commentArea);
+ }
+ function createModuleCommentatore(commentArea, commento, num, id){
+ var commentoCommentatore = commento.split(',');
+ var divModule = $('<div class="module pb-0">');
+ var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+'" aria-expanded="false">')
+ //var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+'" aria-expanded="false">')
+
+ var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">');
+ var divTesto = $('<div class="p-2">')
+ var nota;
+ var urlCommento = commentoCommentatore[0];
+ var position = urlCommento.indexOf("https");
+ urlCommento = urlCommento.substring(position)
+ urlCommento = urlCommento.replaceAll("'", "");
+ var esitoCommento = commentoCommentatore[3];
+ esitoCommento = esitoCommento.replace("'Rapporto': ", "")
+ esitoCommento = esitoCommento.replaceAll("'", "");
+ esitoCommento = esitoCommento.replaceAll('}', "");
+ var autoreCommento = commentoCommentatore[1];
+ autoreCommento = autoreCommento.replace(" 'Autore':", "")
+ autoreCommento = autoreCommento.replaceAll("'", "");
+ if (autoreCommento == "") {
+ autoreCommento = "Commento"
+ }
+ if (esitoCommento == "") {
+ esitoCommento = "Rapporto nullo"
+ }
+ if (urlCommento == "") {
+ nota = '<b>Rapporto Commento/Commentatore: [</b>Commento nullo, '+esitoCommento+']</b><br>';
+ } else {
+ nota = '<b>Rapporto Commento/Commentatore: [</b><a href="'+urlCommento+'"target="_blank"<i>' + autoreCommento+ '</i></a>, ' + esitoCommento + ']</b><br>';
+ }
+
+ divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+'" role="button"></a>')
+ divTesto.append(nota);
+
+ divContent.append(divTesto);
+ divNote.append(divContent)
+ divModule.append(divNote);
+ divModule.appendTo(commentArea);
+ }
function hasComments(cid){