From 1747a63f3338d8b95175a3cb3d9397462ef3aad0 Mon Sep 17 00:00:00 2001 From: Jonas Ohlsson Date: Sat, 28 Feb 2015 18:57:39 +0000 Subject: [PATCH] functional node module, added instructions in readme --- README.md | 11 +++++++++- bin/specificity-graph | 46 +++++++++++++--------------------------- lib/{cli.js => index.js} | 24 +++++++++++---------- package.json | 4 ++-- 4 files changed, 40 insertions(+), 45 deletions(-) rename lib/{cli.js => index.js} (82%) diff --git a/README.md b/README.md index c76708c..6f21fe1 100644 --- a/README.md +++ b/README.md @@ -12,6 +12,7 @@ Generate an interactive line graph showing the specificity in your stylesheet. U ## Usage `specifity-graph` can be used in different ways: * [CLI](#cli) +* [Node module](#node-module) * [Via JavaScript](#via-javascript) * [Online](http://jonassebastianohlsson.com/specificity-graph/) @@ -30,12 +31,20 @@ Creates a directory containing | -b --browser | auto launch browser to view generated chart | | -h --help | Help | +### Node module +``` +var specificityGraph = require('specificity-graph'); + +specificityGraph(directory, css, function(directory){ + console.log('specificity-graph files created in ' + directory); +}); +``` ### Via JavaScript First get the `specificityGraph` accessible in your code: #### Using Browserify (or similar) -Just `require('specificity-graph')` +Just `require('specificity-graph')`. #### Standalone (no module loader) Add ``, diff --git a/bin/specificity-graph b/bin/specificity-graph index 4395756..ed17909 100755 --- a/bin/specificity-graph +++ b/bin/specificity-graph @@ -1,5 +1,10 @@ #!/usr/bin/env node +/* + * Executable that will be available in the path by executing `npm install specificity-graph -g`. + * If installed as a dependency the binary will be placed in node_modules/.bin/specificity-graph + */ + 'use strict'; var fs = require('fs'), @@ -7,8 +12,7 @@ var fs = require('fs'), colors = require('cli-color'), commander = require('commander'), open = require('opn'), - generateCssData = require('../lib/generateCssData'), - generateCustomSpecificityFiles = require('../lib/cli'); + specificityGraph = require('../lib/index'); commander .usage(' [options]') @@ -32,18 +36,19 @@ if (!input){ console.error(colors.red('Missing arguments')); console.log('usage: ' + ' [options]. See --help for more info'); process.exit(1); -} -if(input && !fs.existsSync(input)) { - console.error(colors.red('Unable to read file'), input); - process.exit(1); -} +} else { + if(!fs.existsSync(input)) { + console.error(colors.red('Unable to read file'), input); + process.exit(1); + } -if(input) { try { var css = fs.readFileSync(input); - var specificity = generateCssData(css.toString()); - generateCustomSpecificityFiles(output, specificity, function (dest){ + specificityGraph(output, css, function (dest, err){ + if(err) { + console.log(colors.yellow('[specificity-graph] The directory already exist')); + } console.log(colors.blue('[specificity-graph]') + ' Write specificity in ' + dest); if(openInBrowser){ open(path.join(dest, 'index.html')); @@ -54,24 +59,3 @@ if(input) { error(e); } } - - -if(!input) { - process.stdin.resume(); - process.stdin.setEncoding('utf8'); - - var buffer = ''; - process.stdin.on('data', function(data) { - buffer += data; - }); - - process.stdin.on('end', function() { - try { - var specificity = generateCssData(buffer); - console.log(JSON.stringify(specificity,null, 2)); - - }catch(e) { - error(e); - } - }); -} diff --git a/lib/cli.js b/lib/index.js similarity index 82% rename from lib/cli.js rename to lib/index.js index 3fb40d1..95ec101 100644 --- a/lib/cli.js +++ b/lib/index.js @@ -1,7 +1,12 @@ +/* + * Node module wrapper for specificity-graph + */ + var fs = require('fs'), - path = require('path'); - mkdirp = require('mkdirp'); - colors = require('cli-color'); + path = require('path'), + mkdirp = require('mkdirp'), + colors = require('cli-color'), + generateCssData = require('./generateCssData'); /** * Generates CSS specificity data in JSON format, @@ -12,17 +17,16 @@ var fs = require('fs'), * @param {Function} cb Success callback * @return {void} */ -function main(directory, data, cb) { +module.exports = function(directory, css, cb) { + var directory = directory || './specificity-graph'; fs.mkdir(directory, function (err) { - if(err) { - console.log(colors.yellow('[specificity-graph] The directory already exist')); - } cb = cb || function(){}; - var json = JSON.stringify(data); + + var json = JSON.stringify(generateCssData(css.toString())); writeSpecificityJson(json, directory); addExampleFiles(json, directory); - cb(directory); + cb(directory, err); }); } @@ -70,5 +74,3 @@ function copyFileToDir(file, directory) { .createReadStream(path.join(__dirname, '../' + file)) .pipe(fs.createWriteStream(path.join(directory, file))); } - -module.exports = main; diff --git a/package.json b/package.json index f094abb..a11be58 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "specificity-graph", "description": "Generate an interactive Specificity Graph for your CSS.", - "version": "0.1.1", + "version": "0.1.2", "homepage": "https://github.com/pocketjoso/specificity-graph", "author": { "name": "Jonas Ohlsson", @@ -16,7 +16,7 @@ "url": "https://github.com/pocketjoso/specificity-graph/issues" }, "license": "MIT", - "main": "./bin/specificity-graph", + "main": "./lib/index.js", "bin": { "specificity-graph": "./bin/specificity-graph" },