Modifiche grafiche e ai collapse, problema ridotto ma non risolto

This commit is contained in:
Luca Trupiano 2023-12-05 16:38:44 +01:00
parent f10ec52566
commit 144c724a00
2 changed files with 35 additions and 29 deletions

View File

@ -114,8 +114,8 @@
<select class="custom-select text-muted bg-light border border-secondary" <select class="custom-select text-muted bg-light border border-secondary"
id="valoreVista"> id="valoreVista">
<option value="forme">Forme</option> <option value="forme">Forme</option>
<option value="frasi">Frasi</option> <option value="frasi">Periodi</option>
<option value="citazioni">Citazioni</option> <option value="riferimenti">Riferimenti</option>
<option value="dialoghi">Dialoghi</option> <option value="dialoghi">Dialoghi</option>
<option value="metafore">Metafore</option> <option value="metafore">Metafore</option>
</select> </select>
@ -471,7 +471,7 @@
<div class="d-table-cell p-0 pt-1" style="background-color: rgba(0,0,0,.03);"> <div class="d-table-cell p-0 pt-1" style="background-color: rgba(0,0,0,.03);">
<ul class="nav nav-tabs" id="tab-list" role="tablist"> <ul class="nav nav-tabs" id="tab-list" role="tablist">
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">
<a class="nav-link py-1 active" id="vis0-tab" data-toggle="tab" href="#vis0" role="tab" aria-controls="vis0" aria-selected="true"><span class=" btn-link"><ion-icon name="create"></ion-icon></span> <a class="nav-link py-1 active" id="vis0-tab" data-toggle="tab" href="#vis0" role="tab" aria-controls="vis0" aria-selected="true"><span class=" btn-link"><ion-icon name="document-attach"></ion-icon></span>
<span class="h6 btn-link"> Commenti</span></a> <span class="h6 btn-link"> Commenti</span></a>
</li> </li>
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">

View File

@ -741,7 +741,6 @@ function resetFrasi(){
canto='0'+canto canto='0'+canto
//console.log(cantica+', '+canto) //console.log(cantica+', '+canto)
commentsArray=getVersiConCitazioni(cantica, canto) commentsArray=getVersiConCitazioni(cantica, canto)
//console.log("Array prima") //console.log("Array prima")
//console.log(commentsArray) //console.log(commentsArray)
@ -791,7 +790,7 @@ function resetFrasi(){
for (var pos in commentsArray){ for (var pos in commentsArray){
console.log("Id: "+id); console.log("Id: "+id);
var noteCard = $('<div class="card card-body well well-sm m-1 mt-2 p-0" id="noteCard' + id + '">'); var noteCard = $('<div class="card card-body well well-sm m-1 mt-2 p-0" id="noteCard' + id + '">');
var collapseCardBody = $('<div class="card-body p-0 mx-1 mb-1 border rounded" >'); var collapseCardBody = $('<div class="card-body px-0 py-2 mx-1 mb-1 mt-0 border rounded" >');
var divCampiSingoli = $('<div class="d-flex align-content-start flex-wrap text-muted">'); var divCampiSingoli = $('<div class="d-flex align-content-start flex-wrap text-muted">');
var comments = commentsArray[pos] var comments = commentsArray[pos]
@ -842,15 +841,15 @@ function resetFrasi(){
var titoloFonte = ""; var titoloFonte = "";
var luogoFonte = ""; var luogoFonte = "";
var commentHeader = $('<div class="d-flex align-content-start flex-nowrap text-muted" id="commentoVerso' + id + '_' + pos + '">') var commentHeader = $('<div class="d-flex align-content-start flex-nowrap text-muted" id="commentoVerso' + id + '_' + pos + '">')
var rigaNota = $('<div class="p-2 mt-1">'); var rigaNota = $('<div class="px-3 py-1 mt-1">');
var buttons = $('<div class="d-flex flex-wrap-reverse ml-auto align-items-center justify-content-end p-1">') var buttons = $('<div class="d-flex flex-wrap-reverse ml-auto align-items-center justify-content-end p-1">')
var collapseButton = $('<button id="collapseBtnNote'+id+ '_' + pos +'"'+ var collapseButton = $('<button id="collapseBtnNote'+id+ '_' + pos +'"'+
'class="btn btn-sm btn-outline-primary bg-light collapseNote border rounded mb-auto text-primary align-self-end px-1 pb-0"'+ 'class="btn btn-sm btn-outline-primary bg-light collapseNote border rounded text-primary align-self-end px-1 pb-0"'+
'data-toggle="collapse" data-target="#collapseNote'+id+ '_' + pos +'"'+ 'data-toggle="collapse" data-target="#collapseNote'+id+ '_' + pos +'"'+
'aria-expanded="true" aria-controls="collapseNote'+id+ '_' + pos +'">'+ 'aria-expanded="true" aria-controls="collapseNote'+id+ '_' + pos +'">'+
'<ion-icon name="archive"></ion-icon>'); '<ion-icon name="archive"></ion-icon>');
var closeButton = $('<button id="closeNote'+id+ '_' + pos +'"'+ var closeButton = $('<button id="closeNote'+id+ '_' + pos +'"'+
'class="btn btn-sm btn-outline-primary bg-light closeNote border rounded mb-auto text-primary align-self-end px-1 pb-0 ml-1">'+ 'class="btn btn-sm btn-outline-primary bg-light closeNote border rounded text-primary align-self-end px-1 pb-0 ml-1 mb-1">'+
'<ion-icon name="close-circle"></ion-icon>'); '<ion-icon name="close-circle"></ion-icon>');
rigaNota.append('<b>' + cantica + '</b><i>' + ", Canto " + getRoman(parcid[2]) + " Verso " + parcid[3] + "</i> - "); rigaNota.append('<b>' + cantica + '</b><i>' + ", Canto " + getRoman(parcid[2]) + " Verso " + parcid[3] + "</i> - ");
@ -894,31 +893,34 @@ function resetFrasi(){
} }
function createDivSingola(divCampi, campo, valore){ function createDivSingola(divCampi, campo, valore){
var divSingola = $('<div class="p-2">'); var divSingola = $('<div class="px-3 py-1">');
divSingola.append ('<b>'+campo+'</b><i> '+valore+'</i>'); divSingola.append ('<b>'+campo+'</b><i> '+valore+'</i>');
divSingola.appendTo(divCampi); divSingola.appendTo(divCampi);
} }
function createModule(collapse,label, testo, num, id, pos){ function createModule(collapse,label, testo, num, id, pos){
var divModule = $('<div class="module pb-0">'); console.log(label+": "+testo.length);
var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+ '_' + pos +'" aria-expanded="false">')
var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">'); var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">');
var divTesto = $('<div class="p-2">') var divTesto = $('<div class="px-3 py-1">')
var nota = '<b>'+label+'</b>'+testo; var nota = '<b>'+label+'</b>'+testo;
divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+ '_' + pos +'" role="button"></a>')
divTesto.append(nota); divTesto.append(nota);
divContent.append(divTesto); divContent.append(divTesto);
if (testo.length > 260) {
var divModule = $('<div class="module pb-0">');
var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+ '_' + pos +'" aria-expanded="false">')
divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+ '_' + pos +'" role="button"></a>')
divNote.append(divContent) divNote.append(divContent)
divModule.append(divNote); divModule.append(divNote);
divModule.appendTo(collapse); divModule.appendTo(collapse);
} else {
divContent.appendTo(collapse);
}
} }
function createModuleCommentatore(collapse, commento, num, id, pos){ function createModuleCommentatore(collapse, commento, num, id, pos){
var commentoCommentatore = commento.split(','); var commentoCommentatore = commento.split(',');
var divModule = $('<div class="module pb-0">');
var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+ '_' + pos +'" aria-expanded="false">')
var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">'); var divContent = $('<div class="d-flex align-content-start flex-wrap text-muted">');
var divTesto = $('<div class="p-2">') var divTesto = $('<div class="px-3 py-1">')
var nota; var nota;
var urlCommento = commentoCommentatore[0]; var urlCommento = commentoCommentatore[0];
var position = urlCommento.indexOf("https"); var position = urlCommento.indexOf("https");
@ -942,16 +944,21 @@ function resetFrasi(){
} else { } else {
nota = '<b>Rapporto Commento/Commentatore: </b>'+esitoCommento +' <a href="'+urlCommento+'"target="_blank"<i>' + autoreCommento+ '</i></a>, ' + '</b><br>'; nota = '<b>Rapporto Commento/Commentatore: </b>'+esitoCommento +' <a href="'+urlCommento+'"target="_blank"<i>' + autoreCommento+ '</i></a>, ' + '</b><br>';
} }
divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+ '_' + pos +'" role="button"></a>')
divTesto.append(nota); divTesto.append(nota);
divContent.append(divTesto); divContent.append(divTesto);
if (nota.length > 260) {
var divModule = $('<div class="module pb-0">');
var divNote = $('<div class="collapse" id="collapse'+num+'Note'+id+ '_' + pos +'" aria-expanded="false">')
divModule.append('<a class="read-more collapsed" data-toggle="collapse" href="#collapse'+num+'Note'+id+ '_' + pos +'" role="button"></a>')
divNote.append(divContent) divNote.append(divContent)
divModule.append(divNote); divModule.append(divNote);
divModule.appendTo(collapse); divModule.appendTo(collapse);
} else {
divContent.appendTo(collapse);
}
} }
function hasComments(cid){ function hasComments(cid){
var id = cid.substr(9); var id = cid.substr(9);
for (var pos in commentsArray){ for (var pos in commentsArray){
var comments = commentsArray[pos] var comments = commentsArray[pos]
@ -964,14 +971,13 @@ function resetFrasi(){
} }
function numberOfComments(cid){ function numberOfComments(cid){
var id = cid.substr(9); var id = cid.substr(9);
//[....].filter(x => x==2).length //[....].filter(x => x==2).length
return commentsArray.filter(x => x.verso==id).length return commentsArray.filter(x => x.verso==id).length
} }
/*FINE GESTIONE CITAZIONI*/ /*FINE GESTIONE CITAZIONI*/
function getCantica(numeroCantica){ function getCantica(numeroCantica){
switch (numeroCantica){ switch (numeroCantica){