Merge pull request #43 from t32k/develop

Released v3.0.0

README.md

@@ -26,21 +26,19 @@ StyleStats!
 ┌─────────────────────────────────┬────────────────┐
 │ Stylesheets                     │ 1              │
 ├─────────────────────────────────┼────────────────┤
-│ Size                            │ 753B           │
+│ Size                            │ 240B           │
 ├─────────────────────────────────┼────────────────┤
-│ Data Uri Size                   │ 82B            │
-├─────────────────────────────────┼────────────────┤
-│ Ratio Of Data Uri Size          │ 10.89%         │
+│ Data Uri Size                   │ 0              │
 ├─────────────────────────────────┼────────────────┤
 │ Rules                           │ 7              │
 ├─────────────────────────────────┼────────────────┤
 │ Selectors                       │ 12             │
 ├─────────────────────────────────┼────────────────┤
 │ Simplicity                      │ 58.33%         │
 ├─────────────────────────────────┼────────────────┤
-│ Most Identifers                 │ 3              │
+│ Most Identifier                 │ 3              │
 ├─────────────────────────────────┼────────────────┤
-│ Most Identifers Selector        │ .foo .bar .baz │
+│ Most Identifier Selector        │ .foo .bar .baz │
 ├─────────────────────────────────┼────────────────┤
 │ Lowest Cohesion                 │ 2              │
 ├─────────────────────────────────┼────────────────┤
@@ -69,12 +67,12 @@ StyleStats!
 ├─────────────────────────────────┼────────────────┤
 │ Float Properties                │ 1              │
 ├─────────────────────────────────┼────────────────┤
-│ Media Queries                   │ 0              │
-├─────────────────────────────────┼────────────────┤
 │ Properties Count                │ color: 4       │
 │                                 │ font-size: 3   │
 │                                 │ margin: 2      │
 │                                 │ float: 1       │
+├─────────────────────────────────┼────────────────┤
+│ Media Queries                   │ 0              │
 └─────────────────────────────────┴────────────────┘
 ```
 
@@ -84,39 +82,39 @@ StyleStats supports parsing stylesheets and `style` elements in HTML page.
 $ stylestats http://t32k.me/
 ```
 
-StyleStats supports remote file analysis.
+Supports remote file analysis.
 
 ```sh
 $ stylestats http://t32k.me/static/blog/skelton.css
 ```
 
-StyleStats supports multiple input.
+Supports multiple input.
 
 ```sh
 $ stylestats foo.css bar.css baz.css
 ```
-supports directory input.
+Supports directory input.
 
 ```sh
 $ stylestats path/to/dir
 ```
 
-supports glob(required quotations) input.
+Supports glob(required quotations) input.
 
 ```sh
 $ stylestats 'path/**/*.css'
 ```
 
-`-e` option output JSON or CSV or HTML.
+`-t` option output JSON or CSV or HTML.
 
 ```sh
-$ stylestats foo.css -e [json|csv|html]
+$ stylestats foo.css -t [json|csv|html]
 ```
 
 If you installed __[gist](https://github.com/defunkt/gist)__ tool, you can upload StyleStats data to [GitHub Gist](https://gist.github.com/9725673) with one-liner command.
 
 ```sh
-$ stylestats http://t32k.me/static/blog/skelton.css -e html > stats.md && gist stats.md
+$ stylestats http://t32k.me/ -t html > stats.md && gist stats.md
 https://gist.github.com/9725673
 ```
 
@@ -220,11 +218,11 @@ $ stylestats -h
 
   Options:
 
-    -h, --help                output usage information
-    -V, --version             output the version number
-    -c, --config [path]       Path and name of the incoming JSON file.
-    -e, --extension [format]  Specify the format to convert. <json|csv>
-    -s, --simple              Show compact style's log.
+    -h, --help           output usage information
+    -V, --version        output the version number
+    -c, --config [path]  Path and name of the incoming JSON file.
+    -t, --type [format]  Specify the output format. <json|html|csv>
+    -s, --simple         Show compact style's log.
 ```
 
 ```shell
@@ -319,7 +317,7 @@ _(Coming soon)_
 
 ## Release History
 
-+ v3.0.0: __API is changed:__ `StyleStats.parse()`. Support parse HTML page.
++ v3.0.0: __API is changed:__ CLI option. Support parse HTML page.
 + v2.3.0: Support HTML output CLI option.
 + v2.2.0: Add `dataUriSize`, `ratioOfDataUriSize` metics.
 + v2.1.0: Add `javascriptSpecificSelectors` metics, and fix counting properties in mediaQueries.

lib/cli.js → bin/cli.js

@@ -2,7 +2,6 @@
 
 'use strict';
 
-var fs = require('fs');
 var path = require('path');
 var jade = require('jade');
 var Table = require('cli-table');
@@ -15,12 +14,14 @@ _.str = require('underscore.string');
 _.mixin(_.str.exports());
 _.str.include('Underscore.string', 'string');
 
+var StyleStats = require('../lib/stylestats');
+
 /**
- * Method of return prettified StyleStats data.
+ * Prettify StyleStats data.
  * @param {object} [result] StyleStats parse data. Required.
  * @return {array} prettified data.
  */
-var prettifyData = function(result) {
+function prettify(result) {
     var collections = [];
     Object.keys(result).forEach(function(key) {
         var stats = {};
@@ -46,15 +47,13 @@ var prettifyData = function(result) {
         collections.push(stats);
     });
     return collections;
-};
-
-var StyleStats = require('./stylestats');
+}
 
 program
     .version(require('../package.json').version)
     .usage('[options] <file ...>')
     .option('-c, --config [path]', 'Path and name of the incoming JSON file.')
-    .option('-e, --extension [format]', 'Specify the format to convert. <json|html|csv>')
+    .option('-t, --type [format]', 'Specify the output format. <json|html|csv>')
     .option('-s, --simple', 'Show compact style\'s log.')
     .parse(process.argv);
 
@@ -65,7 +64,7 @@ if (!program.args.length) {
 
 var stats = new StyleStats(program.args, program.config);
 stats.parse(function(result) {
-    switch (program.extension) {
+    switch (program.type) {
         case 'json':
             var json = JSON.stringify(result, null, 2);
             console.log(json);
@@ -79,13 +78,10 @@ stats.parse(function(result) {
             });
             break;
         case 'html':
-            var realPath = path.dirname(__filename) + '/jade/stats.jade';
-            var htmlData = prettifyData(result);
-            var template = jade.compile(fs.readFileSync(realPath, 'utf8'), {
-                pretty: true
-            });
-            var html = template({
-                stats: htmlData,
+            var template = path.join(__dirname, '../assets/stats.jade');
+            var html = jade.renderFile(template, {
+                pretty: true,
+                stats: prettify(result),
                 published: result.published,
                 paths: result.paths
             });
@@ -98,7 +94,7 @@ stats.parse(function(result) {
                     compact: program.simple
                 }
             });
-            prettifyData(result).forEach(function(data) {
+            prettify(result).forEach(function(data) {
                 table.push(data);
             });
             console.log(' StyleStats!\n' + table.toString());

lib/analyzer.js

@@ -24,13 +24,13 @@ function Analyzer(rules, selectors, declarations, cssString, cssSize, options) {
     // array of css declaration
     // referenced in analyzeDeclarations
     this.declarations = declarations;
-    
+
     // all of css string
     this.cssString = cssString;
-    
+
     // size of css
     this.cssSize = cssSize;
-    
+
     // result options
     this.options = options;
 }
@@ -41,7 +41,7 @@ function Analyzer(rules, selectors, declarations, cssString, cssSize, options) {
  *   {Array} cssDeclarations
  * }
  */
-Analyzer.prototype.analyzeRules = function () {
+Analyzer.prototype.analyzeRules = function() {
 
     // object to return
     var result = {
@@ -76,7 +76,7 @@ Analyzer.prototype.analyzeRules = function () {
  *   {Array} identifiers
  * }
  */
-Analyzer.prototype.analyzeSelectors = function () {
+Analyzer.prototype.analyzeSelectors = function() {
 
     // object to return
     var result = {
@@ -142,7 +142,7 @@ Analyzer.prototype.analyzeSelectors = function () {
  *   {Object} properties
  * }
  */
-Analyzer.prototype.analyzeDeclarations = function () {
+Analyzer.prototype.analyzeDeclarations = function() {
 
     // object to return
     var result = {
@@ -211,7 +211,7 @@ Analyzer.prototype.analyzeDeclarations = function () {
             count: result.properties[key]
         });
     });
-    
+
     // sort by property count
     result.properties = propertiesCount.sort(function decreasingOrder(a, b) {
         return b.count - a.count;
@@ -230,7 +230,7 @@ Analyzer.prototype.analyzeDeclarations = function () {
  *   {Number} gzippedSize,
  *   {Number} rules,
  *   {Number} selectors,
- *   {Float} simplicity,
+ *   {Float}  simplicity,
  *   {Number} mostIdentifier,
  *   {String} mostIdentifierSelector,
  *   {Number} lowestCohesion,
@@ -248,7 +248,7 @@ Analyzer.prototype.analyzeDeclarations = function () {
  *   {Number} propertiesCount
  * }
  */
-Analyzer.prototype.analyze = function () {
+Analyzer.prototype.analyze = function() {
 
     // get analytics
     var ruleAnalysis = this.analyzeRules();

lib/parser.js

@@ -30,24 +30,14 @@ function requestSync(url) {
  * @param {Array} urls
  * @param {Array} files
  * @param {Array} styles
- * @param {Array} htmls
  * @constructor
  */
-function Parser(urls, files, styles, htmls) {
+function Parser(urls, files, styles) {
     this.urls = urls;
     this.files = files;
     this.styles = styles;
-    this.htmls = htmls;
 }
 
-/**
- * Add css string
- * @param {String} style
- */
-Parser.prototype.addString = function(style) {
-    this.styles.push(style);
-};
-
 /**
  * Parse css data
  * @param {Function} callback
@@ -85,31 +75,47 @@ Parser.prototype.parse = function(callback) {
 
     // get remote files
     Promise.all(requestPromises).then(function onFulfilled(responses) {
-        var secondPromises = [];
+
+        // requests to stylesheet defined in html
+        var requestPromisesInner = [];
 
         // push remote css data
         responses.forEach(function(response) {
-            if (response.headers['content-type'].indexOf('html') > -1) {
+
+            // response content type
+            var contentType = response.headers['content-type'];
+
+            if (contentType.indexOf('html') > -1) {
+
+                // parse response body
                 var $ = cheerio.load(response.body);
-                result.cssFiles += $('link').length;
-                $('link[rel=stylesheet]').each(function() {
+                var $link = $('link[rel=stylesheet]');
+                var $style = $('style');
+
+                // add css file count
+                result.cssFiles += $link.length;
+                result.styleElements += $style.length;
+
+                // request link[href]
+                $link.each(function() {
                     var relPath = $(this).attr('href');
                     var absPath = url.resolve(response.request.href, relPath);
-                    secondPromises.push(requestSync(absPath));
+                    requestPromisesInner.push(requestSync(absPath));
                 });
-                result.styleElements += $('style').length;
-                $('style').each(function() {
+
+                // add text in style tags
+                $style.each(function() {
                     that.styles.push($(this).text());
                 });
-            } else if (response.headers['content-type'].indexOf('css') > -1) {
+            } else if (contentType.indexOf('css') > -1) {
                 that.styles.push(response.body);
             } else {
                 throw new Error('Content type is not HTML or CSS!');
             }
         });
 
-        if (secondPromises.length > 0) {
-            return Promise.all(secondPromises);
+        if (requestPromisesInner.length > 0) {
+            return Promise.all(requestPromisesInner);
         } else {
             return true;
         }

lib/stylestats.js

@@ -59,7 +59,7 @@ function StyleStats(args, config) {
         }
     });
 
-    var defaultOptions = require('./default.json');
+    var defaultOptions = require('../assets/default.json');
     var customOptions = {};
     if (config && util.isFile(config)) {
         var configString = fs.readFileSync(config, {

package.json

@@ -3,7 +3,7 @@
     "version": "3.0.0",
     "main": "lib/stylestats.js",
     "bin": {
-        "stylestats": "./bin/stylestats"
+        "stylestats": "./bin/cli.js"
     },
     "description": "StyleStats is Node.js library to collect CSS statistics!",
     "homepage": "https://github.com/t32k/stylestats",
@@ -37,7 +37,8 @@
     },
     "files": [
         "lib",
-        "bin"
+        "bin",
+        "assets"
     ],
     "dependencies": {
         "jade": "~1.3.0",
@@ -55,7 +56,7 @@
         "underscore.string": "~2.3.3"
     },
     "devDependencies": {
-        "mocha": "~1.17.1",
+        "mocha": "~1.18.2",
         "testem": "~0.6.8",
         "istanbul": "~0.2.6",
         "coveralls": "~2.10.0",