Reference Source

References

admin

summary
public
public

F routes(app: App)

The routes initializer defines the forum app's routes.

public

admin/components

summary
public
public
public
public
public
public
public

C Widget

public
public
public
public

The EditGroupModal component shows a modal dialog which allows the user to create or edit a group.

public
public

The HeaderPrimary component displays primary header controls.

public

The HeaderSecondary component displays secondary header controls.

public
public
public abstract

C Page

The Page component

public
public
public
public

The SessionDropdown component shows a button with the current user's avatar/name, with a dropdown of session controls.

public
public
public
public
public

admin/utils

summary
public

F saveSettings(settings: *): *

common

summary
public

The App class provides a container for an application, as well as various utilities for the rest of the app to use.

public abstract

The Component class defines a user interface 'building block'.

public abstract

C Model

The Model class represents a local data resource.

public

The Session class defines the current user session.

public

C Store

The Store class defines a local data store, and provides methods to retrieve data from the API.

public

Translator with the same API as Symfony's.

Derived from https://github.com/willdurand/BazingaJsTranslationBundle which is available under the MIT License. Copyright (c) William Durand william.durand1@gmail.com

public

F extend(object: Object, method: String, callback: function)

Extend an object's method by running its output through a mutating callback every time it is called.

The callback accepts the method's return value and should perform any mutations directly on this value.

public

F override(object: Object, method: String, newMethod: function)

Override an object's method by replacing it with a new function, so that the new function will be run every time the object's method is called.

common/components

summary
public

C Alert

The Alert component represents an alert box, which contains a message, some controls, and may be dismissible.

public

The AlertManager component provides an area in which Alert components can be shown and dismissed.

public

C Badge

The Badge component represents a user/discussion badge, indicating some status (e.g.

public

C Button

The Button component defines an element which, when clicked, performs an action.

public

The Checkbox component defines a checkbox input.

public

The Dropdown component displays a button which, when clicked, shows a dropdown menu beneath it.

public

The FieldSet component defines a collection of fields, displayed in a list underneath a title.

public
public

The LinkButton component defines a Button which links to a route.

public

The LoadingIndicator component displays a loading spinner with spin.js.

public abstract

C Modal

The Modal component displays a modal dialog, wrapped in a form.

public

The ModalManager component manages a modal dialog.

public

The Navigation component displays a set of navigation buttons.

public

The Placeholder component displays a muted text with some call to action, usually used as an empty state.

public

C Select

The Select component displays a <select> input, surrounded with some extra elements for styling.

public

The SelectDropdown component is the same as a Dropdown, except the toggle button's label is set as the label of the first child which has a truthy active prop.

Props

  • caretIcon
  • defaultLabel
public

The Separator component defines a menu separator item.

public

The SplitDropdown component is similar to Dropdown, but the first child is displayed as its own button prior to the toggle button.

public

C Switch

The Switch component is a Checkbox, but with a switch display instead of a tick/cross one.

common/extend

summary
public

C Routes

public
public

C Routes

common/helpers

summary
public

F avatar(user: User, attrs: Object): Object

The avatar helper displays a user's avatar.

public

F fullTime(time: Date): Object

The fullTime helper displays a formatted time string wrapped in a <time> tag.

public

F highlight(string: String, phrase: String | RegExp, length: Integer): Object

The highlight helper searches for a word phrase in a string, and wraps matches with the <mark> tag.

public

F humanTime(time: Date): Object

The humanTime helper displays a time in a human-friendly time-ago format (e.g.

public

F icon(fontClass: String, attrs: Object): Object

The icon helper displays an icon.

public

F listItems(items: *): Array

The listItems helper wraps a collection of components in

  • tags, stripping out any unnecessary Separator components.
  • public

    F punctuateSeries(items: Array): VirtualElement

    The punctuateSeries helper formats a list of strings (e.g.

    public

    F userOnline(user: User): Object

    The useronline helper displays a green circle if the user is online

    public

    F username(user: User): Object

    The username helper displays a user's username in a tag. If the user doesn't exist, the username will be displayed as [deleted].

    common/models

    summary
    public
    public

    C Forum

    public

    C Group

    public
    public

    C Post

    public

    C User

    common/utils

    summary
    public

    C Drawer

    The Drawer class controls the page's drawer. The drawer is the area the slides out from the left on mobile devices; it contains the header and the footer.

    public

    The ItemList class collects items and then arranges them into an array by priority.

    public
    public

    The ScrollListener class sets up a listener that handles window scroll events.

    public

    The SubtreeRetainer class represents a Mithril virtual DOM subtree.

    public

    F abbreviateNumber(number: Integer): String

    The abbreviateNumber utility converts a number to a shorter localized form.

    public

    F anchorScroll(element: DOMElement, callback: Function)

    The anchorScroll utility saves the scroll position relative to an element, and then restores it after a callback has been run.

    public

    F classList(classes: Object): String

    The classList utility creates a list of class names by joining an object's keys, but only for values which are truthy.

    public

    F computed(dependentKeys: ...String, compute: function): Function

    The computed utility creates a function that will cache its output until any of the dependent values are dirty.

    public

    F extract(object: Object, property: String): *

    The extract utility deletes a property from an object and returns its value.

    public

    F extractText(vdom: VirtualElement): String

    Extract the text nodes from a virtual element.

    public

    F formatNumber(number: Number): String

    The formatNumber utility localizes a number into a string with the appropriate punctuation.

    public

    F humanTime(time: Date): String

    The humanTime utility converts a date to a localized, human-readable time- ago string.

    public

    F humanTime()

    The humanTime initializer sets up a loop every 1 second to update timestamps rendered with the humanTime helper.

    public

    F mapRoutes(routes: Object, basePath: String): Object

    The mapRoutes utility converts a map of named application routes into a format that can be understood by Mithril.

    public

    F mixin(Parent: Class, mixins: ...Object): Class

    The mixin utility assigns the properties of a set of 'mixin' objects to the prototype of a parent object.

    public

    F patchMithril(global: *)

    public

    Strip HTML tags and quotes out of the given string, replacing them with meaningful punctuation.

    public

    F slug(string: String): String

    Create a slug out of the given string.

    public

    F truncate(string: String, length: Number, start: Number): String

    Truncate a string to the given length, appending ellipses if necessary.

    public

    F ucfirst(string: String): String

    Make a string's first character uppercase.

    public

    Convert the given string to a unique color.

    forum

    summary
    public
    public

    F routes(app: App)

    The routes initializer defines the forum app's routes.

    public

    forum/components

    summary
    public

    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
    public

    The ChangeEmailModal component shows a modal dialog which allows the user to change their email address.

    public

    The ChangePasswordModal component shows a modal dialog which allows the user to send themself a password reset email.

    public

    The CommentPost component displays a standard comment-typed post.

    public

    The Composer component displays the composer.

    public abstract

    The ComposerBody component handles the body, or the content, of the composer.

    public

    The ComposerButton component displays a button suitable for the composer controls.

    public

    The DiscussionComposer component displays the composer content for starting a new discussion.

    public

    The DiscussionHero component displays the hero on a discussion page.

    public

    The DiscussionList component displays a list of discussions.

    public

    The DiscussionListItem component shows a single discussion in the discussion list.

    public

    The DiscussionPage component displays a whole discussion page, including the discussion list pane, the hero, the posts, and the sidebar.

    public

    The DiscussionRenamedNotification component displays a notification which indicates that a discussion has had its title changed.

    public

    The DiscussionRenamedPost component displays a discussion event post indicating that the discussion has been renamed.

    public

    The DiscussionsSearchSource finds and displays discussion search results in the search dropdown.

    public

    The DiscussionsUserPage component shows a discussion list inside of a user page.

    public

    The EditPostComposer component displays the composer content for editing a post.

    public

    The EditUserModal component displays a modal dialog with a login form.

    public abstract

    The EventPost component displays a post which indicating a discussion event, like a discussion being renamed or stickied.

    public

    The ForgotPasswordModal component displays a modal which allows the user to enter their email address and request a link to reset their password.

    public

    The HeaderPrimary component displays primary header controls.

    public

    The HeaderSecondary component displays secondary header controls, such as the search box and the user menu.

    public

    The IndexPage component displays the index page, including the welcome hero, the sidebar, and the discussion list.

    public

    The LoadingPost component shows a placeholder that looks like a post, indicating that the post is loading.

    public

    The LogInButton component displays a social login button which will open a popup window containing the specified path.

    public

    The LogInButtons component displays a collection of social login buttons.

    public

    The LogInModal component displays a modal dialog with a login form.

    public abstract

    The Notification component abstract displays a single notification.

    public

    The NotificationGrid component displays a table of notification types and methods, allowing the user to toggle each combination.

    public

    The NotificationList component displays a list of the logged-in user's notifications, grouped by discussion.

    public
    public

    The NotificationsPage component shows the notifications list.

    public abstract

    C Page

    The Page component

    public abstract

    C Post

    The Post component displays a single post.

    public

    The PostEdited component displays information about when and by whom a post was edited.

    public

    The PostMeta component displays the time of a post, and when clicked, shows a dropdown containing more information about the post (number, full time, permalink).

    public

    The PostPreview component shows a link to a post containing the avatar and username of the author, and a short excerpt of the post's content.

    Props

    • post
    public

    The PostStream component displays an infinitely-scrollable wall of posts in a discussion.

    public

    The PostStreamScrubber component displays a scrubber which can be used to navigate/scrub through a post stream.

    public

    The PostUser component shows the avatar and username of a post's author.

    Props

    • post
    public

    The PostsUserPage component shows a user's activity feed inside of their profile.

    public

    The 'RenameDiscussionModal' displays a modal dialog with an input to rename a discussion

    public

    The ReplyComposer component displays the composer content for replying to a discussion.

    public

    The ReplyPlaceholder component displays a placeholder for a reply, which, when clicked, opens the reply composer.

    public

    C Search

    The Search component displays a menu of as-you-type results from a variety of sources.

    public

    The SessionDropdown component shows a button with the current user's avatar/name, with a dropdown of session controls.

    public

    The SettingsPage component displays the user's settings control panel, in the context of their user profile.

    public

    The SignUpModal component displays a modal dialog with a singup form.

    public

    Displays information about a the first or last post in a discussion.

    public

    The TextEditor component displays a textarea with controls, including a submit button.

    public

    The TextEditorButton component displays a button suitable for the text editor toolbar.

    public

    The UserCard component displays a user's profile card. This is used both on the UserPage (in the hero) and in discussions, shown when hovering over a post author.

    Props

    • user
    • className
    • editable
    • controlsButtonClassName
    public abstract

    The UserPage component shows a user's profile. It can be extended to show content inside of the content area. See ActivityPage and SettingsPage for examples.

    public

    The UsersSearchSource finds and displays user search results in the search dropdown.

    public

    The WelcomeHero component displays a hero that welcomes the user to the forum.

    public

    The SearchSource interface defines a section of search results in the search dropdown.

    forum/utils

    summary
    public

    The History class keeps track and manages a stack of routes that the user has navigated to in their session.

    public

    The KeyboardNavigatable class manages lists that can be navigated with the keyboard, calling callbacks for each actions.

    public

    C Pane

    The Pane class manages the page's discussion list sidepane. The pane is a part of the content view (DiscussionPage component), but its visibility is determined by CSS classes applied to the outer page element. This class manages the application of those CSS classes.

    public

    F affixSidebar(element: DOMElement, isInitialized: Boolean, context: Object)

    Setup the sidebar DOM element to be affixed to the top of the viewport using Bootstrap's affix plugin.

    public

    F alertEmailConfirmation(app: ForumApp): *

    Shows an alert if the user has not yet confirmed their email address.

    public

    F slidable(element: DOMElement): Object

    The slidable utility adds touch gestures to an element so that it can be slid away to reveal controls underneath, and then released to activate those controls.