From e66d6c90f0e8b437b2a631f1709ff240fc769cc8 Mon Sep 17 00:00:00 2001
From: Oskar Cieslik <oskar.cieslik@gmail.com>
Date: Fri, 22 Jul 2016 01:15:23 +0200
Subject: [PATCH] Add support for multiple cursor shapes (#352)

* Add config support for cursor shapes

* Add cursorShape to default config
---
 app/lib/components/term.js  | 7 +++++++
 app/lib/components/terms.js | 1 +
 app/lib/containers/terms.js | 1 +
 app/lib/reducers/ui.js      | 7 +++++++
 config-default.js           | 3 +++
 5 files changed, 19 insertions(+)

diff --git a/app/lib/components/term.js b/app/lib/components/term.js
index ee692932..2fff5017 100644
--- a/app/lib/components/term.js
+++ b/app/lib/components/term.js
@@ -47,6 +47,9 @@ export default class Term extends Component {
           props.onResize(cols, rows);
         }
       };
+
+      // this.term.CursorNode_ is available at this point.
+      this.term.setCursorShape(props.cursorShape);
     };
     this.term.decorate(this.refs.term);
     this.term.installKeyboard();
@@ -186,6 +189,10 @@ export default class Term extends Component {
       this.term.prefs_.set('cursor-color', Color(nextProps.cursorColor).rgbString());
     }
 
+    if (this.props.cursorShape !== nextProps.cursorShape) {
+      this.term.setCursorShape(nextProps.cursorShape);
+    }
+
     if (this.props.colors !== nextProps.colors) {
       this.term.prefs_.set('color-palette-overrides', getColorList(nextProps.colors));
     }
diff --git a/app/lib/components/terms.js b/app/lib/components/terms.js
index 7307284e..16091fe3 100644
--- a/app/lib/components/terms.js
+++ b/app/lib/components/terms.js
@@ -128,6 +128,7 @@ export default class Terms extends Component {
             customCSS: this.props.customCSS,
             fontSize: this.props.fontSize,
             cursorColor: this.props.cursorColor,
+            cursorShape: this.props.cursorShape,
             fontFamily: this.props.fontFamily,
             fontSmoothing: this.props.fontSmoothing,
             foregroundColor: this.props.foregroundColor,
diff --git a/app/lib/containers/terms.js b/app/lib/containers/terms.js
index aa86e9f8..bbe76a2a 100644
--- a/app/lib/containers/terms.js
+++ b/app/lib/containers/terms.js
@@ -26,6 +26,7 @@ const TermsContainer = connect(
       fontSmoothing: state.ui.fontSmoothingOverride,
       padding: state.ui.padding,
       cursorColor: state.ui.cursorColor,
+      cursorShape: state.ui.cursorShape,
       borderColor: state.ui.borderColor,
       colors: state.ui.colors,
       foregroundColor: state.ui.foregroundColor,
diff --git a/app/lib/reducers/ui.js b/app/lib/reducers/ui.js
index 5a68e46e..c20698c2 100644
--- a/app/lib/reducers/ui.js
+++ b/app/lib/reducers/ui.js
@@ -18,12 +18,15 @@ import {
 import { UPDATE_AVAILABLE } from '../constants/updater';
 import { values } from '../utils/object';
 
+const allowedCursorShapes = ['BEAM', 'BLOCK', 'UNDERLINE'];
+
 // TODO: populate `config-default.js` from this :)
 const initial = Immutable({
   cols: null,
   rows: null,
   activeUid: null,
   cursorColor: '#F81CE5',
+  cursorShape: 'BLOCK',
   borderColor: '#333',
   fontSize: 12,
   padding: '12px 14px',
@@ -93,6 +96,10 @@ const reducer = (state = initial, action) => {
           ret.cursorColor = config.cursorColor;
         }
 
+        if (allowedCursorShapes.includes(config.cursorShape)) {
+          ret.cursorShape = config.cursorShape;
+        }
+
         if (null != config.borderColor) {
           ret.borderColor = config.borderColor;
         }
diff --git a/config-default.js b/config-default.js
index 2c59ff8a..331f1dfa 100644
--- a/config-default.js
+++ b/config-default.js
@@ -9,6 +9,9 @@ module.exports = {
     // terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
     cursorColor: 'rgba(248,28,229,0.75)',
 
+    // `BEAM` for |, `UNDERLINE` for _, `BLOCK` for █
+    cursorShape: 'BLOCK',
+
     // color of the text
     foregroundColor: '#fff',