Reference Source
import Composer from 'flarum/components/Composer'
public class | source

Composer

Extends:

src/common/Component.js~Component → Composer

The Composer component displays the composer. It can be loaded with a content component with load and then its position/state can be altered with show, hide, close, minimize, fullScreen, and exitFullScreen.

Member Summary

Public Members
public
public

Whether or not the composer currently has focus.

public

handle: *

public

handlers: {}

public
public

The composer's "state".

Method Summary

Public Methods
public

Animate the Composer into the new position by changing the height.

public

Trigger the right animation depending on the desired new position.

public

changeHeight(height: Integer)

Save a new Composer height and update the DOM.

public

configHandle(vnode: *)

Add the necessary event handlers to the composer's handle so that it can be used to resize the composer.

public

Build an item list for the composer's controls.

public

defaultHeight(): Integer

Default height of the Composer in case none is saved.

public

focus()

Draw focus to the first focusable content element (the text editor).

public

Hide the Composer backdrop.

public

Initialize default Composer height.

public

oncreate(vnode: *)

public

oninit(vnode: *)

public

onmousemove(e: Event)

Resize the composer according to mouse movement.

public

Finish resizing the composer when the mouse is released.

public
public
public

Show the Composer backdrop.

public

Update the amount of padding-bottom on the body so that the page's content will still be visible above the composer when the page is scrolled right to the bottom.

public

Update the DOM to reflect the composer's current height. This involves setting the height of the composer's root element, and adjusting the height of any flexible elements inside the composer's body.

public

view(): *

Private Methods
private

hide()

Animate closing the composer.

private

Shrink the composer until only its title is visible.

private

show()

Animate the composer sliding up from the bottom to take its normal height.

Public Members

public $backdrop: * source

public active: Boolean source

Whether or not the composer currently has focus.

public handle: * source

public handlers: {} source

public prevPosition: * source

public state: ComposerState source

The composer's "state".

Public Methods

public animateHeightChange(): * source

Animate the Composer into the new position by changing the height.

Return:

*

public animatePositionChange(): * source

Trigger the right animation depending on the desired new position.

Return:

*

public changeHeight(height: Integer) source

Save a new Composer height and update the DOM.

Params:

NameTypeAttributeDescription
height Integer

public configHandle(vnode: *) source

Add the necessary event handlers to the composer's handle so that it can be used to resize the composer.

Params:

NameTypeAttributeDescription
vnode *

public controlItems(): ItemList source

Build an item list for the composer's controls.

Return:

ItemList

public defaultHeight(): Integer source

Default height of the Composer in case none is saved.

Return:

Integer

public focus() source

Draw focus to the first focusable content element (the text editor).

public hideBackdrop() source

Hide the Composer backdrop.

public initializeHeight() source

Initialize default Composer height.

public oncreate(vnode: *) source

Params:

NameTypeAttributeDescription
vnode *

public oninit(vnode: *) source

Params:

NameTypeAttributeDescription
vnode *

public onmousemove(e: Event) source

Resize the composer according to mouse movement.

Params:

NameTypeAttributeDescription
e Event

public onmouseup() source

Finish resizing the composer when the mouse is released.

public onremove() source

public onupdate() source

public showBackdrop() source

Show the Composer backdrop.

public updateBodyPadding() source

Update the amount of padding-bottom on the body so that the page's content will still be visible above the composer when the page is scrolled right to the bottom.

public updateHeight() source

Update the DOM to reflect the composer's current height. This involves setting the height of the composer's root element, and adjusting the height of any flexible elements inside the composer's body.

public view(): * source

Return:

*

Private Methods

private hide() source

Animate closing the composer.

private minimize() source

Shrink the composer until only its title is visible.

private show() source

Animate the composer sliding up from the bottom to take its normal height.