linear fades

9 files changed, 120 insertions, 85 deletions

diff --git a/bin/convert-style.js b/bin/convert-style.js
index be38458eab..74501ad8e3 100755
--- a/bin/convert-style.js
+++ b/bin/convert-style.js
@@ -19,19 +19,23 @@ var bucket_type = {
 // enum
 var cap_type = {
     round: 1,
+    butt: 2,
+    square: 3
 };
 
 // enum
 var join_type = {
     butt: 1,
-    bevel: 2
+    bevel: 2,
+    round: 3
 };
 
 // enum
 var property_type = {
     'null': 1,
     constant: 2,
-    stops: 3
+    stops: 3,
+    linear: 4
 };
 
 
@@ -90,34 +94,31 @@ function createStructure(structure) {
     return pbf;
 }
 
-// function createWidth(width) {
-//     var pbf = new Protobuf();
-//     var values = [];
-//     if (Array.isArray(width)) {
-//         pbf.writeTaggedString(1 /* scaling */, width[0]);
-//         for (var i = 1; i < width.length; i++) {
-//             if (width[0] === 'stops') {
-//                 values.push(width[i].z, width[i].val);
-//             } else {
-//                 values.push(width[i]);
-//             }
-//         }
-//     } else {
-//         values.push(width);
-//     }
-//     pbf.writePackedFloats(2 /* value */, values);
-
-//     return pbf;
-// }
-
 function createProperty(type, values) {
     var pbf = new Protobuf();
     pbf.writeTaggedVarint(1 /* function */, property_type[type]);
-    pbf.writePackedFloats(2 /* value */, values.map(function(value) { return +value; }));
+    pbf.writePackedFloats(2 /* value */, values.map(function(v) { return +v; }));
 
     return pbf;
 }
 
+function convertProperty(orig_values) {
+    if (Array.isArray(orig_values)) {
+        var type = orig_values[0];
+        var values = [];
+        for (var i = 1; i < orig_values.length; i++) {
+            if (orig_values[0] === 'stops') {
+                values.push(orig_values[i].z, orig_values[i].val);
+            } else {
+                values.push(orig_values[i]);
+            }
+        }
+        return createProperty(type, values);
+    } else {
+        return createProperty('constant', [orig_values]);
+    }
+}
+
 function createFillClass(layer, name) {
     var pbf = new Protobuf();
     pbf.writeTaggedString(1 /* layer_name */, name);
@@ -136,9 +137,7 @@ function createFillClass(layer, name) {
     }
 
     if ('opacity' in layer) {
-        if (typeof layer.opacity == 'number') {
-            pbf.writeMessage(7 /* opacity */, createProperty('constant', [layer.opacity]));
-        }
+        pbf.writeMessage(7 /* opacity */, convertProperty(layer.opacity));
     }
 
     return pbf;
@@ -158,23 +157,11 @@ function createLineClass(layer, name) {
     }
 
     if ('width' in layer) {
-        var values = [];
-        var width = layer.width;
-        var type = 'constant';
-        if (Array.isArray(width)) {
-            type = width[0];
-            for (var i = 1; i < width.length; i++) {
-                if (width[0] === 'stops') {
-                    values.push(width[i].z, width[i].val);
-                } else {
-                    values.push(width[i]);
-                }
-            }
-        } else {
-            values.push(width);
-        }
+        pbf.writeMessage(4 /* width */, convertProperty(layer.width));
+    }
 
-        pbf.writeMessage(4 /* width */, createProperty(type, values));
+    if ('opacity' in layer) {
+        pbf.writeMessage(6 /* opacity */, convertProperty(layer.opacity));
     }
 
     return pbf;
diff --git a/bin/style.js b/bin/style.js
index 8dabe0bced..26b7bc6544 100644
--- a/bin/style.js
+++ b/bin/style.js
@@ -65,6 +65,7 @@ module.exports = {
         { "name": "park", "bucket": "park" },
         { "name": "wood", "bucket": "wood" },
         { "name": "water", "bucket": "water" },
+        { "name": "building", "bucket": "building" },
         { "name": "road_limited", "bucket": "road_limited" },
         { "name": "road_regular", "bucket": "road_regular" },
         { "name": "road_large", "bucket": "road_large" },
@@ -94,6 +95,12 @@ module.exports = {
                     "color": "#73b6e6",
                     "antialias": true
                 },
+                "building": {
+                    "type": "fill",
+                    "color": "#000000",
+                    "antialias": true,
+                    "opacity": [ "linear", 13, 0, 0.1, 0, 0.1 ]
+                },
                 "road_limited": {
                     "type": "line",
                     "color": "#BBBBBB",
diff --git a/include/llmr/style/properties.hpp b/include/llmr/style/properties.hpp
index 9a9fc67ca3..f0e3cf5079 100644
--- a/include/llmr/style/properties.hpp
+++ b/include/llmr/style/properties.hpp
@@ -25,7 +25,8 @@ enum class Winding {
 enum class Property {
     Null = 1,
     Constant = 2,
-    Stops = 3
+    Stops = 3,
+    Linear = 4
 };
 
 namespace functions {
@@ -39,6 +40,9 @@ bool constant(float z, const std::vector<bool>& values);
 float stops(float z, const std::vector<float>& values);
 bool stops(float z, const std::vector<bool>& values);
 
+float linear(float z, const std::vector<float>& values);
+bool linear(float z, const std::vector<bool>& values);
+
 }
 
 
diff --git a/proto/style.proto b/proto/style.proto
index b2b103e6da..281749c903 100644
--- a/proto/style.proto
+++ b/proto/style.proto
@@ -7,15 +7,15 @@ enum bucket_type {
 }
 
 enum cap_type {
-    round = 1;
-    butt = 2;
-    square = 3;
+    round_cap = 1;
+    butt_cap = 2;
+    square_cap = 3;
 }
 
 enum join_type {
-    butt = 1;
-    bevel = 2;
-    round = 3;
+    butt_join = 1;
+    bevel_join = 2;
+    round_join = 3;
 }
 
 enum winding_type {
@@ -27,6 +27,7 @@ enum property_type {
     null = 1;
     constant = 2;
     stops = 3;
+    linear = 4;
 }
 
 message value {
@@ -87,6 +88,7 @@ message stroke_style {
     optional fixed32 color = 3 [ default = 0x000000FF ]; // rgba (=> rgb << 8 | 0xFF for opaque!)
     optional property width = 4;
     optional property offset = 5;
+    optional property opacity = 6; // values from 0..1
     // line join + line cap are already defined in the
     // TODO: dasharray
     // TODO: image/icon
diff --git a/resources/style.pbf b/resources/style.pbf
index 30f9007e0a..2157505641 100644
--- a/resources/style.pbf
+++ b/resources/style.pbf
diff --git a/src/renderer/painter.cpp b/src/renderer/painter.cpp
index 68eca999ae..f3e265c69b 100644
--- a/src/renderer/painter.cpp
+++ b/src/renderer/painter.cpp
@@ -349,6 +349,12 @@ void Painter::renderLine(LineBucket& bucket, const std::string& layer_name) {
     double inset = fmax(-1, offset - width / 2 - 0.5) + 1;
     double outset = offset + width / 2 + 0.5;
 
+    Color color = properties.color;
+    color[0] *= properties.opacity;
+    color[1] *= properties.opacity;
+    color[2] *= properties.opacity;
+    color[3] *= properties.opacity;
+
     // var imagePos = properties.image && imageSprite.getPosition(properties.image);
     // var shader;
     bool imagePos = false;
@@ -387,7 +393,7 @@ void Painter::renderLine(LineBucket& bucket, const std::string& layer_name) {
     //     color[3] = Infinity;
     //     glUniform4fv(lineShader->u_color, color);
     // } else {
-    glUniform4fv(lineShader->u_color, 1, properties.color.data());
+    glUniform4fv(lineShader->u_color, 1, color.data());
     // }
 
 
diff --git a/src/resources/style.cpp b/src/resources/style.cpp
index b59643f8cf..8bd1ca1297 100644
--- a/src/resources/style.cpp
+++ b/src/resources/style.cpp
@@ -39,30 +39,35 @@ const unsigned char resources::style[] = {
     116, 121, 112, 101, 50, 9, 10, 7, 65, 108, 99, 111, 104, 111, 108, 18,
     12, 10, 4, 112, 97, 114, 107, 18, 4, 112, 97, 114, 107, 18, 12, 10,
     4, 119, 111, 111, 100, 18, 4, 119, 111, 111, 100, 18, 14, 10, 5, 119,
-    97, 116, 101, 114, 18, 5, 119, 97, 116, 101, 114, 18, 28, 10, 12, 114,
-    111, 97, 100, 95, 108, 105, 109, 105, 116, 101, 100, 18, 12, 114, 111, 97,
-    100, 95, 108, 105, 109, 105, 116, 101, 100, 18, 28, 10, 12, 114, 111, 97,
-    100, 95, 114, 101, 103, 117, 108, 97, 114, 18, 12, 114, 111, 97, 100, 95,
-    114, 101, 103, 117, 108, 97, 114, 18, 24, 10, 10, 114, 111, 97, 100, 95,
-    108, 97, 114, 103, 101, 18, 10, 114, 111, 97, 100, 95, 108, 97, 114, 103,
-    101, 18, 18, 10, 7, 97, 108, 99, 111, 104, 111, 108, 18, 7, 97, 108,
-    99, 111, 104, 111, 108, 26, 144, 2, 10, 7, 100, 101, 102, 97, 117, 108,
-    116, 18, 21, 10, 4, 112, 97, 114, 107, 34, 8, 8, 2, 18, 4, 0,
-    0, 128, 63, 45, 255, 159, 223, 200, 18, 31, 10, 4, 119, 111, 111, 100,
-    34, 8, 8, 2, 18, 4, 0, 0, 128, 63, 45, 255, 102, 170, 51, 58,
-    8, 8, 2, 18, 4, 205, 204, 204, 61, 18, 22, 10, 5, 119, 97, 116,
-    101, 114, 34, 8, 8, 2, 18, 4, 0, 0, 128, 63, 45, 255, 230, 182,
-    115, 26, 41, 10, 12, 114, 111, 97, 100, 95, 108, 105, 109, 105, 116, 101,
-    100, 29, 255, 187, 187, 187, 34, 20, 8, 3, 18, 16, 0, 0, 0, 0,
-    0, 0, 128, 63, 0, 0, 240, 65, 0, 0, 128, 63, 26, 65, 10, 12,
-    114, 111, 97, 100, 95, 114, 101, 103, 117, 108, 97, 114, 29, 255, 153, 153,
-    153, 34, 44, 8, 3, 18, 40, 0, 0, 0, 0, 0, 0, 0, 63, 0,
-    0, 80, 65, 0, 0, 0, 63, 0, 0, 128, 65, 0, 0, 0, 64, 0,
-    0, 160, 65, 0, 0, 0, 66, 0, 0, 240, 65, 0, 0, 0, 66, 26,
-    71, 10, 10, 114, 111, 97, 100, 95, 108, 97, 114, 103, 101, 29, 255, 102,
-    102, 102, 34, 52, 8, 3, 18, 48, 0, 0, 0, 0, 0, 0, 0, 63,
-    0, 0, 48, 65, 0, 0, 0, 63, 0, 0, 80, 65, 0, 0, 128, 63,
-    0, 0, 128, 65, 0, 0, 128, 64, 0, 0, 160, 65, 0, 0, 128, 66,
-    0, 0, 240, 65, 0, 0, 128, 66
+    97, 116, 101, 114, 18, 5, 119, 97, 116, 101, 114, 18, 20, 10, 8, 98,
+    117, 105, 108, 100, 105, 110, 103, 18, 8, 98, 117, 105, 108, 100, 105, 110,
+    103, 18, 28, 10, 12, 114, 111, 97, 100, 95, 108, 105, 109, 105, 116, 101,
+    100, 18, 12, 114, 111, 97, 100, 95, 108, 105, 109, 105, 116, 101, 100, 18,
+    28, 10, 12, 114, 111, 97, 100, 95, 114, 101, 103, 117, 108, 97, 114, 18,
+    12, 114, 111, 97, 100, 95, 114, 101, 103, 117, 108, 97, 114, 18, 24, 10,
+    10, 114, 111, 97, 100, 95, 108, 97, 114, 103, 101, 18, 10, 114, 111, 97,
+    100, 95, 108, 97, 114, 103, 101, 18, 18, 10, 7, 97, 108, 99, 111, 104,
+    111, 108, 18, 7, 97, 108, 99, 111, 104, 111, 108, 26, 197, 2, 10, 7,
+    100, 101, 102, 97, 117, 108, 116, 18, 21, 10, 4, 112, 97, 114, 107, 34,
+    8, 8, 2, 18, 4, 0, 0, 128, 63, 45, 255, 159, 223, 200, 18, 31,
+    10, 4, 119, 111, 111, 100, 34, 8, 8, 2, 18, 4, 0, 0, 128, 63,
+    45, 255, 102, 170, 51, 58, 8, 8, 2, 18, 4, 205, 204, 204, 61, 18,
+    22, 10, 5, 119, 97, 116, 101, 114, 34, 8, 8, 2, 18, 4, 0, 0,
+    128, 63, 45, 255, 230, 182, 115, 18, 51, 10, 8, 98, 117, 105, 108, 100,
+    105, 110, 103, 34, 8, 8, 2, 18, 4, 0, 0, 128, 63, 45, 255, 0,
+    0, 0, 58, 24, 8, 4, 18, 20, 0, 0, 80, 65, 0, 0, 0, 0,
+    205, 204, 204, 61, 0, 0, 0, 0, 205, 204, 204, 61, 26, 41, 10, 12,
+    114, 111, 97, 100, 95, 108, 105, 109, 105, 116, 101, 100, 29, 255, 187, 187,
+    187, 34, 20, 8, 3, 18, 16, 0, 0, 0, 0, 0, 0, 128, 63, 0,
+    0, 240, 65, 0, 0, 128, 63, 26, 65, 10, 12, 114, 111, 97, 100, 95,
+    114, 101, 103, 117, 108, 97, 114, 29, 255, 153, 153, 153, 34, 44, 8, 3,
+    18, 40, 0, 0, 0, 0, 0, 0, 0, 63, 0, 0, 80, 65, 0, 0,
+    0, 63, 0, 0, 128, 65, 0, 0, 0, 64, 0, 0, 160, 65, 0, 0,
+    0, 66, 0, 0, 240, 65, 0, 0, 0, 66, 26, 71, 10, 10, 114, 111,
+    97, 100, 95, 108, 97, 114, 103, 101, 29, 255, 102, 102, 102, 34, 52, 8,
+    3, 18, 48, 0, 0, 0, 0, 0, 0, 0, 63, 0, 0, 48, 65, 0,
+    0, 0, 63, 0, 0, 80, 65, 0, 0, 128, 63, 0, 0, 128, 65, 0,
+    0, 128, 64, 0, 0, 160, 65, 0, 0, 128, 66, 0, 0, 240, 65, 0,
+    0, 128, 66
 };
 const unsigned long resources::style_size = sizeof(resources::style);
diff --git a/src/style/properties.cpp b/src/style/properties.cpp
index 499f0c7276..a0f2a659df 100644
--- a/src/style/properties.cpp
+++ b/src/style/properties.cpp
@@ -46,10 +46,12 @@ float functions::stops(float z, const std::vector<float>& stops) {
     }
 
     if (smaller && larger) {
+        if (larger_z == smaller_z || larger_val == smaller_val) return smaller_val;
+        float factor = (z - smaller_z) / (larger_z - smaller_z);
+        // Linear interpolation if base is 0
+        if (smaller_val == 0) return factor * larger_val;
         // Exponential interpolation between the values
-        if (larger_z == smaller_z) return smaller_val;
-        float val = smaller_val * pow(larger_val / smaller_val, (z - smaller_z) / (larger_z - smaller_z));
-        return val;
+        return smaller_val * pow(larger_val / smaller_val, factor);
     } else if (larger || smaller) {
         // Do not draw a line.
         return -std::numeric_limits<float>::infinity();
@@ -68,3 +70,21 @@ bool functions::stops(float z, const std::vector<bool>& values) {
     return false;
 }
 
+float functions::linear(float z, const std::vector<float>& values) {
+    if (values.size() != 5) {
+        return 0;
+    }
+
+    const float z_base = values[0];
+    const float val = values[1];
+    const float slope = values[2];
+    const float min = values[3];
+    const float max = values[4];
+
+    return fmin(fmax(min, val + (z - z_base) * slope), max);
+}
+
+bool functions::linear(float z, const std::vector<bool>&) {
+    // TODO
+    return false;
+}
diff --git a/src/style/style.cpp b/src/style/style.cpp
index 3b95fb8792..3f6982feb0 100644
--- a/src/style/style.cpp
+++ b/src/style/style.cpp
@@ -144,8 +144,10 @@ std::pair<std::string, LineClass> Style::parseLineClass(pbf data) {
             stroke.color = parseColor(data);
         } else if (data.tag == 4) { // width
             stroke.width = parseProperty<float>(data.message());
-        } else if (data.tag == 5) { // opacity
+        } else if (data.tag == 5) { // offset
             stroke.offset = parseProperty<float>(data.message());
+        } else if (data.tag == 6) { // opacity
+            stroke.opacity = parseProperty<float>(data.message());
         } else {
             data.skip();
         }
@@ -158,11 +160,12 @@ std::pair<std::string, LineClass> Style::parseLineClass(pbf data) {
 Color Style::parseColor(pbf& data) {
     uint32_t rgba = data.fixed<uint32_t, 4>();
     return {{
-        (float)((rgba >> 24) & 0xFF) / 0xFF,
-        (float)((rgba >> 16) & 0xFF) / 0xFF,
-        (float)((rgba >>  8) & 0xFF) / 0xFF,
-        (float)((rgba >>  0) & 0xFF) / 0xFF
-    }};
+            (float)((rgba >> 24) & 0xFF) / 0xFF,
+            (float)((rgba >> 16) & 0xFF) / 0xFF,
+            (float)((rgba >>  8) & 0xFF) / 0xFF,
+            (float)((rgba >>  0) & 0xFF) / 0xFF
+        }
+    };
 }
 
 template <typename T> FunctionProperty<T> Style::parseProperty(pbf data) {
@@ -170,10 +173,11 @@ template <typename T> FunctionProperty<T> Style::parseProperty(pbf data) {
 
     while (data.next()) {
         if (data.tag == 1) { // function
-            switch((Property)data.varint()) {
+            switch ((Property)data.varint()) {
                 case Property::Null: property.function = &functions::null; break;
                 case Property::Constant: property.function = &functions::constant; break;
                 case Property::Stops: property.function = &functions::stops; break;
+                case Property::Linear: property.function = &functions::linear; break;
                 default: property.function = &functions::null; break;
             }
         } else if (data.tag == 2) { // value