Copy shaders from WR repo.

resources/shaders/blur.fs.glsl

@@ -28,7 +28,7 @@ void main(void) {
             lColorTexCoord.x <= 1.0 &&
             lColorTexCoord.y >= 0.0 &&
             lColorTexCoord.y <= 1.0 ?
-            Texture(sDiffuse, lColorTexCoord * sourceTextureUvSize + sourceTextureUvOrigin) :
+            texture(sDiffuse, lColorTexCoord * sourceTextureUvSize + sourceTextureUvOrigin) :
             vec4(0.0);
 
         // Alpha must be premultiplied in order to properly blur the alpha channel.

resources/shaders/box_shadow.fs.glsl

@@ -141,6 +141,8 @@ void main(void) {
     vec2 radii = vBorderRadii.xy;
     float sigma = vBlurRadius / 2.0;
     float value = color(pos, p0Rect, p1Rect, radii, sigma);
-    SetFragColor(vec4(vColor.rgb, max(value, 0.0)));
+
+    value = max(value, 0.0);
+    SetFragColor(vec4(vColor.rgb, vColor.a == 0.0 ? 1.0 - value : value));
 }
 

resources/shaders/debug_color.fs.glsl

@@ -4,5 +4,5 @@
 
 void main(void)
 {
-    SetFragColor(vColor);
+    oFragColor = vColor;
 }

resources/shaders/debug_font.fs.glsl

@@ -5,9 +5,9 @@
 void main(void)
 {
 #ifdef SERVO_ES2
-    float alpha = Texture(sDiffuse, vColorTexCoord.xy).a;
+    float alpha = texture(sDiffuse, vColorTexCoord.xy).a;
 #else
-    float alpha = Texture(sDiffuse, vColorTexCoord.xy).r;
+    float alpha = texture(sDiffuse, vColorTexCoord.xy).r;
 #endif
-    SetFragColor(vec4(vColor.xyz, vColor.w * alpha));
+    oFragColor = vec4(vColor.xyz, vColor.w * alpha);
 }

resources/shaders/es2_common.vs.glsl

@@ -65,6 +65,6 @@ vec2 SnapToPixels(vec2 pos)
     // Snap the vertex to pixel position to guarantee correct texture
     // sampling when using bilinear filtering.
 
-    // TODO(gw): Do we ever get negative coords here?
+    // TODO(gw): ES2 doesn't have round(). Do we ever get negative coords here?
     return floor(0.5 + pos * uDevicePixelRatio) / uDevicePixelRatio;
 }

resources/shaders/gl3_common.vs.glsl

@@ -62,8 +62,5 @@ vec2 SnapToPixels(vec2 pos)
 {
     // Snap the vertex to pixel position to guarantee correct texture
     // sampling when using bilinear filtering.
-
-    // Don't use round() because its behavior is implementation-defined on 0.5.
-    // TODO: Do we ever get negative coords here?
-    return floor(0.5 + pos * uDevicePixelRatio) / uDevicePixelRatio;
+    return round(pos * uDevicePixelRatio) / uDevicePixelRatio;
 }

resources/shaders/prim_shared.glsl

@@ -0,0 +1,180 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+#define PST_INVALID      uint(0)
+#define PST_TOP_LEFT     uint(1)
+#define PST_TOP_RIGHT    uint(2)
+#define PST_BOTTOM_LEFT  uint(3)
+#define PST_BOTTOM_RIGHT uint(4)
+#define PST_TOP          uint(5)
+#define PST_LEFT         uint(6)
+#define PST_BOTTOM       uint(7)
+#define PST_RIGHT        uint(8)
+
+// Border styles as defined in webrender_traits/types.rs
+#define BORDER_STYLE_NONE         uint(0)
+#define BORDER_STYLE_SOLID        uint(1)
+#define BORDER_STYLE_DOUBLE       uint(2)
+#define BORDER_STYLE_DOTTED       uint(3)
+#define BORDER_STYLE_DASHED       uint(4)
+#define BORDER_STYLE_HIDDEN       uint(5)
+#define BORDER_STYLE_GROOVE       uint(6)
+#define BORDER_STYLE_RIDGE        uint(7)
+#define BORDER_STYLE_INSET        uint(8)
+#define BORDER_STYLE_OUTSET       uint(9)
+
+#ifdef WR_VERTEX_SHADER
+struct Layer {
+    mat4 transform;
+    mat4 inv_transform;
+    ivec4 world_clip_rect;
+    vec4 screen_vertices[4];
+};
+
+layout(std140) uniform Layers {
+    Layer layers[WR_MAX_PRIM_LAYERS];
+};
+
+struct Tile {
+    uvec4 actual_rect;
+    uvec4 target_rect;
+};
+
+layout(std140) uniform Tiles {
+    Tile tiles[WR_MAX_PRIM_TILES];
+};
+
+struct PrimitiveInfo {
+    uvec4 layer_tile_part;
+    vec4 local_clip_rect;
+    vec4 local_rect;
+};
+
+struct ClipCorner {
+    vec4 rect;
+    vec4 outer_inner_radius;
+};
+
+struct Clip {
+    vec4 rect;
+    ClipCorner top_left;
+    ClipCorner top_right;
+    ClipCorner bottom_left;
+    ClipCorner bottom_right;
+};
+
+bool ray_plane(vec3 normal, vec3 point, vec3 ray_origin, vec3 ray_dir, out float t)
+{
+    float denom = dot(normal, ray_dir);
+    if (denom > 1e-6) {
+        vec3 d = point - ray_origin;
+        t = dot(d, normal) / denom;
+        return t >= 0.0;
+    }
+
+    return false;
+}
+
+vec4 untransform(vec2 ref, vec3 n, vec3 a, mat4 inv_transform) {
+    vec3 p = vec3(ref, -10000.0);
+    vec3 d = vec3(0, 0, 1.0);
+
+    float t;
+    ray_plane(n, a, p, d, t);
+    vec3 c = p + d * t;
+
+    vec4 r = inv_transform * vec4(c, 1.0);
+    return r;
+}
+
+vec3 get_layer_pos(vec2 pos, uint layer_index) {
+    Layer layer = layers[layer_index];
+    vec3 a = layer.screen_vertices[0].xyz / layer.screen_vertices[0].w;
+    vec3 b = layer.screen_vertices[3].xyz / layer.screen_vertices[3].w;
+    vec3 c = layer.screen_vertices[2].xyz / layer.screen_vertices[2].w;
+    vec3 n = normalize(cross(b-a, c-a));
+    vec4 local_pos = untransform(pos, n, a, layer.inv_transform);
+    return local_pos.xyw;
+}
+
+struct Rect {
+    vec2 p0;
+    vec2 p1;
+};
+
+struct VertexInfo {
+    Rect local_rect;
+    vec2 local_clamped_pos;
+    vec2 global_clamped_pos;
+};
+
+VertexInfo write_vertex(PrimitiveInfo info) {
+    Layer layer = layers[info.layer_tile_part.x];
+    Tile tile = tiles[info.layer_tile_part.y];
+
+    vec2 p0 = floor(0.5 + info.local_rect.xy * uDevicePixelRatio) / uDevicePixelRatio;
+    vec2 p1 = floor(0.5 + (info.local_rect.xy + info.local_rect.zw) * uDevicePixelRatio) / uDevicePixelRatio;
+
+    vec2 local_pos = mix(p0, p1, aPosition.xy);
+
+    vec2 cp0 = floor(0.5 + info.local_clip_rect.xy * uDevicePixelRatio) / uDevicePixelRatio;
+    vec2 cp1 = floor(0.5 + (info.local_clip_rect.xy + info.local_clip_rect.zw) * uDevicePixelRatio) / uDevicePixelRatio;
+    local_pos = clamp(local_pos, cp0, cp1);
+
+    vec4 world_pos = layer.transform * vec4(local_pos, 0, 1);
+    world_pos.xyz /= world_pos.w;
+
+    vec2 device_pos = world_pos.xy * uDevicePixelRatio;
+
+    vec2 clamped_pos = clamp(device_pos,
+                             vec2(tile.actual_rect.xy),
+                             vec2(tile.actual_rect.xy + tile.actual_rect.zw));
+
+    clamped_pos = clamp(clamped_pos,
+                        vec2(layer.world_clip_rect.xy),
+                        vec2(layer.world_clip_rect.xy + layer.world_clip_rect.zw));
+
+    vec4 local_clamped_pos = layer.inv_transform * vec4(clamped_pos / uDevicePixelRatio, world_pos.z, 1);
+    local_clamped_pos.xyz /= local_clamped_pos.w;
+
+    vec2 final_pos = clamped_pos + vec2(tile.target_rect.xy) - vec2(tile.actual_rect.xy);
+
+    gl_Position = uTransform * vec4(final_pos, 0, 1);
+
+    VertexInfo vi = VertexInfo(Rect(p0, p1), local_clamped_pos.xy, clamped_pos.xy);
+    return vi;
+}
+#endif
+
+#ifdef WR_FRAGMENT_SHADER
+void do_clip(vec2 pos, vec4 clip_rect, vec4 radius) {
+    vec2 ref_tl = clip_rect.xy + vec2( radius.x,  radius.x);
+    vec2 ref_tr = clip_rect.zy + vec2(-radius.y,  radius.y);
+    vec2 ref_br = clip_rect.zw + vec2(-radius.z, -radius.z);
+    vec2 ref_bl = clip_rect.xw + vec2( radius.w, -radius.w);
+
+    float d_tl = distance(pos, ref_tl);
+    float d_tr = distance(pos, ref_tr);
+    float d_br = distance(pos, ref_br);
+    float d_bl = distance(pos, ref_bl);
+
+    bool out0 = pos.x < ref_tl.x && pos.y < ref_tl.y && d_tl > radius.x;
+    bool out1 = pos.x > ref_tr.x && pos.y < ref_tr.y && d_tr > radius.y;
+    bool out2 = pos.x > ref_br.x && pos.y > ref_br.y && d_br > radius.z;
+    bool out3 = pos.x < ref_bl.x && pos.y > ref_bl.y && d_bl > radius.w;
+
+    // TODO(gw): Alpha anti-aliasing based on edge distance!
+    if (out0 || out1 || out2 || out3) {
+        discard;
+    }
+}
+
+bool point_in_rect(vec2 p, vec2 p0, vec2 p1) {
+    return p.x >= p0.x &&
+           p.y >= p0.y &&
+           p.x <= p1.x &&
+           p.y <= p1.y;
+}
+#endif

resources/shaders/ps_angle_gradient.fs.glsl

@@ -0,0 +1,39 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+float offset(int index) {
+    return vOffsets[index / 4][index % 4];
+}
+
+float linearStep(float lo, float hi, float x) {
+    float d = hi - lo;
+    float v = x - lo;
+    if (d != 0.0) {
+        v /= d;
+    }
+    return clamp(v, 0.0, 1.0);
+}
+
+void main(void) {
+    float angle = atan(-vEndPoint.y + vStartPoint.y,
+                        vEndPoint.x - vStartPoint.x);
+    float sa = sin(angle);
+    float ca = cos(angle);
+
+	float sx = vStartPoint.x * ca - vStartPoint.y * sa;
+    float ex = vEndPoint.x * ca - vEndPoint.y * sa;
+    float d = ex - sx;
+
+    float x = vPos.x * ca - vPos.y * sa;
+
+    oFragColor = mix(vColors[0],
+                     vColors[1],
+                     linearStep(sx + d * offset(0), sx + d * offset(1), x));
+
+    for (int i=1 ; i < vStopCount-1 ; ++i) {
+        oFragColor = mix(oFragColor,
+                         vColors[i+1],
+                         linearStep(sx + d * offset(i), sx + d * offset(i+1), x));
+    }
+}

resources/shaders/ps_angle_gradient.glsl

@@ -0,0 +1,13 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+#define MAX_STOPS_PER_ANGLE_GRADIENT 8
+
+flat varying int vStopCount;
+flat varying float vAngle;
+flat varying vec2 vStartPoint;
+flat varying vec2 vEndPoint;
+varying vec2 vPos;
+flat varying vec4 vColors[MAX_STOPS_PER_ANGLE_GRADIENT];
+flat varying vec4 vOffsets[MAX_STOPS_PER_ANGLE_GRADIENT/4];

resources/shaders/ps_angle_gradient.vs.glsl

@@ -0,0 +1,38 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct AngleGradient {
+	PrimitiveInfo info;
+    vec4 start_end_point;
+    uvec4 stop_count;
+    vec4 colors[MAX_STOPS_PER_ANGLE_GRADIENT];
+    vec4 offsets[MAX_STOPS_PER_ANGLE_GRADIENT/4];
+};
+
+layout(std140) uniform Items {
+    AngleGradient gradients[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    AngleGradient gradient = gradients[gl_InstanceID];
+    VertexInfo vi = write_vertex(gradient.info);
+
+    vStopCount = int(gradient.stop_count.x);
+    vPos = vi.local_clamped_pos;
+
+    // Snap the start/end points to device pixel units.
+    // I'm not sure this is entirely correct, but the
+    // old render path does this, and it is needed to
+    // make the angle gradient ref tests pass. It might
+    // be better to fix this higher up in DL construction
+    // and not snap here?
+    vStartPoint = floor(0.5 + gradient.start_end_point.xy * uDevicePixelRatio) / uDevicePixelRatio;
+    vEndPoint = floor(0.5 + gradient.start_end_point.zw * uDevicePixelRatio) / uDevicePixelRatio;
+
+    for (int i=0 ; i < int(gradient.stop_count.x) ; ++i) {
+        vColors[i] = gradient.colors[i];
+        vOffsets[i] = gradient.offsets[i];
+    }
+}

resources/shaders/ps_blend.fs.glsl

@@ -0,0 +1,10 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+uniform sampler2D sCache;
+
+void main(void) {
+    vec4 color = texture(sCache, vUv);
+    oFragColor = vec4(color.rgb, color.a * vOpacity);
+}

resources/shaders/ps_blend.glsl

@@ -0,0 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vUv;
+varying float vOpacity;

resources/shaders/ps_blend.vs.glsl

@@ -0,0 +1,29 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Blend {
+    uvec4 target_rect;
+    uvec4 src_rect;
+    vec4 opacity;
+};
+
+layout(std140) uniform Items {
+    Blend blends[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Blend blend = blends[gl_InstanceID];
+
+    vec2 local_pos = mix(vec2(blend.target_rect.xy),
+                         vec2(blend.target_rect.xy + blend.target_rect.zw),
+                         aPosition.xy);
+
+    vec2 st0 = vec2(blend.src_rect.xy) / 2048.0;
+    vec2 st1 = vec2(blend.src_rect.xy + blend.src_rect.zw) / 2048.0;
+    vUv = mix(st0, st1, aPosition.xy);
+    vOpacity = blend.opacity.x;
+
+    gl_Position = uTransform * vec4(local_pos, 0, 1);
+}

resources/shaders/ps_border.fs.glsl

@@ -0,0 +1,184 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// draw a circle at position aDesiredPos with a aRadius
+vec4 drawCircle(vec2 aPixel, vec2 aDesiredPos, float aRadius, vec3 aColor) {
+  float farFromCenter = length(aDesiredPos - aPixel) - aRadius;
+  float pixelInCircle = 1.00 - clamp(farFromCenter, 0.0, 1.0);
+  return vec4(aColor, pixelInCircle);
+}
+
+// Draw a rectangle at aRect fill it with aColor. Only works on non-rotated
+// rects.
+vec4 drawRect(vec2 aPixel, vec4 aRect, vec3 aColor) {
+   // GLSL origin is bottom left, positive Y is up
+   bool inRect = (aRect.x <= aPixel.x) && (aPixel.x <= aRect.x + aRect.z) &&
+            (aPixel.y >= aRect.y) && (aPixel.y <= aRect.y + aRect.w);
+   return vec4(aColor, float(inRect));
+}
+
+vec4 draw_dotted_edge() {
+  // Everything here should be in device pixels.
+  // We want the dot to be roughly the size of the whole border spacing
+  float border_spacing = min(vBorders.w, vBorders.z);
+  float radius = floor(border_spacing / 2.0);
+  float diameter = radius * 2.0;
+  // The amount of space between dots. 2.2 was chosen because it looks kind of
+  // like firefox.
+  float circleSpacing = diameter * 2.2;
+
+  vec2 size = vec2(vBorders.z, vBorders.w);
+  // Get our position within this specific segment
+  vec2 position = vDevicePos - vBorders.xy;
+
+  // Break our position into square tiles with circles in them.
+  vec2 circleCount = floor(size / circleSpacing);
+  circleCount = max(circleCount, 1.0);
+
+  vec2 distBetweenCircles = size / circleCount;
+  vec2 circleCenter = distBetweenCircles / 2.0;
+
+  // Find out which tile this pixel belongs to.
+  vec2 destTile = floor(position / distBetweenCircles);
+  destTile = destTile * distBetweenCircles;
+
+  // Where we want to draw the actual circle.
+  vec2 tileCenter = destTile + circleCenter;
+
+  // Find the position within the tile
+  vec2 positionInTile = mod(position, distBetweenCircles);
+  vec2 finalPosition = positionInTile + destTile;
+
+  vec4 white = vec4(1.0, 1.0, 1.0, 1.0);
+  // See if we should draw a circle or not
+  vec4 circleColor = drawCircle(finalPosition, tileCenter, radius, vVerticalColor.xyz);
+  return mix(white, circleColor, circleColor.a);
+}
+
+// Our current edge calculation is based only on
+// the size of the border-size, but we need to draw
+// the dashes in the center of the segment we're drawing.
+// This calculates how much to nudge and which axis to nudge on.
+vec2 get_dashed_nudge_factor(vec2 dash_size, bool is_corner) {
+  if (is_corner) {
+    return vec2(0.0, 0.0);
+  }
+
+  bool xAxisFudge = vBorders.z > vBorders.w;
+  if (xAxisFudge) {
+    return vec2(dash_size.x / 2.0, 0);
+  } else {
+    return vec2(0.0, dash_size.y / 2.0);
+  }
+}
+
+vec4 draw_dashed_edge(bool is_corner) {
+  // Everything here should be in device pixels.
+  // We want the dot to be roughly the size of the whole border spacing
+  // 5.5 here isn't a magic number, it's just what mostly looks like FF/Chrome
+  float dash_interval = min(vBorders.w, vBorders.z) * 5.5;
+  vec2 edge_size = vec2(vBorders.z, vBorders.w);
+  vec2 dash_size = vec2(dash_interval / 2.0, dash_interval / 2.0);
+  vec2 position = vDevicePos - vBorders.xy;
+
+  vec2 dash_count = floor(edge_size/ dash_interval);
+  vec2 dist_between_dashes = edge_size / dash_count;
+
+  vec2 target_rect_index = floor(position / dist_between_dashes);
+  vec2 target_rect_loc = target_rect_index * dist_between_dashes;
+  target_rect_loc += get_dashed_nudge_factor(dash_size, is_corner);
+  vec4 target_rect = vec4(target_rect_loc, dash_size);
+
+  vec4 white = vec4(1.0, 1.0, 1.0, 1.0);
+  vec4 target_colored_rect = drawRect(position, target_rect, vVerticalColor.xyz);
+  return mix(white, target_colored_rect, target_colored_rect.a);
+}
+
+void draw_dotted_border(void) {
+  switch (vBorderPart) {
+    // These are the layer tile part PrimitivePart as uploaded by the tiling.rs
+    case PST_TOP_LEFT:
+    case PST_TOP_RIGHT:
+    case PST_BOTTOM_LEFT:
+    case PST_BOTTOM_RIGHT:
+    {
+      // TODO: Fix for corners with a border-radius
+      oFragColor = draw_dotted_edge();
+      break;
+    }
+    case PST_BOTTOM:
+    case PST_TOP:
+    case PST_LEFT:
+    case PST_RIGHT:
+    {
+      oFragColor = draw_dotted_edge();
+      break;
+    }
+  }
+}
+
+void draw_dashed_border(void) {
+  switch (vBorderPart) {
+    // These are the layer tile part PrimitivePart as uploaded by the tiling.rs
+    case PST_TOP_LEFT:
+    case PST_TOP_RIGHT:
+    case PST_BOTTOM_LEFT:
+    case PST_BOTTOM_RIGHT:
+    {
+      // TODO: Fix for corners with a border-radius
+      bool is_corner = true;
+      oFragColor = draw_dashed_edge(is_corner);
+      break;
+    }
+    case PST_BOTTOM:
+    case PST_TOP:
+    case PST_LEFT:
+    case PST_RIGHT:
+    {
+      bool is_corner = false;
+      oFragColor = draw_dashed_edge(is_corner);
+      break;
+    }
+  }
+}
+
+void main(void) {
+	if (vRadii.x > 0.0 &&
+		(distance(vRefPoint, vLocalPos) > vRadii.x ||
+		 distance(vRefPoint, vLocalPos) < vRadii.z)) {
+		discard;
+	}
+
+  switch (vBorderStyle) {
+    case BORDER_STYLE_DASHED:
+    {
+      draw_dashed_border();
+      break;
+    }
+    case BORDER_STYLE_DOTTED:
+    {
+      draw_dotted_border();
+      break;
+    }
+    case BORDER_STYLE_OUTSET:
+    case BORDER_STYLE_INSET:
+    {
+      float color = step(0.0, vF);
+      oFragColor = mix(vVerticalColor, vHorizontalColor, color);
+      break;
+    }
+    case BORDER_STYLE_NONE:
+    case BORDER_STYLE_SOLID:
+    {
+      float color = step(0.0, vF);
+      oFragColor = mix(vHorizontalColor, vVerticalColor, color);
+      break;
+    }
+    default:
+    {
+      discard;
+      break;
+    }
+  }
+}

resources/shaders/ps_border.glsl

@@ -0,0 +1,24 @@
+#line 1
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// These two are interpolated
+varying float vF;   // This is a weighting as we get closer to the bottom right corner?
+
+// These are not changing.
+flat varying vec4 vVerticalColor;     // The vertical color, e.g. top/bottom
+flat varying vec4 vHorizontalColor;   // The horizontal color e.g. left/right
+flat varying vec4 vRadii;             // The border radius from CSS border-radius
+
+// These are in device space
+varying vec2 vLocalPos;     // The clamped position in local space.
+varying vec2 vDevicePos;    // The clamped position in device space.
+flat varying vec4 vBorders; // the rect of the border in (x, y, width, height) form
+
+// for corners, this is the beginning of the corner.
+// For the lines, this is the top left of the line.
+flat varying vec2 vRefPoint;
+flat varying uint vBorderStyle;
+flat varying uint vBorderPart; // Which part of the border we're drawing.

resources/shaders/ps_border.vs.glsl

@@ -0,0 +1,113 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Border {
+    PrimitiveInfo info;
+    vec4 verticalColor;
+    vec4 horizontalColor;
+    vec4 radii;
+    uvec4 border_style_trbl;
+};
+
+layout(std140) uniform Items {
+    Border borders[WR_MAX_PRIM_ITEMS];
+};
+
+uint get_border_style(Border a_border, uint a_edge) {
+  switch (a_edge) {
+    case PST_TOP:
+    case PST_TOP_LEFT:
+      return a_border.border_style_trbl.x;
+    case PST_BOTTOM_LEFT:
+    case PST_LEFT:
+      return a_border.border_style_trbl.z;
+    case PST_BOTTOM_RIGHT:
+    case PST_BOTTOM:
+      return a_border.border_style_trbl.w;
+    case PST_TOP_RIGHT:
+    case PST_RIGHT:
+      return a_border.border_style_trbl.y;
+  }
+}
+
+void main(void) {
+    Border border = borders[gl_InstanceID];
+    VertexInfo vi = write_vertex(border.info);
+
+    // Just our boring radius position.
+    vRadii = border.radii;
+
+    float x0, y0, x1, y1;
+    vBorderPart = border.info.layer_tile_part.z;
+    switch (vBorderPart) {
+        // These are the layer tile part PrimitivePart as uploaded by the tiling.rs
+        case PST_TOP_LEFT:
+            x0 = border.info.local_rect.x;
+            y0 = border.info.local_rect.y;
+            // These are width / heights
+            x1 = border.info.local_rect.x + border.info.local_rect.z;
+            y1 = border.info.local_rect.y + border.info.local_rect.w;
+
+            // The radius here is the border-radius. This is 0, so vRefPoint will
+            // just be the top left (x,y) corner.
+            vRefPoint = vec2(x0, y0) + vRadii.xy;
+            break;
+        case PST_TOP_RIGHT:
+            x0 = border.info.local_rect.x + border.info.local_rect.z;
+            y0 = border.info.local_rect.y;
+            x1 = border.info.local_rect.x;
+            y1 = border.info.local_rect.y + border.info.local_rect.w;
+            vRefPoint = vec2(x0, y0) + vec2(-vRadii.x, vRadii.y);
+            break;
+        case PST_BOTTOM_LEFT:
+            x0 = border.info.local_rect.x;
+            y0 = border.info.local_rect.y + border.info.local_rect.w;
+            x1 = border.info.local_rect.x + border.info.local_rect.z;
+            y1 = border.info.local_rect.y;
+            vRefPoint = vec2(x0, y0) + vec2(vRadii.x, -vRadii.y);
+            break;
+        case PST_BOTTOM_RIGHT:
+            x0 = border.info.local_rect.x;
+            y0 = border.info.local_rect.y;
+            x1 = border.info.local_rect.x + border.info.local_rect.z;
+            y1 = border.info.local_rect.y + border.info.local_rect.w;
+            vRefPoint = vec2(x1, y1) + vec2(-vRadii.x, -vRadii.y);
+            break;
+        case PST_TOP:
+        case PST_LEFT:
+        case PST_BOTTOM:
+        case PST_RIGHT:
+            vRefPoint = border.info.local_rect.xy;
+            x0 = border.info.local_rect.x;
+            y0 = border.info.local_rect.y;
+            x1 = border.info.local_rect.x + border.info.local_rect.z;
+            y1 = border.info.local_rect.y + border.info.local_rect.w;
+            break;
+    }
+
+    vBorderStyle = get_border_style(border, vBorderPart);
+
+    // y1 - y0 is the height of the corner / line
+    // x1 - x0 is the width of the corner / line.
+    float width = x1 - x0;
+    float height = y1 - y0;
+    // This is just a weighting of the pixel colors it seems?
+    vF = (vi.local_clamped_pos.x - x0) * height - (vi.local_clamped_pos.y - y0) * width;
+
+    // This is what was currently sent.
+    vVerticalColor = border.verticalColor;
+    vHorizontalColor = border.horizontalColor;
+
+    // Local space
+    vLocalPos = vi.local_clamped_pos.xy;
+
+    // These are in device space
+    vDevicePos = vi.global_clamped_pos;
+
+    // These are in device space
+    vBorders = vec4(border.info.local_rect.x, border.info.local_rect.y,
+                    border.info.local_rect.z,
+                    border.info.local_rect.w) * uDevicePixelRatio;
+}

resources/shaders/ps_box_shadow.fs.glsl

@@ -0,0 +1,151 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// See http://asciimath.org to render the equations here.
+
+// The Gaussian function used for blurring:
+//
+//     G_sigma(x) = 1/sqrt(2 pi sigma^2) e^(-x^2/(2 sigma^2))
+float gauss(float x, float sigma) {
+    float sigmaPow2 = sigma * sigma;
+    return 1.0 / sqrt(6.283185307179586 * sigmaPow2) * exp(-(x * x) / (2.0 * sigmaPow2));
+}
+
+// An approximation of the error function, which is related to the integral of the Gaussian
+// function:
+//
+//     "erf"(x) = 2/sqrt(pi) int_0^x e^(-t^2) dt
+//              ~~ 1 - 1 / (1 + a_1 x + a_2 x^2 + a_3 x^3 + a_4 x^4)^4
+//
+// where:
+//
+//     a_1 = 0.278393, a_2 = 0.230389, a_3 = 0.000972, a_4 = 0.078108
+//
+// This approximation is accurate to `5 xx 10^-4`, more than accurate enough for our purposes.
+//
+// See: https://en.wikipedia.org/wiki/Error_function#Approximation_with_elementary_functions
+float erf(float x) {
+    bool negative = x < 0.0;
+    if (negative)
+        x = -x;
+    float x2 = x * x;
+    float x3 = x2 * x;
+    float x4 = x2 * x2;
+    float denom = 1.0 + 0.278393 * x + 0.230389 * x2 + 0.000972 * x3 + 0.078108 * x4;
+    float result = 1.0 - 1.0 / (denom * denom * denom * denom);
+    return negative ? -result : result;
+}
+
+// A useful helper for calculating integrals of the Gaussian function via the error function:
+//
+//      "erf"_sigma(x) = 2 int 1/sqrt(2 pi sigma^2) e^(-x^2/(2 sigma^2)) dx
+//                     = "erf"(x/(sigma sqrt(2)))
+float erfSigma(float x, float sigma) {
+    return erf(x / (sigma * 1.4142135623730951));
+}
+
+// Returns the blurred color value from the box itself (not counting any rounded corners). `p_0` is
+// the vector distance to the top left corner of the box; `p_1` is the vector distance to its
+// bottom right corner.
+//
+//      "colorFromRect"_sigma(p_0, p_1)
+//          = int_{p_{0_y}}^{p_{1_y}} int_{p_{1_x}}^{p_{0_x}} G_sigma(y) G_sigma(x) dx dy
+//          = 1/4 ("erf"_sigma(p_{1_x}) - "erf"_sigma(p_{0_x}))
+//              ("erf"_sigma(p_{1_y}) - "erf"_sigma(p_{0_y}))
+float colorFromRect(vec2 p0, vec2 p1, float sigma) {
+    return (erfSigma(p1.x, sigma) - erfSigma(p0.x, sigma)) *
+        (erfSigma(p1.y, sigma) - erfSigma(p0.y, sigma)) / 4.0;
+}
+
+// Returns the `x` coordinate on the ellipse with the given radii for the given `y` coordinate:
+//
+//      "ellipsePoint"(y, y_0, a, b) = a sqrt(1 - ((y - y_0) / b)^2)
+float ellipsePoint(float y, float y0, vec2 radii) {
+    float bStep = (y - y0) / radii.y;
+    return radii.x * sqrt(1.0 - bStep * bStep);
+}
+
+// A helper function to compute the value that needs to be subtracted to accommodate the border
+// corners.
+//
+//     "colorCutout"_sigma(x_{0_l}, x_{0_r}, y_0, y_{min}, y_{max}, a, b)
+//          = int_{y_{min}}^{y_{max}}
+//              int_{x_{0_r} + "ellipsePoint"(y, y_0, a, b)}^{x_{0_r} + a} G_sigma(y) G_sigma(x) dx
+//              + int_{x_{0_l} - a}^{x_{0_l} - "ellipsePoint"(y, y_0, a, b)} G_sigma(y) G_sigma(x)
+//                  dx dy
+//          = int_{y_{min}}^{y_{max}} 1/2 G_sigma(y)
+//              ("erf"_sigma(x_{0_r} + a) - "erf"_sigma(x_{0_r} + "ellipsePoint"(y, y_0, a, b)) +
+//               "erf"_sigma(x_{0_l} - "ellipsePoint"(y, y_0, a, b)) - "erf"_sigma(x_{0_l} - a))
+//
+// with the outer integral evaluated numerically.
+float colorCutoutGeneral(float x0l,
+                         float x0r,
+                         float y0,
+                         float yMin,
+                         float yMax,
+                         vec2 radii,
+                         float sigma) {
+    float sum = 0.0;
+    for (float y = yMin; y <= yMax; y += 1.0) {
+        float xEllipsePoint = ellipsePoint(y, y0, radii);
+        sum += gauss(y, sigma) *
+            (erfSigma(x0r + radii.x, sigma) - erfSigma(x0r + xEllipsePoint, sigma) +
+             erfSigma(x0l - xEllipsePoint, sigma) - erfSigma(x0l - radii.x, sigma));
+    }
+    return sum / 2.0;
+}
+
+// The value that needs to be subtracted to accommodate the top border corners.
+float colorCutoutTop(float x0l, float x0r, float y0, vec2 radii, float sigma) {
+    return colorCutoutGeneral(x0l, x0r, y0, y0, y0 + radii.y, radii, sigma);
+}
+
+// The value that needs to be subtracted to accommodate the bottom border corners.
+float colorCutoutBottom(float x0l, float x0r, float y0, vec2 radii, float sigma) {
+    return colorCutoutGeneral(x0l, x0r, y0, y0 - radii.y, y0, radii, sigma);
+}
+
+// The blurred color value for the point at `pos` with the top left corner of the box at
+// `p_{0_"rect"}` and the bottom right corner of the box at `p_{1_"rect"}`.
+float color(vec2 pos, vec2 p0Rect, vec2 p1Rect, vec2 radii, float sigma) {
+    // Compute the vector distances `p_0` and `p_1`.
+    vec2 p0 = p0Rect - pos, p1 = p1Rect - pos;
+
+    // Compute the basic color `"colorFromRect"_sigma(p_0, p_1)`. This is all we have to do if
+    // the box is unrounded.
+    float cRect = colorFromRect(p0, p1, sigma);
+    if (radii.x == 0.0 || radii.y == 0.0)
+        return cRect;
+
+    // Compute the inner corners of the box, taking border radii into account: `x_{0_l}`,
+    // `y_{0_t}`, `x_{0_r}`, and `y_{0_b}`.
+    float x0l = p0.x + radii.x;
+    float y0t = p1.y - radii.y;
+    float x0r = p1.x - radii.x;
+    float y0b = p0.y + radii.y;
+
+    // Compute the final color:
+    //
+    //     "colorFromRect"_sigma(p_0, p_1) -
+    //          ("colorCutoutTop"_sigma(x_{0_l}, x_{0_r}, y_{0_t}, a, b) +
+    //           "colorCutoutBottom"_sigma(x_{0_l}, x_{0_r}, y_{0_b}, a, b))
+    float cCutoutTop = colorCutoutTop(x0l, x0r, y0t, radii, sigma);
+    float cCutoutBottom = colorCutoutBottom(x0l, x0r, y0b, radii, sigma);
+    return cRect - (cCutoutTop + cCutoutBottom);
+}
+
+void main(void) {
+    vec2 pos = vPos.xy;
+    vec2 p0Rect = vBoxShadowRect.xy, p1Rect = vBoxShadowRect.zw;
+    vec2 radii = vBorderRadii.xy;
+    float sigma = vBlurRadius / 2.0;
+    float value = color(pos, p0Rect, p1Rect, radii, sigma);
+
+    value = max(value, 0.0);
+    oFragColor = vec4(vColor.rgb, vInverted == 1.0 ? 1.0 - value : value);
+}

resources/shaders/ps_box_shadow.glsl

@@ -0,0 +1,11 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vPos;
+flat varying vec4 vColor;
+flat varying vec2 vBorderRadii;
+flat varying float vBlurRadius;
+flat varying vec4 vBoxShadowRect;
+flat varying vec4 vSrcRect;
+flat varying float vInverted;

resources/shaders/ps_box_shadow.vs.glsl

@@ -0,0 +1,29 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct BoxShadow {
+	PrimitiveInfo info;
+	vec4 color;
+    vec4 border_radii_blur_radius_inverted;
+    vec4 bs_rect;
+    vec4 src_rect;
+};
+
+layout(std140) uniform Items {
+    BoxShadow boxshadows[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    BoxShadow bs = boxshadows[gl_InstanceID];
+    VertexInfo vi = write_vertex(bs.info);
+
+    vPos = vi.local_clamped_pos;
+    vColor = bs.color;
+    vBorderRadii = bs.border_radii_blur_radius_inverted.xy;
+    vBlurRadius = bs.border_radii_blur_radius_inverted.z;
+    vBoxShadowRect = vec4(bs.bs_rect.xy, bs.bs_rect.xy + bs.bs_rect.zw);
+    vSrcRect = vec4(bs.src_rect.xy, bs.src_rect.xy + bs.src_rect.zw);
+    vInverted = bs.border_radii_blur_radius_inverted.w;
+}

resources/shaders/ps_clear.fs.glsl

@@ -0,0 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    oFragColor = vec4(1, 1, 1, 1);
+}

resources/shaders/ps_clear.glsl

@@ -0,0 +1,3 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

resources/shaders/ps_clear.vs.glsl

@@ -0,0 +1,23 @@
+#line 1
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct ClearTile {
+    uvec4 rect;
+};
+
+layout(std140) uniform Tiles {
+    ClearTile tiles[WR_MAX_CLEAR_TILES];
+};
+
+
+void main() {
+    ClearTile tile = tiles[gl_InstanceID];
+
+    vec4 rect = vec4(tile.rect);
+
+    vec4 pos = vec4(mix(rect.xy, rect.xy + rect.zw, aPosition.xy), 0, 1);
+    gl_Position = uTransform * pos;
+}

resources/shaders/ps_composite.fs.glsl

@@ -0,0 +1,320 @@
+#line 1
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+#define COMPOSITE_KIND_MIX_BLEND_MODE   0
+#define COMPOSITE_KIND_FILTER           1
+
+uniform sampler2D sCache;
+
+vec3 rgbToHsv(vec3 c) {
+    float value = max(max(c.r, c.g), c.b);
+
+    float chroma = value - min(min(c.r, c.g), c.b);
+    if (chroma == 0.0) {
+        return vec3(0.0);
+    }
+    float saturation = chroma / value;
+
+    float hue;
+    if (c.r == value)
+        hue = (c.g - c.b) / chroma;
+    else if (c.g == value)
+        hue = 2.0 + (c.b - c.r) / chroma;
+    else // if (c.b == value)
+        hue = 4.0 + (c.r - c.g) / chroma;
+
+    hue *= 1.0/6.0;
+    if (hue < 0.0)
+        hue += 1.0;
+    return vec3(hue, saturation, value);
+}
+
+vec3 hsvToRgb(vec3 c) {
+    if (c.s == 0.0) {
+        return vec3(c.z);
+    }
+
+    float hue = c.x * 6.0;
+    int sector = int(hue);
+    float residualHue = hue - float(sector);
+
+    vec3 pqt = c.z * vec3(1.0 - c.y, 1.0 - c.y * residualHue, 1.0 - c.y * (1.0 - residualHue));
+    if (sector == 0)
+        return vec3(c.z, pqt.z, pqt.x);
+    if (sector == 1)
+        return vec3(pqt.y, c.z, pqt.x);
+    if (sector == 2)
+        return vec3(pqt.x, c.z, pqt.z);
+    if (sector == 3)
+        return vec3(pqt.x, pqt.y, c.z);
+    if (sector == 4)
+        return vec3(pqt.z, pqt.x, c.z);
+    return vec3(c.z, pqt.x, pqt.y);
+}
+
+float gauss(float x, float sigma) {
+    if (sigma == 0.0)
+        return 1.0;
+    return (1.0 / sqrt(6.283185307179586 * sigma * sigma)) * exp(-(x * x) / (2.0 * sigma * sigma));
+}
+
+vec4 Blur(float radius, vec2 direction) {
+    // TODO(gw): Support blur in WR2!
+    return vec4(1, 1, 1, 1);
+}
+
+vec4 Contrast(vec4 Cs, float amount) {
+    return vec4(Cs.rgb * amount - 0.5 * amount + 0.5, 1.0);
+}
+
+vec4 Grayscale(vec4 Cs, float amount) {
+    float ia = 1.0 - amount;
+    return mat4(vec4(0.2126 + 0.7874 * ia, 0.2126 - 0.2126 * ia, 0.2126 - 0.2126 * ia, 0.0),
+                vec4(0.7152 - 0.7152 * ia, 0.7152 + 0.2848 * ia, 0.7152 - 0.7152 * ia, 0.0),
+                vec4(0.0722 - 0.0722 * ia, 0.0722 - 0.0722 * ia, 0.0722 + 0.9278 * ia, 0.0),
+                vec4(0.0, 0.0, 0.0, 1.0)) * Cs;
+}
+
+vec4 HueRotate(vec4 Cs, float amount) {
+    vec3 CsHsv = rgbToHsv(Cs.rgb);
+    CsHsv.x = mod(CsHsv.x + amount / 6.283185307179586, 1.0);
+    return vec4(hsvToRgb(CsHsv), Cs.a);
+}
+
+vec4 Invert(vec4 Cs, float amount) {
+    return mix(Cs, vec4(1.0, 1.0, 1.0, Cs.a) - vec4(Cs.rgb, 0.0), amount);
+}
+
+vec4 Saturate(vec4 Cs, float amount) {
+    return vec4(hsvToRgb(min(vec3(1.0, amount, 1.0) * rgbToHsv(Cs.rgb), vec3(1.0))), Cs.a);
+}
+
+vec4 Sepia(vec4 Cs, float amount) {
+    float ia = 1.0 - amount;
+    return mat4(vec4(0.393 + 0.607 * ia, 0.349 - 0.349 * ia, 0.272 - 0.272 * ia, 0.0),
+                vec4(0.769 - 0.769 * ia, 0.686 + 0.314 * ia, 0.534 - 0.534 * ia, 0.0),
+                vec4(0.189 - 0.189 * ia, 0.168 - 0.168 * ia, 0.131 + 0.869 * ia, 0.0),
+                vec4(0.0, 0.0, 0.0, 1.0)) * Cs;
+}
+
+vec3 Multiply(vec3 Cb, vec3 Cs) {
+    return Cb * Cs;
+}
+
+vec3 Screen(vec3 Cb, vec3 Cs) {
+    return Cb + Cs - (Cb * Cs);
+}
+
+vec3 HardLight(vec3 Cb, vec3 Cs) {
+    vec3 m = Multiply(Cb, 2.0 * Cs);
+    vec3 s = Screen(Cb, 2.0 * Cs - 1.0);
+    vec3 edge = vec3(0.5, 0.5, 0.5);
+    return mix(m, s, step(edge, Cs));
+}
+
+// TODO: Worth doing with mix/step? Check GLSL output.
+float ColorDodge(float Cb, float Cs) {
+    if (Cb == 0.0)
+        return 0.0;
+    else if (Cs == 1.0)
+        return 1.0;
+    else
+        return min(1.0, Cb / (1.0 - Cs));
+}
+
+// TODO: Worth doing with mix/step? Check GLSL output.
+float ColorBurn(float Cb, float Cs) {
+    if (Cb == 1.0)
+        return 1.0;
+    else if (Cs == 0.0)
+        return 0.0;
+    else
+        return 1.0 - min(1.0, (1.0 - Cb) / Cs);
+}
+
+float SoftLight(float Cb, float Cs) {
+    if (Cs <= 0.5) {
+        return Cb - (1.0 - 2.0 * Cs) * Cb * (1.0 - Cb);
+    } else {
+        float D;
+
+        if (Cb <= 0.25)
+            D = ((16.0 * Cb - 12.0) * Cb + 4.0) * Cb;
+        else
+            D = sqrt(Cb);
+
+        return Cb + (2.0 * Cs - 1.0) * (D - Cb);
+    }
+}
+
+vec3 Difference(vec3 Cb, vec3 Cs) {
+    return abs(Cb - Cs);
+}
+
+vec3 Exclusion(vec3 Cb, vec3 Cs) {
+    return Cb + Cs - 2.0 * Cb * Cs;
+}
+
+// These functions below are taken from the spec.
+// There's probably a much quicker way to implement
+// them in GLSL...
+float Sat(vec3 c) {
+    return max(c.r, max(c.g, c.b)) - min(c.r, min(c.g, c.b));
+}
+
+float Lum(vec3 c) {
+    vec3 f = vec3(0.3, 0.59, 0.11);
+    return dot(c, f);
+}
+
+vec3 ClipColor(vec3 C) {
+    float L = Lum(C);
+    float n = min(C.r, min(C.g, C.b));
+    float x = max(C.r, max(C.g, C.b));
+
+    if (n < 0.0)
+        C = L + (((C - L) * L) / (L - n));
+
+    if (x > 1.0)
+        C = L + (((C - L) * (1.0 - L)) / (x - L));
+
+    return C;
+}
+
+vec3 SetLum(vec3 C, float l) {
+    float d = l - Lum(C);
+    return ClipColor(C + d);
+}
+
+void SetSatInner(inout float Cmin, inout float Cmid, inout float Cmax, float s) {
+    if (Cmax > Cmin) {
+        Cmid = (((Cmid - Cmin) * s) / (Cmax - Cmin));
+        Cmax = s;
+    } else {
+        Cmid = 0.0;
+        Cmax = 0.0;
+    }
+    Cmin = 0.0;
+}
+
+vec3 SetSat(vec3 C, float s) {
+    if (C.r <= C.g) {
+        if (C.g <= C.b) {
+            SetSatInner(C.r, C.g, C.b, s);
+        } else {
+            if (C.r <= C.b) {
+                SetSatInner(C.r, C.b, C.g, s);
+            } else {
+                SetSatInner(C.b, C.r, C.g, s);
+            }
+        }
+    } else {
+        if (C.r <= C.b) {
+            SetSatInner(C.g, C.r, C.b, s);
+        } else {
+            if (C.g <= C.b) {
+                SetSatInner(C.g, C.b, C.r, s);
+            } else {
+                SetSatInner(C.b, C.g, C.r, s);
+            }
+        }
+    }
+    return C;
+}
+
+vec3 Hue(vec3 Cb, vec3 Cs) {
+    return SetLum(SetSat(Cs, Sat(Cb)), Lum(Cb));
+}
+
+vec3 Saturation(vec3 Cb, vec3 Cs) {
+    return SetLum(SetSat(Cb, Sat(Cs)), Lum(Cb));
+}
+
+vec3 Color(vec3 Cb, vec3 Cs) {
+    return SetLum(Cs, Lum(Cb));
+}
+
+vec3 Luminosity(vec3 Cb, vec3 Cs) {
+    return SetLum(Cb, Lum(Cs));
+}
+
+void main(void) {
+    vec4 Cs = texture(sCache, vUv1);
+    vec4 Cb = texture(sCache, vUv0);
+
+    // TODO(gw): This is a hack that's (probably) wrong.
+    //           Instead of drawing the tile rect, draw the
+    //           stacking context bounds instead?
+    if (Cs.a == 0.0) {
+        oFragColor = Cb;
+        return;
+    }
+
+    int kind = vInfo.x;
+    int op = vInfo.y;
+    float amount = vAmount;
+
+    // Return yellow if none of the branches match (shouldn't happen).
+    vec4 result = vec4(1.0, 1.0, 0.0, 1.0);
+
+    switch (kind) {
+        case COMPOSITE_KIND_MIX_BLEND_MODE:
+            if (op == 2) {
+                result.rgb = Screen(Cb.rgb, Cs.rgb);
+            } else if (op == 3) {
+                result.rgb = HardLight(Cs.rgb, Cb.rgb);        // Overlay is inverse of Hardlight
+            } else if (op == 6) {
+                result.r = ColorDodge(Cb.r, Cs.r);
+                result.g = ColorDodge(Cb.g, Cs.g);
+                result.b = ColorDodge(Cb.b, Cs.b);
+            } else if (op == 7) {
+                result.r = ColorBurn(Cb.r, Cs.r);
+                result.g = ColorBurn(Cb.g, Cs.g);
+                result.b = ColorBurn(Cb.b, Cs.b);
+            } else if (op == 8) {
+                result.rgb = HardLight(Cb.rgb, Cs.rgb);
+            } else if (op == 9) {
+                result.r = SoftLight(Cb.r, Cs.r);
+                result.g = SoftLight(Cb.g, Cs.g);
+                result.b = SoftLight(Cb.b, Cs.b);
+            } else if (op == 10) {
+                result.rgb = Difference(Cb.rgb, Cs.rgb);
+            } else if (op == 11) {
+                result.rgb = Exclusion(Cb.rgb, Cs.rgb);
+            } else if (op == 12) {
+                result.rgb = Hue(Cb.rgb, Cs.rgb);
+            } else if (op == 13) {
+                result.rgb = Saturation(Cb.rgb, Cs.rgb);
+            } else if (op == 14) {
+                result.rgb = Color(Cb.rgb, Cs.rgb);
+            } else if (op == 15) {
+                result.rgb = Luminosity(Cb.rgb, Cs.rgb);
+            }
+            break;
+        case COMPOSITE_KIND_FILTER:
+            if (op == 0) {
+                // Gaussian blur is specially handled:
+                result = Cs;// Blur(amount, vec2(0,0));
+            } else {
+                if (op == 1) {
+                    result = Contrast(Cs, amount);
+                } else if (op == 2) {
+                    result = Grayscale(Cs, amount);
+                } else if (op == 3) {
+                    result = HueRotate(Cs, amount);
+                } else if (op == 4) {
+                    result = Invert(Cs, amount);
+                } else if (op == 5) {
+                    result = Saturate(Cs, amount);
+                } else if (op == 6) {
+                    result = Sepia(Cs, amount);
+                }
+            }
+            break;
+    }
+
+    oFragColor = result;
+}

resources/shaders/ps_composite.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vUv0;
+varying vec2 vUv1;
+flat varying ivec2 vInfo;
+flat varying float vAmount;

resources/shaders/ps_composite.vs.glsl

@@ -0,0 +1,37 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Composite {
+    uvec4 src0;
+    uvec4 src1;
+    uvec4 target_rect;
+    ivec4 info;
+    vec4 amount;
+};
+
+layout(std140) uniform Items {
+    Composite composites[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Composite composite = composites[gl_InstanceID];
+
+    vec2 local_pos = mix(vec2(composite.target_rect.xy),
+                         vec2(composite.target_rect.xy + composite.target_rect.zw),
+                         aPosition.xy);
+
+    vec2 st0 = vec2(composite.src0.xy) / 2048.0;
+    vec2 st1 = vec2(composite.src0.xy + composite.src0.zw) / 2048.0;
+    vUv0 = mix(st0, st1, aPosition.xy);
+
+    st0 = vec2(composite.src1.xy) / 2048.0;
+    st1 = vec2(composite.src1.xy + composite.src1.zw) / 2048.0;
+    vUv1 = mix(st0, st1, aPosition.xy);
+
+    vInfo = composite.info.xy;
+    vAmount = composite.amount.x;
+
+    gl_Position = uTransform * vec4(local_pos, 0, 1);
+}

resources/shaders/ps_gradient.fs.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    do_clip(vPos, vClipRect, vClipRadius);
+    oFragColor = mix(vColor0, vColor1, vF);
+}

resources/shaders/ps_gradient.glsl

@@ -0,0 +1,10 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying float vF;
+varying vec2 vPos;
+flat varying vec4 vColor0;
+flat varying vec4 vColor1;
+flat varying vec4 vClipRect;
+flat varying vec4 vClipRadius;

resources/shaders/ps_gradient.vs.glsl

@@ -0,0 +1,45 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+#define DIR_HORIZONTAL      uint(0)
+#define DIR_VERTICAL        uint(1)
+
+struct Gradient {
+	PrimitiveInfo info;
+    vec4 color0;
+    vec4 color1;
+    uvec4 dir;
+    Clip clip;
+};
+
+layout(std140) uniform Items {
+    Gradient gradients[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Gradient gradient = gradients[gl_InstanceID];
+    VertexInfo vi = write_vertex(gradient.info);
+
+    vec2 f = (vi.local_clamped_pos - gradient.info.local_rect.xy) / gradient.info.local_rect.zw;
+
+    switch (gradient.dir.x) {
+        case DIR_HORIZONTAL:
+            vF = f.x;
+            break;
+        case DIR_VERTICAL:
+            vF = f.y;
+            break;
+    }
+
+    vClipRect = vec4(gradient.clip.rect.xy, gradient.clip.rect.xy + gradient.clip.rect.zw);
+    vClipRadius = vec4(gradient.clip.top_left.outer_inner_radius.x,
+                       gradient.clip.top_right.outer_inner_radius.x,
+                       gradient.clip.bottom_right.outer_inner_radius.x,
+                       gradient.clip.bottom_left.outer_inner_radius.x);
+    vPos = vi.local_clamped_pos;
+
+    vColor0 = gradient.color0;
+    vColor1 = gradient.color1;
+}

resources/shaders/ps_image.fs.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    vec2 st = vTextureOffset + vTextureSize * fract(vUv);
+    oFragColor = texture(sDiffuse, st);
+}

resources/shaders/ps_image.glsl

@@ -0,0 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vUv;                 // Location within the CSS box to draw.
+flat varying vec2 vTextureOffset; // Offset of this image into the texture atlas.
+flat varying vec2 vTextureSize;   // Size of the image in the texture atlas.

resources/shaders/ps_image.vs.glsl

@@ -0,0 +1,24 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Image {
+    PrimitiveInfo info;
+    vec4 st_rect;       // Location of the image texture in the texture atlas.
+    vec4 stretch_size;  // Size of the actual image.
+};
+
+layout(std140) uniform Items {
+    Image images[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Image image = images[gl_InstanceID];
+    VertexInfo vi = write_vertex(image.info);
+
+    // vUv will contain how many times this image has wrapped around the image size.
+    vUv = (vi.local_clamped_pos - vi.local_rect.p0) / image.stretch_size.xy;
+    vTextureSize = image.st_rect.zw - image.st_rect.xy;
+    vTextureOffset = image.st_rect.xy;
+}

resources/shaders/ps_image_clip.fs.glsl

@@ -0,0 +1,9 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    do_clip(vPos, vClipRect, vClipRadius);
+    vec2 st = vTextureOffset + vTextureSize * fract(vUv);
+    oFragColor = texture(sDiffuse, st);
+}

resources/shaders/ps_image_clip.glsl

@@ -0,0 +1,10 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vUv;                 // Location within the CSS box to draw.
+varying vec2 vPos;
+flat varying vec2 vTextureOffset; // Offset of this image into the texture atlas.
+flat varying vec2 vTextureSize;   // Size of the image in the texture atlas.
+flat varying vec4 vClipRect;
+flat varying vec4 vClipRadius;

resources/shaders/ps_image_clip.vs.glsl

@@ -0,0 +1,32 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Image {
+    PrimitiveInfo info;
+    vec4 st_rect;       // Location of the image texture in the texture atlas.
+    vec4 stretch_size;  // Size of the actual image.
+    Clip clip;
+};
+
+layout(std140) uniform Items {
+    Image images[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Image image = images[gl_InstanceID];
+    VertexInfo vi = write_vertex(image.info);
+
+    vClipRect = vec4(image.clip.rect.xy, image.clip.rect.xy + image.clip.rect.zw);
+    vClipRadius = vec4(image.clip.top_left.outer_inner_radius.x,
+                       image.clip.top_right.outer_inner_radius.x,
+                       image.clip.bottom_right.outer_inner_radius.x,
+                       image.clip.bottom_left.outer_inner_radius.x);
+    vPos = vi.local_clamped_pos;
+
+    // vUv will contain how many times this image has wrapped around the image size.
+    vUv = (vi.local_clamped_pos - image.info.local_rect.xy) / image.stretch_size.xy;
+    vTextureSize = image.st_rect.zw - image.st_rect.xy;
+    vTextureOffset = image.st_rect.xy;
+}

resources/shaders/ps_image_transform.fs.glsl

@@ -0,0 +1,13 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    vec2 pos = vPos.xy / vPos.z;
+
+    if (!point_in_rect(pos, vRect.xy, vRect.xy + vRect.zw)) {
+        discard;
+    }
+
+    oFragColor = texture(sDiffuse, vUv / vPos.z);
+}

resources/shaders/ps_image_transform.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec2 vUv;
+
+varying vec3 vPos;
+flat varying vec4 vRect;

resources/shaders/ps_image_transform.vs.glsl

@@ -0,0 +1,65 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Image {
+    PrimitiveInfo info;
+    vec4 st_rect;
+    vec4 stretch_size;  // Size of the actual image.
+};
+
+layout(std140) uniform Items {
+    Image images[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Image image = images[gl_InstanceID];
+    Layer layer = layers[image.info.layer_tile_part.x];
+    Tile tile = tiles[image.info.layer_tile_part.y];
+
+    vec2 p0 = image.info.local_rect.xy;
+    vec2 p1 = image.info.local_rect.xy + vec2(image.info.local_rect.z, 0.0);
+    vec2 p2 = image.info.local_rect.xy + vec2(0.0, image.info.local_rect.w);
+    vec2 p3 = image.info.local_rect.xy + image.info.local_rect.zw;
+
+    vec4 t0 = layer.transform * vec4(p0, 0, 1);
+    vec4 t1 = layer.transform * vec4(p1, 0, 1);
+    vec4 t2 = layer.transform * vec4(p2, 0, 1);
+    vec4 t3 = layer.transform * vec4(p3, 0, 1);
+
+    vec2 tp0 = t0.xy / t0.w;
+    vec2 tp1 = t1.xy / t1.w;
+    vec2 tp2 = t2.xy / t2.w;
+    vec2 tp3 = t3.xy / t3.w;
+
+    vec2 min_pos = min(tp0.xy, min(tp1.xy, min(tp2.xy, tp3.xy)));
+    vec2 max_pos = max(tp0.xy, max(tp1.xy, max(tp2.xy, tp3.xy)));
+
+    vec2 min_pos_clamped = clamp(min_pos * uDevicePixelRatio,
+                                 vec2(tile.actual_rect.xy),
+                                 vec2(tile.actual_rect.xy + tile.actual_rect.zw));
+
+    vec2 max_pos_clamped = clamp(max_pos * uDevicePixelRatio,
+                                 vec2(tile.actual_rect.xy),
+                                 vec2(tile.actual_rect.xy + tile.actual_rect.zw));
+
+    vec2 clamped_pos = mix(min_pos_clamped,
+                           max_pos_clamped,
+                           aPosition.xy);
+
+    vec3 layer_pos = get_layer_pos(clamped_pos / uDevicePixelRatio, image.info.layer_tile_part.x);
+
+    vRect = image.info.local_rect;
+    vPos = layer_pos;
+
+    vec2 f = (layer_pos.xy - image.info.local_rect.xy) / image.info.local_rect.zw;
+
+    vUv = mix(image.st_rect.xy,
+              image.st_rect.zw,
+              f);
+
+    vec2 final_pos = clamped_pos + vec2(tile.target_rect.xy) - vec2(tile.actual_rect.xy);
+
+    gl_Position = uTransform * vec4(final_pos, 0, 1);
+}

resources/shaders/ps_rectangle.fs.glsl

@@ -0,0 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    oFragColor = vColor;
+}

resources/shaders/ps_rectangle.glsl

@@ -0,0 +1,5 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec4 vColor;

resources/shaders/ps_rectangle.vs.glsl

@@ -0,0 +1,19 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Rectangle {
+	PrimitiveInfo info;
+	vec4 color;
+};
+
+layout(std140) uniform Items {
+    Rectangle rects[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Rectangle rect = rects[gl_InstanceID];
+    write_vertex(rect.info);
+    vColor = rect.color;
+}

resources/shaders/ps_rectangle_clip.fs.glsl

@@ -0,0 +1,9 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    do_clip(vPos, vClipRect, vClipRadius);
+
+    oFragColor = vColor;
+}

resources/shaders/ps_rectangle_clip.glsl

@@ -0,0 +1,10 @@
+#line 1
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec4 vColor;
+varying vec2 vPos;
+flat varying vec4 vClipRect;
+flat varying vec4 vClipRadius;

resources/shaders/ps_rectangle_clip.vs.glsl

@@ -0,0 +1,28 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Rectangle {
+  	PrimitiveInfo info;
+  	vec4 color;
+    Clip clip;
+};
+
+layout(std140) uniform Items {
+    Rectangle rects[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Rectangle rect = rects[gl_InstanceID];
+    VertexInfo vi = write_vertex(rect.info);
+
+    vClipRect = vec4(rect.clip.rect.xy, rect.clip.rect.xy + rect.clip.rect.zw);
+    vClipRadius = vec4(rect.clip.top_left.outer_inner_radius.x,
+                       rect.clip.top_right.outer_inner_radius.x,
+                       rect.clip.bottom_right.outer_inner_radius.x,
+                       rect.clip.bottom_left.outer_inner_radius.x);
+    vPos = vi.local_clamped_pos;
+
+    vColor = rect.color;
+}

resources/shaders/ps_rectangle_transform.fs.glsl

@@ -0,0 +1,13 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    vec2 pos = vPos.xy / vPos.z;
+
+    if (!point_in_rect(pos, vRect.xy, vRect.xy + vRect.zw)) {
+	    discard;
+    }
+
+	oFragColor = vColor;
+}

resources/shaders/ps_rectangle_transform.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+varying vec4 vColor;
+
+varying vec3 vPos;
+flat varying vec4 vRect;

resources/shaders/ps_rectangle_transform.vs.glsl

@@ -0,0 +1,59 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Rectangle {
+	PrimitiveInfo info;
+	vec4 color;
+};
+
+layout(std140) uniform Items {
+    Rectangle rects[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Rectangle rect = rects[gl_InstanceID];
+    Layer layer = layers[rect.info.layer_tile_part.x];
+    Tile tile = tiles[rect.info.layer_tile_part.y];
+
+    vec2 p0 = rect.info.local_rect.xy;
+    vec2 p1 = rect.info.local_rect.xy + vec2(rect.info.local_rect.z, 0.0);
+    vec2 p2 = rect.info.local_rect.xy + vec2(0.0, rect.info.local_rect.w);
+    vec2 p3 = rect.info.local_rect.xy + rect.info.local_rect.zw;
+
+    vec4 t0 = layer.transform * vec4(p0, 0, 1);
+    vec4 t1 = layer.transform * vec4(p1, 0, 1);
+    vec4 t2 = layer.transform * vec4(p2, 0, 1);
+    vec4 t3 = layer.transform * vec4(p3, 0, 1);
+
+    vec2 tp0 = t0.xy / t0.w;
+    vec2 tp1 = t1.xy / t1.w;
+    vec2 tp2 = t2.xy / t2.w;
+    vec2 tp3 = t3.xy / t3.w;
+
+    vec2 min_pos = min(tp0.xy, min(tp1.xy, min(tp2.xy, tp3.xy)));
+    vec2 max_pos = max(tp0.xy, max(tp1.xy, max(tp2.xy, tp3.xy)));
+
+    vec2 min_pos_clamped = clamp(min_pos * uDevicePixelRatio,
+                                 vec2(tile.actual_rect.xy),
+                                 vec2(tile.actual_rect.xy + tile.actual_rect.zw));
+
+    vec2 max_pos_clamped = clamp(max_pos * uDevicePixelRatio,
+                                 vec2(tile.actual_rect.xy),
+                                 vec2(tile.actual_rect.xy + tile.actual_rect.zw));
+
+    vec2 clamped_pos = mix(min_pos_clamped,
+                           max_pos_clamped,
+                           aPosition.xy);
+
+    vec3 layer_pos = get_layer_pos(clamped_pos / uDevicePixelRatio, rect.info.layer_tile_part.x);
+
+    vRect = rect.info.local_rect;
+    vPos = layer_pos;
+    vColor = rect.color;
+
+    vec2 final_pos = clamped_pos + vec2(tile.target_rect.xy) - vec2(tile.actual_rect.xy);
+
+    gl_Position = uTransform * vec4(final_pos, 0, 1);
+}

resources/shaders/ps_text.fs.glsl

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+void main(void) {
+    float a = texture(sDiffuse, vUv).a;
+    oFragColor = vec4(vColor.rgb, vColor.a * a);
+}

resources/shaders/ps_text.glsl

@@ -0,0 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+flat varying vec4 vColor;
+varying vec2 vUv;

resources/shaders/ps_text.vs.glsl

@@ -0,0 +1,26 @@
+#line 1
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+struct Glyph {
+    PrimitiveInfo info;
+    vec4 color;
+    vec4 st_rect;
+};
+
+layout(std140) uniform Items {
+    Glyph glyphs[WR_MAX_PRIM_ITEMS];
+};
+
+void main(void) {
+    Glyph glyph = glyphs[gl_InstanceID];
+    VertexInfo vi = write_vertex(glyph.info);
+
+    vec2 f = (vi.local_clamped_pos - vi.local_rect.p0) / (vi.local_rect.p1 - vi.local_rect.p0);
+
+    vColor = glyph.color;
+    vUv = mix(glyph.st_rect.xy,
+              glyph.st_rect.zw,
+              f);
+}

resources/shaders/shared.glsl

@@ -0,0 +1,45 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+//======================================================================================
+// Vertex shader attributes and uniforms
+//======================================================================================
+#ifdef WR_VERTEX_SHADER
+    #define varying out
+
+    // Uniform inputs
+	uniform mat4 uTransform;       // Orthographic projection
+  uniform float uDevicePixelRatio;
+
+    // Attribute inputs
+	in vec3 aPosition;
+#endif
+
+//======================================================================================
+// Fragment shader attributes and uniforms
+//======================================================================================
+#ifdef WR_FRAGMENT_SHADER
+    precision highp float;
+
+    #define varying in
+
+    // Uniform inputs
+    uniform sampler2D sDiffuse;
+    uniform sampler2D sMask;
+
+    // Fragment shader outputs
+    out vec4 oFragColor;
+#endif
+
+//======================================================================================
+// Interpolator definitions
+//======================================================================================
+
+//======================================================================================
+// VS only types and UBOs
+//======================================================================================
+
+//======================================================================================
+// VS only functions
+//======================================================================================

resources/shaders/shared_other.glsl

@@ -0,0 +1,64 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+//======================================================================================
+// Vertex shader attributes and uniforms
+//======================================================================================
+#ifdef WR_VERTEX_SHADER
+    in vec4 aColorTexCoordRectTop;
+    in vec4 aColorRectTL;
+
+    // box-shadow
+    in vec4 aBorderPosition;
+	in vec4 aBorderRadii;
+	in float aBlurRadius;
+
+    // blur
+    in vec2 aDestTextureSize;
+    in vec2 aSourceTextureSize;
+#endif
+
+//======================================================================================
+// Fragment shader attributes and uniforms
+//======================================================================================
+#ifdef WR_FRAGMENT_SHADER
+    uniform vec2 uDirection;
+#endif
+
+//======================================================================================
+// Interpolator definitions
+//======================================================================================
+
+// Hacks to be removed (needed for text etc)
+varying vec2 vColorTexCoord;
+varying vec4 vColor;
+
+// box_shadow
+varying vec2 vPosition;
+varying vec4 vBorderPosition;
+varying vec4 vBorderRadii;
+varying float vBlurRadius;
+
+// blur
+varying vec2 vSourceTextureSize;
+varying vec2 vDestTextureSize;
+
+//======================================================================================
+// VS only types and UBOs
+//======================================================================================
+
+//======================================================================================
+// VS only functions
+//======================================================================================
+
+//======================================================================================
+// FS only functions
+//======================================================================================
+#ifdef WR_FRAGMENT_SHADER
+
+void SetFragColor(vec4 color) {
+    oFragColor = color;
+}
+
+#endif