@ckeditor/ckeditor5-fullscreen 49.0.0-alpha.1 → 49.0.0-alpha.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -254,8 +254,8 @@ export declare class FullscreenAbstractEditorHandler {
|
|
|
254
254
|
*/
|
|
255
255
|
private _restoreRevisionHistoryCallbacks;
|
|
256
256
|
/**
|
|
257
|
-
*
|
|
258
|
-
* utilizing the empty space on the right side of the editable element.
|
|
257
|
+
* Adjusts the position of the open dialog to the editable moved to the fullscreen mode, and adds an event listener when
|
|
258
|
+
* the dialog opens to adjust its position in fullscreen mode, utilizing the empty space on the right side of the editable element.
|
|
259
259
|
*/
|
|
260
260
|
private _registerFullscreenDialogPositionAdjustments;
|
|
261
261
|
/**
|
|
@@ -273,7 +273,7 @@ export declare class FullscreenAbstractEditorHandler {
|
|
|
273
273
|
/**
|
|
274
274
|
* Adjusts the dialog position to utilize the empty space on the right side of the editable.
|
|
275
275
|
* The new dialog position should be on the right side of the fullscreen view with a 30px margin.
|
|
276
|
-
* Only dialogs with the position set to "editor-top-side" should have their position changed.
|
|
276
|
+
* Only dialogs with the position set to "editor-top-side" and not dragged by the user should have their position changed.
|
|
277
277
|
*/
|
|
278
278
|
private _setNewDialogPosition;
|
|
279
279
|
/**
|
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
4
4
|
*/
|
|
5
5
|
import { Command, Plugin } from "@ckeditor/ckeditor5-core";
|
|
6
|
-
import { Rect, ResizeObserver, adoptGlobalStyleSheet, createElement, env, getLayoutParentElement, getOverlayMountRoot, getParentNode, global, isShadowRoot, trustedHtml } from "@ckeditor/ckeditor5-utils";
|
|
6
|
+
import { Rect, ResizeObserver, adoptGlobalStyleSheet, containsNode, createElement, env, getLayoutParentElement, getOverlayMountRoot, getParentNode, global, isShadowRoot, trustedHtml } from "@ckeditor/ckeditor5-utils";
|
|
7
7
|
import { BalloonPanelView, BodyCollection, ButtonView, DialogViewPosition, MenuBarMenuListItemButtonView, MenuBarView } from "@ckeditor/ckeditor5-ui";
|
|
8
8
|
import { IconDocumentOutlineToggle, IconFullscreenEnter, IconFullscreenLeave, IconPreviousArrow } from "@ckeditor/ckeditor5-icons";
|
|
9
9
|
|
|
@@ -410,8 +410,12 @@ var FullscreenAbstractEditorHandler = class {
|
|
|
410
410
|
/* v8 ignore if -- @preserve */
|
|
411
411
|
if (this._editor.plugins.has("AITabs")) this._handleAITabsTransfer();
|
|
412
412
|
if (this._editor.plugins.has("SourceEditing") && this._editor.plugins.has("DocumentOutlineUI")) this._editor.plugins.get("SourceEditing").on("change:isSourceEditingMode", this._sourceEditingCallback);
|
|
413
|
-
|
|
414
|
-
|
|
413
|
+
const elementsToKeepVisible = [
|
|
414
|
+
this.getWrapper(),
|
|
415
|
+
this._editor.ui.view.body.bodyCollectionContainer,
|
|
416
|
+
this._editor.config.get("ui.overlayContainer") || null
|
|
417
|
+
];
|
|
418
|
+
for (const element of (this._editor.config.get("fullscreen.container") || this._document.body).children) if (!elementsToKeepVisible.some((node) => containsNode(element, node)) && !element.classList.contains("ck-body-wrapper") && !element.classList.contains("ckbox-wrapper") && element.style.display !== "none") {
|
|
415
419
|
this._hiddenElements.set(element, element.style.display);
|
|
416
420
|
element.style.display = "none";
|
|
417
421
|
}
|
|
@@ -422,6 +426,7 @@ var FullscreenAbstractEditorHandler = class {
|
|
|
422
426
|
this._adjustVisibleElements();
|
|
423
427
|
this._setupResizeObserver();
|
|
424
428
|
this._disableContextualBalloonPositionHandler = registerFullscreenBalloonOffsetCorrection(this._editor, this.getWrapper());
|
|
429
|
+
if (this._editor.plugins.has("Dialog")) this._registerFullscreenDialogPositionAdjustments();
|
|
425
430
|
this._editor.ui.update();
|
|
426
431
|
if (this._editor.config.get("fullscreen.onEnterCallback")) this._editor.config.get("fullscreen.onEnterCallback")(this.getWrapper());
|
|
427
432
|
}
|
|
@@ -669,12 +674,14 @@ var FullscreenAbstractEditorHandler = class {
|
|
|
669
674
|
});
|
|
670
675
|
}
|
|
671
676
|
/**
|
|
672
|
-
*
|
|
673
|
-
* utilizing the empty space on the right side of the editable element.
|
|
677
|
+
* Adjusts the position of the open dialog to the editable moved to the fullscreen mode, and adds an event listener when
|
|
678
|
+
* the dialog opens to adjust its position in fullscreen mode, utilizing the empty space on the right side of the editable element.
|
|
674
679
|
*/
|
|
675
680
|
_registerFullscreenDialogPositionAdjustments() {
|
|
676
681
|
const dialog = this._editor.plugins.get("Dialog");
|
|
682
|
+
const dialogView = dialog.view;
|
|
677
683
|
this._setNewDialogPosition();
|
|
684
|
+
if (dialogView && !dialogView.wasMoved) dialogView.updatePosition();
|
|
678
685
|
dialog.on("change:isOpen", this.updateDialogPositionCallback, { priority: "highest" });
|
|
679
686
|
}
|
|
680
687
|
/**
|
|
@@ -684,7 +691,7 @@ var FullscreenAbstractEditorHandler = class {
|
|
|
684
691
|
const dialog = this._editor.plugins.get("Dialog");
|
|
685
692
|
const dialogView = dialog.view;
|
|
686
693
|
if (dialogView && dialogView.position === null) dialogView.position = DialogViewPosition.EDITOR_TOP_SIDE;
|
|
687
|
-
if (dialogView) dialogView.updatePosition();
|
|
694
|
+
if (dialogView && !dialogView.wasMoved) dialogView.updatePosition();
|
|
688
695
|
dialog.off("change:isOpen", this.updateDialogPositionCallback);
|
|
689
696
|
}
|
|
690
697
|
/**
|
|
@@ -700,11 +707,11 @@ var FullscreenAbstractEditorHandler = class {
|
|
|
700
707
|
/**
|
|
701
708
|
* Adjusts the dialog position to utilize the empty space on the right side of the editable.
|
|
702
709
|
* The new dialog position should be on the right side of the fullscreen view with a 30px margin.
|
|
703
|
-
* Only dialogs with the position set to "editor-top-side" should have their position changed.
|
|
710
|
+
* Only dialogs with the position set to "editor-top-side" and not dragged by the user should have their position changed.
|
|
704
711
|
*/
|
|
705
712
|
_setNewDialogPosition() {
|
|
706
713
|
const dialogView = this._editor.plugins.get("Dialog").view;
|
|
707
|
-
if (!dialogView || dialogView.position !== DialogViewPosition.EDITOR_TOP_SIDE) return;
|
|
714
|
+
if (!dialogView || dialogView.position !== DialogViewPosition.EDITOR_TOP_SIDE || dialogView.wasMoved) return;
|
|
708
715
|
const keepRightEdgeContainerVisible = new Rect(this._wrapper.querySelector(".ck-fullscreen__right-edge")).getVisible();
|
|
709
716
|
const relativeContainer = keepRightEdgeContainerVisible ? this._wrapper.querySelector(".ck-fullscreen__right-edge") : this._wrapper;
|
|
710
717
|
const relativeContainerRect = new Rect(relativeContainer).getVisible();
|