ted/recogito-client-core
ted
/
recogito-client-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Editor auto-position now respects iframe bounds (#111)

This commit is contained in:
Rainer Simon 2022-09-03 21:44:51 +02:00
parent b92bd8d77c
commit 745f04b435
1 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/editor/setPosition.js
View File

@ -16,9 +16,11 @@ const setPosition = (wrapperEl, editorEl, selectedEl, autoPosition) => {
if (autoPosition) { if (autoPosition) {
const defaultOrientation = editorEl.children[1].getBoundingClientRect(); const defaultOrientation = editorEl.children[1].getBoundingClientRect();
const { innerWidth, innerHeight } = wrapperEl.ownerDocument.defaultView;
// Test 1: does right edge extend beyond the width of the page? // Test 1: does right edge extend beyond the width of the page?
// If so, flip horizontally // If so, flip horizontally
if (defaultOrientation.right > window.innerWidth) { if (defaultOrientation.right > innerWidth) {
editorEl.classList.remove('r6o-arrow-left'); editorEl.classList.remove('r6o-arrow-left');
editorEl.classList.add('r6o-arrow-right'); editorEl.classList.add('r6o-arrow-right');
editorEl.style.left = `${right - defaultOrientation.width - containerBounds.left}px`; editorEl.style.left = `${right - defaultOrientation.width - containerBounds.left}px`;
@ -26,7 +28,7 @@ const setPosition = (wrapperEl, editorEl, selectedEl, autoPosition) => {
// Test 2: does the bottom edge extend beyond the height of the page? // Test 2: does the bottom edge extend beyond the height of the page?
// If so, flip vertically // If so, flip vertically
if (defaultOrientation.bottom > window.innerHeight) { if (defaultOrientation.bottom > innerHeight) {
editorEl.classList.remove('r6o-arrow-top'); editorEl.classList.remove('r6o-arrow-top');
editorEl.classList.add('r6o-arrow-bottom'); editorEl.classList.add('r6o-arrow-bottom');