const m = require('mithril')
const socket = require('../socket')
const Module = require('../module')

const Log = Module({
  init: function(vnode) {
    this.activeAppName = 'service-core'
    this.connected = socket.connected
    this.loglines = []
    this.logUpdated = false
    
    this.on('newlog', data => {
      this.loglines.push(this.formatLine(data))
      this.logUpdated = true
      m.redraw()
    })

    this.updateActiveApp(vnode.attrs.id)
    this._socketOn(() => this.socketOpen())
  },

  onupdate: function(vnode) {
    this.updateActiveApp(vnode.attrs.id)
  },

  remove: function() {
    socket.emit('core.unlistenlogs', { name: this.activeAppName })
  },

  updateActiveApp(name) {
    if (!name) {
      name = 'service-core'
    }
    if (this.activeAppName === name) return
    if (this.activeAppName !== name) {
      socket.emit('core.unlistenlogs', { name: this.activeAppName })
    }
    this.activeAppName = name
    this.socketOpen()
  },

  socketOpen: function() {
    this.loglines = []
    socket.emit('core.listenlogs', { name: this.activeAppName })
    socket.emit('core.getlastlogs', { name: this.activeAppName }, (res) => {
      this.loglines = res.map(this.formatLine)
      this.logUpdated = true
      m.redraw()
    })
    m.redraw()
  },

  formatLine: function(line) {
    return m.trust(line.replace(/\\033\[37m/g, '<span class="white">')
                       .replace(/\\033\[33m/g, '<span class="yellow">')
                       .replace(/\\033\[36m/g, '<span class="cyan">')
                       .replace(/\\033\[35m/g, '<span class="magenta">')
                       .replace(/\\033\[31m/g, '<span class="red">')
                       .replace(/\\033\[7m/g, '<span class="inverse">')
                       .replace(/\\033\[32m/g, '<span class="green">')
                       .replace(/\\033\[27m/g, '</span>')
                       .replace(/\\033\[39m/g, '</span>'))
  },

  view: function() {
    return [
      m('div.actions', [
        m(m.route.Link, {
          class: 'button ' + (this.activeAppName === 'service-core' ? 'active' : 'inactive'),
          href: '/log',
        }, 'service-core'),
        this.core.apps.map((app) => {
          return m(m.route.Link, {
            class: 'button ' + (this.activeAppName === app.name ? 'active' : 'inactive'),
            href: '/log/' + app.name,
          }, app.name)
        }),
      ]),
      m('div#logger', {
        onupdate: (vnode) => {
          if (this.logUpdated) {
            vnode.dom.scrollTop = vnode.dom.scrollHeight
            this.logUpdated = false
          }
        }
      }, [
        this.loglines.map((line, i) => {
          return m('div', { key: i }, line)
        }),
        m('div.padder'),
      ]),
    ]
  }
})

module.exports = Log