Merge pull request #87 from kizu/detector

Detection of existent codestyle

Author: mishanga

README.md

@@ -61,6 +61,7 @@ csscomb -h
     -V, --version        output the version number
     -v, --verbose        verbose mode
     -c, --config [path]  configuration file path
+    -d, --detect         detect mode (would return detected options)
     -l, --lint           in case some fixes needed returns an error
 ```
 
@@ -137,6 +138,8 @@ var combedLESS = comb.processString(less, 'less');
 
 ## Configuration
 
+### Through `.csscomb.json`
+
 `csscomb` is configured using [.csscomb.json](https://github.com/csscomb/csscomb.js/blob/master/.csscomb.json) file, located in the project root.
 
 Example configuration:
@@ -162,6 +165,66 @@ Example configuration:
 }
 ```
 
+### Through `.css`-template
+
+Instead of configuring all the options one by one, you can use a CSS-template file instead: CSSComb.js would detect the codestyle used in this file and would use it as a config. All the existent properties except for the `sort-order` could be configured this way.
+
+To provide a template just add `"template"` with the path to the template in the `.csscomb.json`:
+
+```json
+{
+    "template": "example.css"
+}
+```
+
+CSSComb.js would detect only those things that could be detected, so if your template don't provide examples of usage for some of the options, or if you would want to override something from it, you can write them in the `.csscomb.json` along the `"template"`:
+
+```json
+{
+    "template": "example.css",
+    "leading-zero": false,
+    "vendor-prefix-align": true
+}
+```
+
+This config would detect all the options from the `example.css`, then it would use `"leading-zero":  false` instead of what it detected, and then it would use `"vendor-prefix-align": true` even if there were no prefixed properties or values inside the `example.css`.
+
+### Creating `.csscomb.json` from the `.css` file
+
+If you want to configure everything manually, but based on the codestyle from existing `.css`-file, you can at first detect all the options using `--detect` CLI option, and then add/edit any options you like. So if you have such `example.css`:
+
+```css
+.foo
+{
+    width: #fff;
+}
+```
+
+then by running
+
+```bash
+csscomb -d template.css > .csscomb.json
+```
+
+you would generate this `.csscomb.json`:
+
+```json
+{
+    "remove-empty-rulesets": true,
+    "always-semicolon": true,
+    "color-case": "lower",
+    "color-shorthand": true,
+    "strip-spaces": true,
+    "eof-newline": true,
+    "stick-brace": "\n",
+    "colon-space": [
+        "",
+        " "
+    ],
+    "rule-indent": "    "
+}
+```
+
 ## Options
 
 ### exclude
@@ -178,7 +241,7 @@ Available value: `{Boolean}` `true`
 
 Config mode: `{ "verbose": true }`
 ```bash
-./bin/csscomb ./test
+csscomb ./test
 
 ✓ test/integral.origin.css
   test/integral.expect.css
@@ -190,8 +253,22 @@ Config mode: `{ "verbose": true }`
 
 CLI mode:
 ```bash
-./bin/csscomb ./test --verbose
-./bin/csscomb ./test -v
+csscomb --verbose ./test
+csscomb -v ./test
+```
+
+### template
+
+**Note:** see the description of the [configuring through template](#through-css-template).
+
+Available value: `{String}` path to the `.css` file.
+
+Example: `{ "template": "example.css" }`
+
+CLI mode — just provide path to `.css` file instead of `.csscomb.json`:
+```bash
+csscomb --config example.css ./test
+csscomb -c example.css ./test
 ```
 
 ### always-semicolon

lib/cli.js

@@ -14,6 +14,7 @@ program
     .usage('[options] <file ...>')
     .option('-v, --verbose', 'verbose mode')
     .option('-c, --config [path]', 'configuration file path')
+    .option('-d, --detect', 'detect mode (would return detected options)')
     .option('-l, --lint', 'in case some fixes needed returns an error')
     .parse(process.argv);
 
@@ -23,10 +24,34 @@ if (!program.args.length) {
 }
 
 var configPath = program.config || (process.cwd() + '/.csscomb.json');
+var comb = new Comb();
+
+if (program.detect) {
+    console.log(JSON.stringify(comb.detectInFile(program.args[0]), false, 4));
+    process.exit(0);
+}
 
 if (fs.existsSync(configPath)) {
-    var comb = new Comb();
-    var config = require(configPath);
+    var config;
+    if (configPath.match(/\.css$/)) {
+        config = comb.detectInFile(configPath);
+    } else {
+        config = require(configPath);
+    }
+
+    if (config.template) {
+        if (fs.existsSync(config.template)) {
+            var templateConfig = comb.detectInFile(config.template);
+            for (var attrname in templateConfig) {
+                if (!config[attrname]) {
+                    config[attrname] = templateConfig[attrname];
+                }
+            }
+        } else {
+            console.log('Template configuration file ' + config.template + ' was not found.');
+            process.exit(1);
+        }
+    }
 
     console.time('spent');
 

lib/csscomb.js

@@ -1,6 +1,7 @@
 var gonzales = require('gonzales-pe');
 var minimatch = require('minimatch');
 var vow = require('vow');
+var fs = require('fs');
 var vfs = require('vow-fs');
 var doNothing = function() {};
 
@@ -31,6 +32,7 @@ var Comb = function() {
         'vendor-prefix-align'
     ];
     this._exclude = null;
+    this._detect = false;
 };
 
 Comb.prototype = {
@@ -65,14 +67,55 @@ Comb.prototype = {
         this._lint = config.lint;
     },
 
+    /**
+     * Detects the options in the given string
+     *
+     * @param {String} text Stylesheet
+     * @param {Array} options List of options to detect
+     * @returns {Object}
+     */
+    detectInString: function(text, options) {
+        var result;
+        this._detect = true;
+        this._detected = {};
+        this._handlers = [];
+        this._options.forEach(function(option) {
+            try {
+                var handler = require('./options/' + option);
+                if (!handler || options && options.indexOf(option) === -1) return;
+
+                handler._name = option;
+                this._detected[option] = [];
+                this._handlers.push(handler);
+            } catch (e) {
+                console.warn('Error loading "%s" handler: %s', option, e.message);
+            }
+        }, this);
+
+        result = this.processString(text);
+        this._detect = false;
+        return result;
+    },
+
+    /**
+     * Detects the options in the given file
+     *
+     * @param {String} path Path to the stylesheet
+     * @param {Array} options List of options to detect
+     * @returns {Object}
+     */
+    detectInFile: function(path, options) {
+        var stylesheet = fs.readFileSync(path, 'utf8');
+        return this.detectInString(stylesheet, options);
+    },
+
     /**
      * Processes stylesheet tree node.
      *
      * @param {Array} tree Parsed tree
      * @returns {Array}
      */
     processTree: function(tree) {
-
         // We walk across complete tree for each handler,
         // because we need strictly maintain order in which handlers work,
         // despite fact that handlers work on different level of the tree.
@@ -92,7 +135,16 @@ Comb.prototype = {
             if (!Array.isArray(node)) return;
 
             var nodeType = node.shift();
-            handler.process(nodeType, node, level);
+            if (this._detect) {
+                if (handler.detect) {
+                    var detected = handler.detect(nodeType, node, level);
+                    if (detected !== undefined) {
+                        this._detected[handler._name].push(detected);
+                    }
+                }
+            } else {
+                handler.process(nodeType, node, level);
+            }
             node.unshift(nodeType);
 
             if (nodeType === 'atrulers') level++;
@@ -120,7 +172,11 @@ Comb.prototype = {
             throw new Error('Undefined tree at ' + filename + ': ' + string(text) + ' => ' + string(tree));
         }
         tree = this.processTree(tree);
-        return gonzales.astToCSS({ syntax: syntax, ast: tree });
+        if (this._detect) {
+            return this._getDetectedOptions(this._detected);
+        } else {
+            return gonzales.astToCSS({ syntax: syntax, ast: tree });
+        }
     },
 
     /**
@@ -238,6 +294,59 @@ Comb.prototype = {
         }
 
         return this._shouldProcess(path);
+    },
+
+    /**
+     * Gets the detected options.
+     *
+     * @param {Object} detected
+     * @returns {Object}
+     */
+    _getDetectedOptions: function(detected) {
+        var options = {};
+        Object.keys(detected).forEach(function(option) {
+            // List of all the detected variants from the stylesheet for the given option:
+            var values = detected[option];
+            var i;
+            if (values.length) {
+                if (values.length === 1) {
+                    options[option] = values[0];
+                } else {
+                    // If there are more than one value for the option, find the most popular one;
+                    // `variants` would be populated with the popularity for different values.
+                    var variants = {};
+                    var bestGuess = null;
+                    var maximum = 0;
+                    for (i = values.length; i--;) {
+                        var currentValue = values[i];
+                        // Count the current value:
+                        if (variants[currentValue]) {
+                            variants[currentValue]++;
+                        } else {
+                            variants[currentValue] = 1;
+                        }
+                        // If the current variant is the most popular one, treat it as the best guess:
+                        if (variants[currentValue] >= maximum) {
+                            maximum = variants[currentValue];
+                            bestGuess = currentValue;
+                        }
+                    }
+                    if (bestGuess !== null) {
+                        options[option] = bestGuess;
+                    }
+                }
+            } else {
+                // If there are no values for the option, check if there is a default one:
+                for (i = this._handlers.length; i--;) {
+                    if (this._handlers[i]._name === option && this._handlers[i]._detectDefault !== undefined) {
+                        options[option] = this._handlers[i]._detectDefault;
+                        break;
+                    }
+                }
+            }
+        }, this);
+
+        return options;
     }
 };
 

lib/options/always-semicolon.js

@@ -69,5 +69,23 @@ module.exports = {
                 break;
             }
         }
+    },
+
+    /**
+     * Detects the value of an option at the tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    detect: function(nodeType, node) {
+        if (nodeType === 'block') {
+            for (var i = node.length; i--;) {
+                var nodeItem = node[i];
+                var type = nodeItem[0];
+                if (type === 'declDelim') return true;
+
+                if (type === 'declaration') return false;
+            }
+        }
     }
 };

lib/options/block-indent.js

@@ -69,6 +69,32 @@ module.exports = {
                 space[1] += new Array(level + 1).join(this._value);
             }
         }
+    },
+
+    /**
+     * Detects the value of an option at the tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    detect: function(nodeType, node, level) {
+        var result = null;
+        if (nodeType === 'atrulers' || nodeType === 'block') {
+            if (node[node.length - 1][0] === 's' && level > 0) {
+                result = node[node.length - 1][1].replace(/\s*\n/g, '');
+
+                if (this._prev !== undefined && this._prev[0] < level) {
+                    result = result.replace(result.replace(this._prev[1], ''), '');
+                }
+                if (this._prev === undefined || this._prev[0] !== level) {
+                    this._prev = [level, result];
+                }
+            }
+        }
+
+        if (result !== null) {
+            return result;
+        }
     }
 
 };