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

AvatarEditor

Extends:

Component → AvatarEditor

The AvatarEditor component displays a user's avatar along with a dropdown menu which allows the user to upload/remove the avatar.

Props

  • className
  • user

Static Method Summary

Static Public Methods
public static

initProps(props: *)

Member Summary

Public Members
public

Whether or not an image has been dragged over the dropzone.

public

Whether or not an avatar upload is in progress.

Method Summary

Public Methods
public

Get the items in the edit avatar dropdown menu.

public

disableDragover(e: Event)

Disable dragover style

public

dropUpload(e: Event)

Upload avatar when file is dropped into dropzone.

public

enableDragover(e: Event)

Enable dragover style

public

init()

public

Upload avatar using file picker

public

quickUpload(e: Event)

If the user doesn't have an avatar, there's no point in showing the controls dropdown, because only one option would be viable: uploading.

public

remove()

Remove the user's avatar.

public

upload(file: File)

Upload avatar

public

view(): *

Protected Methods
protected

failure(response: Object)

If avatar upload/removal fails, stop loading.

protected

success(response: Object)

After a successful upload/removal, push the updated user data into the store, and force a recomputation of the user's avatar color.

Inherited Summary

From class Component
public static

component(props: Object, children: *): Object

Get a Mithril component object for this component, preloaded with props.

public static

initProps(props: Object)

Initialize the component's props.

public

element: *

The root DOM element for the component.

public

The properties passed into the component.

public

Whether or not to retain the component's subtree on redraw.

public

$(selector: String): jQuery

Returns a jQuery object for this component's element. If you pass in a selector string, this method will return a jQuery object, using the current element as its buffer.

For example, calling component.$('li') will return a jQuery object containing all of the li elements inside the DOM element of this component.

public

config(isInitialized: Boolean, context: Object, vdom: Object)

Called after the component's root element is redrawn. This hook can be used to perform any actions on the DOM, both on the initial draw and any subsequent redraws. See Mithril's documentation for more information.

public

Called when the component is destroyed, i.e.

public

Get the renderable virtual DOM that represents the component's view.

This should NOT be overridden by subclasses. Subclasses wishing to define their virtual DOM should override Component#view instead.

protected

init()

Called when the component is constructed.

protected

Get the virtual DOM that represents the component's view.

Static Public Methods

public static initProps(props: *) source

Initialize the component's props.

Override:

Component#initProps

Params:

NameTypeAttributeDescription
props *

Public Members

public isDraggedOver: Boolean source

Whether or not an image has been dragged over the dropzone.

public loading: Boolean source

Whether or not an avatar upload is in progress.

Public Methods

public controlItems(): ItemList source

Get the items in the edit avatar dropdown menu.

Return:

ItemList

public disableDragover(e: Event) source

Disable dragover style

Params:

NameTypeAttributeDescription
e Event

public dropUpload(e: Event) source

Upload avatar when file is dropped into dropzone.

Params:

NameTypeAttributeDescription
e Event

public enableDragover(e: Event) source

Enable dragover style

Params:

NameTypeAttributeDescription
e Event

public init() source

Called when the component is constructed.

Override:

Component#init

public openPicker() source

Upload avatar using file picker

public quickUpload(e: Event) source

If the user doesn't have an avatar, there's no point in showing the controls dropdown, because only one option would be viable: uploading. Thus, when the avatar editor's dropdown toggle button is clicked, we prompt the user to upload an avatar immediately.

Params:

NameTypeAttributeDescription
e Event

public remove() source

Remove the user's avatar.

public upload(file: File) source

Upload avatar

Params:

NameTypeAttributeDescription
file File

public view(): * source

Get the virtual DOM that represents the component's view.

Override:

Component#view

Return:

*

Protected Methods

protected failure(response: Object) source

If avatar upload/removal fails, stop loading.

Params:

NameTypeAttributeDescription
response Object

protected success(response: Object) source

After a successful upload/removal, push the updated user data into the store, and force a recomputation of the user's avatar color.

Params:

NameTypeAttributeDescription
response Object