Techognito/starter-kit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Replace term.js with xterm.js

Browse source
This commit is contained in:
Justin Stephenson 2019-08-16 14:18:13 -04:00
parent 229671f485
commit cddcb1f40a
6 changed files with 57 additions and 257 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/player.jsx
View file

@ -18,13 +18,13 @@
*/
"use strict";
import React from 'react';
import './console.css';
import { Terminal as Term } from 'xterm';
let cockpit = require("cockpit");
let _ = cockpit.gettext;
let moment = require("moment");
let Term = require("term.js-cockpit");
let Journal = require("journal");
let $ = require("jquery");
require("console.css");
require("bootstrap-slider");
let padInt = function (n, w) {
@ -1143,7 +1143,9 @@ export class Player extends React.Component {
cols: this.state.cols,
rows: this.state.rows,
screenKeys: true,
useStyle: true
useStyle: true,
/* Exposes the xterm-accessibility-tree */
screenReaderMode: true,
});
term.on('title', this.handleTitleChange);
@ -1242,35 +1244,35 @@ export class Player extends React.Component {
</div>
<div className="panel-footer">
<Slider length={this.buf.pos} mark={this.state.currentTsPost} fastForwardFunc={this.fastForwardToTS} play={this.play} pause={this.pause} paused={this.state.paused} />
<button title="Play/Pause - Hotkey: p" type="button" ref="playbtn"
<button id="player-play-pause" title="Play/Pause - Hotkey: p" type="button" ref="playbtn"
className="btn btn-default btn-lg margin-right-btn play-btn"
onClick={this.playPauseToggle}>
<i className={"fa fa-" + (this.state.paused ? "play" : "pause")}
aria-hidden="true" />
</button>
<button title="Skip Frame - Hotkey: ." type="button"
<button id="player-skip-frame" title="Skip Frame - Hotkey: ." type="button"
className="btn btn-default btn-lg margin-right-btn"
onClick={this.skipFrame}>
<i className="fa fa-step-forward" aria-hidden="true" />
</button>
<button title="Restart Playback - Hotkey: Shift-R" type="button"
<button id="player-restart" title="Restart Playback - Hotkey: Shift-R" type="button"
className="btn btn-default btn-lg" onClick={this.rewindToStart}>
<i className="fa fa-fast-backward" aria-hidden="true" />
</button>
<button title="Fast-forward to end - Hotkey: Shift-G" type="button"
<button id="player-fast-forward" title="Fast-forward to end - Hotkey: Shift-G" type="button"
className="btn btn-default btn-lg margin-right-btn"
onClick={this.fastForwardToEnd}>
<i className="fa fa-fast-forward" aria-hidden="true" />
</button>
<button title="Speed /2 - Hotkey: {" type="button"
<button id="player-speed-down" title="Speed /2 - Hotkey: {" type="button"
className="btn btn-default btn-lg" onClick={this.speedDown}>
/2
</button>
<button title="Reset Speed - Hotkey: Backspace" type="button"
<button id="player-speed-reset" title="Reset Speed - Hotkey: Backspace" type="button"
className="btn btn-default btn-lg" onClick={this.speedReset}>
1:1
</button>
<button title="Speed x2 - Hotkey: }" type="button"
<button id="player-speed-up" title="Speed x2 - Hotkey: }" type="button"
className="btn btn-default btn-lg margin-right-btn"
onClick={this.speedUp}>
x2
@ -1278,16 +1280,16 @@ export class Player extends React.Component {
<span>{speedStr}</span>
<span style={to_right}>
<span className="session_time">{formatDuration(this.state.currentTsPost)} / {formatDuration(this.buf.pos)}</span>
<button title="Drag'n'Pan" type="button" className="btn btn-default btn-lg"
<button id="player-drag-pan" title="Drag'n'Pan" type="button" className="btn btn-default btn-lg"
onClick={this.dragPan}>
<i className={"fa fa-" + (this.state.drag_pan ? "hand-rock-o" : "hand-paper-o")}
aria-hidden="true" /></button>
<button title="Zoom In - Hotkey: =" type="button" className="btn btn-default btn-lg"
<button id="player-zoom-in" title="Zoom In - Hotkey: =" type="button" className="btn btn-default btn-lg"
onClick={this.zoomIn} disabled={this.state.term_zoom_max}>
<i className="fa fa-search-plus" aria-hidden="true" /></button>
<button title="Fit To - Hotkey: Z" type="button" className="btn btn-default btn-lg"
<button id="player-fit-to" title="Fit To - Hotkey: Z" type="button" className="btn btn-default btn-lg"
onClick={this.fitTo}><i className="fa fa-expand" aria-hidden="true" /></button>
<button title="Zoom Out - Hotkey: -" type="button" className="btn btn-default btn-lg"
<button id="player-zoom-out" title="Zoom Out - Hotkey: -" type="button" className="btn btn-default btn-lg"
onClick={this.zoomOut} disabled={this.state.term_zoom_min}>
<i className="fa fa-search-minus" aria-hidden="true" /></button>
</span>