diff --git a/www/MainView.js b/www/MainView.js index cb7a81df..1dd315bd 100644 --- a/www/MainView.js +++ b/www/MainView.js @@ -224,6 +224,10 @@ Ext.define('PBS.MainView', { href: '/docs/index.html', margin: '0 5 0 0', }, + { + xtype: 'pbsTaskButton', + margin: '0 5 0 0', + }, { reference: 'logoutButton', xtype: 'button', diff --git a/www/Makefile b/www/Makefile index b205f677..f75082b1 100644 --- a/www/Makefile +++ b/www/Makefile @@ -9,6 +9,7 @@ JSSRC= \ form/RemoteSelector.js \ form/DataStoreSelector.js \ data/RunningTasksStore.js \ + button/TaskButton.js \ config/UserView.js \ config/RemoteView.js \ config/ACLView.js \ diff --git a/www/button/TaskButton.js b/www/button/TaskButton.js new file mode 100644 index 00000000..67cc1477 --- /dev/null +++ b/www/button/TaskButton.js @@ -0,0 +1,92 @@ +Ext.define('PBS.TaskButton', { + extend: 'Ext.button.Button', + alias: 'widget.pbsTaskButton', + + config: { + badgeText: '0', + badgeCls: '', + }, + + iconCls: 'fa fa-list', + userCls: 'pmx-has-badge', + text: gettext('Tasks'), + + setText: function(value) { + let me = this; + me.realText = value; + let badgeText = me.getBadgeText(); + let badgeCls = me.getBadgeCls(); + let text = `${value} ${badgeText}`; + return me.callParent([text]); + }, + + getText: function() { + let me = this; + return me.realText; + }, + + setBadgeText: function(value) { + let me = this; + me.badgeText = value.toString(); + return me.setText(me.getText()); + }, + + setBadgeCls: function(value) { + let me = this; + let res = me.callParent([value]); + let badgeText = me.getBadgeText(); + me.setBadgeText(badgeText); + return res; + }, + + handler: function() { + let me = this; + if (me.grid.isVisible()) { + me.grid.setVisible(false); + } else { + me.grid.showBy(me, 'tr-br'); + } + }, + + initComponent: function() { + let me = this; + + me.grid = Ext.create({ + xtype: 'pbsRunningTasks', + title: '', + hideHeaders: false, + floating: true, + + width: 600, + + bbar: [ + '->', + { + xtype: 'button', + text: gettext('Show All Tasks'), + handler: function() { + var mainview = me.up('mainview'); + mainview.getController().redirectTo('pbsServerAdministration:tasks'); + me.grid.hide(); + }, + }, + ], + + listeners: { + 'taskopened': function() { + me.grid.hide(); + }, + }, + }); + me.callParent(); + me.mon(me.grid.getStore().rstore, 'load', function(store, records, success) { + if (!success) return; + + let count = records.length; + let text = count > 9 ? '9+' : count.toString(); + let cls = count > 0 ? 'active': ''; + me.setBadgeText(text); + me.setBadgeCls(cls); + }); + }, +}); diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css index e634cfc1..551d1d11 100644 --- a/www/css/ext6-pbs.css +++ b/www/css/ext6-pbs.css @@ -190,3 +190,22 @@ p.logs { visibility: hidden; width: 5px; } + +.pmx-has-badge .x-btn-inner { + padding: 0 0 0 5px; + min-width: 24px; +} + +.pmx-button-badge { + display: inline-block; + font-weight: bold; + border-radius: 20px; + background-color: #AAA; + padding: 2px 3px; + min-width: 24px; + line-height: 1em; +} + +.pmx-button-badge.active { + background-color: #F00; +} diff --git a/www/dashboard/RunningTasks.js b/www/dashboard/RunningTasks.js index e31218ef..4c1d4d12 100644 --- a/www/dashboard/RunningTasks.js +++ b/www/dashboard/RunningTasks.js @@ -18,6 +18,8 @@ Ext.define('PBS.RunningTasks', { upid: record.data.upid, endtime: record.data.endtime, }).show(); + + view.fireEvent('taskopened', view, record.data.upid); }, openTaskItemDblClick: function(grid, record) {