webgl terminal renderer

Author: pfitzseb

lib/console/console.js

@@ -90,6 +90,14 @@ export default class InkTerminal extends PaneItem {
       opts.windowsMode = true
     }
 
+    this.persistentState = {}
+    this.persistentState.opts = opts
+
+    if (opts.rendererType === 'webgl') {
+      this.isWebgl = true
+      opts.rendererType = 'canvas'
+    }
+
     this.terminal = new Terminal(opts)
     const webLinksAddon = new WebLinksAddon((ev, uri) => openExternal(uri))
     this.terminal.loadAddon(webLinksAddon)
@@ -100,11 +108,8 @@ export default class InkTerminal extends PaneItem {
     this.fitAddon = new FitAddon()
     this.terminal.loadAddon(this.fitAddon)
 
-
     this.setTitle('Terminal')
 
-    this.persistentState = {}
-    this.persistentState.opts = opts
     this.classname = ''
 
     this.enterhandler = (e) => {
@@ -119,7 +124,7 @@ export default class InkTerminal extends PaneItem {
 
     this.terminal.attachCustomKeyEventHandler(this.enterhandler)
 
-    this.view = new TerminalElement
+    this.view = new TerminalElement()
 
     this.searchui = new SearchUI(this.terminal, this.searchAddon)
 
@@ -141,6 +146,30 @@ export default class InkTerminal extends PaneItem {
     return [this.terminal._core.buffer.x, this.terminal._core.buffer.y]
   }
 
+  setOption (key, val) {
+    if (!this.persistentState) {
+      this.persistentState = { opts: {} }
+    }
+    if (!this.persistentState.opts) {
+      this.persistentState.opts = {}
+    }
+
+    if (key === 'rendererType' && !this.element.initialized) {
+      return
+    }
+    try {
+      if (key === 'rendererType' && val === 'webgl') {
+        this.persistentState.opts[key] = val
+        val = 'canvas'
+      } else {
+        this.persistentState.opts[key] = val
+      }
+      this.terminal.setOption(key, val)
+    } catch (err) {
+      console.warn('Error while applying settings for terminal:', this, err)
+    }
+  }
+
   update () {}
 
   render () {

lib/console/view.js

@@ -1,6 +1,7 @@
 'use babel'
 
 import { CompositeDisposable } from 'atom'
+import { WebglAddon } from 'xterm-addon-webgl'
 import ResizeDetector from 'element-resize-detector'
 import { debounce, throttle } from 'underscore-plus'
 import chroma from 'chroma-js'
@@ -24,6 +25,10 @@ class TerminalElement extends HTMLElement {
 
     this.model.terminal.open(this)
 
+    if (this.model.isWebgl) {
+      this.model.terminal.loadAddon(new WebglAddon())
+    }
+
     this.subs.add(atom.config.observe('editor.fontSize', (val) => {
         this.model.terminal.setOption('fontSize', val)
     }))

package-lock.json

@@ -24,10 +24,11 @@
     "katex": "0.11.0",
     "replace-in-file": "^3.0.0",
     "underscore-plus": "^1.6.6",
-    "xterm": "4.2.0",
+    "xterm": "4.3.0",
     "xterm-addon-fit": "^0.3.0",
-    "xterm-addon-search": "^0.3.0",
-    "xterm-addon-web-links": "^0.2.1"
+    "xterm-addon-search": "^0.4.0",
+    "xterm-addon-web-links": "^0.2.1",
+    "xterm-addon-webgl": "^0.4.0"
   },
   "scripts": {
     "postinstall": "node scripts/postinstall.js"