services/boot/js/index.js

   1 // application entry point
   2 window.jQuery = require('jquery')
   3 window.Tether = require('tether')
   4 require('bootstrap')
   5 require('./example.js')
   6 var m = require('mithril')
   7 var Stream = require('mithril/stream')
   8
   9 const refreshInterval = 5
  10
  11 var ctl = Stream({Tasks: [], Version: 0, Outdated: true})
  12
  13 refresh.xhr = null
  14 function refresh() {
  15     if (refresh.xhr !== null) {
  16         refresh.xhr.abort()
  17         refresh.xhr = null
  18         ctl().Outdated = true
  19         m.redraw()
  20     }
  21     m.request({
  22         method: 'GET',
  23         url: '/api/tasks/ctl?timeout='+refreshInterval+'&newerThan='+ctl().version,
  24         config: function(xhr) { refresh.xhr = xhr },
  25     })
  26         .then(function(data) {
  27             var isNew = data.Version != ctl().Version
  28             ctl(data)
  29             refresh.xhr = null
  30             if (isNew)
  31                 // Got a new version -- assume the server is obeying
  32                 // newerThan, and start listening for the next version
  33                 // right away.
  34                 refresh()
  35         })
  36 }
  37 window.setInterval(refresh, refreshInterval*1000)
  38 refresh()
  39
  40 var Home = {
  41     view: function(vnode) {
  42         return [
  43             m('nav.navbar.navbar-toggleable-md.navbar-inverse.bg-primary',
  44               m('a.navbar-brand[href=#]', 'arvados-boot'),
  45               m('.collapse.navbar-collapse',
  46                 m('ul.navbar-nav',
  47                   m('li.nav-item.active',
  48                     m('a.nav-link[href=/]', {config: m.route}, 'health', m('span.sr-only', '(current)')))))),
  49             m('.x-spacer', {height: '1em'}),
  50             m('table.table', {style: {width: '350px'}},
  51               m('tbody', {style: {opacity: ctl().Outdated ? .5 : 1}}, ctl().Tasks.map(function(task) {
  52                   return m('tr', [
  53                       m('td', task.Name),
  54                       m('td',
  55                         m('span.badge',
  56                           {class: task.State == 'OK' ? 'badge-success' : 'badge-danger'},
  57                           task.State)),
  58                   ])
  59               }))),
  60         ]
  61     }
  62 }
  63
  64 m.route(document.getElementById('app'), '/', {
  65     '/': Home,
  66 })