fixed js renderer

dist/carto.js

@@ -4754,12 +4754,16 @@ var tree = require('../tree');
 
 // monkey patch less classes
 tree.Value.prototype.toJS = function() {
-  var v = this.value[0].value[0];
+  //var v = this.value[0].value[0];
-  val = v.toString();
+  var val = this.eval()
-  if(v.is === "color" || v.is === 'uri') {
+  var v = val.toString();
-    val = "'" + val + "'";
+  if(val.is === "color" || val.is === 'uri') {
+    v = "'" + v + "'";
+  } else if (val.is === 'field') {
+    // replace [varuable] by ctx['variable']
+    v = v.replace(/\[(.*)\]/g, "ctx['\$1']")
   }
-  return "_value = " + val + ";";
+  return "_value = " + v + ";";
 };
 
 Object.defineProperty(tree.Filterset.prototype, 'toJS', {
@@ -4846,7 +4850,8 @@ CartoCSS.renderers['svg'] = {
       if(t) {
         target[t] = src[i];
       } else {
-        console.log("unknow property: " + i);
+        // copy it
+        target[i] = src[i];
       }
     }
     return target;
@@ -4863,6 +4868,7 @@ CartoCSS.renderers['canvas-2d'] = {
     'marker-line-width': 'lineWidth',
     'marker-line-opacity': 'strokeOpacity',
     'marker-fill-opacity': 'fillOpacity',
+    'marker-opacity': 'fillOpacity',
     'marker-fill': 'fillStyle',
     'marker-file': function(attr) {
       var img = new Image();
@@ -4897,7 +4903,8 @@ CartoCSS.renderers['canvas-2d'] = {
           target[t] = src[i];
         }
       } else {
-        console.log("unknow property: " + i);
+        // copy it
+        target[i] = src[i];
       }
     }
     return target;
@@ -4917,10 +4924,19 @@ for(var ss in to_load) {
 
 CartoCSS.Layer.prototype = {
 
-  name: function() {
+  fullName: function() {
     return this.shader.attachment;
   },
 
+  name: function() {
+    return this.fullName().split('::')[0];
+  },
+
+  attachment: function() {
+    return this.fullName().split('::')[1];
+  },
+
+
   /*
    * `target`: style, 'svg', 'canvas-2d'...
    * `props`: feature properties
@@ -4982,6 +4998,23 @@ CartoCSS.prototype = {
     return this.layers;
   },
 
+  getDefault: function() {
+    return this.findLayer({ attachment: '__default__' });
+  },
+
+  findLayer: function(where) {
+    return _.find(this.layers, function(value) {
+      for (var key in where) {
+        var v = value[key];
+        if (typeof(v) === 'function') {
+          v = v.call(value);
+        }
+        if (where[key] !== v) return false;
+      }
+      return true;
+    });
+  },
+
   _createFn: function(ops) {
     var body = ops.join('\n');
     console.log(body);

lib/carto/renderer_js.js

@@ -3,12 +3,16 @@ var tree = require('../tree');
 
 // monkey patch less classes
 tree.Value.prototype.toJS = function() {
-  var v = this.value[0].value[0];
+  //var v = this.value[0].value[0];
-  val = v.toString();
+  var val = this.eval()
-  if(v.is === "color" || v.is === 'uri') {
+  var v = val.toString();
-    val = "'" + val + "'";
+  if(val.is === "color" || val.is === 'uri') {
+    v = "'" + v + "'";
+  } else if (val.is === 'field') {
+    // replace [varuable] by ctx['variable']
+    v = v.replace(/\[(.*)\]/g, "ctx['\$1']")
   }
-  return "_value = " + val + ";";
+  return "_value = " + v + ";";
 };
 
 Object.defineProperty(tree.Filterset.prototype, 'toJS', {
@@ -95,7 +99,8 @@ CartoCSS.renderers['svg'] = {
       if(t) {
         target[t] = src[i];
       } else {
-        console.log("unknow property: " + i);
+        // copy it
+        target[i] = src[i];
       }
     }
     return target;
@@ -112,6 +117,7 @@ CartoCSS.renderers['canvas-2d'] = {
     'marker-line-width': 'lineWidth',
     'marker-line-opacity': 'strokeOpacity',
     'marker-fill-opacity': 'fillOpacity',
+    'marker-opacity': 'fillOpacity',
     'marker-fill': 'fillStyle',
     'marker-file': function(attr) {
       var img = new Image();
@@ -146,7 +152,8 @@ CartoCSS.renderers['canvas-2d'] = {
           target[t] = src[i];
         }
       } else {
-        console.log("unknow property: " + i);
+        // copy it
+        target[i] = src[i];
       }
     }
     return target;
@@ -166,10 +173,19 @@ for(var ss in to_load) {
 
 CartoCSS.Layer.prototype = {
 
-  name: function() {
+  fullName: function() {
     return this.shader.attachment;
   },
 
+  name: function() {
+    return this.fullName().split('::')[0];
+  },
+
+  attachment: function() {
+    return this.fullName().split('::')[1];
+  },
+
+
   /*
    * `target`: style, 'svg', 'canvas-2d'...
    * `props`: feature properties
@@ -231,6 +247,23 @@ CartoCSS.prototype = {
     return this.layers;
   },
 
+  getDefault: function() {
+    return this.findLayer({ attachment: '__default__' });
+  },
+
+  findLayer: function(where) {
+    return _.find(this.layers, function(value) {
+      for (var key in where) {
+        var v = value[key];
+        if (typeof(v) === 'function') {
+          v = v.call(value);
+        }
+        if (where[key] !== v) return false;
+      }
+      return true;
+    });
+  },
+
   _createFn: function(ops) {
     var body = ops.join('\n');
     console.log(body);