Let's add TrayClock to UniStatusBar (can be added to other controls).
1.
initialization
UniAddCSSLibrary('build/packages/ux/classic/classic/resources/ux-all.css', False, [upoFolderJS, upoPlatformDesktop]);
UniAddJSLibrary('build/packages/ux/classic/ux.js', False, [upoFolderJS, upoPlatformDesktop]);
2. UniStatusBar.ClientEvents.ExtEvents ->
function afterrender(sender, eOpts)
{
if (Ext.isDefined(Ext.ux)) {
sender.add({
xtype: 'tbfill'
});
sender.add(
new Ext.ux.desktop.TrayClock()
);
}
}
Let's modify by adding a style, a time format, and an update time of one second.
(2).
function afterrender(sender, eOpts)
{
if (Ext.isDefined(Ext.ux)) {
sender.add({
xtype: 'tbfill'
});
sender.add(new Ext.ux.desktop.TrayClock({
tpl: '<span style="color: green; font-weight: bold;">{time}</span>', //default = '{time}'
timeFormat: 'Y-m-d H:i:s', //default = 'g:i A'
updateTime: function() {
var me = this,
time = Ext.Date.format(new Date(), me.timeFormat),
text = me.tpl.apply({
time: time
});
if (me.lastText !== text) {
me.setText(text);
me.lastText = text;
}
me.timer = Ext.defer(me.updateTime, 1000, me);
}
}));
}
}