concordia
/
LiDa_Search
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fissati problemi di dimensionamento, diventato automatico

This commit is contained in:
Luca Trupiano 2023-02-24 15:06:20 +01:00
parent 8f4b5cbe29
commit 1fd2c05ced
5 changed files with 55 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
css/custom1_4.2.css
View File

@ -19,7 +19,7 @@ body {
} }
.tableMain { .tableMain {
height: 950px; height: 95%;
min-height: 600px; min-height: 600px;
} }
@ -33,7 +33,7 @@ body {
} }
#colVisualizza { #colVisualizza {
max-height: 950px; max-height: 95%;
min-height: 600px; min-height: 600px;
} }
@ -53,20 +53,15 @@ body {
.minimap { .minimap {
width: 108px; width: 108px;
min-height: 700px; min-height: 600px;
} }
.menuRicerca { .menuRicerca {
width: 30%; width: 30%;
} }
.visCanto {
height: 500px;
}
#displaycanto { #displaycanto {
display: d-flex; display: d-flex;
height: 500px;
overflow-y: scroll; overflow-y: scroll;
} }
@ -78,8 +73,6 @@ body {
overflow: auto !important; overflow: auto !important;
} }
.row-content { height: 100%; display: d-flex;}
.doubleborder { .doubleborder {
z-index: 90; z-index: 90;
border-bottom-width: 8px !important; border-bottom-width: 8px !important;

13
css/custom2_4.2.css
View File

@ -19,7 +19,7 @@ body {
} }
.tableMain { .tableMain {
height: 950px; height: 95%;
min-height: 600px; min-height: 600px;
} }
@ -33,7 +33,7 @@ body {
} }
#colVisualizza { #colVisualizza {
max-height: 950px; max-height: 95%;
min-height: 600px; min-height: 600px;
} }
@ -53,20 +53,15 @@ body {
.minimap { .minimap {
width: 108px; width: 108px;
min-height: 700px; min-height: 600px;
} }
.menuRicerca { .menuRicerca {
width: 30%; width: 30%;
} }
.visCanto {
height: 500px;
}
#displaycanto { #displaycanto {
display: d-flex; display: d-flex;
height: 500px;
overflow-y: scroll; overflow-y: scroll;
} }
@ -78,8 +73,6 @@ body {
overflow: auto !important; overflow: auto !important;
} }
.row-content { height: 100%; display: d-flex;}
.doubleborder { .doubleborder {
z-index: 90; z-index: 90;
border-bottom-width: 8px !important; border-bottom-width: 8px !important;

4
index_4.2.html
View File

@ -387,8 +387,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="card"> <div class="card" style="display: none;">
<div class="card-header px-1" id="headingZero" style="display: none;"> <div class="card-header px-1" id="headingZero">
<h6 class="mb-0"> <h6 class="mb-0">
<div class="row no-gutters justify-content-end"> <div class="row no-gutters justify-content-end">
<div class="col-auto flex-fill align-self-end text-muted text-right nav-link"> <div class="col-auto flex-fill align-self-end text-muted text-right nav-link">

70
js/minimap.js
View File

@ -6,6 +6,8 @@ const displayCantoId = '#displaycanto';
const minimapviewerId = '#minimapviewer'; const minimapviewerId = '#minimapviewer';
const displayminimapId = '#displayminimap'; const displayminimapId = '#displayminimap';
const visCantoClass = '.visCanto'; const visCantoClass = '.visCanto';
const tableMainHeight = 0.95; //.tableMain {height: 95%;}
const cantoHeight = 0.65;
let minimap = document.createElement('div'); let minimap = document.createElement('div');
let viewer = document.createElement('div'); let viewer = document.createElement('div');
@ -16,26 +18,32 @@ let initOffset = '';
function drawMinimap(name){ function drawMinimap(name){
currentMinimap = name; var cantoHeightToSet = $("body")[0].clientHeight*cantoHeight;
initOffset = parseInt($("body").css("padding-top").replace("px", ""))+63; var maxCantoHeightToSet = $("body")[0].clientHeight*tableMainHeight-110;
showMinimap(); $(visCantoClass).css("max-height", maxCantoHeightToSet);
$(displayCantoId).scrollTop(0); $(visCantoClass).css("height", cantoHeightToSet);
$(minimapviewerId).offset({ top: initOffset}); $(displayCantoId).css("max-height", maxCantoHeightToSet);
var minimapTopPos = $(minimapviewerId).offset().top; $(displayCantoId).css("height", cantoHeightToSet);
$(minimapviewerId).draggable({ currentMinimap = name;
axis: "y", initOffset = parseInt($("body").css("padding-top").replace("px", ""))+63;
containment: $(displayminimapId), showMinimap();
//containment: $(".minimap__content"), $(displayCantoId).scrollTop(0);
scroll: false, $(minimapviewerId).offset({ top: initOffset});
start: function(event, ui) { minimapScrolling = true; }, var minimapTopPos = $(minimapviewerId).offset().top;
stop: function(event, ui) { minimapScrolling = false; },
drag: function(event, ui) { $(minimapviewerId).draggable({
minimapScrolling = true; axis: "y",
$(displayCantoId).scrollTop((ui.offset.top - minimapTopPos) / realScale); containment: $(displayminimapId),
} scroll: false,
}); start: function(event, ui) { minimapScrolling = true; },
} stop: function(event, ui) { minimapScrolling = false; },
drag: function(event, ui) {
minimapScrolling = true;
$(displayCantoId).scrollTop((ui.offset.top - minimapTopPos) / realScale);
}
});
}
function showMinimap() { function showMinimap() {
@ -73,11 +81,12 @@ function showMinimap() {
let bgCanto = $(visCantoClass).css('background-color'); let bgCanto = $(visCantoClass).css('background-color');
$('iframe').contents().find('body').css('background-color', bgCanto + ' !important;'); $('iframe').contents().find('body').css('background-color', bgCanto + ' !important;');
getDimensionsDiv(); var infoHeightToSet = $("body")[0].clientHeight*tableMainHeight - $(visCantoClass)[0].clientHeight-2-63-2
$("#displayinfo").css("maxHeight", infoHeightToSet+"px");
$("#displayinfo").css("height", infoHeightToSet+"px");
$(".visInfo").css("height", (infoHeightToSet+4)+"px");
$("#displayinfo").css("maxHeight", (950-$(visCantoClass)[0].clientHeight-2-63-2)+"px"); getDimensionsDiv();
$("#displayinfo").css("height", (950-$(visCantoClass)[0].clientHeight-2-63-2)+"px");
$(".visInfo").css("height", (950-$(visCantoClass)[0].clientHeight-2-63+4-2)+"px !important");
window.addEventListener('resize', getDimensionsDiv); window.addEventListener('resize', getDimensionsDiv);
} }
@ -86,34 +95,23 @@ function showMinimap() {
function getDimensionsDiv(onlyViewer = false) { function getDimensionsDiv(onlyViewer = false) {
var srcCantoWidth = $(currentMinimap)[0].clientWidth; var srcCantoWidth = $(currentMinimap)[0].clientWidth;
var srcCantoHeight = $(currentMinimap)[0].clientHeight; var srcCantoHeight = $(currentMinimap)[0].clientHeight;
//var maxHeight = ($(displayminimapId)[0].clientHeight)-4-63; //h attuale dello spazio minimap -4 padding -63 top padding var maxHeight = ($("#colMinimap")[0].clientHeight)-68; //h attuale dello spazio minimap; -63 top padding, -1 bordo col, -4 bordi iframe
var maxHeight = ($("#colMinimap")[0].clientHeight)-68; //h attuale dello spazio minimap; -63 top padding, -2 bordi minimapviewer, -1 bordo col, -4 bordi iframe
var maxWidth = $(displayminimapId)[0].clientWidth; //w attuale della minimap (css) var maxWidth = $(displayminimapId)[0].clientWidth; //w attuale della minimap (css)
//var miniCantoHeight = Math.ceil(((srcCantoHeight-44)/25*26)+44+32); //h prevista del canto nella minimap
var miniCantoWidth = srcCantoWidth+64; //h prevista del canto nella minimap 64: padding pr + blank space var miniCantoWidth = srcCantoWidth+64; //h prevista del canto nella minimap 64: padding pr + blank space
//var miniCantoHeight = srcCantoHeight+16; //h prevista del canto nella minimap 16x2: padding py
var miniCantoHeight = srcCantoHeight; //h prevista del canto nella minimap 16x2: padding py var miniCantoHeight = srcCantoHeight; //h prevista del canto nella minimap 16x2: padding py
var resizableWidth = $(visCantoClass)[0].clientWidth; var resizableWidth = $(visCantoClass)[0].clientWidth;
var resizableHeight = $(visCantoClass)[0].clientHeight; var resizableHeight = $(visCantoClass)[0].clientHeight;
var resizableRatio = resizableHeight/resizableWidth; var resizableRatio = resizableHeight/resizableWidth;
var widthRatio = resizableWidth/srcCantoWidth; var widthRatio = resizableWidth/srcCantoWidth;
var heightRatio = resizableHeight/srcCantoHeight; var heightRatio = resizableHeight/srcCantoHeight;
//var realScaleW = Math.min((maxWidth/miniCantoWidth), 1);
//var realScaleH = Math.min((maxHeight/miniCantoHeight), 1);
//minimap.style.width = '100%';
if (onlyViewer == false) { if (onlyViewer == false) {
realScale= Math.min((maxWidth/miniCantoWidth), (maxHeight/miniCantoHeight), 1); realScale= Math.min((maxWidth/miniCantoWidth), (maxHeight/miniCantoHeight), 1);
minimapContent.style.transform = `scale(${realScale})`; minimapContent.style.transform = `scale(${realScale})`;
//minimapContent.style.height = Math.trunc(miniCantoHeight) + "px";
//minimapContent.style.width = Math.trunc(maxWidth/realScale) + "px";
minimapContent.style.height = miniCantoHeight + "px"; minimapContent.style.height = miniCantoHeight + "px";
minimapContent.style.width = maxWidth/realScale + "px"; minimapContent.style.width = maxWidth/realScale + "px";
} }
//let viewerHeight = (maxHeight*heightRatio)-2; // -2 = bordi
let viewerHeight = (miniCantoHeight*realScale*heightRatio)-2; // -2 = bordi let viewerHeight = (miniCantoHeight*realScale*heightRatio)-2; // -2 = bordi
let viewerWidth = Math.min(viewerHeight/resizableRatio, maxWidth-2); // -2 bordi let viewerWidth = Math.min(viewerHeight/resizableRatio, maxWidth-2); // -2 bordi

31
js/script_4.2.js
View File

@ -128,8 +128,6 @@ $(document).ready(function() {
minWidth: 100, minWidth: 100,
maxWidth: 350, maxWidth: 350,
resize: function(event, ui) { resize: function(event, ui) {
//$("#displayinfo").css("maxWidth", ($(".visInfo").width()-4)+"px");
//$("#displayinfo").css("maxHeight", $(".visInfo").height()+"px");
getDimensionsDiv(true); getDimensionsDiv(true);
}, },
stop: function(event, ui) { stop: function(event, ui) {
@ -142,8 +140,6 @@ $(document).ready(function() {
minWidth: 350, minWidth: 350,
resize: function(event, ui) { resize: function(event, ui) {
ui.position.left = 0; ui.position.left = 0;
//$("#displayinfo").css("maxWidth", ($(".visInfo").width()-4)+"px");
//$("#displayinfo").css("maxHeight", $(".visInfo").height()+"px");
getDimensionsDiv(true); getDimensionsDiv(true);
}, },
stop: function(event, ui) { stop: function(event, ui) {
@ -154,23 +150,16 @@ $(document).ready(function() {
$(".visCanto").resizable({ $(".visCanto").resizable({
handles: "s", handles: "s",
minHeight: 80, minHeight: 80,
maxHeight: 880, //maxHeight: 880,
alsoResize: "#displaycanto", alsoResize: "#displaycanto",
resize: function(event, ui) { resize: function(event, ui) {
$("#displaycanto").width(" min-content"); $("#displaycanto").width(" min-content");
var infoHeightToSet = $("body")[0].clientHeight*tableMainHeight - $(visCantoClass)[0].clientHeight-2-63-2
$("#displayinfo").css("maxHeight", infoHeightToSet+"px");
$("#displayinfo").css("height", infoHeightToSet+"px");
$(".visInfo").css("height", (infoHeightToSet+4)+"px");
$("#displayinfo").css("maxHeight", (950-$(".visCanto")[0].clientHeight-2-63-1)+"px");
$("#displayinfo").css("height", (950-$(".visCanto")[0].clientHeight-2-63-1)+"px");
$(".visInfo").css("height", (950-$(".visCanto")[0].clientHeight-2-63+4-1)+"px !important");
//$("#displayinfo").css("maxHeight", ($("#colVisualizza")[0].clientHeight-$(".visCanto")[0].clientHeight-2-63-2)+"px");
//$("#displayinfo").css("height", ($("#colVisualizza")[0].clientHeight-$(".visCanto")[0].clientHeight-2-63-2)+"px");
//$(".visInfo").css("height", ($("#colVisualizza")[0].clientHeight-$(".visCanto")[0].clientHeight-2-63+4-2)+"px !important");
//$("#displayinfo").css("maxWidth", ($(".visInfo").width()-4)+"px");
//$("#displayinfo").css("maxHeight", ($(".visInfo").height()-17)+"px");
//$("#displayinfo").css("height", ($(".visInfo").height()-17)+"px");
//$("#displayinfo").css("maxHeight", "");
getDimensionsDiv(true); getDimensionsDiv(true);
}, },
stop: function(event, ui) { stop: function(event, ui) {
@ -557,9 +546,15 @@ $(document).ready(function() {
const jsonReplacer = (key, value) => const jsonReplacer = (key, value) =>
typeof value === 'undefined' ? 0 : value; typeof value === 'undefined' ? 0 : value;
//const cantoHeight = 0.65;
// Fine variabili // Fine variabili
//var cantoHeightToSet = $("body")[0].clientHeight*cantoHeight;
//$(".visCanto").css("max-height", cantoHeightToSet);
//$("#displaycanto").css("max-height", cantoHeightToSet);
//$(".visCanto").css("height", cantoHeightToSet);
//$("#displaycanto").css("height", cantoHeightToSet);
//$("#displayinfo").css("maxWidth", $(".visInfo").width()+"px"); //$("#displayinfo").css("maxWidth", $(".visInfo").width()+"px");