jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style(player): few renamings

Browse source
This commit is contained in:
Alex Kaminskii 2022-05-16 20:02:19 +02:00
parent 7929a8ceca
commit d495f1aa97
10 changed files with 52 additions and 80 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
frontend/app/player/MessageDistributor/MessageDistributor.ts
View file

@ -207,12 +207,12 @@ export default class MessageDistributor extends StatedScreen {
move(t: number, index?: number): void { move(t: number, index?: number): void {
const stateToUpdate: Partial<State> = {}; const stateToUpdate: Partial<State> = {};
/* == REFACTOR_ME == */ /* == REFACTOR_ME == */
const lastLoadedLocationMsg = this.loadedLocationManager.moveToLast(t, index); const lastLoadedLocationMsg = this.loadedLocationManager.moveGetLast(t, index);
if (!!lastLoadedLocationMsg) { if (!!lastLoadedLocationMsg) {
setListsStartTime(lastLoadedLocationMsg.time) setListsStartTime(lastLoadedLocationMsg.time)
this.navigationStartOffset = lastLoadedLocationMsg.navigationStart - this.sessionStart; this.navigationStartOffset = lastLoadedLocationMsg.navigationStart - this.sessionStart;
} }
const llEvent = this.locationEventManager.moveToLast(t, index); const llEvent = this.locationEventManager.moveGetLast(t, index);
if (!!llEvent) { if (!!llEvent) {
if (llEvent.domContentLoadedTime != null) { if (llEvent.domContentLoadedTime != null) {
stateToUpdate.domContentLoadedTime = { stateToUpdate.domContentLoadedTime = {
@ -231,22 +231,22 @@ export default class MessageDistributor extends StatedScreen {
} }
} }
/* === */ /* === */
const lastLocationMsg = this.locationManager.moveToLast(t, index); const lastLocationMsg = this.locationManager.moveGetLast(t, index);
if (!!lastLocationMsg) { if (!!lastLocationMsg) {
stateToUpdate.location = lastLocationMsg.url; stateToUpdate.location = lastLocationMsg.url;
} }
const lastConnectionInfoMsg = this.connectionInfoManger.moveToLast(t, index); const lastConnectionInfoMsg = this.connectionInfoManger.moveGetLast(t, index);
if (!!lastConnectionInfoMsg) { if (!!lastConnectionInfoMsg) {
stateToUpdate.connType = lastConnectionInfoMsg.type; stateToUpdate.connType = lastConnectionInfoMsg.type;
stateToUpdate.connBandwidth = lastConnectionInfoMsg.downlink; stateToUpdate.connBandwidth = lastConnectionInfoMsg.downlink;
} }
const lastPerformanceTrackMessage = this.performanceTrackManager.moveToLast(t, index); const lastPerformanceTrackMessage = this.performanceTrackManager.moveGetLast(t, index);
if (!!lastPerformanceTrackMessage) { if (!!lastPerformanceTrackMessage) {
stateToUpdate.performanceChartTime = lastPerformanceTrackMessage.time; stateToUpdate.performanceChartTime = lastPerformanceTrackMessage.time;
} }
LIST_NAMES.forEach(key => { LIST_NAMES.forEach(key => {
const lastMsg = this.lists[key].moveToLast(t, key === 'exceptions' ? undefined : index); const lastMsg = this.lists[key].moveGetLast(t, key === 'exceptions' ? undefined : index);
if (lastMsg != null) { if (lastMsg != null) {
stateToUpdate[`${key}ListNow`] = this.lists[key].listNow; stateToUpdate[`${key}ListNow`] = this.lists[key].listNow;
} }
@ -256,19 +256,19 @@ export default class MessageDistributor extends StatedScreen {
/* Sequence of the managers is important here */ /* Sequence of the managers is important here */
// Preparing the size of "screen" // Preparing the size of "screen"
const lastResize = this.resizeManager.moveToLast(t, index); const lastResize = this.resizeManager.moveGetLast(t, index);
if (!!lastResize) { if (!!lastResize) {
this.setSize(lastResize) this.setSize(lastResize)
} }
this.pagesManager.moveReady(t).then(() => { this.pagesManager.moveReady(t).then(() => {
const lastScroll = this.scrollManager.moveToLast(t, index); const lastScroll = this.scrollManager.moveGetLast(t, index);
if (!!lastScroll && this.window) { if (!!lastScroll && this.window) {
this.window.scrollTo(lastScroll.x, lastScroll.y); this.window.scrollTo(lastScroll.x, lastScroll.y);
} }
// Moving mouse and setting :hover classes on ready view // Moving mouse and setting :hover classes on ready view
this.mouseMoveManager.move(t); this.mouseMoveManager.move(t);
const lastClick = this.clickManager.moveToLast(t); const lastClick = this.clickManager.moveGetLast(t);
if (!!lastClick && t - lastClick.time < 600) { // happend during last 600ms if (!!lastClick && t - lastClick.time < 600) { // happend during last 600ms
this.cursor.click(); this.cursor.click();
} }

4
frontend/app/player/MessageDistributor/managers/ActivityManager.ts
View file

@ -27,14 +27,14 @@ export default class ActivityManager extends ListWalker<SkipInterval> {
updateAcctivity(time: number) { updateAcctivity(time: number) {
if (time - this.lastActivity >= this.minInterval) { if (time - this.lastActivity >= this.minInterval) {
this.add(new SkipIntervalCls(this.lastActivity, time)); this.append(new SkipIntervalCls(this.lastActivity, time));
} }
this.lastActivity = time; this.lastActivity = time;
} }
end() { end() {
if (this.endTime - this.lastActivity >= this.minInterval) { if (this.endTime - this.lastActivity >= this.minInterval) {
this.add(new SkipIntervalCls(this.lastActivity, this.endTime)); this.append(new SkipIntervalCls(this.lastActivity, this.endTime));
} }
} }

8
frontend/app/player/MessageDistributor/managers/DOMManager.ts
View file

@ -40,12 +40,12 @@ export default class DOMManager extends ListWalker<Message> {
if (!this.nodeScrollManagers[ m.id ]) { if (!this.nodeScrollManagers[ m.id ]) {
this.nodeScrollManagers[ m.id ] = new ListWalker(); this.nodeScrollManagers[ m.id ] = new ListWalker();
} }
this.nodeScrollManagers[ m.id ].add(m); this.nodeScrollManagers[ m.id ].append(m);
return; return;
//case "css_insert_rule": // || //set_css_data ??? //case "css_insert_rule": // || //set_css_data ???
//case "css_delete_rule": //case "css_delete_rule":
// (m.tp === "set_node_attribute" && this.isLink[ m.id ] && m.key === "href")) { // (m.tp === "set_node_attribute" && this.isLink[ m.id ] && m.key === "href")) {
// this.stylesManager.add(m); // this.stylesManager.append(m);
// return; // return;
default: default:
if (m.tp === "create_element_node") { if (m.tp === "create_element_node") {
@ -62,7 +62,7 @@ export default class DOMManager extends ListWalker<Message> {
logger.log("Ignorring message: ", m) logger.log("Ignorring message: ", m)
return; // Ignoring... return; // Ignoring...
} }
super.add(m); super.append(m);
} }
} }
@ -299,7 +299,7 @@ export default class DOMManager extends ListWalker<Message> {
moveReady(t: number): Promise<void> { moveReady(t: number): Promise<void> {
this.moveApply(t, this.applyMessage); // This function autoresets pointer if necessary (better name?) this.moveApply(t, this.applyMessage); // This function autoresets pointer if necessary (better name?)
this.nodeScrollManagers.forEach(manager => { this.nodeScrollManagers.forEach(manager => {
const msg = manager.moveToLast(t); // TODO: reset (?) const msg = manager.moveGetLast(t); // TODO: reset (?)
if (!!msg && !!this.nl[msg.id]) { if (!!msg && !!this.nl[msg.id]) {
const node = this.nl[msg.id] as HTMLElement; const node = this.nl[msg.id] as HTMLElement;

76
frontend/app/player/MessageDistributor/managers/ListWalker.ts
View file

@ -1,26 +1,19 @@
import type { Timed } from '../messages/timed'; import type { Timed } from '../messages/timed';
export default class ListWalker<T extends Timed> { export default class ListWalker<T extends Timed> {
// Optimisation: #prop compiles to method that costs mor than strict property call. private p = 0
_p = 0; constructor(private _list: Array<T> = []) {}
_list: Array<T>;
constructor(list: Array<T> = []) {
this._list = list;
}
add(m: T): void {
return this.append(m);
}
append(m: T): void { append(m: T): void {
if (this.length > 0 && this.last && m.time < this.last.time) { if (this.length > 0 && this.last && m.time < this.last.time) {
console.error("Trying to append message with the less time then the list tail: ", m); console.error("Trying to append message with the less time then the list tail: ", m)
return
} }
this._list.push(m); this._list.push(m);
} }
reset(): void { reset(): void {
this._p = 0; this.p = 0
} }
sort(comparator): void { sort(comparator): void {
@ -32,14 +25,6 @@ export default class ListWalker<T extends Timed> {
this._list.forEach(f); this._list.forEach(f);
} }
// set pointer(p: number): void {
// if (p >= this.length || p < 0) {
// // console.error("Trying to set wrong pointer")
// return;
// }
// this._p = p;
// }
get last(): T | null { get last(): T | null {
if (this._list.length === 0) { if (this._list.length === 0) {
return null; return null;
@ -48,17 +33,17 @@ export default class ListWalker<T extends Timed> {
} }
get current(): T | null { get current(): T | null {
if (this._p === 0) { if (this.p === 0) {
return null; return null;
} }
return this._list[ this._p - 1 ]; return this._list[ this.p - 1 ];
} }
get timeNow(): number { get timeNow(): number {
if (this._p === 0) { if (this.p === 0) {
return 0; return 0;
} }
return this._list[ this._p - 1 ].time; return this._list[ this.p - 1 ].time;
} }
get length(): number { get length(): number {
@ -79,7 +64,7 @@ export default class ListWalker<T extends Timed> {
} }
get listNow(): Array<T> { get listNow(): Array<T> {
return this._list.slice(0, this._p); return this._list.slice(0, this.p);
} }
get list(): Array<T> { get list(): Array<T> {
@ -91,15 +76,15 @@ export default class ListWalker<T extends Timed> {
} }
get countNow(): number { get countNow(): number {
return this._p; return this.p;
} }
/* /*
Returns last message with the time <= t. Returns last message with the time <= t.
Assumed that the current message is already handled so Assumed that the current message is already handled so
if pointer doesn't cahnge <undefined> is returned. if pointer doesn't cahnge <null> is returned.
*/ */
moveToLast(t: number, index?: number): T | null { moveGetLast(t: number, index?: number): T | null {
let key: string = "time"; //TODO let key: string = "time"; //TODO
let val = t; let val = t;
if (index) { if (index) {
@ -108,42 +93,29 @@ export default class ListWalker<T extends Timed> {
} }
let changed = false; let changed = false;
while (this._p < this.length && this._list[this._p][key] <= val) { while (this.p < this.length && this._list[this.p][key] <= val) {
this._p++; this.p++;
changed = true; changed = true;
} }
while (this._p > 0 && this._list[ this._p - 1 ][key] > val) { while (this.p > 0 && this._list[ this.p - 1 ][key] > val) {
this._p--; this.p--;
changed = true; changed = true;
} }
return changed ? this._list[ this._p - 1 ] : null; return changed ? this._list[ this.p - 1 ] : null;
} }
// moveToLastByIndex(i: number): ?T { moveApply(t: number, fn: (T) => void, fnBack?: (T) => void): void {
// let changed = false;
// while (!!this._list[this._p] && this._list[this._p]._index <= i) {
// this._p++;
// changed = true;
// }
// while (this._p > 0 && this._list[ this._p - 1 ]._index > i) {
// this._p--;
// changed = true;
// }
// return changed ? this._list[ this._p - 1 ] : undefined;
// }
moveApply(t: number, fn: (T) => void): void {
// Applying only in increment order for now // Applying only in increment order for now
if (t < this.timeNow) { if (t < this.timeNow) {
this.reset(); this.reset();
} }
while (!!this._list[this._p] && this._list[this._p].time <= t) { while (!!this._list[this.p] && this._list[this.p].time <= t) {
fn(this._list[ this._p++ ]); fn(this._list[ this.p++ ]);
}
while (fnBack && this.p > 0 && this._list[ this.p - 1 ].time > t) {
fnBack(this._list[ --this.p ]);
} }
//while (this._p > 0 && this._list[ this._p - 1 ].time > t) {
// fnBack(this._list[ --this._p ]);
//}
} }
} }

2
frontend/app/player/MessageDistributor/managers/MouseMoveManager.ts
View file

@ -32,7 +32,7 @@ export default class MouseMoveManager extends ListWalker<MouseMove> {
} }
move(t: number) { move(t: number) {
const lastMouseMove = this.moveToLast(t); const lastMouseMove = this.moveGetLast(t);
if (!!lastMouseMove){ if (!!lastMouseMove){
this.screen.cursor.move(lastMouseMove); this.screen.cursor.move(lastMouseMove);
//window.getComputedStyle(this.screen.getCursorTarget()).cursor === 'pointer' // might nfluence performance though //window.getComputedStyle(this.screen.getCursorTarget()).cursor === 'pointer' // might nfluence performance though

6
frontend/app/player/MessageDistributor/managers/PagesManager.js
View file

@ -25,13 +25,13 @@ export default class PagesManager extends ListWalker<TimedMessage> {
*/ */
add(m: TimedMessage): void { add(m: TimedMessage): void {
if (m.tp === "create_document") { if (m.tp === "create_document") {
super.add(new DOMManager(this.#screen, this.#isMobile, m.time)) super.append(new DOMManager(this.#screen, this.#isMobile, m.time))
} }
if (this.last === null) { if (this.last === null) {
// Log wrong // Log wrong
return; return;
} }
this.last.add(m); this.last.append(m);
} }
sort(comparator) { sort(comparator) {
@ -39,7 +39,7 @@ export default class PagesManager extends ListWalker<TimedMessage> {
} }
moveReady(t: number): Promise<void> { moveReady(t: number): Promise<void> {
const requiredPage = this.moveToLast(t); const requiredPage = this.moveGetLast(t);
if (!!requiredPage) { if (!!requiredPage) {
this.#currentPage = requiredPage; this.#currentPage = requiredPage;
this.#currentPage.reset(); // Otherwise it won't apply create_document this.#currentPage.reset(); // Otherwise it won't apply create_document

2
frontend/app/player/MessageDistributor/managers/PerformanceTrackManager.ts
View file

@ -62,7 +62,7 @@ export default class PerformanceTrackManager extends ListWalker<PerformanceTrack
time: msg.time, time: msg.time,
nodesCount: this.prevNodesCount, nodesCount: this.prevNodesCount,
}); });
super.add(msg); super.append(msg);
} }
setCurrentNodesCount(count: number) { setCurrentNodesCount(count: number) {

8
frontend/app/player/ios/ImagePlayer.js
View file

@ -80,7 +80,7 @@ export default class ImagePlayer {
logger.error(e); logger.error(e);
} }
}); });
Object.values(this.lists).forEach(list => list.moveToLast(0)); // In case of negative values Object.values(this.lists).forEach(list => list.moveGetLast(0)); // In case of negative values
}) })
if (session.socket == null || typeof session.socket.jwt !== "string" || typeof session.socket.url !== "string") { if (session.socket == null || typeof session.socket.jwt !== "string" || typeof session.socket.url !== "string") {
@ -190,8 +190,8 @@ export default class ImagePlayer {
_setTime(ts) { _setTime(ts) {
ts = Math.max(Math.min(ts, this.state.endTime), 0); ts = Math.max(Math.min(ts, this.state.endTime), 0);
this.state.setTime(ts); this.state.setTime(ts);
Object.values(this.lists).forEach(list => list.moveToLast(ts)); Object.values(this.lists).forEach(list => list.moveGetLast(ts));
const screen = this._screens.moveToLast(ts); const screen = this._screens.moveGetLast(ts);
if (screen != null) { if (screen != null) {
const { dataURL, width, height } = screen; const { dataURL, width, height } = screen;
this.state.setSize(width, height); this.state.setSize(width, height);
@ -199,7 +199,7 @@ export default class ImagePlayer {
//this._screen.style.backgroundImage = `url(${screen.dataURL})`; //this._screen.style.backgroundImage = `url(${screen.dataURL})`;
screen.loadImage.then(() => this._screen.style.backgroundImage = `url(${screen.dataURL})`); screen.loadImage.then(() => this._screen.style.backgroundImage = `url(${screen.dataURL})`);
} }
const lastClick = this._clicks.moveToLast(ts); const lastClick = this._clicks.moveGetLast(ts);
if (lastClick != null && lastClick.time > ts - 600) { if (lastClick != null && lastClick.time > ts - 600) {
this._animateClick(lastClick); this._animateClick(lastClick);
} }

4
frontend/app/player/ios/PerformanceList.js
View file

@ -27,8 +27,8 @@ export default class PerformanceList {
return this._list.count; return this._list.count;
} }
moveToLast(t) { moveGetLast(t) {
this._list.moveToLast(t); this._list.moveGetLast(t);
} }
append(m) { append(m) {

4
frontend/app/player/ios/ScreenList.js
View file

@ -34,8 +34,8 @@ export default class ScreenList {
this._walker._list.splice(p, 0, m); this._walker._list.splice(p, 0, m);
} }
moveToLast(time) { moveGetLast(time) {
return this._walker.moveToLast(time); return this._walker.moveGetLast(time);
} }
insertScreen(time, width, height, arrayBuffer): void { insertScreen(time, width, height, arrayBuffer): void {