presentation-components

Augmented.js Presentation Simple Components Module

API

$3

- Article
- Parameters
- Examples
- header
- Parameters
- Properties
- footer
- Parameters
- Properties
- body
- Parameters
- Properties
- sections
- Parameters
- Properties
- addSection
- Parameters
- Examples
- clearSections
- render
- Card
- Parameters
- style
- Parameters
- style
- Parameters
- body
- Parameters
- render
- remove
- Footer
- Parameters
- body
- Parameters
- render
- Header
- Parameters
- title
- Parameters
- Properties
- subTitle
- Parameters
- Properties
- render
- remove
- Manager
- Parameters
- manageComponent
- Parameters
- unmanageComponent
- Parameters
- SelectBox
- Parameters
- render
- remove
- addOption
- Parameters
- Examples

Article

Extends DecoratorView

An article class for setting up a 'page'

Supported options are:

• name - The name of the article view


• el - The mount point


• style - The style class


• header - The header markup


• headerEl - The header mount point


• footer - The footer markup


• footerEl - The footer mount point


• body - The body markup


• bodyEl - The body mount point (will generate a div)


• sections - array of sections to prefill (see addSection API for format)

$3

- options object Options to pass to the constructor

$3

``javascript
const article = new Presentation.Component.Article(
{ "el": "#mount", "header": "html", "footerEl": "#foot" });
`

$3

Header property

#### Parameters

- header

#### Properties

- header string

$3

Footer for the article

#### Parameters

- footer

#### Properties

- footer string

$3

The body content of the card (supports HTML)

#### Parameters

- body

#### Properties

- body string

$3

The section array

#### Parameters

- sections

#### Properties

- sections array

$3

Add a section object to the article

#### Parameters

- section object a section object

#### Examples

`javascript
Section Object format:
{
"id" "something",
"body" "html",
"class" "something"
}
`

$3

Clear the sections

$3

render - render the article

Card

Extends DecoratorView

A card view - simple panel/dialog-like panel

$3

- options

$3

body property - the body of the card

#### Parameters

- style

$3

style property - the style

#### Parameters

- style

$3

The body content of the card (supports HTML)

#### Parameters

- body

$3

render - render the card

$3

remove

Footer

Extends DecoratorView

A Footer Component

$3

- options

$3

The body content of the card (supports HTML)

#### Parameters

- body

$3

render - render the footer

Header

Extends DecoratorView

A Header Component

$3

- options

$3

#### Parameters

- title

#### Properties

- title string A title property

$3

#### Parameters

- subTitle

#### Properties

- subTitle string A subTitle property

$3

render - render the header

$3

Remove the Header

Returns object Returns the view context ('this')

Manager

Extends Mediator

A Component Manager or Mediator

$3

- options

Meta

- deprecated: Use Mediator

$3

Manages a component (colleague)

#### Parameters

- component View A component or view to manage

$3

Unmanages a component (colleague)

#### Parameters

- component View A component or view to manage

SelectBox

Extends DecoratorView

A SelectBox

$3

- options (optional, default {})

$3

Render the SelectBox

Returns object Returns the view context ('this')

$3

remove

$3

Adds an option to the select

#### Parameters

- label string label of the option
- value string value of the option
- selected boolean selected or not

#### Examples

`javascript
addOption({"dog", 0, true});
``