diff --git a/frontend/src/css/index.css b/frontend/src/css/index.css index f46dceb..76e1fcf 100755 --- a/frontend/src/css/index.css +++ b/frontend/src/css/index.css @@ -6,6 +6,13 @@ pre.word-wrap { word-wrap: break-word; /* Internet Explorer 5.5+ */ } +pre.terminal { + background: black; + color: #aaa; + height: 600px; + width: 100%; +} + .w-1 { width: 1px !important; } diff --git a/frontend/src/js/component/wb-live-logs.js b/frontend/src/js/component/wb-live-logs.js new file mode 100644 index 0000000..26f0b79 --- /dev/null +++ b/frontend/src/js/component/wb-live-logs.js @@ -0,0 +1,47 @@ +import { h, Component } from 'preact'; +import makeArvadosRequest from 'make-arvados-request'; + +class WBLiveLogs extends Component { + componentDidMount() { + this.fetchData(); + } + + componentWillReceiveProps(nextProps) { + if (nextProps.uuid === this.props.uuid); + return; + this.props = nextProps; + this.fetchData(); + } + + fetchData() { + const { uuid, app } = this.props; + const { arvHost, arvToken } = app.state; + const filters = [ + [ 'object_uuid', '=', uuid ] + ]; + let prom = makeArvadosRequest(arvHost, arvToken, + '/arvados/v1/logs?filters=' + encodeURIComponent(JSON.stringify(filters))); + prom = prom.then(xhr => { + const { items } = xhr.response; + this.setState({ + content: items.filter(a => ('text' in a.properties)).map(a => a.properties.text.trim()).join('\n') + }); + }); + } + + render({}, { content }) { + return ( +
+ { + e.preventDefault(); + this.fetchData(); + } }>Refresh +
+          { content }
+        
+
+ ); + } +} + +export default WBLiveLogs; diff --git a/frontend/src/js/page/wb-container-view.js b/frontend/src/js/page/wb-container-view.js index ea2a804..3ca5a4b 100644 --- a/frontend/src/js/page/wb-container-view.js +++ b/frontend/src/js/page/wb-container-view.js @@ -3,6 +3,7 @@ import WBNavbarCommon from 'wb-navbar-common'; import WBArvadosCrumbs from 'wb-arvados-crumbs'; import WBCommonFields from 'wb-common-fields'; import WBContainerFields from 'wb-container-fields'; +import WBLiveLogs from 'wb-live-logs'; class WBContainerView extends Component { render({ app, uuid }) { @@ -21,6 +22,9 @@ class WBContainerView extends Component {

Container Fields

+ +

Live Logs

+ ); }