# FullscreenAbstractEditorHandler

class

The abstract editor type handler.

This class defines some actions and behaviors that are applied when fullscreen mode is toggled, and which are common regardless of the editor type. Then, specific classes like `ClassicEditorHandler` or `DecoupledEditorHandler` extend this class with actions specific for these editor types.

Extend this class to provide fullscreen mode handling for unsupported editor types, or if you wish to heavily customize the default behavior.

The only method that is necessary to provide when extending this class is [`defaultOnEnter`](#function-defaultOnEnter). However, make sure to familiarize yourself with the below full list of actions taken by `FullscreenAbstractEditorHandler` to understand what is covered by default, and what should be provided by you.

When entering the fullscreen mode, the [`enable`](#function-enable) method is called. It creates the properly styled container and handles the editor features that need it, in the following order:

1. Saves the scroll positions of all ancestors of the editable element to restore them after leaving the fullscreen mode.
2. Executes the [`defaultOnEnter`](#function-defaultOnEnter) method to move the proper editor UI elements to the fullscreen mode. **If you extend the abstract handler, you should override this method** to move the elements that are specific to your editor type, like: editable, toolbar, menu bar. Use [`moveToFullscreen`](#function-moveToFullscreen) method for this purpose to ensure they are automatically cleaned up after leaving the fullscreen mode.
3. Adds proper classes to the `<body>` and `<html>` elements to block page scrolling, adjust `z-index` etc.

Steps 4-12 are only executed if the corresponding features are used.

4. If presence list is used, moves it to the fullscreen mode container.
5. If document outline is used, moves it to the fullscreen mode.
6. If pagination is used, adjusts it's configuration for the changed view.
7. If annotations are used, moves them to the fullscreen mode.
8. If revision history is used, overrides the callbacks to show the revision viewer in the fullscreen mode.
9. If AI Tabs is used, moves it to the fullscreen mode.
10. If source editing and document outline are both used, registers a callback hiding the document outline header in source editing mode.
11. Changes the position of some dialogs to utilize the empty space on the right side of the editable element.
12. If custom container is used, hides all other elements in it to ensure they don't create an empty unscrollable space.

Then finally:

13. Adjusts the visibility of the left and right sidebars based on the available space.
14. Sets up a resize observer to adjust the visibility of the left and right sidebars dynamically.
15. Executes the configured [`config.fullscreen.onEnterCallback`](module_fullscreen_fullscreenconfig-FullscreenConfig.md#member-onEnterCallback) function. By default, it returns the fullscreen mode container element so it can be further customized.

When leaving the fullscreen mode, the [`disable`](#function-disable) method is called. It does the following:

1. Execute the configured [`config.fullscreen.onLeaveCallback`](module_fullscreen_fullscreenconfig-FullscreenConfig.md#member-onLeaveCallback) function.
2. Remove the classes added to the `<body>` and `<html>` elements.
3. If document outline is used, restore its default container.
4. If annotations are used, restore their original state (UI, filters etc).
5. If revision history is used, restore the original callbacks.
6. If AI Tabs is used, restore it to the original state.
7. If source editing and document outline are both used, restore the document outline header.
8. Restore all moved elements to their original place.
9. Destroy the fullscreen mode container.
10. If the editor has a toolbar, switch its behavior to the one configured in the [`shouldGroupWhenFull`](module_ui_toolbar_toolbarview-ToolbarOptions.md#member-shouldGroupWhenFull) property.
11. Restore the scroll positions of all ancestors of the editable element.
12. If pagination is used, restore its default configuration.
13. Restore default dialogs positions.

This class is exported to allow for custom extensions.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L82)

<a id="properties">

## Properties

<a id="member-updateDialogPositionCallback">

### `updateDialogPositionCallback: ( _evt: EventInfo, _name: string, isOpen: boolean ) => void`

Stores a bound reference to the \_updateDialogPosition method, allowing it to be attached and detached from change event.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L846)

<a id="member-_closeRevisionViewerCallback">

### `_closeRevisionViewerCallback: ( viewerEditor: any ) => Promise<unknown> | null` _(protected)_

A callback that closes the revision viewer, stored to restore the original one after exiting the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L178)

<a id="member-_editor">

### `_editor: Editor & Partial<ElementApi>` _(protected)_

An editor instance. It should be set by the particular editor type handler.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L183)

<a id="member-_showRevisionViewerCallback">

### `_showRevisionViewerCallback: ( config: EditorConfig ) => Promise<any> | null` _(protected)_

A callback that shows the revision viewer, stored to restore the original one after exiting the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L173)

<a id="member-_aiTabsData">

### `_aiTabsData: object | null` _(private)_

A map of AI Tabs data that were set before entering the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L188)

<a id="member-_annotationsUIsData">

### `_annotationsUIsData: Map<string, Record<string, any>> | null` _(private)_

Data of the annotations UIs that were active before entering the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L101)

<a id="member-_collapseLeftSidebarButton">

### `_collapseLeftSidebarButton: ButtonView | null` _(private)_

The button that toggles the visibility of the left sidebar.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L117)

<a id="member-_disableContextualBalloonPositionHandler">

### `_disableContextualBalloonPositionHandler: VoidFunction` _(private)_

A cleanup function returned by `registerFullscreenBalloonOffsetCorrection`.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L144)

<a id="member-_document">

### `_document: Document` _(private)_

The document object in which the editor is located.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L96)

<a id="member-_forceShowLeftSidebar">

### `_forceShowLeftSidebar: boolean` _(private)_

Temporary flag used to ignore the first automatic layout adjustment logic when user collapses the left sidebar with a button. It is then immediately set back to `false`.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L139)

<a id="member-_hasLeftCollapseButton">

### `_hasLeftCollapseButton: boolean` _(private)_

Whether the left sidebar collapse button is created.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L112)

<a id="member-_hiddenElements">

### `_hiddenElements: Map<HTMLElement, string>` _(private)_

A map of elements that were hidden when entering the fullscreen mode. It is used to restore their previous visibility when leaving the fullscreen mode and avoid showing elements that were hidden before entering the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L163)

<a id="member-_keepLeftSidebarHidden">

### `_keepLeftSidebarHidden: boolean` _(private)_

Whether the left sidebar should be kept hidden even if there is enough space for it. It's set to `true` when user collapses the left sidebar with a button. Behavior is reset when exiting the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L133)

<a id="member-_paginationBodyCollection">

### `_paginationBodyCollection: BodyCollection | null` _(private)_

The pagination body collection that is used in the fullscreen mode. If we don't move pagination lines to the fullscreen container, they won't be visible.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L107)

<a id="member-_placeholderMap">

### `_placeholderMap: Map<string, object>` _(private)_

Maps placeholder names to placeholder elements and moved elements.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L86)

<a id="member-_resizeObserver">

### `_resizeObserver: ResizeObserver | null` _(private)_

The resize observer that is used to adjust the visibility of the left and right sidebars dynamically.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L122)

<a id="member-_savedAncestorsScrollPositions">

### `_savedAncestorsScrollPositions: Map<HTMLElement, object>` _(private)_

A map matching the ancestors of the editable element with their scroll positions before entering fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L168)

<a id="member-_sidebarsWidths">

### `_sidebarsWidths: object` _(private)_

The width of the expanded left and right sidebars in the fullscreen mode. Necessary for logic checking if they should be visible.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L127)

<a id="member-_wrapper">

### `_wrapper: HTMLElement | null` _(private)_

The wrapper element that holds the fullscreen mode layout.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L91)

<a id="methods">

## Methods

<a id="function-constructor">

### `constructor( editor )`

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L193)

#### Parameters

* `editor: Editor`

<a id="function-defaultOnEnter">

### `defaultOnEnter() → HTMLElement`

A function that moves the editor UI elements to the fullscreen mode. It should be set by the particular editor type handler.

Returns the fullscreen mode container element so it can be further customized via `fullscreen.onEnterCallback` configuration property.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L510)

#### Returns

* `HTMLElement`

<a id="function-destroy">

### `destroy() → void`

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L492)

#### Returns

* `void`

<a id="function-disable">

### `disable() → void`

Disables the fullscreen mode by restoring all moved elements and destroying the fullscreen container.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L402)

#### Returns

* `void`

<a id="function-enable">

### `enable() → void`

Enables the fullscreen mode. It executes the editor-specific enable handler and then the configured callback.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L287)

#### Returns

* `void`

<a id="function-getWrapper">

### `getWrapper() → HTMLElement`

Returns the fullscreen mode container element.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L253)

#### Returns

* `HTMLElement`

<a id="function-moveToFullscreen">

### `moveToFullscreen( elementToMove, placeholderName ) → void`

Moves the given element to the fullscreen mode container, leaving a placeholder in its place.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L219)

#### Parameters

* `elementToMove: HTMLElement`
* `placeholderName: string`

#### Returns

* `void`

<a id="function-restoreMovedElementLocation">

### `restoreMovedElementLocation( placeholderName ) → void`

Returns a single moved element to its original place.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L233)

#### Parameters

* `placeholderName: string`

#### Returns

* `void`

<a id="function-_adjustVisibleElements">

### `_adjustVisibleElements() → void` _(private)_

Adjusts the visibility of the left and right sidebars based on the available space.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L988)

#### Returns

* `void`

<a id="function-_aiTabsTransitionEndCallback">

### `_aiTabsTransitionEndCallback( evt ) → void` _(private)_

Handler for AI tabs `transitionend`; must be the same reference in `addEventListener` / `removeEventListener`.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1139)

#### Parameters

* `evt: Event`

#### Returns

* `void`

<a id="function-_destroyContainer">

### `_destroyContainer() → void` _(private)_

Destroys the fullscreen mode container.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L517)

#### Returns

* `void`

<a id="function-_generateCollapseButton">

### `_generateCollapseButton() → void` _(private)_

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L624)

#### Returns

* `void`

<a id="function-_generateDocumentOutlineContainer">

### `_generateDocumentOutlineContainer() → void` _(private)_

Checks if the DocumentOutlineUI plugin is available and moves its elements to fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L573)

#### Returns

* `void`

<a id="function-_generatePresenceListContainer">

### `_generatePresenceListContainer() → void` _(private)_

Checks if the PresenceListUI plugin is available and moves its elements to fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L538)

#### Returns

* `void`

<a id="function-_handleAISidebarTransitions">

### `_handleAISidebarTransitions( evt ) → void` _(private)_

Checks the transition event to see if it's changing the width of the AI tabs and if so, adjusts the visible fullscreen mode elements.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L959)

#### Parameters

* `evt: TransitionEvent`

#### Returns

* `void`

<a id="function-_handleAITabsTransfer">

### `_handleAITabsTransfer() → void` _(private)_

Stores the current state of the AI Tabs and moves it to the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L938)

#### Returns

* `void`

<a id="function-_hideLeftSidebar">

### `_hideLeftSidebar() → void` _(private)_

Hides the left sidebar. Works only if there is anything to hide.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1087)

#### Returns

* `void`

<a id="function-_hideRightSidebar">

### `_hideRightSidebar() → void` _(private)_

Hides the right sidebar. Works only if there is anything to hide.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1119)

#### Returns

* `void`

<a id="function-_overrideAnnotationsUIs">

### `_overrideAnnotationsUIs() → void` _(private)_

Stores the current state of the annotations UIs to restore it when leaving fullscreen mode and switches the UI to the wide sidebar.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L669)

#### Returns

* `void`

<a id="function-_overrideRevisionHistoryCallbacks">

### `_overrideRevisionHistoryCallbacks() → void` _(private)_

Modifies the revision history viewer callbacks to display the viewer in the fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L735)

#### Returns

* `void`

<a id="function-_registerFullscreenDialogPositionAdjustments">

### `_registerFullscreenDialogPositionAdjustments() → void` _(private)_

Adds an event listener when the dialog opens to adjust its position in fullscreen mode, utilizing the empty space on the right side of the editable element.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L817)

#### Returns

* `void`

<a id="function-_restoreAITabs">

### `_restoreAITabs() → void` _(private)_

Restores the state of the AI Tabs to the original values.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L974)

#### Returns

* `void`

<a id="function-_restoreAnnotationsUIs">

### `_restoreAnnotationsUIs() → void` _(private)_

Restores the saved state of the annotations UIs.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L712)

#### Returns

* `void`

<a id="function-_restoreDocumentOutlineDefaultContainer">

### `_restoreDocumentOutlineDefaultContainer() → void` _(private)_

Restores the default value of documentOutlineContainer, which is modified in fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L617)

#### Returns

* `void`

<a id="function-_restoreRevisionHistoryCallbacks">

### `_restoreRevisionHistoryCallbacks() → void` _(private)_

Resets the revision history viewer callbacks to their original values.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L799)

#### Returns

* `void`

<a id="function-_saveAncestorsScrollPositions">

### `_saveAncestorsScrollPositions( domElement ) → void` _(private)_

Saves the scroll positions of all ancestors of the given element.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L900)

#### Parameters

* `domElement: HTMLElement`

#### Returns

* `void`

<a id="function-_setNewDialogPosition">

### `_setNewDialogPosition() → void` _(private)_

Adjusts the dialog position to utilize the empty space on the right side of the editable. The new dialog position should be on the right side of the fullscreen view with a 30px margin. Only dialogs with the position set to "editor-top-side" should have their position changed.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L862)

#### Returns

* `void`

<a id="function-_setupResizeObserver">

### `_setupResizeObserver() → void` _(private)_

Sets up a resize observer to adjust the visibility of the left and right sidebars dynamically.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1070)

#### Returns

* `void`

<a id="function-_showLeftSidebar">

### `_showLeftSidebar() → void` _(private)_

Shows the left sidebar. Works only if there is anything to show.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1104)

#### Returns

* `void`

<a id="function-_showRightSidebar">

### `_showRightSidebar() → void` _(private)_

Shows the right sidebar. Works only if there is anything to show.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1129)

#### Returns

* `void`

<a id="function-_sourceEditingCallback">

### `_sourceEditingCallback( _evt, _name, value ) → void` _(private)_

A callback that hides the document outline header when the source editing mode is enabled. Document outline element itself is hidden by source editing plugin.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L151)

#### Parameters

* `_evt: EventInfo`
* `_name: string`
* `value: boolean`

#### Returns

* `void`

<a id="function-_switchAnnotationsUI">

### `_switchAnnotationsUI( uiName ) → void` _(private)_

Switches the annotations UI to the requested one.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L1038)

#### Parameters

* `uiName: string`

#### Returns

* `void`

<a id="function-_unregisterFullscreenDialogPositionAdjustments">

### `_unregisterFullscreenDialogPositionAdjustments() → void` _(private)_

Removes an event listener that adjusts the dialog's position in fullscreen mode.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L828)

#### Returns

* `void`

<a id="function-_updateDialogPosition">

### `_updateDialogPosition( _evt, _name, isOpen ) → void` _(private)_

If dialog is open, adjust its positioning.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-fullscreen/src/handlers/abstracteditorhandler.ts#L851)

#### Parameters

* `_evt: EventInfo`
* `_name: string`
* `isOpen: boolean`

#### Returns

* `void`

---

Full index of the CKEditor 5 API reference: [llms.txt](llms.txt)
