diff --git a/js/ckeditor.on-init.js b/js/ckeditor.on-init.js index eb725fb0b..58e95dbfb 100644 --- a/js/ckeditor.on-init.js +++ b/js/ckeditor.on-init.js @@ -16,6 +16,21 @@ CKEDITOR.on('instanceReady', function (oEvent) { $('#'+ oEvent.editor.name).closest('form').trigger('submit'); } }); + // N°4631 - Add a custom class to the CKEditor container when it is in fullscreen mode + // so elements know they should take into account intersecting with the editor + oEvent.editor.on('maximize', function() { + const sFullscreenClass = 'ibo-is-fullscreen'; + let container = this.container.getFirst( function( node ) { + return node.type === CKEDITOR.NODE_ELEMENT && node.hasClass( 'cke_inner' ); + } ); + if (this.commands.maximize.state === CKEDITOR.TRISTATE_ON) { + // The editor is in fullscreen mode, add the custom class + container.addClass(sFullscreenClass); + } else { + // The editor is not in fullscreen mode, remove the custom class + container.removeClass(sFullscreenClass); + } + }); }); // For disabling the CKEditor at init time when the corresponding textarea is disabled ! diff --git a/js/components/panel.js b/js/components/panel.js index c17679e25..d1ddc5dda 100644 --- a/js/components/panel.js +++ b/js/components/panel.js @@ -37,7 +37,9 @@ $(function () { sticky_sentinel_top: 'ibo-sticky-sentinel-top', }, js_selectors: { - global: {}, + global: { + fullscreen_elements: '.ibo-is-fullscreen', + }, block: { panel_header: '[data-role="ibo-panel--header"]:first', panel_header_sticky_sentinel_top: '[data-role="ibo-panel--header--sticky-sentinel-top"]:first', @@ -132,10 +134,18 @@ $(function () { }) // ... we consider the header as sticking... .on('enter', function () { + // N°4631 - If a non-intersecting element is fullscreen, we do nothing + if ($(me.js_selectors.global.fullscreen_elements).length > 0) { + return; + } me._onHeaderBecomesSticky(); }) // ... and when it comes back in the viewport, it stops. .on('leave', function () { + // N°4631 - If a non-intersecting element is fullscreen, we do nothing + if ($(me.js_selectors.global.fullscreen_elements).length > 0) { + return; + } me._onHeaderStopsBeingSticky(); }) .addTo(this.sticky_header_controller); diff --git a/js/layouts/tab-container/tab-container.js b/js/layouts/tab-container/tab-container.js index 985127f00..582fa0046 100644 --- a/js/layouts/tab-container/tab-container.js +++ b/js/layouts/tab-container/tab-container.js @@ -32,6 +32,9 @@ $(function() extra_tabs_list_toggler: '[data-role="ibo-tab-container--extra-tabs-list-toggler"]', extra_tabs_list: '[data-role="ibo-tab-container--extra-tabs-list"]', extra_tab_toggler: '[data-role="ibo-tab-container--extra-tab-toggler"]', + global: { + fullscreen_elements: '.ibo-is-fullscreen', + }, }, // the constructor @@ -141,6 +144,10 @@ $(function() // Resize of the tab container if(window.IntersectionObserver) { const oTabsListIntersectObs = new IntersectionObserver(function(aEntries, oTabsListIntersectObs){ + // N°4631 - If a non-intersecting element is fullscreen, we do nothing + if ($(me.js_selectors.global.fullscreen_elements).length > 0) { + return; + } aEntries.forEach(oEntry => { let oTabHeaderElem = $(oEntry.target); let bIsVisible = oEntry.isIntersecting;