Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin

...

Section
Column
width15%
Excerpt Include
Advanced Macros Plugin
Advanced Macros Plugin
nopaneltrueAdvanced Macros Plugin
Column
width60%
Deck of Cards
width907
idComposition
Card
labelOverview

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.

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
labelDocumentation
Deck of Cards
idcompisitionm

Card
labelcomposition-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

The Code

Properties set within the body of the macro :

Code Block
composition-setup}
property.key = value
some.properties = some_values
some.properties = some_values
{composition-setup}

Properties attached in a text file:

Code Block
{composition-setup:defaults=[Home^composition.properties]}
property.key = value
{composition-setup}

Toggle Cloak
id10
Properties

Cloak
id10
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').

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.

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.

Toggle Cloak
id2
Parameters

Cloak
id2

Name

Required?

Default

Description

default

 

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.

Card
labeldeck / card

The deck and *card macros work together to create tabbed content.

Note
titleRequires the *composition-setup* macro be placed on the current page.

The Code

Code Block
Deck of Cards
id[Unique Deck ID]

Card
labelCard 1

Card 1 content.

Card
labelCard 2

Card 2 content.

Code Block
h3. {toggle-cloak:id=3} Result 
{cloak:id=3}
{deck:id=[Unique Deck ID]}
{card:label=Card 1}
Card 1 content.
{card}
{card:label=Card 2}
Card 2 content.
{card}
{deck}

{cloak}
h3. {toggle-cloak:id=4} Parameters
{cloak:id=4}
h5. Deck Parameters
||*Name*||*Required?*||*Default*||*Description*||
|id|(/)| |The ID for the deck. Must be unique to this page. |
|tabLocation|(x)|top|Either 'top', 'bottom' or 'none'. |
|class|(x)| |The custom CSS class the deck is decorated by. |
|width|(x)| |The width the content will be constrained to (not including any tabs). If not set, the tabs expand to display their content. |
|height|(x)| |The height the content will be constrained to (not including any tabs). If not set, the tabs expand to display their content. |
|startHidden|(x)| true|If set to false, the cards will be initially visible on the page until setup is complete. |
|loopCards|(x)|false|If true, the deck will loop back to the beginning from the last card and vice versa. |
|nextAfter|(x)|never|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. 
|effectType|(x)|none|The effect to use when moving to a new slide. May be 'fade' or 'none' (the default). |
|effectDuration|(x)|1|The number of seconds the transition will take to complete. Eg. '1.5'. or '10'. |
h5. Card Parameters
||*Name*||*Required?*||*Default*||*Description*||
|label|(/)| | The label for the deck. May contain simple wiki text (e.g. bold, italic, emoticons and images). |
|default|(x)|false|If true, this card will be the default one shown when the page is first viewed. |
|class|(x)| |The custom CSS class the card is decorated by. Inherits its value from the containing {deck} if not specified.|
|accessKey|(x)| | The key that is hot linked to the specified card.
* Works in Firefox 2 using: Alt + Shift + <character> (Note that some characters (for example b, which accesses the bookmarks toolbar and t which accesses the Tools toolbar menu, will not work as an access key as the default browser functionality take precedence)
* accessKeys are not compatible with IE6 and IE7.|
|nextAfter|(x)| |The number of seconds the slide will stay visible before moving to the next one. By default the current slide will not transition until prompted by the user. Inherits its value from the containing *deck* if not specified. |
|effectType|(x)| none| The effect to use when moving to this slide. May be 'fade' or 'none'. Inherits its value from the containing {deck} if not specified.|		
|effectDuration|(x)| |The number of seconds the transition will take to complete. Eg. '1.5' or '10'. Inherits its value from the containing {deck} if not specified. |
{cloak}
{card}

{card:label=show-card}
Displays contents of a specific *card*.
{note:title=Only works when referencing *cards / decks* on the current page.}
h3. The Code 
Show Card
deck[deck id]
card[card label

Show card

Code Block

h3. {toggle-cloak:id=5} Parameters
{cloak:id=5}
||*Name*||*Required?*||*Default*||*Description*||
|deck|(/)| |The unique ID of the deck. |
|card|(/)| |The label of the card to show. |
|scrollTo|(x)|true|If false, the page will not scroll to the deck the card is in. |
{cloak}
{card}

{card:label=float}
This macro allows content to 'float' to the left or right of the surrounding text.
h3. The Code 
Float
left
left

Content to float.

Code Block
h3. {toggle-cloak:id=6} Result 
{cloak:id=6}
!float_left.png!
{cloak}
h3. {toggle-cloak:id=7} Parameters
{cloak:id=7}
||*Name*||*Required?*||*Default*||*Description*||
|default / side|(/)| |The side to float on ('left' or 'right'). |
|width|(x)| |CSS defining the width of the floating block. E.g. '200px'. |
|background|(x)| |CSS defining the background colour or image.|
|border|(x)| |CSS defining the border to put around the floating block. E.g. 'solid blue 1px'.|
|margin|(x)| |CSS defining the margin to surround the block with. E.g. '5px'. |
|padding|(x)| |CSS defining the padding inside the block. E.g. '5px'. |
{float}
{cloak}
{card}

{card:label=toggle-cloak / cloak}
Creates a button to toggle a cloaked section between being visible and hidden.
{note:title=Requires the *composition-setup* macro be placed on the current page.}
h3. The Code 
Toggle Cloak
idMy Cloak
My Cloak
Cloak
visibletrue
idMy Cloak

My Cloak content.

Code Block

Toggle Cloak
id8
Result

Cloak
id8
solidgrey2px
My Cloak My Cloak
My Cloaktrue

My Cloak content.

Panel

Cloak

9 Parameters

9
Toggle-cloak Parameters

Name

Required?

Default

Description

id

 

The unique ID of the cloaked section to toggle. May be '*' to be have an auto-id.

exclusive

false

If 'true', other cloaked sections at the same level will be hidden when this one is shown.

Cloak Parameters

Name

Required?

Default

Description

id

 

The unique ID of the cloaked section. May be '*' to be an auto-id.

visible

false

If 'true', the section will be visible initially.

Card
Deck of Cards

Deck of Cards

Round Rectangle
cornersfalse,false,true,true
bgcolor#828282
width909px
height50px

Column
width20%