From c08538b8f09cbd1db6c4462f524d041680eb77f6 Mon Sep 17 00:00:00 2001 From: gconsidine Date: Wed, 10 Jan 2018 13:29:32 -0500 Subject: [PATCH] Fix model pagination behavior, limit, and cache --- .../features/output/index.controller.js | 23 ++++------ awx/ui/client/features/output/index.js | 6 ++- awx/ui/client/lib/models/Base.js | 45 +++++++------------ 3 files changed, 29 insertions(+), 45 deletions(-) diff --git a/awx/ui/client/features/output/index.controller.js b/awx/ui/client/features/output/index.controller.js index 6aae149d69..380aed1a95 100644 --- a/awx/ui/client/features/output/index.controller.js +++ b/awx/ui/client/features/output/index.controller.js @@ -16,6 +16,7 @@ const meta = { scroll: {} }; +const SCROLL_BUFFER = 250; const EVENT_START_TASK = 'playbook_on_task_start'; const EVENT_START_PLAY = 'playbook_on_play_start'; const EVENT_STATS_PLAY = 'playbook_on_stats'; @@ -75,8 +76,6 @@ function JobsIndexController (_job_, JobEventModel, _$sce_, _$timeout_, _$scope_ table.html($sce.getTrustedHtml(html)); $compile(table.contents())($scope); - meta.scroll.height = container[0].scrollHeight; - meta.scroll.buffer = 100; meta.next = job.get('related.job_events.next'); meta.prev = job.get('related.job_events.previous'); meta.cursor = job.get('related.job_events.results').length; @@ -86,17 +85,17 @@ function JobsIndexController (_job_, JobEventModel, _$sce_, _$timeout_, _$scope_ } function next () { - job.next({ related: 'job_events', limit: 5 }) - .then(() => { + job.next({ related: 'job_events' }) + .then(cursor => { meta.next = job.get('related.job_events.next'); meta.prev = job.get('related.job_events.previous'); - append(); + append(cursor); }); } -function append () { - const events = job.get('related.job_events.results').slice(meta.cursor); +function append (cursor) { + const events = job.get('related.job_events.results').slice(cursor); const rows = $($sce.getTrustedHtml($sce.trustAsHtml(parseEvents(events)))); const table = $('#result-table'); @@ -176,10 +175,6 @@ function createRecord (ln, lines, event) { isHost: typeof event.host === 'number' }; - if (info.isHost) { - console.log(event); - } - if (event.parent_uuid) { info.parents = getParentEvents(event.parent_uuid); } @@ -341,7 +336,7 @@ function onScroll () { $timeout(() => { const top = container[0].scrollTop; - const bottom = top + meta.scroll.buffer + container[0].offsetHeight; + const bottom = top + SCROLL_BUFFER + container[0].offsetHeight; meta.scroll.inProgress = false; @@ -353,10 +348,10 @@ function onScroll () { vm.menu.scroll.display = true; - if (bottom >= meta.scroll.height && meta.next) { + if (bottom >= container[0].scrollHeight && meta.next) { next(); } - }, 500); + }, 250); } JobsIndexController.$inject = ['job', 'JobEventModel', '$sce', '$timeout', '$scope', '$compile']; diff --git a/awx/ui/client/features/output/index.js b/awx/ui/client/features/output/index.js index 630d84a442..b29adebb48 100644 --- a/awx/ui/client/features/output/index.js +++ b/awx/ui/client/features/output/index.js @@ -34,10 +34,12 @@ function JobsRun ($stateExtender, strings) { return new Jobs('get', id) .then(job => job.extend('job_events', { + pageCache: true, + pageLimit: 2, params: { - page_size: 13, + page_size: 25, order_by: 'start_line' - } + }, })); }] } diff --git a/awx/ui/client/lib/models/Base.js b/awx/ui/client/lib/models/Base.js index 20746ed8aa..ac0f44081f 100644 --- a/awx/ui/client/lib/models/Base.js +++ b/awx/ui/client/lib/models/Base.js @@ -107,6 +107,8 @@ function httpGet (config = {}) { if (config.params.page_size) { this.pageSize = config.params.page_size; + this.pageLimit = config.pageLimit || false; + this.pageCache = config.pageCache || false; } } @@ -336,6 +338,8 @@ function extend (related, config) { if (config.params.page_size) { this.pageSize = config.params.page_size; + this.pageLimit = config.pageLimit || false; + this.pageCache = config.pageCache || false; } if (this.has(req.method, `related.${related}`)) { @@ -377,12 +381,19 @@ function next (config = {}) { return $http(req) .then(({ data }) => { - results = results || []; + let cursor = 0; - data.results = results.concat(data.results); + if (this.pageCache) { + results = results || []; + data.results = results.concat(data.results); + cursor = results.length; - if ((config.limit * this.pageSize) < data.results.length) { - data.results.splice(-config.limit * this.pageSize); + if (this.pageLimit && this.pageLimit * this.pageSize < data.results.length) { + const removeCount = data.results.length - this.pageLimit * this.pageSize; + + data.results.splice(0, removeCount); + cursor -= removeCount; + } } if (config.related) { @@ -390,31 +401,8 @@ function next (config = {}) { } else { this.set('get', data); } - }); -} -function prev (related, config = {}) { - const url = this.get(`related.${related}.previous`); - - if (!url) { - return Promise.resolve(null); - } - - const req = { - method: 'GET', - url - }; - - return $http(req) - .then(({ data }) => { - const results = this.get(`related.${related}.results`) || []; - - data.results = data.results.concat(results); - this.set('get', `related.${related}`, data); - - if (config.limit < results.length) { - console.log(results); - } + return cursor <= 0 ? 0 : cursor; }); } @@ -599,7 +587,6 @@ function BaseModel (resource, settings) { this.normalizePath = normalizePath; this.options = options; this.parseRequestConfig = parseRequestConfig; - this.prev = prev; this.request = request; this.requestWithCache = requestWithCache; this.search = search;