Working push. Still needs agg-gradient

lib/carto/tree/definition.js

@@ -90,6 +90,11 @@ tree.Definition.prototype.symbolizersToXML = function(env, symbolizers, zoom) {
     for (var i = 0; i < sym_order.length; i++) {
         var attributes = symbolizers[sym_order[i]];
         var symbolizer = sym_order[i].split('/').pop();
+        
+        // Skip the magical * symbolizer which is used for universal properties
+        // which are bubbled up to Style elements intead of Symbolizer elements.
+        if (symbolizer === '*') continue;
+
         var fail = tree.Reference.requiredProperties(symbolizer, attributes);
         if (fail) {
             var rule = attributes[Object.keys(attributes).shift()];

lib/carto/tree/imagefilter.js

@@ -2,14 +2,20 @@
 //
 // RGB Colors - #ff0014, #eee
 //
-tree.ImageFilter = function ImageFilter(type, args) {
+tree.ImageFilter = function ImageFilter(filter, args) {
     this.is = 'imagefilter';
+    this.filter = filter;
+    this.args = args || null;
 };
 tree.ImageFilter.prototype = {
     eval: function() { return this; },
 
     toString: function() {
-        
+        if (this.args) {
+            // TODO
+        } else {
+            return this.filter;
+        }
     }
 };
 

lib/carto/tree/reference.js

@@ -91,7 +91,7 @@ tree.Reference._validateValue = {
 
 tree.Reference.isFont = function(selector) {
     return tree.Reference.selector(selector).validate == 'font';
-}
+};
 
 tree.Reference.validValue = function(env, selector, value) {
     var i, j;
@@ -126,7 +126,7 @@ tree.Reference.validValue = function(env, selector, value) {
         } else {
             if (tree.Reference.selector(selector).validate) {
                 var valid = false;
-                for (var i = 0; i < value.value.length; i++) {
+                for (i = 0; i < value.value.length; i++) {
                     if (tree.Reference.selector(selector).type == value.value[i].is &&
                         tree.Reference
                             ._validateValue
@@ -141,6 +141,6 @@ tree.Reference.validValue = function(env, selector, value) {
             }
         }
     }
-}
+};
 
 })(require('../tree'));

lib/carto/tree/style.js

@@ -1,4 +1,5 @@
 (function(tree) {
+var _ = require('underscore');
 
 tree.Style = function Style(name, attachment, definitions) {
     this.attachment = attachment;
@@ -9,11 +10,25 @@ tree.Style = function Style(name, attachment, definitions) {
 tree.Style.prototype.toXML = function(env) {
     var existing = {};
     // TODO :add filters and comp op
+    var image_filters = _.flatten(this.definitions.map(function(definition) {
+        return definition.rules.filter(function(rule) {
+            return (rule.name === 'image-filters');
+        });
+    }));
+
     var rules = this.definitions.map(function(definition) {
         return definition.toXML(env, existing);
     });
 
-    return '<Style name="' + this.name + '" filter-mode="first">\n' + rules.join('') + '</Style>';
+    var image_filters_xml = '';
+
+    if (image_filters.length) {
+        image_filters_xml = 'image-filters="' + image_filters.map(function(f) {
+            return f.value.eval(env).toString(env, null, ';');
+        }).join(',') + '"';
+    }
+
+    return '<Style name="' + this.name + '" filter-mode="first" ' + image_filters_xml + '>\n' + rules.join('') + '</Style>';
 };
 
 })(require('../tree'));

lib/carto/tree/value.js

@@ -14,10 +14,10 @@ tree.Value.prototype = {
             }));
         }
     },
-    toString: function(env, selector) {
+    toString: function(env, selector, sep) {
         return this.value.map(function(e) {
             return e.toString(env);
-        }).join(', ');
+        }).join(sep || ', ');
     },
     clone: function() {
         var obj = Object.create(tree.Value.prototype);

test/rendering/image_filters.mss

@@ -2,5 +2,6 @@
   polygon-fill: #FFF;
   line-color:#F00;
   line-width: 0.5;
-  image-filters: blur() sharpen();
+  image-filters: blur(), sharpen();
+  line-dasharray: 2, 3;
 }