Class Description: The class that renders the sub workspaces configured for the current active workspace. It is instantiated by the Layout manager and is supposed to render the sub workspaces in the container Object passed by Layout manager.
Called By: cbx canvas.core.LayoutManager
Meta data Metadata to be considered: ct canvas.metadata.getLayoutsForWS(workspaceId) → This API returns a list of layouts configured for the current workspace. The component developers are expected to create that many child elements as the length of this list.
ctcanvas.metadata.getWorkSpaceById(workspaceId).WORKSPACE_LAYOUT → This API returns the Layout Type of the current workspace, i.e. the way in which the sub workspaces have to rendered. The current supported sub workspace layouts are as follows:
...
- R – MENU → Sub workspaces rendered with a menu to the Right
ctcanvas.preferences.isLangDirectionRTL() → Indicates if the direction of the application is RTL.
...
Scope: The Layout Manager passes an object containing the following information:
| Code Block | ||
|---|---|---|
| ||
{
"layoutManager" : "The layout manager Object",
"workspaceID" : "The ID of the Workspace currently active",
"layoutType" : "The Layout Type of the Workspace",
"elem" : "The parent element"
}
|
Sample
...
Code
...
Snippet:
...
| Code Block |
|---|
canvas.lib.layoutContainer = Class(cbxcanvas.core.Component, { layoutManager:null, workspaceID:'', constructor: function(config) { this.layoutManager = config.layoutManager; this.workspaceID = config.workspaceID; this.layoutId = config.layoutId; this.layoutType = ctcanvas.metadata.getWorkSpaceById(this.workspaceID).WORKSPACE_LAYOUT cbxcanvas.lib.layoutContainer.$super.call(this); var layoutContainerObj = config.elem; this.addItem(layoutContainerObj); var that = this; var layoutArr = cbxcanvas.core.ws.metadata.getLayoutsForWS(this.workspaceID); var layoutContainer; switch(this.layoutType) { case "STACK": //Renders layoutContainer as stack for ( var index = 0; index < layoutArr.length; index++) { var rb = CRB.getBundle(layoutArr[index].LD_BUNDLE_KEY); var title = rb[layoutArr[index].LAYOUT_DISPLAY_NM]; /** * Render layoutContainer as stack */ } } break; case "TAB" : //Render layoutContainer as tab for ( var index = 0; index < layoutArr.length; index++) { var rb = CRB.getBundle(layoutArr[index].LD_BUNDLE_KEY); var title = rb[layoutArr[index].LAYOUT_DISPLAY_NM]; /**} * Render layoutContainer as tab */ } break; break; case "L-MENU" : //Render layoutContainer as L-MENU for ( var index = 0; index < layoutArr.length; index++) { var rb = CRB.getBundle(layoutArr[index].LD_BUNDLE_KEY); var title = rb[layoutArr[index].LAYOUT_DISPLAY_NM]; /**} *break; Render layoutContainer as L-MENU */ } break; case "R-MENU" : //Render layoutContainer as R-MENU for ( var index = 0; index < layoutArr.length; index++) { var rb = CRB.getBundle(layoutArr[index].LD_BUNDLE_KEY); var title = rb[layoutArr[index].LAYOUT_DISPLAY_NM]; /**} * Render layoutContainer as R-MENU */break; } break; } this.getItem(0).appendChild(layoutContainer); }, getLayoutContainer: function() { return this.getItem(0); } }); CLCR.registerCmp({'COMP_TYPE':'PARENT_LAYOUT_CONTAINER'}, cbxcanvas.lib.layoutContainer); |
There
...
are
...
a
...
lot
...
of
...
ways
...
of
...
rendering
...
this,
...
and
...
the
...
library
...
developers
...
can
...
internally
...
user
...
CLCR
...
again
...
to
...
render
...
their
...
components
...
according
...
to
...
the
...
layout
...
types.
...
On
...
Activating
...
a
...
layout
...
(if
...
applicable),
...
the
...
library
...
developers
...
must
...
do
...
something
...
like
...
the
...
following:
...
| Code Block | ||
|---|---|---|
| ||
var that = this; layout.on('activate',function() { var config = { /** * You can pass on your scope to widget container here */ }; that.layoutManager.getWidgetContainer(config); }) |