Class Description: The class that is expected to render the structure of the application. All Canvas libraries are advised to have header, footer, and content spaces.
Called By: cbx canvas.initializer
Meta data to be considered: ct canvas.metadata.getApplicationLayout() → gives a string corresponding to the configured Application Layout. The header, footer, and content areas are to designed specific to this meta data. The following layout types are currently available in Canvas:
...
on demand file set id = (framework Id)_(CT_VIEW_BASE),
For example, a jQuery UI component developer can do this as follows:
on demand file set id = jqui_CT_VIEW_BASE
Registry Signature:
| Code Block | ||
|---|---|---|
| ||
CLCR.registerCmp({'VIEW_TYPE':'VIEWPORT'}, <<View port class>>); |
Scope: The core layer does not pass anything significant here for the library developers to consider.
Sample Code Snippet:
cbx
| Code Block | ||
|---|---|---|
| ||
canvas.lib.viewport = Class( |
...
canvas.core.Component, { |
...
initialize: function() |
...
{ // This is the config which will be passed to Workspace Manager var viewportConfig = { "eleType": "div", |
...
"id":"JQM-CONTENT" |
...
}; |
...
var viewportConfigObj = new |
...
canvas.lib.layer(viewportConfig).getLayer(); |
...
this.addItem(viewportConfigObj); |
...
var config = |
...
{ elem: viewportConfigObj |
...
}; |
...
var applicationLayout = |
...
canvas.core.metadata.getApplicationLayout(); |
...
var headerClass = CLCR.getCmp( { 'COMP_TYPE':'APPLICATION_HEADER', 'LAYOUT':applicationLayout }); |
...
var header = new headerClass(); |
...
$('#HEADER_DIV').append(header.getItem(0).html()); |
...
var footerClass = CLCR.getCmp( { 'COMP_TYPE':'APPLICATION_FOOTER', 'LAYOUT':applicationLayout }); |
...
if(footerClass) |
...
{ var footer = new footerClass(); |
...
$('#FOOTER_DIV').append(footer.getItem(0)); |
...
} var that = this; setTimeout(function() |
...
{ /* * Calling the core workspace manager to assign it to this.wsManager * with the config object containing the viewport component. */ that.wsManager = new canvas.core.WSManager(config); |
...
/* * Adds the app container as viewport's child. * This app container contains the workspace container. |
...
*/ that.getItem(0).appendChild(that.wsManager.getContainer().getAppContainer()); |
...
$("#CONTENT_DIV").prepend(that.getItem(0)); |
...
},500); |
...
$(document).ready(function() |
...
{ setTimeout(function() |
...
{ canvas.lib.utility.loadInitialWorkspace(); |
...
},500); |
...
}); |
...
} |
...
}); |
...
CLCR.registerCmp({'VIEW_TYPE':'VIEWPORT'}, |
...
canvas.lib.viewport); |