{deck:id=Composition|width=907}
{card:label=Overview}
h4. Composition Plugin
This plugin contains macros which allow finer control over the layout (or composition) of a page. Allows control over when content is hidden or displayed and how it is organized.
h5. This plugin includes the following macros:
* *composition-setup*
* *deck* and *card* - Creates tabbed content
* *show-card* - Shows a card in a specified deck.
* *float* - Allows content to float to the left or right of text.
* *toggle-cloak* and *cloak* - Allows content to be hidden or displayed.
{card}
{card:label=Documentation}
{deck:id=compisitionm}
{card:label=composition-setup}
Performs setup operations for some of the composition macros, as well as allowing page-wide defaults to be set. The macro's properties can be put within the body of the macro or attached to the page in a text file.
The following *Composition Macros* require the composition-setup macro to function:
* *deck*
* *card*
* *cloak*
* *toggle cloak*
h3. The Code
Properties set within the body of the macro :
{code}
composition-setup}
property.key = value
some.properties = some_values
some.properties = some_values
{composition-setup}
{code}
Properties attached in a text file:
{code}
{composition-setup:defaults=[Home^composition.properties]}
property.key = value
{composition-setup}
{code}
h3. {toggle-cloak:id=10} Properties
{cloak:id=10}
h5. General Properties
These properties should be put into the body of the {composition-setup} macro. Alternately, they can be put into a text file which is attached to a page and linked via the 'defaults' macro property.
||*Name*||*Default*||*Description*||
|import.css| | Allows a Cascading Style Sheet to be imported into the page. The value may be an attachment link (e.g. 'Foo^bar.css'), an absolute link (e.g. 'http://foo.com/bar.css') or a server-relative link (e.g. '/bar.css').|
h5. Cloak Properties
||*Name*||*Default*||*Description*||
|cloak.memory.duration| 0 | The number of days the cloak status should be remembered for.|
|cloak.toggle.type |default|The type of toggle to display. Options are:
* default - Blue arrows pointing up or down.
* custom - A custom image for each of the modes.
* text - Plain text for the two modes.
* wiki - Wiki text for the two modes.
* none - No icon at all. You will probably want to ensure that cloak.toggle.zone is enabled.|
|cloak.toggle.open| |The value to use for the icon when the cloak can be opened.
|cloak.toggle.close| |The value to use for the icon when the cloak can be closed.
|cloak.toggle.exclusive| false |If 'true', all the toggles on the page will be exclusive. That is, at each level, only one cloak is open at a time.
|cloak.toggle.zone| true | If 'true', the heading or paragraph the toggle is in will be clickable.|
h5. Deck Properties
||*Name*||*Default*||*Description*||
|deck.memory.duration| 0 |The number of days the deck status should be remembered for.|
|deck.tab.location| 'top' |'top', 'bottom' or 'none'. The location of the tab bar.|
|deck.tab.active.border | |The border for the active tab (CSS - eg. '1px dashed black')|
|deck.tab.active.background| |The background for the active tab (CSS - eg. '#ff0055')|
|deck.tab.inactive.border| |The border for inactive tabs (CSS)|
|deck.tab.inactive.background| |The background for inactive tabs (CSS)|
|deck.tab.spacer| |The distance between tabs (eg '5px')|
|deck.card.border| |The border for the active card.|
|deck.card.background| |The background for the active card.|
|deck.width/deck.height| |The width and/or height the content will be constrained to (not including any tabs). If not set, the tabs expand to display their content.|
|deck.startHidden| true |If set to 'false', the cards will be initially visible on the page until setup is complete.|
|deck.loopCards| false |If 'true', the deck will loop back to the beginning from the last card and vice versa.|
|deck.nextAfter | |The number of seconds the slides will stay visible before moving to the next one. By default the current slide will not transition until prompted by the user.|
|deck.effect.type |none |The effect to use when moving to a new slide. May be 'fade' or 'none'.|
|deck.effect.duration| 0 |The number of seconds the transition will take to complete. Eg. '1.5'. Defaults to 0.|
{cloak}
h3. {toggle-cloak:id=2}Parameters
{cloak:id=2}
||*Name*||*Required?*||*Default*||*Description*||
|default|(x)| |The name of the page attachment containing the default settings for this page. E.g. 'Home^composition.properties'. The file should be a text file with properties listed as they are in the *Properties* section.|
{cloak}
h3. {toggle-cloak:id=10} Properties
{cloak:id=10}
{card}
{card:id=deck / card}
h3. The Code
{code}
{code}
h3. {toggle-cloak:id=3}Result
{cloak:id=3}
{cloak}
h3. {toggle-cloak:id=4}Parameters
{cloak:id=4
||*Name*||*Required?*||*Default*||*Description*||
{cloak}
{card}
{card:id=show-card}
h3. The Code
{code}
{code}
h3. {toggle-cloak:id=5}Result
{cloak:id=5
{cloak}
h3. {toggle-cloak:id=5}Parameters
{cloak:id=5}
||*Name*||*Required?*||*Default*||*Description*||
{cloak}
{card}
{card:id=float}
h3. The Code
{code}
{code}
h3. {toggle-cloak:id=6}Result
{cloak:id=6}
{cloak}
h3. {toggle-cloak:id=7}Parameters
{cloak:id=7}
||*Name*||*Required?*||*Default*||*Description*||
{cloak}
{card}
{card:id=toggle-cloak / cloak}
h3. The Code
{code}
{code}
h3. {toggle-cloak:id=8}Result
{cloak:id=8}
{cloak}
h3. {toggle-cloak:id=9}Parameters
{cloak:id=9}
||*Name*||*Required?*||*Default*||*Description*||
{cloak}
{card}
{deck}
{card}
{deck}
{roundrect:bgcolor=#828282|width=909px|height=50px|corners=false,false,true,true}
{roundrect}
|