submodule/skia/modules/canvaskit/htmlcanvas/radialgradient.js

   1 // Note, Skia has a different notion of a "radial" gradient.
   2 // Skia has a twoPointConical gradient that is the same as the
   3 // canvas's RadialGradient.
   4
   5 function RadialCanvasGradient(x1, y1, r1, x2, y2, r2) {
   6   this._shader = null;
   7   this._colors = [];
   8   this._pos = [];
   9
  10   this.addColorStop = function(offset, color) {
  11     if (offset < 0 || offset > 1 || !isFinite(offset)) {
  12       throw 'offset must be between 0 and 1 inclusively';
  13     }
  14
  15     color = parseColor(color);
  16     // From the spec: If multiple stops are added at the same offset on a
  17     // gradient, then they must be placed in the order added, with the first
  18     // one closest to the start of the gradient, and each subsequent one
  19     // infinitesimally further along towards the end point (in effect
  20     // causing all but the first and last stop added at each point to be
  21     // ignored).
  22     // To implement that, if an offset is already in the list,
  23     // we just overwrite its color (since the user can't remove Color stops
  24     // after the fact).
  25     var idx = this._pos.indexOf(offset);
  26     if (idx !== -1) {
  27       this._colors[idx] = color;
  28     } else {
  29       // insert it in sorted order
  30       for (idx = 0; idx < this._pos.length; idx++) {
  31         if (this._pos[idx] > offset) {
  32           break;
  33         }
  34       }
  35       this._pos   .splice(idx, 0, offset);
  36       this._colors.splice(idx, 0, color);
  37     }
  38   }
  39
  40   this._copy = function() {
  41     var rcg = new RadialCanvasGradient(x1, y1, r1, x2, y2, r2);
  42     rcg._colors = this._colors.slice();
  43     rcg._pos    = this._pos.slice();
  44     return rcg;
  45   }
  46
  47   this._dispose = function() {
  48     if (this._shader) {
  49       this._shader.delete();
  50       this._shader = null;
  51     }
  52   }
  53
  54   this._getShader = function(currentTransform) {
  55     // From the spec: "The points in the linear gradient must be transformed
  56     // as described by the current transformation matrix when rendering."
  57     var pts = [x1, y1, x2, y2];
  58     CanvasKit.Matrix.mapPoints(currentTransform, pts);
  59     var sx1 = pts[0];
  60     var sy1 = pts[1];
  61     var sx2 = pts[2];
  62     var sy2 = pts[3];
  63
  64     var sx = currentTransform[0];
  65     var sy = currentTransform[4];
  66     var scaleFactor = (Math.abs(sx) + Math.abs(sy))/2;
  67
  68     var sr1 = r1 * scaleFactor;
  69     var sr2 = r2 * scaleFactor;
  70
  71     this._dispose();
  72     this._shader = CanvasKit.Shader.MakeTwoPointConicalGradient(
  73         [sx1, sy1], sr1, [sx2, sy2], sr2, this._colors, this._pos,
  74         CanvasKit.TileMode.Clamp);
  75     return this._shader;
  76   }
  77 }