Stylus extension to support full 6 digit hex colors when needed

color.js

/*
 * Extend Stylus to allow use of 6 digit hex color
 * modified from this StackOverflow answer
 * http://stackoverflow.com/a/9378924/395414
*/

module.exports = function() {
  var hex = function(n) {
    return n.toString(16)
  };

  return function(style) {
    style.define('longColor', function(color) {
      var hexNum = [color.r, color.g, color.b].map(hex);

      hexNum.forEach(function(el, i, arr) {
        if (el === 0 || el === "" || el === "0") {
          hexNum[i] = "00";
        } else if (el.toString().length === 1) {
          hexNum[i] = "0" + el.toString();
        }
      });

      return hexNum.join("");
    });
  }
};


/*
Use:
I use Gulp-Stylus so in my gulpfile.js the stylus part looks like this:

var stylus = require('gulp-stylus');
var nib = require('nib');
var longColor = require("./src/stylus/extend/color.js")

// gulp-stylus blocks gulp watch if you don't handle the error like this
function handleError(err) {
  console.log(err.toString());
  this.emit('end');
}

gulp.task('stylus', function() {
  return gulp.src('./src/stylus/app.styl')
    .pipe(stylus({
      use: [nib(), longColor()],
      errors: true
    }))
    .on("error", handleError)
    .pipe(gulp.dest('./app/css'));
});

in your stylus file you can use it like this
.something
  color: longColor(#333)

*/