How to use the gui.Browser function in gui

handlebars.registerHelper('normalizeId', function(id) {
  return 'msg' + id.replace('.', '_')
})

handlebars.registerHelper('revert', function(boolean) {
  return boolean ? 'false' : 'true'
})

const fontStyle = fs.readFileSync(path.join(__dirname, 'chat', 'font.css')).toString()
handlebars.registerHelper('fontStyle', function() {
  return fontStyle
})

// Register wey:// protocol to work around CROS problem with file:// protocol.
gui.Browser.registerProtocol('wey', (u) => {
  const r = url.parse(u)
  if (r.host !== 'file')
    return gui.ProtocolStringJob.create('text/plain', 'Unsupported type')
  const query = querystring.parse(r.query)
  return gui.ProtocolFileJob.create(query.path)
})

module.exports = ChatBox

const fs = require('fs')
const path = require('path')
const gui = require('gui')

const handlebars = require('./handlebars')
const accountManager = require('../../controller/account-manager')

const messageTemplate = handlebars.compile(
  fs.readFileSync(path.join(__dirname, 'messages.html')).toString())

gui.Browser.registerProtocol('wey', (url) => {
  // Generate messages.
  const found = url.match(/wey:\/\/chat\/messages\/(\w+)\/(\w+)/)
  if (found) {
    const account = accountManager.findAccountById(found[1])
    if (!account)
      return gui.ProtocolStringJob.create('text/html', `Unkown account: ${found[1]}`)
    const channel = account.findChannelById(found[2])
    if (!channel)
      return gui.ProtocolStringJob.create('text/html', `Unkown channel: ${found[2]}`)
    const page = messageTemplate({account, channel})
    fs.writeFileSync('page.html', page)
    return gui.ProtocolStringJob.create('text/html', page)
  }
  // Error.
  return gui.ProtocolStringJob.create('text/html', `Unkown url: ${url}`)
})

constructor(mainWindow) {
    this.mainWindow = mainWindow

    this.messageList = null
    this.subscription = null
    this.messagesLoaded = false
    this.isSendingReply = false
    this.isDisplaying = false
    this.pendingMessages = []
    this.isLoading = false
    this.loadedTimes = 0

    this.view = gui.Container.create()
    this.view.setStyle({flex: 1})

    this.browser = gui.Browser.create({
      devtools: true,
      contextMenu: true,
      allowFileAccessFromFiles: true,
      hardwareAcceleration: false,
    })
    this.browser.setStyle({flex: 1})
    this.browser.setBindingName('wey')
    this.browser.addBinding('ready', this._ready.bind(this))
    this.browser.addBinding('openLink', this._openLink.bind(this))
    this.browser.addBinding('openLinkContextMenu', this._openLinkContextMenu.bind(this))
    this.browser.addBinding('openChannel', this._openChannel.bind(this))
    this.browser.addBinding('openThread', this._openThread.bind(this))
    this.browser.addBinding('setMessageStar', this._setMessageStar.bind(this))
    this.browser.addBinding('setMessageReaction', this._setMessageReaction.bind(this))
    this.browser.addBinding('notifyDisplaying', this._notifyDisplaying.bind(this))
    this.browser.addBinding('notifyNotDisplaying', this._notifyNotDisplaying.bind(this))