Floating Panel XPages Control

There is a new simple XPages control on OpenNTF – floating panel. Essentially this control is just a wrapper for the dojo.dnd.Moveable class which can now be easily used in XPages. You can run it live here.



Custom control: ccFloatingPanel

In order to use the floating panel in your app, add this custom control to your XPage.

The content to display within the panel can be defined in two ways:

1. Property of custom control Property name Type Default Description Sample value text string “” Text to display in floating panel “Drag this panel and move it around.”

Sample:
<xc:ccFloatingPanel text=“Drag this panel and move it around.”>
xc:ccFloatingPanel>

2. Via editable area

In your XPage in which you have dropped the custom control you can now drop other controls from the palette by dropping them within the editable area of the floating panel control.

Sample:
<xc:ccFloatingPanel text=“Drag this panel and move it around.”>
       <xp:this.facets>
               <xp:panel xp:key=“editableAreaFloatingPanel”>
                       <br>br>
                       <xp:label value=“Here you can add controls “ id=“label1”>xp:label>
                       <xp:label value=“via an editable area or via “ id=“label2”>xp:label>
                       <xp:label value=“a property of the control.” id=“label3”>xp:label>
               xp:panel>
       xp:this.facets>
xc:ccFloatingPanel>