Completed theme support

- Removed colors from config as it wasn't used anymore
- Added couple more themes
- Added tests to check for invalid values

Author: agnivade

bin/tldr

@@ -23,7 +23,7 @@ program
   .option('--linux', 'Override the operating system with Linux')
   .option('--osx', 'Override the operating system with OSX')
   .option('--sunos', 'Override the operating system with SunOS')
-  .option('-t, --theme [theme]', 'Color theme (bw, bw-simple, original)')
+  .option('-t, --theme [theme]', 'Color theme (simple, base16, ocean)')
   //
   // CACHE MANAGEMENT
   //

config.json

@@ -1,41 +1,42 @@
 {
   "pagesRepository": "tldr-pages/tldr",
   "url": "http://tldr-pages.github.io/assets/tldr.zip",
-  "colors": {
-    "text": "green",
-    "command-background": "black",
-    "command-foreground": "red",
-    "command-token": "white"
-  },
   "themes": {
-    "bw": {
-      "name": "bold, underline",
+    "simple": {
+      "name": "bold,underline",
       "description": "bold",
       "exampleDescription": "",
       "exampleCode": "",
-      "exampleArgument": "underline"
-    },
-    "plain": {
-      "name": "",
-      "description": "",
-      "exampleDescription": "",
-      "exampleCode": "",
-      "exampleArgument": ""
+      "exampleToken": "underline"
     },
-    "original": {
+    "base16": {
       "name": "bold",
       "description": "",
       "exampleDescription": "green",
       "exampleCode": "red",
-      "exampleArgument": ""
+      "exampleToken": "cyan"
     },
-    "simple": {
+    "ocean": {
       "name": "bold,cyan",
       "description": "",
       "exampleDescription": "green",
-      "exampleCode": "",
-      "exampleArgument": "dim"
+      "exampleCode": "cyan",
+      "exampleToken": "dim"
+    },
+    "inverse": {
+      "name": "bold,inverse",
+      "description": "inverse",
+      "exampleDescription": "black",
+      "exampleCode": "inverse",
+      "exampleToken": "green,bgBlack,inverse"
+    },
+    "matrix": {
+      "name": "bold",
+      "description": "underline",
+      "exampleDescription": "green,bgBlack",
+      "exampleCode": "green,bgBlack",
+      "exampleToken": "green,bold,bgBlack"
     }
   },
-  "theme": "bw"
+  "theme": "simple"
 }

lib/config.js

@@ -36,7 +36,7 @@ function load() {
   }
 
   var merged = defaults(customConfig, defaultConfig);
-  var errors = map(merged.colors, validateColor);
+  var errors = map(merged.themes, validateThemeItem);
   errors.push(validatePlatform(merged.platform));
   errors = compact(errors);
 
@@ -54,10 +54,42 @@ function validatePlatform(os) {
   return null;
 }
 
-function validateColor(colorName, key) {
-  var ansi = ['white','black','blue','cyan','green','magenta','red','yellow'];
-  if (ansi.indexOf(colorName) < 0) {
-    return 'Invalid ANSI color : ' + key + ' = ' + colorName;
+function validateThemeItem(field, key) {
+  var validValues = ['',
+                    'reset',
+                    'bold',
+                    'dim',
+                    'italic',
+                    'underline',
+                    'inverse',
+                    'hidden',
+                    'black',
+                    'red',
+                    'green',
+                    'yellow',
+                    'blue',
+                    'magenta',
+                    'cyan',
+                    'white',
+                    'gray',
+                    'bgBlack',
+                    'bgRed',
+                    'bgGreen',
+                    'bgYellow',
+                    'bgBlue',
+                    'bgMagenta',
+                    'bgCyan',
+                    'bgWhite'
+                    ];
+  for (var item in field) {
+    if (field.hasOwnProperty(item)) {
+      var tokens = field[item].split(',');
+      for (var i=0; i < tokens.length; i++) {
+        if (validValues.indexOf(tokens[i]) < 0) {
+          return 'Invalid ANSI color : ' + tokens[i] + ' in ' + key + ' theme';
+        }
+      }
+    }
   }
   return null;
 }

lib/render.js

@@ -11,7 +11,7 @@ exports.toANSI = function(page) {
     // every second part is a token
     return '    ' + parts.reduce(function(memo, item, i) {
       if (i % 2) {
-        return memo + theme.renderExampleArgument(item);
+        return memo + theme.renderExampleToken(item);
       }
       return memo + theme.renderExampleCode(item);
     }, '');

lib/theme.js

@@ -34,7 +34,7 @@ var Theme = function(options) {
     renderDescription: renderPartMemoized('description'),
     renderExampleDescription: renderPartMemoized('exampleDescription'),
     renderExampleCode: renderPartMemoized('exampleCode'),
-    renderExampleArgument: renderPartMemoized('exampleArgument')
+    renderExampleToken: renderPartMemoized('exampleToken')
   };
 };
 

test/config.spec.js

@@ -16,11 +16,18 @@ describe('Config', function() {
 
   var CUSTOM_INVALID =
     '{' +
-    '  "colors": {' +
-    '    "text": "pretty" ' +
+    '"themes": {' +
+    '  "simple": {' +
+    '    "name": "bold,underline",' +
+    '    "description": "#876992",' +
+    '    "exampleDescription": "",' +
+    '    "exampleCode": "",' +
+    '    "exampleToken": "underline"' +
     '  }' +
+    '}' +
     '}';
 
+
   beforeEach(function() {
     sinon.stub(fs, 'readFileSync');
     config.reset();

test/render.spec.js

@@ -7,7 +7,8 @@ var config = require('../lib/config');
 describe('Render', function() {
 
   beforeEach(function() {
-    config.get().theme = 'plain';
+    config.reset();
+    config.get().theme = 'base16';
   });
 
   it('surrounds the output with blank lines', function() {

test/theme.spec.js

@@ -10,7 +10,7 @@ describe('Theme', function() {
       description: 'red, underline',
       exampleDescription: 'blue',
       exampleCode: 'bold',
-      exampleArgument: 'yellow,dim,underline'
+      exampleToken: 'yellow,dim,underline'
     });
 
     it('should render name with green and bold', function () {
@@ -38,7 +38,7 @@ describe('Theme', function() {
     });
 
     it('should render example argument with yellow, dim, underline', function() {
-      theme.renderExampleArgument('text')
+      theme.renderExampleToken('text')
         .should.equal(
           chalk.yellow.dim.underline('text'));
     });