[frontend] Keep the jobs panel anchored below the toggle button
@@ -43,13 +43,25 @@ from desktop.views import _ko
var JobBrowserPanel = function (params) {
var self = this;
+ var $container = $(HUE_CONTAINER);
+ var $jobsPanel = $('#jobsPanel');
+ var $toggle = $('.btn-toggle-jobs-panel');
+
+ var reposition = function () {
+ $jobsPanel.css('top', ($toggle.offset().top + $toggle.height() + 15) + 'px');
+ $jobsPanel.css('left', ($container.offset().left + $container.width() - 630) + 'px')
+ };
+
huePubSub.subscribe('hide.jobs.panel', function () {
- $('#jobsPanel').hide();
+ $(window).off('resize', reposition);
+ $jobsPanel.hide();
});
huePubSub.subscribe('show.jobs.panel', function (section) {
huePubSub.publish('hide.history.panel');
- $('#jobsPanel').show();
+ $(window).on('resize', reposition);
+ reposition();
+ $jobsPanel.show();
huePubSub.publish('mini.jb.navigate', section && section.interface ? section.interface : 'jobs');
if (section && section.id) {
huePubSub.publish('mini.jb.open.job', section.id);
@@ -57,7 +69,7 @@ from desktop.views import _ko
});
huePubSub.subscribe('toggle.jobs.panel', function () {
- if ($('#jobsPanel').is(':visible')){
+ if ($jobsPanel.is(':visible')){
huePubSub.publish('hide.jobs.panel');
}
else {
