diff --git a/awx/ui/client/features/jobs/_index.less b/awx/ui/client/features/jobs/_index.less index abd2352fb1..a72c05a6be 100644 --- a/awx/ui/client/features/jobs/_index.less +++ b/awx/ui/client/features/jobs/_index.less @@ -7,6 +7,10 @@ border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom: none; + + & > div { + user-select: none; + } } &-menuBottom { @@ -18,6 +22,10 @@ right: 60px; bottom: 24px; cursor: pointer; + + &:hover { + color: @at-blue; + } } &-menuIconGroup { @@ -39,6 +47,10 @@ font-size: 12px; padding: 10px; cursor: pointer; + + &:hover { + color: @at-blue; + } } &-menuIcon--lg { @@ -47,6 +59,10 @@ font-weight: bold; padding: 10px; cursor: pointer; + + &:hover { + color: @at-blue; + } } &-toggle { diff --git a/awx/ui/client/features/output/index.controller.js b/awx/ui/client/features/output/index.controller.js index dd0c28f845..305f0dd8d9 100644 --- a/awx/ui/client/features/output/index.controller.js +++ b/awx/ui/client/features/output/index.controller.js @@ -20,7 +20,7 @@ const meta = { const PAGE_LIMIT = 3; const SCROLL_BUFFER = 250; -const SCROLL_LOAD_DELAY = 250; +const SCROLL_LOAD_DELAY = 50; const EVENT_START_TASK = 'playbook_on_task_start'; const EVENT_START_PLAY = 'playbook_on_play_start'; const EVENT_STATS_PLAY = 'playbook_on_stats'; @@ -161,57 +161,18 @@ function prev () { page: data.page }); + const previousHeight = container.scrollHeight; + return pop() .then(() => prepend(data.results)) .then(lines => { - container.scrollTop = (getRowHeight() * lines) + const currentHeight = container.scrollHeight; + + container.scrollTop = currentHeight - previousHeight; }); }); } -function getRowCount () { - return $(ELEMENT_TBODY).children().length; -} - -function getRowHeight () { - return $(ELEMENT_TBODY).children()[0].offsetHeight; -} - -function getViewHeight () { - return $(ELEMENT_CONTAINER)[0].offsetHeight; -} - -function getScrollPosition () { - return $(ELEMENT_CONTAINER)[0].scrollTop; -} - -function getScrollHeight () { - return $(ELEMENT_CONTAINER)[0].scrollHeight; -} - -function getRowsAbove () { - const top = getScrollPosition(); - - if (top === 0) { - return 0; - } - - return Math.floor(top / getRowHeight()); -} - -function getRowsBelow () { - const bottom = getScrollPosition() + getViewHeight(); - - return Math.floor((getScrollHeight() - bottom) / getRowHeight()); -} - -function getRowsInView () { - const rowHeight = getRowHeight(); - const viewHeight = getViewHeight(); - - return Math.floor(viewHeight / rowHeight); -} - function append (events) { console.log('[4] appending next page'); @@ -628,7 +589,7 @@ function scrollEnd () { .then(() => { const container = $(ELEMENT_CONTAINER)[0]; - container.scrollTop = getScrollHeight(); + container.scrollTop = container.scrollHeight; meta.scroll.inProgress = false; }); }); @@ -638,22 +599,14 @@ function scrollPageUp () { const container = $(ELEMENT_CONTAINER)[0]; const jump = container.scrollTop - container.offsetHeight; - if (jump < 0) { - container.scrollTop = 0; - } else { - container.scrollTop = jump; - } + container.scrollTop = jump; } function scrollPageDown () { const container = $(ELEMENT_CONTAINER)[0]; const jump = container.scrollTop + container.offsetHeight; - if (jump > container.scrollHeight) { - container.scrollTop = container.scrollHeight; - } else { - container.scrollTop = jump; - } + container.scrollTop = jump; } JobsIndexController.$inject = [ diff --git a/awx/ui/client/features/output/index.view.html b/awx/ui/client/features/output/index.view.html index dd938739b0..4b460e4bc1 100644 --- a/awx/ui/client/features/output/index.view.html +++ b/awx/ui/client/features/output/index.view.html @@ -16,15 +16,15 @@