add nesting. Closes reworkcss#2

Author: tj

examples/benchmark.css

@@ -0,0 +1,19 @@
+
+body
+  background: #888
+  color: #eee
+
+ul
+  margin: 0
+  li
+    color: white
+    a
+      color: blue
+
+@media print
+  body
+    width: 100px
+    ul
+      width: 50px
+      li
+        list-style: disc

examples/nesting.css

@@ -0,0 +1,12 @@
+
+/**
+ * Module dependencies.
+ */
+
+var fs = require('fs')
+  , compile = require('..')
+  , read = fs.readFileSync
+
+var str = read('examples/nesting.css', 'utf8');
+var css = compile(str);
+console.log(css);

examples/nesting.js

@@ -16,6 +16,10 @@ var debug = require('debug')('css-whitespace:parser')
 
 module.exports = function(node){
   var indents = 1;
+  var rules = [];
+  var stash = [];
+  var level = 0;
+  var nest = 0;
 
   if (debug.enabled) {
     console.log(util.inspect(node, false, 12, true));
@@ -32,9 +36,15 @@ module.exports = function(node){
       case 'root':
         return root(node);
       case 'rule':
-        return rule(node);
+        if ('@' == node[1][0]) ++nest;
+        var ret = rule(node);
+        if ('@' == node[1][0]) --nest;
+        return ret;
       case 'block':
-        return block(node);
+        ++level;
+        var ret = block(node);
+        --level;
+        return ret;
       case 'prop':
         return prop(node);
       default:
@@ -47,11 +57,14 @@ module.exports = function(node){
    */
 
   function block(node) {
+    var buf = [];
     var nodes = node[1];
-    ++indents;
-    var ret = nodes.map(visit).join('\n');
-    --indents;
-    return ret;
+    
+    for (var i = 0; i < nodes.length; ++i) {
+      buf.push(visit(nodes[i]));
+    }
+
+    return buf.join('');
   }
 
   /**
@@ -61,7 +74,7 @@ module.exports = function(node){
   function prop(node) {
     var prop = node[1];
     var val = node[2];
-    return indent() + prop + ': ' + val + ';';
+    return indent() + prop + ': ' + val + ';\n';
   }
 
   /**
@@ -74,10 +87,34 @@ module.exports = function(node){
 
     if (!block) return rule + ';';
 
-    return indent() + rule + ' {\n'
-      + visit(block)
-      + '\n'
-      + indent() + '}';
+    rules.push(node);
+
+    if ('@' == rule[0]) {
+      var buf = join(rules) + '{\n'
+      visit(block);
+      buf += stash.join('\n');
+      buf += '\n}';
+      stash = [];
+    } else if (nest) {
+      indents = 2;
+      var buf = '  ' + join(rules, 1) + '{\n';
+      buf += visit(block);
+      buf += '  }';
+      indents = 1;
+    } else {
+      var buf = join(rules) + '{\n'
+        + visit(block)
+        + '}';
+    }
+
+    if (rules.length > 1) {
+      if (hasProperties(block)) stash.push(buf);
+      buf = '';
+    }
+    
+    rules.pop();
+  
+    return buf;
   }
 
   /**
@@ -86,17 +123,72 @@ module.exports = function(node){
 
   function root(node) {
     var buf = [];
-    for (var i=0; i < node[1].length; ++i) {
+    for (var i = 0; i < node[1].length; ++i) {
       buf.push(visit(node[1][i]));
+      if (stash.length) {
+        buf = buf.concat(stash);
+        stash = [];
+      }
     }
     return buf.join('\n\n');
   }
 
   /**
-   * Return current indent.
+   * Return indent.
    */
 
   function indent() {
-    return Array(indents).join('  ');
+    return Array(indents + 1).join('  ');
+  }
+};
+
+/**
+ * Join the given rules.
+ *
+ * @param {Array} rules
+ * @param {Number} [offset]
+ * @return {String}
+ * @api private
+ */
+
+function join(rules, offset) {
+  var buf = '';
+  var curr;
+  var next;
+
+  for (var i = offset || 0; i < rules.length; ++i) {
+    curr = rules[i];
+    next = rules[i + 1];
+    buf += curr[1];
+    if (next && next.parent) continue;
+    buf += ' ';
   }
-};
+
+  return buf;
+}
+
+/**
+ * Check if `block` has properties.
+ *
+ * @param {Array} block
+ * @return {Boolean}
+ * @api private
+ */
+
+function hasProperties(block) {
+  var nodes = block[1];
+  for (var i = 0; i < nodes.length; ++i) {
+    if ('prop' == nodes[i][0]) return true;
+  }
+  return false;
+}
+
+/**
+ * Blank string filter.
+ *
+ * @api private
+ */
+
+function blank(str) {
+  return '' != str;
+}

lib/compiler.js

@@ -46,6 +46,7 @@ module.exports = function(str) {
       || blank()
       || comment()
       || indentation()
+      || parent()
       || prop()
       || rule();
   }
@@ -123,6 +124,19 @@ module.exports = function(str) {
     return stashed();
   }
 
+  /**
+   * &<val>
+   */
+  
+  function parent() {
+    var m = str.match(/^ *&([^\n]*)/);
+    if (!m) return;
+    str = str.slice(m[0].length);
+    var ret = ['rule', m[1]];
+    ret.parent = true;
+    return ret;
+  }
+
   /**
    * <prop>: <val>
    */

lib/lexer.js

@@ -0,0 +1,12 @@
+
+body
+  padding: 50px
+
+@media print
+  body
+    padding: 0
+  
+  ul
+    li a
+      color: blue
+      text-decoration: underline

test/cases/media.css

@@ -0,0 +1,13 @@
+body {
+  padding: 50px;
+}
+
+@media print {
+  body {
+    padding: 0;
+  }
+  ul li a {
+    color: blue;
+    text-decoration: underline;
+  }
+}

test/cases/media.out.css

@@ -0,0 +1,16 @@
+body {
+  padding: 50px;
+}
+
+body ul li a {
+  color: blue;
+}
+
+body ul li {
+  list-style: none;
+}
+
+body ul {
+  margin: 0;
+  padding: 0;
+}

test/cases/nesting.out.css

@@ -0,0 +1,14 @@
+ul {
+}
+
+ul li:hover {
+  background: white;
+}
+
+ul li:active {
+  background: #ddd;
+}
+
+ul li {
+  background: #eee;
+}