Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add column hostname #74

Closed
wants to merge 30 commits into from
Closed
Changes from 1 commit
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
f0daf24
Add a hacked-together POC session recording page
spbnick Jun 1, 2017
f19b7dd
Refine session recording looks a bit
spbnick Jul 6, 2017
cd55ad3
Fix to month display
Jul 12, 2017
a55f711
Switch to let instead of var
sabbaka Jul 18, 2017
312f64e
Add date range filter
sabbaka Jul 18, 2017
82e958f
Refactor datepicker
sabbaka Jul 19, 2017
9eba192
Add filter by username
sabbaka Jul 19, 2017
291fc76
Add lookup of tlog UID
sabbaka Jul 25, 2017
f2e3275
Change to TLOG_REC
sabbaka Jul 25, 2017
a286554
Use className attr in recording list table
sabbaka Jul 31, 2017
19ce4e3
Restyle datepicker and userpicker
sabbaka Jul 31, 2017
d06fd74
Add styling for single recording
sabbaka Aug 1, 2017
80210bd
Add restart playback button
sabbaka Aug 2, 2017
c8bca49
Copy cockpit terminal component for expanding
sabbaka Aug 15, 2017
cc2340f
Make terminal resizable
sabbaka Aug 10, 2017
b831514
Improve design
sabbaka Aug 14, 2017
0877af6
Add URL response for filters
sabbaka Aug 18, 2017
9a8be61
Add buttons and hotkeys for playback control
sabbaka Aug 29, 2017
3c22866
Fix console error for ended session
sabbaka Aug 31, 2017
27e3d4a
Fix "if" code style
sabbaka Aug 31, 2017
b5a7d90
Add reason error code to close channels
sabbaka Sep 12, 2017
aff898d
Add recording list sorting
sabbaka Sep 4, 2017
6578d7d
Replace tlog-play with browser-based player
spbnick Sep 13, 2017
2f1bf04
Change datepicker to datetimepicker
sabbaka Sep 7, 2017
231899f
Fix sign output in number padding
spbnick Sep 13, 2017
1dfcce7
Fix terminal width
sabbaka Oct 17, 2017
8579db4
Add playback scaling
sabbaka Nov 27, 2017
cfb2121
Add column hostname
sabbaka Jan 9, 2018
984d344
Add hostname conditional display
sabbaka Jan 10, 2018
fd4fb07
Add hostname filter
sabbaka Jan 10, 2018
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Add recording list sorting
Fix #26
sabbaka authored and spbnick committed Oct 17, 2017
commit aff898d3fca33974441383b73f762c9fef41df75
17 changes: 17 additions & 0 deletions pkg/session_recording/recordings.css
Original file line number Diff line number Diff line change
@@ -318,3 +318,20 @@ a.disabled {
.play-btn {
min-width: 34px;
}

.sort {
cursor: pointer;
}

.sort span {
text-decoration: underline;
}

.sort-icon {
width:7px;
display:inline-block;
}

table.listing-ct > thead th:last-child, tr.listing-ct-item td:last-child {
text-align: left !important;
}
69 changes: 66 additions & 3 deletions pkg/session_recording/recordings.jsx
Original file line number Diff line number Diff line change
@@ -450,6 +450,52 @@
let RecordingList = class extends React.Component {
constructor(props) {
super(props);
this.handleColumnClick = this.handleColumnClick.bind(this);
this.getSortedList = this.getSortedList.bind(this);
this.drawSortDir = this.drawSortDir.bind(this);
this.state = {
sorting_field: "start",
sorting_asc: true,
};
}

drawSortDir() {
$('#sort_arrow').remove();
let type = this.state.sorting_asc ? "asc" : "desc";
let arrow = '<i id="sort_arrow" class="fa fa-sort-' + type + '" aria-hidden="true"></i>';
$(this.refs[this.state.sorting_field]).append(arrow);
}

handleColumnClick(event) {
if(this.state.sorting_field === event.currentTarget.id) {
this.setState({sorting_asc: !this.state.sorting_asc});
}
else {
this.setState({
sorting_field: event.currentTarget.id,
sorting_asc: 'asc'
});
}
}

getSortedList() {
let field = this.state.sorting_field;
let asc = this.state.sorting_asc;
let list = this.props.list.slice();

if (this.state.sorting_field != null) {
if (asc) {
list.sort(function(a, b) {
return a[field] > b[field];
});
} else {
list.sort(function(a, b) {
return a[field] < b[field];
});
}
}

return list;
}

/*
@@ -459,10 +505,24 @@
cockpit.location.go([recording.id], cockpit.location.options);
}

componentDidUpdate() {
this.drawSortDir();
}

render() {
let columnTitles = [_("User"), _("Start"), _("End"), _("Duration")];
let list = this.props.list;
let columnTitles = [
(<div id="user" className="sort" onClick={this.handleColumnClick}><span>{_("User")}</span> <div
ref="user" className="sort-icon"></div></div>),
(<div id="start" className="sort" onClick={this.handleColumnClick}><span>{_("Start")}</span> <div
ref="start" className="sort-icon"></div></div>),
(<div id="end" className="sort" onClick={this.handleColumnClick}><span>{_("End")}</span> <div
ref="end" className="sort-icon"></div></div>),
(<div id="duration" className="sort" onClick={this.handleColumnClick}><span>{_("Duration")}</span> <div
ref="duration" className="sort-icon"></div></div>),
];
let list = this.getSortedList();
let rows = [];

for (let i = 0; i < list.length; i++) {
let r = list[i];
let columns = [r.user,
@@ -600,7 +660,8 @@
pid: parseInt(e["_PID"], 10),
start: ts,
/* FIXME Should be start + message duration */
end: ts};
end: ts,
duration: 0};
/* Map the recording */
this.recordingMap[id] = r;
/* Insert the recording in order */
@@ -612,9 +673,11 @@
/* Adjust existing recording */
if (ts > r.end) {
r.end = ts;
r.duration = r.end - r.start;
}
if (ts < r.start) {
r.start = ts;
r.duration = r.end - r.start;
/* Find the recording in the list */
for (j = recordingList.length - 1;
j >= 0 && recordingList[j] != r;