The wonderful World of Opentext Content Server
Zip&Download has arrived in smartUI. Finally.
Open up a nodelist and you’ll see the new Download command.
How to use it?
Then you get the summary of all files contained in this ZIP Archive
Click on Download and this archive will be downloaded to your machine.
Have you seen the new permissions explorer in smartUI? Open up the permissions on an object and you’ll see the new selection.
The permissions explorer is opened with a click on the “Permissions Explorer” Button on the upper right.
This will give you the option to edit all permissions of the objects in this folder at once.
Have you seen the new smartUI thumbnail mode? You can switch the normal nodelist to the thumbnail mode quite easy by clicking on the list/images icon in the upper right. Another click switches the display back to the list mode.
And, thumbnail mode does have also commands available
The actual Content Server release 16.2.8 brought a lot of improvements to the smartUI SDK, for example the xECM and the connected Workspaces Widgets are nowadays part of the SDK.
Also a lot of of people were interested in smartUI, not only Developers.
So we introduced an updated 5 days training to reflect the changes of 16.2.8 and a 2 days training to provide an overview of the SDK. Naturally, a 5 days training gives more information and also more exercises than a 2 days training, but this 2 days training can provide a good overview for Team Leaders and technical Managers.
For those with little time, there is also a 1 day training giving you a more compact overview for technical Managers and technical Evangelists. The one day training is not recommended for Developers. This training was held at the Enterprise World in Vienna 2019.
The Chapter 6 (SDK Intro) (5 days training Basic)
A new Chapter 12 discusses the strategys needed to “widgedize” an existing legacy g module and to add things to an existing widget
The strange word “to widgedize” stands for “Build a widget for a legacy module not already supporting widgets”. The Strategies on amending a Module by adding a widget and on adding additional functionality inside an existing widget are discussed.
Content:
The advanced training will eventually grow more and more to cover the new widgets and controls coming in future releases.
Chapter 1: Extended SDK Parts
The chapter 3 has also been amended
The usability of Webreports in smartUI has been improved. Now, you can, after starting a Webreport, edit the parameters of that report and receive feedbacks from the running Webreport. This makes a lot of fun!
Lets see, how this is done.
First a table.report widget can be used to list all data.
Then a Parameter Window opens. The Webreport can be startet by pressing the button “Run Webreport”
A feedback can be given from the Webreport like this
The table.report shows a Smart UI table based on the output of WebReports data. The WebReport used by this widget must be based on either the widget_table_report_process_data_in_webreport or widget_table_report_process_data_in_datasource default reportviews which use the INSERTJSON @TABLEREPORT directive.
// Create the data managing context
var context = new PageContext(),
sampleTableReportView = new TableReportView({
context: context,
data: {
id: 24024,
sortBy: "SubType",
SortOrder: "ASC",
columnsWithSearch: "SubType",
titleBarIcon: 'mime_audio',
title: 'Sample WebReports Table',
header: true,
swrLaunchCell: {
id: 12345,
iconClass: 'my-icon-class',
hoverText: 'Some hover text for my icon.'
},
parameters: [
{
name: 'myparm1',
value: 'val1'
},
{
name: 'myparm2',
value: 'val2'
}
]
}
}),
// Create helpers to show the views on the page
region = new Marionette.Region({
el: "#content"
});
// Show the views on the page
region.show(sampleTableReportView);
// Fetch the WebReport output from the server to populate the tile with
context.fetch();
The parameter window can be implemented like this (the xxxxxx is the node number for the webreport)
var promptView,
promptModel,
contentRegion = new Marionette.Region({el: "#content"}),
pageContext = new PageContext(),
currentNode = pageContext.getModel(NodeModelFactory, {attributes: {id: xxxxxx}}),
runWRModel = pageContext.getModel(PromptModelFactory, {
attributes: {
node: currentNode
}
}),
runWRController = new RunWRController();
pageContext.fetch()
.done(function () {
// We've got the page context, now get the runWRModel to see if there are parameters:
runWRController.getRunWRPreModel({
node: currentNode,
context: pageContext
}).done( function(){
// Build the prompt view and show it:
promptView = new PromptView({
context: pageContext,
model: currentNode,
promptModel: runWRController.runWRPreModel,
showBackIcon: false
});
contentRegion.show(promptView);
});
})
A feedback is implemented by the status.screen control.
require(['csui/lib/underscore', 'csui/lib/marionette', 'csui/utils/contexts/page/page.context', 'csui/utils/contexts/factories/connector',
'csui/controls/globalmessage/globalmessage',
'webreports/controls/status.screen/status.screen.view',
'webreports/models/run.webreport.pre/run.webreport.pre.model',
'webreports/models/run.webreport/run.webreport.model',
'./status.screen.mock.js'
], function (_, Marionette, PageContext, ConnectorFactory, GlobalMessage, StatusScreenView, WebReportRunModelPre, WebReportRunModel, WRMock) {
var statusView,
context = new PageContext(),
connector = context.getObject(ConnectorFactory),
region = new Marionette.Region({el: "#webreport-status-screen-demo"}),
attributes = { id: xxxxxx },
options = { connector: connector },
WRRunPreModel = new WebReportRunModelPre(attributes, options),
WRRunModel = new WebReportRunModel(attributes, options);
WRMock.enable(); // Mockup for local tests
WRRunPreModel
.fetch()
.done( function(){
WRRunModel
.fetch()
.done( function(){
statusView = new StatusScreenView({
destinationModel: WRRunPreModel.destinationModel,
executeModel: WRRunModel});
region.show(statusView);
})
})
});
Working with WebReports and SmartUI now makes a lot of fun!
Have you seen the new Rules matching Mixin in the smartUI? Its a great mixin, allowing you to implement a colloection of rule models which are supposed one model, which rules match the input object. This is a quite powerful functionality
The following example implements the selection collection
If run, then the action of the appripriate node is returned. Only on the base of a rules Model!!
Can be implemented like this
var NodeActionSelectingModel = Backbone.Model.extend({
idAttribute: 'signature',
defaults: {
sequence: 100,
signature: null
},
constructor: function NodeActionSelectingModel(attributes, options) {
Backbone.Model.prototype.constructor.apply(this, arguments);
this.makeRulesMatching(options);
},
enabled: function (node) {
return this.matchRules(node, this.attributes);
}
});
RulesMatchingMixin.mixin(NodeActionSelectingModel.prototype);
var NodeActionSelectingCollection = Backbone.Collection.extend({
model: NodeActionSelectingModel,
comparator: 'sequence',
constructor: function NodeActionSelectingCollection(models, options) {
Backbone.Collection.prototype.constructor.apply(this, arguments);
},
findByNode: function (node) {
return this.find(function (model) {
return model.enabled(node);
});
}
});
var nodeActions = new NodeActionSelectingCollection([
{
equals: {
container: true
},
signature: 'Browse'
},
{
equals: {
type: [144, 749]
},
signature: 'Open'
},
{
and: [
equals: {
type: 144
},
containsNoCase: {
mime_type: [
"application/msword",
"application/vnd.ms-word",
"application/vnd.msword",
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
"application/vnd.wordprocessing-openxml",
"application/vnd.ces-quickword",
"application/vnd.ms-word.document.macroEnabled.12",
"application/vnd.ms-word.document.12",
"application/mspowerpoint",
"application/vnd.ms-powerpoint",
"application/vnd.openxmlformats-officedocument.presentationml.presentation",
"application/vnd.ces-quickpoint",
"application/vnd.presentation-openxml",
"application/vnd.presentation-openxmlm",
"application/vnd.ms-powerpoint.presentation.macroEnabled.12",
"application/msexcel",
"application/vnd.ms-excel",
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
"application/vnd.ces-quicksheet",
"application/vnd.spreadsheet-openxml",
"application/vnd.ms-excel.sheet.macroEnabled.12",
]
}
},
signature: 'Edit',
sequence: 50
},
{
and: {
equals: {
type: 144
},
or: {
startsWithNoCase: {
mime_type: 'image/'
},
equalsNoCase: {
mime_type: ['application/pdf', 'application/x-pdf']
} } },
signature: 'Convert',
sequence: 50
},
{
and: [
{
equals: {
type: 144
}
},
{
equalsNoCase: {
mime_type: 'text/plain'
} } ],
signature: 'Read',
sequence: 50
},
{
signature: 'Properties',
sequence: 200
}
]);
var node = new NodeModel(...),
action = nodeActions.findByNode(node);
Looking for a quick list of all Categories and Attributes configured in a Content Server? Tired of browsing the Categories Volume? Want to see all attrobutes and their IDs in a list?
Easy.
Simple use this line as your URL
<server><OT base><cgi>?func=attributes.dump
(p.ex. http://myserver/myContentServer/cs.exe?func=attributes.dump)
This will return this list:
Although this is a screenshot from a Contentserver 16.2.6, you can use this command at least back to Version 10.5.
Widgets are controlled by perspectives, changing the data displayed in the widget requires a change of perspectives
When you restrict yourself to use only the standard REST command set, you’ll find that you fire a lot of REST commands
You lost the capability of using navigational menus with computed URLs.
This leads me to some thoughts towards webreports as an adddition to widgets.
Webreports used as widget surrogates do have this pros and cons.
Pros:
You can use standard bootstrap navigational menus and UI elements, which allows you to mimic your webreport like a widget.
You can easily build things like Wizards inside your webreport structures. This is interesting, when you require some complex categories setup at doc creation time.
Webreports can use different sources to diyplay things, all server based. You can add the complete output via asynchronous AJAX call directly in your hosting webreport.
You can start actions inside the surrounding smartUI using standard jquery and html selections.
Starting Webreports and inserting the output via AJAX makes things quite fast. Especially when you display more than 1 record.
You get the option of using normal menu structures w/o the requirement of changing the perspectives.
Its easy for experienced webreport developers to modify the menu structures and the contents of such a meta webreport.
Cons:
Storing Webreports in the database require an additional license.
You have to load jquery by yourself.
No access to binf.js, unless you build one binf library without the normal csui-hierarchy or load a plain bootstrap.js.
In the last case, you’ll loose the css overwrite capability offered by the Content Server.
Webreports tend to require large numbers of themselves. This requires a very clean process documentation for the group of webreports.
Webreports take some time to start. On performance points, Subwebreports are evil. On the other hand, Subwebreports are required for a lot of things.
Doing things via AJAX means, you enter the wunderful world of async processing. Actually, you have no control on when the async webreport is finished
Here is a short receipe howto use webreports as widget surrogates:
Add a webreport html widget to your perspective. This one will held your base webreport.
This base webreport contains all menu structures and also all js needed.
Define your webreports for the different “pages” controlled by your menu. Each webreport is a stand alone webreport.
Call these via js from your menu structure. Use AJAX calls.
Insert the output from this webreports in a html structure (like a div).
Add somewhere a home button to switch back to your first page.
Some more tips:
Consider using stored searches in your “page” webreports. These are quite fast, depending on your search infrastructure. You dont have to use multible webreports to support this, you can switch the sourceID on the AJAX call to the webreport.
Consider to use the REST tags of a webreport.
Inside the webreport html widget there used to be the opportunity to use plain html for menu or other purposes. Since 16.2.4 there is a new widget in town, a plain html widget without the need of an webreport license.
In both cases, you have to think of the new namespace (“binf”) on using bootstrap.
Take a bootstrap menu for example.
The plain bootstrap code wont work, because OpenText added the prefix “binf” to introduce a special namespace.
Change the plain code by adding these “binf” prefixes:
<nav class="binf-navbar binf-navbar-default" role="navigation"> <div class="binf-navbar-header"> <a class="binf-navbar-brand" href="#" >Committee Menu</a> </div> <div> <ul class="binf-nav binf-navbar-nav"> <li><a href="#" ;alert(s);">Committee News</a></li> <li><a href="#">Member List</a></li> <li class="binf-dropdown"> <a href="#" class="binf-dropdown-toggle" data-binf-toggle="dropdown"> Documents <b class="binf-caret"></b> </a> <ul class="binf-dropdown-menu"> <li href="#">List Documents</li> <li href="#">Notify users</li> </ul> </li> </ul> </div> </nav>
Please do not forget to change the “data-toggle” also to “data-binf-toggle”.
Look at the standard problem:
Your handlebars template contains a Selectbox to display a the status of a task:
<select name="status" id="Status" class="binf-selectpicker" data-style="binf-btn-warning">
<select name="status" id="Status" class="binf-selectpicker" data-style="binf-btn-warning">
{{#select status}}
<option value="0" selected="">Pending</option>
<option value="1">In Process</option> <option value="2">Issue</option>
<option value="3">On Hold</option>
<option value="-1">Completed</option>
<option value="-2">Cancelled </option>
{{/select}}
</select>
And the values you receive from the REST Calls are between -2 and 3.
How can you transfer this in a “selected” clause in the html select box?
Easy.
Ass a select helper in your main marionette view:
Handlebars.registerHelper('select',
function (selected, options) {
Handlebars.registerHelper('select', function (selected, options)
{ return options.fn(this).replace( new RegExp(' value=\"' + selected + '\"'),
'$& selected="selected"'); });
This handlebars helper named “select” will examine the coding tagged betweern a {{select}} and a {{/select}} in your handlebars template and insert at the option clause which is selected a ‘selected=”” ‘ clause. Then the Selectbox is ready to use.
Simply add a
status: this.model.get('status'),
to be returned in your template helper and the
{{#select status}}
...
{{/select}}
will trigger your select box helper to check for the v ariable status and to add a selected at the proper place.
Thats the magic behind the handlebars select helpers.