Skip to content

Commit

Permalink
fix(logs): fixed scrolling jump in logs when scrolling to top
Browse files Browse the repository at this point in the history
closes #49
  • Loading branch information
christopherpickering committed Apr 4, 2023
1 parent d8469de commit 3d9ca60
Show file tree
Hide file tree
Showing 6 changed files with 89 additions and 66 deletions.
5 changes: 4 additions & 1 deletion .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,10 @@ node_modules/*
.mypy_cache
.pytest_cache
.tox
web/static/lib/*

/web/static/lib/*
!/web/static/lib/table/
!/web/static/lib/scroll/
web/static/fonts/*
web/static/css/*
.lighthouserc/*
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@
"url": "github:atlas-bi/atlas-automation-hub"
},
"scripts": {
"build": "gulp build",
"commit": "git add . && pre-commit run ; git add . && cz --no-verify",
"format": "prettier --config .prettierrc \"web/**/*.{ts,css,less,scss,js,json,md,yaml,html}\" --write",
"install": "gulp build",
Expand Down
14 changes: 8 additions & 6 deletions runner/model.py
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
from typing import Optional

from sqlalchemy.orm import declarative_base
from sqlalchemy.sql import functions as func
from sqlalchemy.sql import functions

from .extensions import db

Expand Down Expand Up @@ -59,7 +59,7 @@ class Login(db.Model):
id = db.Column(db.Integer, primary_key=True, index=True)
type_id = db.Column(db.Integer, db.ForeignKey(LoginType.id), nullable=True)
username = db.Column(db.String(120), nullable=True)
login_date = db.Column(db.DateTime, server_default=func.now())
login_date = db.Column(db.DateTime, server_default=functions.now())


@dataclass
Expand Down Expand Up @@ -200,11 +200,11 @@ class Project(db.Model):
passive_deletes=True,
)

created = db.Column(db.DateTime, server_default=func.now())
created = db.Column(db.DateTime, server_default=functions.now())
creator_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
updated = db.Column(db.DateTime, onupdate=func.now())
updated = db.Column(db.DateTime, onupdate=functions.now())
updater_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
Expand Down Expand Up @@ -651,6 +651,7 @@ class ProjectParam(db.Model):
key: Optional[str] = None
value: Optional[str] = None
sensitive: Optional[int] = None
project_id: Optional[int] = None

id = db.Column(db.Integer, primary_key=True, index=True)
key = db.Column(db.String(500), nullable=True)
Expand Down Expand Up @@ -797,11 +798,11 @@ class Task(db.Model):
last_run = db.Column(db.DateTime, nullable=True)
last_run_job_id = db.Column(db.String(30), nullable=True, index=True)
next_run = db.Column(db.DateTime, nullable=True, index=True)
created = db.Column(db.DateTime, server_default=func.now(), index=True)
created = db.Column(db.DateTime, server_default=functions.now(), index=True)
creator_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
updated = db.Column(db.DateTime, onupdate=func.now(), index=True)
updated = db.Column(db.DateTime, onupdate=functions.now(), index=True)
updater_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
Expand Down Expand Up @@ -1079,6 +1080,7 @@ class TaskParam(db.Model):
key: Optional[str] = None
value: Optional[str] = None
sensitive: Optional[int] = None
task_id: Optional[int] = None

id = db.Column(db.Integer, primary_key=True, index=True)
key = db.Column(db.String(500), nullable=True)
Expand Down
14 changes: 8 additions & 6 deletions scheduler/model.py
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
from typing import Optional

from sqlalchemy.orm import declarative_base
from sqlalchemy.sql import functions as func
from sqlalchemy.sql import functions

from .extensions import db

Expand Down Expand Up @@ -59,7 +59,7 @@ class Login(db.Model):
id = db.Column(db.Integer, primary_key=True, index=True)
type_id = db.Column(db.Integer, db.ForeignKey(LoginType.id), nullable=True)
username = db.Column(db.String(120), nullable=True)
login_date = db.Column(db.DateTime, server_default=func.now())
login_date = db.Column(db.DateTime, server_default=functions.now())


@dataclass
Expand Down Expand Up @@ -200,11 +200,11 @@ class Project(db.Model):
passive_deletes=True,
)

created = db.Column(db.DateTime, server_default=func.now())
created = db.Column(db.DateTime, server_default=functions.now())
creator_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
updated = db.Column(db.DateTime, onupdate=func.now())
updated = db.Column(db.DateTime, onupdate=functions.now())
updater_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
Expand Down Expand Up @@ -651,6 +651,7 @@ class ProjectParam(db.Model):
key: Optional[str] = None
value: Optional[str] = None
sensitive: Optional[int] = None
project_id: Optional[int] = None

id = db.Column(db.Integer, primary_key=True, index=True)
key = db.Column(db.String(500), nullable=True)
Expand Down Expand Up @@ -797,11 +798,11 @@ class Task(db.Model):
last_run = db.Column(db.DateTime, nullable=True)
last_run_job_id = db.Column(db.String(30), nullable=True, index=True)
next_run = db.Column(db.DateTime, nullable=True, index=True)
created = db.Column(db.DateTime, server_default=func.now(), index=True)
created = db.Column(db.DateTime, server_default=functions.now(), index=True)
creator_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
updated = db.Column(db.DateTime, onupdate=func.now(), index=True)
updated = db.Column(db.DateTime, onupdate=functions.now(), index=True)
updater_id = db.Column(
db.Integer, db.ForeignKey(User.id), nullable=True, index=True
)
Expand Down Expand Up @@ -1079,6 +1080,7 @@ class TaskParam(db.Model):
key: Optional[str] = None
value: Optional[str] = None
sensitive: Optional[int] = None
task_id: Optional[int] = None

id = db.Column(db.Integer, primary_key=True, index=True)
key = db.Column(db.String(500), nullable=True)
Expand Down
117 changes: 65 additions & 52 deletions web/static/lib/table/logs.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,45 @@
}
};
}
var scroll_ajax = null;
function loader(container, url) {
// if within x of top and no "at-start" class, then get more logs.
if (
container.querySelector('.ss-content') &&
container.querySelector('.ss-content').scrollTop < 500 &&
!container.classList.contains('at-start') &&
!container.querySelector('div.loader')
) {
var loader = undefined;
if (container.querySelector('.ss-content').scrollTop == 0) {
loader = document.createElement('div');
loader.classList.add('loader', 'm-5');
loader.setAttribute('style', 'position:absolute;top:-30px;left:-13px;');
container.insertBefore(loader, container.firstChild);
}

// get logs

if (scroll_ajax) {
scroll_ajax.abort();
}
scroll_ajax = new XMLHttpRequest();

scroll_ajax.open('get', url + '?lt=' + log_id_min, true);
scroll_ajax.send();

scroll_ajax.onload = function () {
try {
appendLogs(JSON.parse(this.responseText), container, url);
if (loader !== undefined && loader.parentElement) {
loader.parentElement.removeChild(loader);
}
} catch (e) {
console.log(e);
}
};
}
}

function loadLogs(arr, el, url) {
var box = document.createElement('div');
Expand All @@ -64,56 +103,18 @@
container.setAttribute('ss-container', 'ss-container');
container.setAttribute('style', 'height:100%');

var scroll_ajax = null;
container.addEventListener(
'scroll',
debounce(function () {
// if within x of top and no "at-start" class, then get more logs.
if (
container.querySelector('.ss-content').scrollTop < 500 &&
!container.classList.contains('at-start')
) {
// add loader
var loader = container.querySelector('div.loader');

if (!loader) {
loader = document.createElement('div');
loader.classList.add('loader', 'm-5');
loader.setAttribute(
'style',
'position:absolute;top:-30px;left:-13px;',
);
container.insertBefore(loader, container.firstChild);
}

// get logs

if (scroll_ajax) {
scroll_ajax.abort();
}
scroll_ajax = new XMLHttpRequest();

scroll_ajax.open('get', url + '?lt=' + log_id_min, true);
scroll_ajax.send();

scroll_ajax.onload = function () {
try {
appendLogs(JSON.parse(this.responseText), container);
if (loader !== undefined && loader.parentElement) {
loader.parentElement.removeChild(loader);
}
} catch (e) {
console.log(e);
}
};
}
debounce(() => {
loader(container, url);
}, 10),
);

box.appendChild(container);
el.innerHTML = '';
el.appendChild(box);

appendLogs(arr, container);
appendLogs(arr, container, url);

// trigger scroll
document.dispatchEvent(
Expand Down Expand Up @@ -148,7 +149,7 @@

q.onload = function () {
try {
appendLogs(JSON.parse(this.responseText), container);
appendLogs(JSON.parse(this.responseText), container, url);
} catch (e) {
console.log(e);
}
Expand All @@ -160,7 +161,7 @@
})(container, url);
}

function appendLogs(arr, container) {
function appendLogs(arr, container, url) {
var empty_msg = 'No data to show.',
current_date = new Date().toLocaleString().replace(',', '');
//.replace(/:\d\d\s/, " ");
Expand Down Expand Up @@ -326,14 +327,7 @@
}
});

if (group[x]['location'] == 'before') {
updated.parentElement.insertBefore(
nav,
updated.parentElement.firstChild,
);
} else {
updated.parentElement.insertBefore(nav, updated);
}
// left
left = document.createElement('div');
left.classList.add(
'level-left',
Expand Down Expand Up @@ -430,6 +424,24 @@
}

left.appendChild(message);

if (group[x]['location'] == 'before') {
updated.parentElement.insertBefore(
nav,
updated.parentElement.firstChild,
);

// preserve scroll position
if (container.querySelector('.ss-content')) {
var height = nav.clientHeight;
container.querySelector('.ss-content').scrollTop += height;
} else {
console.log('no scroller yet');
}
} else {
updated.parentElement.insertBefore(nav, updated);
}

// scroll to bottom if has attribute ss-bottom
if (container.hasAttribute('ss-bottom')) {
scroller = container.querySelector('.ss-content');
Expand All @@ -439,5 +451,6 @@
});
}
}
loader(container, url);
}
})((window.rhcTable = window.rhcTable || {}));
4 changes: 3 additions & 1 deletion web/static/lib/table/table.js
Original file line number Diff line number Diff line change
Expand Up @@ -365,7 +365,9 @@
})(reload, el);
}

var autoReload = el.querySelector('input.switch') ? el.querySelector('input.switch').parentElement : null;
var autoReload = el.querySelector('input.switch')
? el.querySelector('input.switch').parentElement
: null;
var reloadTimer;
if (autoReload) {
/* auto reload */
Expand Down

0 comments on commit 3d9ca60

Please sign in to comment.