diff --git a/ccp/js/executionhistorycontroller.js b/ccp/js/executionhistorycontroller.js index b0217c6..330a3c1 100644 --- a/ccp/js/executionhistorycontroller.js +++ b/ccp/js/executionhistorycontroller.js @@ -26,10 +26,10 @@ class CCPExecutionHistory extends HTMLElement { this.#broadcasturl = this.#broadcasturl + "/ws/notification" this.#archive = this.getAttribute("archive") this.connectNewExecution() - this.connectBroadcast() } connectedCallback(){ + this.connectBroadcastWithSubject() this.render() this.refreshExecutions() } @@ -114,6 +114,8 @@ class CCPExecutionHistory extends HTMLElement { +
+
@@ -270,10 +272,26 @@ class CCPExecutionHistory extends HTMLElement { }) } + connectBroadcastWithSubject(){ + var interval = window.setInterval( ()=>{ + if(this.#boot.subject){ + window.clearInterval(interval) + this.connectBroadcast() + } + }, 1000) + } + connectBroadcast(){ - this.#socket = new WebSocket(this.#broadcasturl + "/executions"); + this.#socket = new WebSocket(`${this.#broadcasturl}/unified?subject=${this.#boot.subject}`); this.#socket.onmessage = event=>{ const data = JSON.parse(event.data) + + if(data[0] && data[0].source){ + //has to be logs + this.appendLogs(data) + return + } + let exec = this.#data.filter(e=>e.id === data.jobID)[0] if(exec){ this.refreshExecution(exec.id) @@ -299,6 +317,17 @@ class CCPExecutionHistory extends HTMLElement { }, 30000) } + appendLogs(data){ + if(!data.length) return; + const exid = data[0]["attrs"]["execution"] + const lt = this.#rootdoc.querySelector(`d4s-ccp-logterminal[index='${exid}']`) + if(!lt){ + console.error("No terminal found for adding logs of " + exid) + }else{ + lt.addLines(data) + } + } + download(url, name) { this.#boot.secureFetch(url).then(reply => { if (!reply.ok) { @@ -627,6 +656,12 @@ class CCPExecutionHistory extends HTMLElement { this.generateCode(id, lang, `${id}.${ext}`) } }, + { + target : "div[name=logterminalcontainer]", + apply : (e,d)=>{ + e.innerHTML = `` + } + }, { target : "ul", recurse : [ @@ -655,4 +690,4 @@ class CCPExecutionHistory extends HTMLElement { ] } } -window.customElements.define('d4s-ccp-executionhistory', CCPExecutionHistory); \ No newline at end of file +window.customElements.define('d4s-ccp-executionhistory', CCPExecutionHistory); diff --git a/ccp/js/logterminalcontroller.js b/ccp/js/logterminalcontroller.js new file mode 100644 index 0000000..b87570e --- /dev/null +++ b/ccp/js/logterminalcontroller.js @@ -0,0 +1,120 @@ +class LogTerminal extends HTMLElement { + + #maxlines = 10; + #maxstoredlines = 100; + #rootdoc = null; + #lines = []; + #index = null; + + static get observedAttributes() { return ['index']; } + + constructor(){ + super() + this.#maxlines = this.getAttribute("maxlines") + this.#rootdoc = this.attachShadow({ "mode" : "open"}) + this.render() + } + + connectedCallback(){ + this.reloadLines() + this.refresh() + } + + attributeChangedCallback(name, oldValue, newValue) { + if(name === "index"){ + this.#index = newValue + this.reloadLines() + } + } + + get lines(){ + return this.#lines + } + + addLines(lines){ + this.#lines = this.#lines.concat(lines) + this.refresh() + this.storeLines() + } + + reloadLines(){ + if(this.#index == null) return; + if(sessionStorage.getItem("logs-" + this.#index)){ + this.#lines = JSON.parse(sessionStorage.getItem("logs-" + this.#index)) + }else{ + this.#lines = [] + } + } + + storeLines(){ + if(this.#lines.length > this.#maxstoredlines){ + this.#lines.splice(0, this.#lines.length - this.#maxstoredlines) + } + sessionStorage.setItem("logs-" + this.#index, JSON.stringify(this.#lines)) + } + + render(){ + this.#rootdoc.innerHTML = ` + + + +
+ ` + } + + refresh(){ + BSS.apply(this.#terminal_bss, this.#rootdoc) + const lt = this.#rootdoc.querySelector("div.terminal") + lt.scrollTop = lt.scrollHeight; + } + + #terminal_bss = { + template : "#TERMINAL_TEMPLATE", + target : "div[name=terminal]", + in : ()=>this, + recurse : { + target : "div.line", + in: (e,d)=>d.lines, + apply: (e,d,i)=>{ + if(d.source === "stderr") e.classList.add("error"); + if(d.source === "infrastructure") e.classList.add("infrastructure"); + e.innerHTML = `${d.line}` + } + } + } +} + +window.customElements.define('d4s-ccp-logterminal', LogTerminal);