Skip to content

Commit 795c5fb

Browse files
AndreiKingsleyAndreiKingsley
committed
fix old iframes
1 parent f2c8085 commit 795c5fb

File tree

133 files changed

+8778
-4123
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

133 files changed

+8778
-4123
lines changed

‎core/src/test/kotlin/org/jetbrains/kotlinx/dataframe/explainer/SamplesRenderingUtils.kt

Lines changed: 66 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -37,41 +37,82 @@ val WritersideStyle = DataFrameHtmlData(
3737
function sendHeight() {
3838
let totalHeight = 0;
3939
40-
const detailsElements = document.querySelectorAll('details');
40+
document.querySelectorAll('body > details, body > br').forEach(element => {
41+
if (element.tagName === 'DETAILS') {
42+
totalHeight += getElementHeight(element.querySelector(':scope > summary'));
4143
42-
detailsElements.forEach(detail => {
43-
44-
const summary = detail.querySelector('summary');
45-
if (summary) {
46-
totalHeight += summary.offsetHeight;
44+
if (element.open) {
45+
totalHeight += getVisibleContentHeight(element);
46+
}
47+
} else if (element.tagName === 'BR') {
48+
totalHeight += getElementHeight(element);
4749
}
50+
});
4851
49-
50-
if (detail.open) {
51-
const table = detail.querySelector('table.dataframe');
52-
if (table) {
53-
totalHeight += table.offsetHeight;
52+
totalHeight += 10;
5453
55-
const styles = getComputedStyle(table);
56-
totalHeight += parseFloat(styles.marginTop) + parseFloat(styles.marginBottom) + 10;
57-
}
54+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(totalHeight)}, '*');
55+
}
56+
57+
function getVisibleContentHeight(detailsElement) {
58+
let height = 0;
59+
60+
detailsElement.querySelectorAll(':scope > details, :scope > table, :scope > p').forEach(child => {
61+
if (child.tagName === 'DETAILS') {
62+
const summary = child.querySelector(':scope > summary');
63+
height += getElementHeight(summary);
5864
59-
const description = detail.querySelector('.dataframe_description');
60-
if (description) {
61-
totalHeight += description.offsetHeight;
65+
if (child.open) {
66+
height += getDirectVisibleContentHeight(child);
6267
}
68+
} else if (isElementVisible(child)) {
69+
height += getElementHeight(child);
70+
}
71+
});
72+
73+
return height;
74+
}
75+
76+
function getDirectVisibleContentHeight(element) {
77+
let height = 0;
78+
element.querySelectorAll(':scope > table, :scope > p, :scope > summary').forEach(child => {
79+
if (isElementVisible(child)) {
80+
height += getElementHeight(child);
81+
}
82+
});
83+
return height;
84+
}
85+
86+
function getElementHeight(el) {
87+
const styles = getComputedStyle(el);
88+
const margin = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
89+
return el.offsetHeight + margin;
90+
}
91+
92+
function isElementVisible(el) {
93+
return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
94+
}
95+
96+
function sendInitialHeight() {
97+
let initialHeight = 0;
98+
99+
document.querySelectorAll('body > details, body > br').forEach(element => {
100+
if (element.tagName === 'DETAILS') {
101+
initialHeight += getElementHeight(element.querySelector(':scope > summary'));
102+
} else if (element.tagName === 'BR') {
103+
initialHeight += getElementHeight(element);
63104
}
64105
});
65-
66-
totalHeight = Math.ceil(totalHeight + 16);
67106
68-
window.parent.postMessage({type: 'iframeHeight', height: totalHeight}, '*');
107+
initialHeight += 10;
108+
109+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(initialHeight)}, '*');
69110
}
70111
71112
function repeatHeightCalculation(maxRetries = 10, interval = 100) {
72113
let retries = 0;
73114
const intervalId = setInterval(() => {
74-
sendHeight();
115+
sendInitialHeight();
75116
retries++;
76117
if (retries >= maxRetries) clearInterval(intervalId);
77118
}, interval);
@@ -80,21 +121,15 @@ function repeatHeightCalculation(maxRetries = 10, interval = 100) {
80121
window.addEventListener('load', () => {
81122
repeatHeightCalculation();
82123
124+
83125
document.querySelectorAll('details').forEach(detail => {
84126
detail.addEventListener('toggle', () => {
85-
setTimeout(sendHeight, 30);
127+
setTimeout(sendHeight, 50);
86128
});
87129
});
88-
});
89130
90-
const allObservedTables = document.querySelectorAll('table.dataframe');
91-
allObservedTables.forEach((table) => {
92-
const observer = new MutationObserver(sendHeight);
93-
observer.observe(table, {
94-
childList: true,
95-
subtree: true,
96-
characterData: true,
97-
});
131+
const observer = new MutationObserver(() => setTimeout(sendHeight, 50));
132+
observer.observe(document.body, {childList: true, subtree: true, characterData: true});
98133
});
99134
""".trimIndent(),
100135
)

‎docs/StardustDocs/resources/snippets/org.jetbrains.kotlinx.dataframe.samples.api.Access.byRow.html

Lines changed: 66 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -516,41 +516,82 @@
516516
function sendHeight() {
517517
let totalHeight = 0;
518518

519-
const detailsElements = document.querySelectorAll('details');
519+
document.querySelectorAll('body > details, body > br').forEach(element => {
520+
if (element.tagName === 'DETAILS') {
521+
totalHeight += getElementHeight(element.querySelector(':scope > summary'));
520522

521-
detailsElements.forEach(detail => {
522-
523-
const summary = detail.querySelector('summary');
524-
if (summary) {
525-
totalHeight += summary.offsetHeight;
523+
if (element.open) {
524+
totalHeight += getVisibleContentHeight(element);
525+
}
526+
} else if (element.tagName === 'BR') {
527+
totalHeight += getElementHeight(element);
526528
}
529+
});
527530

528-
529-
if (detail.open) {
530-
const table = detail.querySelector('table.dataframe');
531-
if (table) {
532-
totalHeight += table.offsetHeight;
531+
totalHeight += 10;
533532

534-
const styles = getComputedStyle(table);
535-
totalHeight += parseFloat(styles.marginTop) + parseFloat(styles.marginBottom) + 10;
536-
}
533+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(totalHeight)}, '*');
534+
}
535+
536+
function getVisibleContentHeight(detailsElement) {
537+
let height = 0;
538+
539+
detailsElement.querySelectorAll(':scope > details, :scope > table, :scope > p').forEach(child => {
540+
if (child.tagName === 'DETAILS') {
541+
const summary = child.querySelector(':scope > summary');
542+
height += getElementHeight(summary);
537543

538-
const description = detail.querySelector('.dataframe_description');
539-
if (description) {
540-
totalHeight += description.offsetHeight;
544+
if (child.open) {
545+
height += getDirectVisibleContentHeight(child);
541546
}
547+
} else if (isElementVisible(child)) {
548+
height += getElementHeight(child);
549+
}
550+
});
551+
552+
return height;
553+
}
554+
555+
function getDirectVisibleContentHeight(element) {
556+
let height = 0;
557+
element.querySelectorAll(':scope > table, :scope > p, :scope > summary').forEach(child => {
558+
if (isElementVisible(child)) {
559+
height += getElementHeight(child);
560+
}
561+
});
562+
return height;
563+
}
564+
565+
function getElementHeight(el) {
566+
const styles = getComputedStyle(el);
567+
const margin = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
568+
return el.offsetHeight + margin;
569+
}
570+
571+
function isElementVisible(el) {
572+
return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
573+
}
574+
575+
function sendInitialHeight() {
576+
let initialHeight = 0;
577+
578+
document.querySelectorAll('body > details, body > br').forEach(element => {
579+
if (element.tagName === 'DETAILS') {
580+
initialHeight += getElementHeight(element.querySelector(':scope > summary'));
581+
} else if (element.tagName === 'BR') {
582+
initialHeight += getElementHeight(element);
542583
}
543584
});
544-
545-
totalHeight = Math.ceil(totalHeight + 16);
546585

547-
window.parent.postMessage({type: 'iframeHeight', height: totalHeight}, '*');
586+
initialHeight += 10;
587+
588+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(initialHeight)}, '*');
548589
}
549590

550591
function repeatHeightCalculation(maxRetries = 10, interval = 100) {
551592
let retries = 0;
552593
const intervalId = setInterval(() => {
553-
sendHeight();
594+
sendInitialHeight();
554595
retries++;
555596
if (retries >= maxRetries) clearInterval(intervalId);
556597
}, interval);
@@ -559,21 +600,15 @@
559600
window.addEventListener('load', () => {
560601
repeatHeightCalculation();
561602

603+
562604
document.querySelectorAll('details').forEach(detail => {
563605
detail.addEventListener('toggle', () => {
564-
setTimeout(sendHeight, 30);
606+
setTimeout(sendHeight, 50);
565607
});
566608
});
567-
});
568609

569-
const allObservedTables = document.querySelectorAll('table.dataframe');
570-
allObservedTables.forEach((table) => {
571-
const observer = new MutationObserver(sendHeight);
572-
observer.observe(table, {
573-
childList: true,
574-
subtree: true,
575-
characterData: true,
576-
});
610+
const observer = new MutationObserver(() => setTimeout(sendHeight, 50));
611+
observer.observe(document.body, {childList: true, subtree: true, characterData: true});
577612
});
578613
/*<!--*/
579614
call_DataFrame(function() { DataFrame.addTable({ cols: [{ name: "<span title=\"firstName: String\">firstName</span>", children: [], rightAlign: false, values: ["Alice","Bob","Charlie","Charlie","Bob","Alice","Charlie"] },

‎docs/StardustDocs/resources/snippets/org.jetbrains.kotlinx.dataframe.samples.api.Access.columnSelectors.html

Lines changed: 66 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -616,41 +616,82 @@
616616
function sendHeight() {
617617
let totalHeight = 0;
618618

619-
const detailsElements = document.querySelectorAll('details');
619+
document.querySelectorAll('body > details, body > br').forEach(element => {
620+
if (element.tagName === 'DETAILS') {
621+
totalHeight += getElementHeight(element.querySelector(':scope > summary'));
620622

621-
detailsElements.forEach(detail => {
622-
623-
const summary = detail.querySelector('summary');
624-
if (summary) {
625-
totalHeight += summary.offsetHeight;
623+
if (element.open) {
624+
totalHeight += getVisibleContentHeight(element);
625+
}
626+
} else if (element.tagName === 'BR') {
627+
totalHeight += getElementHeight(element);
626628
}
629+
});
627630

628-
629-
if (detail.open) {
630-
const table = detail.querySelector('table.dataframe');
631-
if (table) {
632-
totalHeight += table.offsetHeight;
631+
totalHeight += 10;
633632

634-
const styles = getComputedStyle(table);
635-
totalHeight += parseFloat(styles.marginTop) + parseFloat(styles.marginBottom) + 10;
636-
}
633+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(totalHeight)}, '*');
634+
}
635+
636+
function getVisibleContentHeight(detailsElement) {
637+
let height = 0;
638+
639+
detailsElement.querySelectorAll(':scope > details, :scope > table, :scope > p').forEach(child => {
640+
if (child.tagName === 'DETAILS') {
641+
const summary = child.querySelector(':scope > summary');
642+
height += getElementHeight(summary);
637643

638-
const description = detail.querySelector('.dataframe_description');
639-
if (description) {
640-
totalHeight += description.offsetHeight;
644+
if (child.open) {
645+
height += getDirectVisibleContentHeight(child);
641646
}
647+
} else if (isElementVisible(child)) {
648+
height += getElementHeight(child);
649+
}
650+
});
651+
652+
return height;
653+
}
654+
655+
function getDirectVisibleContentHeight(element) {
656+
let height = 0;
657+
element.querySelectorAll(':scope > table, :scope > p, :scope > summary').forEach(child => {
658+
if (isElementVisible(child)) {
659+
height += getElementHeight(child);
660+
}
661+
});
662+
return height;
663+
}
664+
665+
function getElementHeight(el) {
666+
const styles = getComputedStyle(el);
667+
const margin = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
668+
return el.offsetHeight + margin;
669+
}
670+
671+
function isElementVisible(el) {
672+
return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
673+
}
674+
675+
function sendInitialHeight() {
676+
let initialHeight = 0;
677+
678+
document.querySelectorAll('body > details, body > br').forEach(element => {
679+
if (element.tagName === 'DETAILS') {
680+
initialHeight += getElementHeight(element.querySelector(':scope > summary'));
681+
} else if (element.tagName === 'BR') {
682+
initialHeight += getElementHeight(element);
642683
}
643684
});
644-
645-
totalHeight = Math.ceil(totalHeight + 16);
646685

647-
window.parent.postMessage({type: 'iframeHeight', height: totalHeight}, '*');
686+
initialHeight += 10;
687+
688+
window.parent.postMessage({type: 'iframeHeight', height: Math.ceil(initialHeight)}, '*');
648689
}
649690

650691
function repeatHeightCalculation(maxRetries = 10, interval = 100) {
651692
let retries = 0;
652693
const intervalId = setInterval(() => {
653-
sendHeight();
694+
sendInitialHeight();
654695
retries++;
655696
if (retries >= maxRetries) clearInterval(intervalId);
656697
}, interval);
@@ -659,21 +700,15 @@
659700
window.addEventListener('load', () => {
660701
repeatHeightCalculation();
661702

703+
662704
document.querySelectorAll('details').forEach(detail => {
663705
detail.addEventListener('toggle', () => {
664-
setTimeout(sendHeight, 30);
706+
setTimeout(sendHeight, 50);
665707
});
666708
});
667-
});
668709

669-
const allObservedTables = document.querySelectorAll('table.dataframe');
670-
allObservedTables.forEach((table) => {
671-
const observer = new MutationObserver(sendHeight);
672-
observer.observe(table, {
673-
childList: true,
674-
subtree: true,
675-
characterData: true,
676-
});
710+
const observer = new MutationObserver(() => setTimeout(sendHeight, 50));
711+
observer.observe(document.body, {childList: true, subtree: true, characterData: true});
677712
});
678713
/*<!--*/
679714
call_DataFrame(function() { DataFrame.addTable({ cols: [{ name: "<span title=\"firstName: String\">firstName</span>", children: [], rightAlign: false, values: ["Alice","Bob","Charlie","Charlie","Bob","Alice","Charlie"] },

0 commit comments

Comments
 (0)