feature(gritty) add support of fontFamily

Author: coderaiser

README.md

@@ -43,10 +43,12 @@ Start `gritty`, and go to url `http://localhost:1337`
 ```js
 const prefix = '/gritty'; // default
 const env = {}; // default
+const fontFamily = 'Courier'; // default
 
 gritty('body', {
     prefix,
     env,
+    fontFamily,
 });
 ```
 

client/gritty.js

@@ -1,7 +1,6 @@
 'use strict';
 
 require('xterm/dist/xterm.css');
-require('../css/gritty.css');
 
 const fit = require('xterm/lib/addons/fit');
 const currify = require('currify/legacy');
@@ -33,10 +32,14 @@ module.exports._onTermResize = _onTermResize;
 module.exports._onTermData = _onTermData;
 module.exports._onWindowResize = _onWindowResize;
 
+const defaultFontFamily = 'Menlo, Consolas, "Liberation Mono", Monaco, "Lucida Console", monospace';
+module.exports._defaultFontFamily = defaultFontFamily;
+
 function gritty(element, options = {}) {
     const el = getEl(element);
 
     const socketPath = options.socketPath || '';
+    const fontFamily = options.fontFamily || defaultFontFamily;
     const prefix = options.prefix || '/gritty';
     const env = getEnv(options.env || {});
 
@@ -47,15 +50,16 @@ function gritty(element, options = {}) {
     return createTerminal(el, {
         env,
         socket,
+        fontFamily
     });
 }
 
-function createTerminal(terminalContainer, {env, socket}) {
+function createTerminal(terminalContainer, {env, socket, fontFamily}) {
     const terminal = new Terminal({
         scrollback: 1000,
         tabStopWidth: 4,
-        theme: 'gritty',
         experimentalCharAtlas: 'dynamic',
+        fontFamily,
     });
 
     terminal.open(terminalContainer);

css/gritty.css

@@ -30,6 +30,8 @@
     "watch:client:dev": "redrun 6to5:client:dev -- --watch",
     "wisdom": "npm run build",
     "build": "redrun 6to5:*",
+    "build:start": "redrun build:client start",
+    "build:start:dev": "redrun build:client:dev start:dev",
     "build:client": "redrun 6to5:client",
     "build:client:dev": "redrun 6to5:client:dev",
     "watch:lint": "nodemon -w client -w server -w webpack.config.js -x 'redrun lint'",

package.json

@@ -48,6 +48,7 @@ const {
     _onTermResize,
     _onTermData,
     _onWindowResize,
+    _defaultFontFamily,
 } = require('../../client/gritty');
 
 test('gritty: Terminal: new', (t) => {
@@ -65,7 +66,8 @@ test('gritty: Terminal: args', (t) => {
     const args = {
         scrollback: 1000,
         tabStopWidth: 4,
-        theme: 'gritty',
+        experimentalCharAtlas: 'dynamic',
+        fontFamily: _defaultFontFamily,
     };
 
     gritty();
@@ -76,6 +78,28 @@ test('gritty: Terminal: args', (t) => {
     t.end();
 });
 
+test('gritty: Terminal: args: fontFamily', (t) => {
+    before();
+    
+    const fontFamily = 'Droid Sans Mono';
+    const el = {};
+    const args = {
+        scrollback: 1000,
+        tabStopWidth: 4,
+        experimentalCharAtlas: 'dynamic',
+        fontFamily,
+    };
+    
+    gritty(el, {
+        fontFamily
+    });
+    
+    t.ok(Terminal.calledWith(args), 'should have been called with args');
+    
+    after();
+    t.end();
+});
+
 test('gritty: Terminal: open', (t) => {
     const el = {};