8000 List · Droppe/Lu Wiki · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content
Jimgskoop edited this page Nov 24, 2011 · 3 revisions

Athena UI - List

A List is a simple UI component that maintains state on a list of elements, e.g. the index of the selected element, the total number of elements, etc.

TBD: support for events such as goto(), previous(), next(), etc. (do those belong in the Carousel proper?)

TBD: may broadcast custom events like onChange(), onBeforeChange(), etc.

Uses

Everywhere. Used in Carousels, Tabs, DropLists, StyledDropList, Typeaheads, Menus, etc.

Requirements

  • Listen for configurable event(s).
  • Change the selected index.
  • Add to or delete elements from the list.
  • On event emit another configurable event

Markup

<ul role="ui:List" data-config="{
    'ui:List': {
        out: 'onChange'
    }
}">
    <li class="selected">one</li>
    <li>two</li>
    <li>three</li>
</ul>

Events

Notify

  • selected -- Fires when the selected list item changes.
  • max -- Fires when the last+1 item selection is attempted.
  • min -- Fires when the first-1 item selection is attempted.

Observe

  • select
  • next
  • previous
  • first
  • last
Clone this wiki locally
0