FloatingPane
Creates a FloatingPane - an independant window within an html document. The FloatingPane can have shadow and title. It can be constraint into its container, allow resizing, persist its size and position with cookies and belong to a TaskBar. A TaskBar can also be created from a FloatingPane if the isTaskBar parameter is set to true. A TaskBar does not render its toolbar and automatically displays the panes that are registered to it.
See also: Live Demo
Parameters
| Name | Type | Direction | Required | Default | Description |
|---|---|---|---|---|---|
| hasShadow | boolean | in | no | true | Adds shadow to the pane. |
| title | String | in | no | Floating Pane | The title of the pane. |
| icon | IAsset | in | no | Floating Pane | The icon of the pane. |
| constrainToContainer | boolean | in | no | true | If true, the pane cannot be moved outside its container. |
| displayCloseAction | boolean | in | no | true | If true, displays the close button. |
| displayMinimizeAction | boolean | in | no | true | If true, displays the minimize button. |
| displayMaximizeAction | boolean | in | no | true | If true, displays the maximize button. |
| resizable | boolean | in | no | true | If true, a resize handle appears at the lower right of the pane. |
| persistPosition | boolean | in | no | true | If true, the position and size of the pane are persisted with cookies. |
| style | String | in | no | width: 600px; height: 480px; left: 100px; top: 100px; display: none | The css styles to apply to the div created by the pane. |
| toggle | String | in | no | fade | Effect to apply when minimizing and restoring the pane. Use one of: plain, fade, explode. |
| id | String | in | no | id | The html id of the div created by the pane. An additional html id is created for the inner div, named ${id}ContentId. |
| taskBar | Object | in | no | The taskbar this pane belongs to. If specified, this can either be the html id of the TaskBar or the FloatingPane instance representing the TaskBar. | |
| isTaskBar | boolean | in | no | false | If true, this FloatingPane becomes a TaskBar. |
| options | String | in | no | Additional javascript options. Use JSON notation. |
Body: allowed
Informal parameters: allowed
Reserved parameters: none
Examples
Two FloatingPanes and the TaskBar
HTML template
<div jwcid="@tacos:FloatingPane" title="My Test..." taskBar="myTaskBar">Yihaaaa.... <br />It works???</div>
<div jwcid="@tacos:FloatingPane" title="My Second Test" taskBar="myTaskBar">Well??? <br />Another one!</div>
<div jwcid="@tacos:FloatingPane" id="myTaskBar" style="width:400px; height:100px; left:20px; top:200px; display:none; position:absolute;"
persistPosition="ognl:false" isTaskBar="ognl:true" resizable="ognl:false"></div>