summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--contrib/dashboard.html3
-rw-r--r--contrib/dashboard.js17
2 files changed, 18 insertions, 2 deletions
diff --git a/contrib/dashboard.html b/contrib/dashboard.html
index cc09d50..4468786 100644
--- a/contrib/dashboard.html
+++ b/contrib/dashboard.html
@@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>chromebot dashboard</title>
- <!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
+ <!--<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>-->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.7/css/bulma.min.css">
<link rel="stylesheet" href="dashboard.css">
@@ -13,6 +13,7 @@
<noscript>Please enable JavaScript.</noscript>
<section id="app" class="section">
<h1 class="title">chromebot dashboard</h1>
+ <bot-status v-bind:jobs="jobs"></bot-status>
<div class="jobs">
<job-item v-for="j in jobs" v-bind:job="j" v-bind:jobs="jobs" v-bind:ignored="ignored" v-bind:key="j.id"></job-item>
</div>
diff --git a/contrib/dashboard.js b/contrib/dashboard.js
index eb34d43..e07f8e3 100644
--- a/contrib/dashboard.js
+++ b/contrib/dashboard.js
@@ -1,5 +1,5 @@
/* configuration */
-let socket = "ws://localhost:6789/",
+let socket = "wss://localhost:6789/",
urllogMax = 100;
function formatSize (bytes) {
@@ -117,6 +117,21 @@ Vue.component('filesize', {
template: '<span class="filesize">{{ fvalue }}</span>',
computed: { fvalue: function () { return formatSize (this.value); } }
});
+Vue.component('bot-status', {
+ props: ['jobs'],
+ template: '<nav class="level"><div class="level-item has-text-centered"><div><p class="heading">Pending</p><p class="title">{{ stats.pending }}</p></div></div><div class="level-item has-text-centered"><div><p class="heading">Running</p><p class="title">{{ stats.running }}</p></div></div><div class="level-item has-text-centered"><div><p class="heading">Finished</p><p class="title">{{ stats.finished+stats.aborted }}</p></div></div><div class="level-item has-text-centered"><div><p class="heading">Transferred</p><p class="title"><filesize v-bind:value="stats.totalBytes"></filesize></p></div></div></nav>',
+ computed: {
+ stats: function () {
+ let s = {pending: 0, running: 0, finished: 0, aborted: 0, totalBytes: 0};
+ for (let k in this.jobs) {
+ let j = this.jobs[k];
+ s[j.status]++;
+ s.totalBytes += j.stats.bytesRcv;
+ }
+ return s;
+ }
+ }
+});
let app = new Vue({
el: '#app',