skia2/modules/canvaskit/npm_build/extra.html

<!DOCTYPE html>
<title>CanvasKit Extra features (Skia via Web Assembly)</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>
  canvas {
    border: 1px dashed #AAA;
  }
  #sk_legos,#sk_drinks,#sk_party,#sk_onboarding, #sk_animated_gif {
      width: 300px;
      height: 300px;
  }

</style>

<h2> Skottie </h2>
<canvas id=sk_legos width=300 height=300></canvas>
<canvas id=sk_drinks width=500 height=500></canvas>
<canvas id=sk_party width=500 height=500></canvas>
<canvas id=sk_onboarding width=500 height=500></canvas>
<canvas id=sk_animated_gif width=500 height=500
        title='This is an animated gif being animated in Skottie'></canvas>

<h2> RT Shader </h2>
<canvas id=rtshader width=300 height=300></canvas>
<canvas id=rtshader2 width=300 height=300></canvas>

<h2> Particles </h2>
<canvas id=particles width=500 height=500></canvas>

<h2> Paragraph </h2>
<canvas id=para1 width=600 height=600></canvas>

<h2> CanvasKit can serialize/deserialize .skp files</h2>
<canvas id=skp width=500 height=500></canvas>

<h2> 3D perspective transformations </h2>
<canvas id=camera3d width=500 height=500></canvas>
<canvas id=glyphgame width=500 height=500></canvas>

<h2> Support for extended color spaces </h2>
<a href="chrome://flags/#force-color-profile">Force P3 profile</a>
<canvas id=colorsupport width=300 height=300></canvas>

<script type="text/javascript" src="/node_modules/canvaskit/bin/canvaskit.js"></script>

<script type="text/javascript" charset="utf-8">

  var CanvasKit = null;
  var cdn = 'https://storage.googleapis.com/skia-cdn/misc/';

  const ckLoaded = CanvasKitInit({locateFile: (file) => '/node_modules/canvaskit/bin/'+file});

  const loadLegoJSON = fetch(cdn + 'lego_loader.json').then((response) => response.text());
  const loadDrinksJSON = fetch(cdn + 'drinks.json').then((response) => response.text());
  const loadConfettiJSON = fetch(cdn + 'confetti.json').then((response) => response.text());
  const loadOnboardingJSON = fetch(cdn + 'onboarding.json').then((response) => response.text());
  const loadMultiframeJSON = fetch(cdn + 'skottie_sample_multiframe.json').then((response) => response.text());

  const loadFlightGif = fetch(cdn + 'flightAnim.gif').then((response) => response.arrayBuffer());
  const loadSkp = fetch(cdn + 'picture2.skp').then((response) => response.arrayBuffer());
  const loadFont = fetch(cdn + 'Roboto-Regular.ttf').then((response) => response.arrayBuffer());
  const loadDog = fetch(cdn + 'dog.jpg').then((response) => response.arrayBuffer());
  const loadMandrill = fetch(cdn + 'mandrill_256.png').then((response) => response.arrayBuffer());
  const loadBrickTex = fetch(cdn + 'brickwork-texture.jpg').then((response) => response.arrayBuffer());
  const loadBrickBump = fetch(cdn + 'brickwork_normal-map.jpg').then((response) => response.arrayBuffer());

  const curves = {
    "MaxCount": 1000,
    "Drawable": {
      "Type": "SkCircleDrawable",
      "Radius": 2
    },
    "Code": [`
      void effectSpawn(inout Effect effect) {
        effect.rate = 200;
        effect.color = float4(1, 0, 0, 1);
      }
      void spawn(inout Particle p) {
        p.lifetime = 3 + rand(p.seed);
        p.vel.y = -50;
      }

      void update(inout Particle p) {
        float w = mix(15, 3, p.age);
        p.pos.x = sin(radians(p.age * 320)) * mix(25, 10, p.age) + mix(-w, w, rand(p.seed));
        if (rand(p.seed) < 0.5) { p.pos.x = -p.pos.x; }

        p.color.g = (mix(75, 220, p.age) + mix(-30, 30, rand(p.seed))) / 255;
      }
      `
    ],
    "Bindings": []
  };

  const spiralSkSL = `
  uniform float rad_scale;
  uniform float2 in_center;
  uniform float4 in_colors0;
  uniform float4 in_colors1;

  half4 main(float2 p) {
      float2 pp = p - in_center;
      float radius = sqrt(dot(pp, pp));
      radius = sqrt(radius);
      float angle = atan(pp.y / pp.x);
      float t = (angle + 3.1415926/2) / (3.1415926);
      t += radius * rad_scale;
      t = fract(t);
      return half4(mix(in_colors0, in_colors1, t));
  }`;

  // Examples which only require canvaskit
  ckLoaded.then((CK) => {
    CanvasKit = CK;
    ParticlesAPI1(CanvasKit);
    RTShaderAPI1(CanvasKit);
    ColorSupport(CanvasKit);
  });

  // Examples requiring external resources.
  // Set bounds to fix the 4:3 resolution of the legos
  Promise.all([ckLoaded, loadLegoJSON]).then(([ck, jsonstr]) => {
    SkottieExample(ck, 'sk_legos', jsonstr, [-50, 0, 350, 300]);
  });
  // Re-size to fit
  let fullBounds = [0, 0, 500, 500];
  Promise.all([ckLoaded, loadDrinksJSON]).then(([ck, jsonstr]) => {
    SkottieExample(ck, 'sk_drinks', jsonstr, fullBounds);
  });
  Promise.all([ckLoaded, loadConfettiJSON]).then(([ck, jsonstr]) => {
    SkottieExample(ck, 'sk_party', jsonstr, fullBounds);
  });
  Promise.all([ckLoaded, loadOnboardingJSON]).then(([ck, jsonstr]) => {
    SkottieExample(ck, 'sk_onboarding', jsonstr, fullBounds);
  });
  Promise.all([ckLoaded, loadMultiframeJSON, loadFlightGif]).then(([ck, jsonstr, gif]) => {
    SkottieExample(ck, 'sk_animated_gif', jsonstr, fullBounds, {'image_0.png': gif});
  });

  Promise.all([ckLoaded, loadFont]).then((results) => {
    ParagraphAPI1(...results);
    GlyphGame(...results)
  });
  Promise.all([ckLoaded, loadSkp]).then((results) => {SkpExample(...results)});
  Promise.all([ckLoaded, loadBrickTex, loadBrickBump, loadFont]).then((results) => {Camera3D(...results)});

  const rectLeft = 0;
  const rectTop = 1;
  const rectRight = 2;
  const rectBottom = 3;

  function SkottieExample(CanvasKit, id, jsonStr, bounds, assets) {
    if (!CanvasKit || !jsonStr) {
      return;
    }
    const animation = CanvasKit.MakeManagedAnimation(jsonStr, assets);
    const duration = animation.duration() * 1000;
    const size = animation.size();
    let c = document.getElementById(id);
    bounds = bounds || CanvasKit.LTRBRect(0, 0, size.w, size.h);

    // Basic managed animation test.
    if (id === 'sk_drinks') {
      animation.setColor('BACKGROUND_FILL', CanvasKit.Color(0, 163, 199, 1.0));
    }

    const surface = CanvasKit.MakeCanvasSurface(id);
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    let firstFrame = Date.now();

    function drawFrame(canvas) {
      let seek = ((Date.now() - firstFrame) / duration) % 1.0;
      let damage = animation.seek(seek);

      if (damage[rectRight] > damage[rectLeft] && damage[rectBottom] > damage[rectTop]) {
        canvas.clear(CanvasKit.WHITE);
        animation.render(canvas, bounds);
      }
      surface.requestAnimationFrame(drawFrame);
    }
    surface.requestAnimationFrame(drawFrame);

    return surface;
  }

  function ParticlesAPI1(CanvasKit) {
    const surface = CanvasKit.MakeCanvasSurface('particles');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }
    const context = CanvasKit.currentContext();
    const canvas = surface.getCanvas();
    canvas.translate(250, 450);

    const particles = CanvasKit.MakeParticles(JSON.stringify(curves));
    particles.start(Date.now() / 1000.0, true);

    function drawFrame(canvas) {
      canvas.clear(CanvasKit.BLACK);

      particles.update(Date.now() / 1000.0);
      particles.draw(canvas);
      surface.requestAnimationFrame(drawFrame);
    }
    surface.requestAnimationFrame(drawFrame);
  }

  function ParagraphAPI1(CanvasKit, fontData) {
    if (!CanvasKit || !fontData) {
      return;
    }

    const surface = CanvasKit.MakeCanvasSurface('para1');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    const canvas = surface.getCanvas();
    const fontMgr = CanvasKit.FontMgr.FromData([fontData]);

    const paraStyle = new CanvasKit.ParagraphStyle({
        textStyle: {
            color: CanvasKit.BLACK,
            fontFamilies: ['Roboto'],
            fontSize: 50,
        },
        textAlign: CanvasKit.TextAlign.Left,
        maxLines: 5,
    });

    const builder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
    builder.addText('The quick brown fox ate a hamburgerfons and got sick.');
    const paragraph = builder.build();

    let wrapTo = 0;

    let X = 100;
    let Y = 100;

    const font = new CanvasKit.Font(null, 18);
    const fontPaint = new CanvasKit.Paint();
    fontPaint.setStyle(CanvasKit.PaintStyle.Fill);
    fontPaint.setAntiAlias(true);

    function drawFrame(canvas) {
      canvas.clear(CanvasKit.WHITE);
      wrapTo = 350 + 150 * Math.sin(Date.now() / 2000);
      paragraph.layout(wrapTo);
      canvas.drawParagraph(paragraph, 0, 0);

      canvas.drawLine(wrapTo, 0, wrapTo, 400, fontPaint);

      let posA = paragraph.getGlyphPositionAtCoordinate(X, Y);
      canvas.drawText(`At (${X.toFixed(2)}, ${Y.toFixed(2)}) glyph is ${posA.pos}`, 5, 450, fontPaint, font);

      surface.requestAnimationFrame(drawFrame);
    }
    surface.requestAnimationFrame(drawFrame);

    let interact = (e) => {
      X = e.offsetX*2; // multiply by 2 because the canvas is 300 css pixels wide,
      Y = e.offsetY*2; // but the canvas itself is 600px wide
    };

    document.getElementById('para1').addEventListener('pointermove', interact);
    return surface;
  }

  function RTShaderAPI1(CanvasKit) {
    if (!CanvasKit) {
      return;
    }

    const surface = CanvasKit.MakeCanvasSurface('rtshader');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    const canvas = surface.getCanvas();

    const effect = CanvasKit.RuntimeEffect.Make(spiralSkSL);
    const shader = effect.makeShader([
      0.5,
      150, 150,
      0, 1, 0, 1,
      1, 0, 0, 1], true);
    const paint = new CanvasKit.Paint();
    paint.setShader(shader);
    canvas.drawRect(CanvasKit.LTRBRect(0, 0, 300, 300), paint);

    surface.flush();
    shader.delete();
    paint.delete();
    effect.delete();
  }

  // RTShader2 demo
  Promise.all([ckLoaded, loadDog, loadMandrill]).then((values) => {
    const [CanvasKit, dogData, mandrillData] = values;
    const dogImg = CanvasKit.MakeImageFromEncoded(dogData);
    if (!dogImg) {
      console.error('could not decode dog');
      return;
    }
    const mandrillImg = CanvasKit.MakeImageFromEncoded(mandrillData);
    if (!mandrillImg) {
      console.error('could not decode mandrill');
      return;
    }
    const quadrantSize = 150;

    const dogShader = dogImg.makeShaderCubic(
        CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp,
        1/3, 1/3,
        CanvasKit.Matrix.scaled(quadrantSize/dogImg.width(),
        quadrantSize/dogImg.height()));
    const mandrillShader = mandrillImg.makeShaderCubic(
        CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp,
        1/3, 1/3,
        CanvasKit.Matrix.scaled(
            quadrantSize/mandrillImg.width(),
            quadrantSize/mandrillImg.height()));

    const surface = CanvasKit.MakeCanvasSurface('rtshader2');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    const prog = `
      uniform shader before_map;
      uniform shader after_map;
      uniform shader threshold_map;

      uniform float cutoff;
      uniform float slope;

      float smooth_cutoff(float x) {
          x = x * slope + (0.5 - slope * cutoff);
          return clamp(x, 0, 1);
      }

      half4 main(float2 xy) {
          half4 before = sample(before_map, xy);
          half4 after = sample(after_map, xy);

          float m = smooth_cutoff(sample(threshold_map, xy).r);
          return mix(before, after, half(m));
      }`;

    const canvas = surface.getCanvas();

    const thresholdEffect = CanvasKit.RuntimeEffect.Make(prog);
    const spiralEffect = CanvasKit.RuntimeEffect.Make(spiralSkSL);

    const draw = (x, y, shader) => {
      const paint = new CanvasKit.Paint();
      paint.setShader(shader);
      canvas.save();
      canvas.translate(x, y);
      canvas.drawRect(CanvasKit.LTRBRect(0, 0, quadrantSize, quadrantSize), paint);
      canvas.restore();
      paint.delete();
    };

    const offscreenSurface = CanvasKit.MakeSurface(quadrantSize, quadrantSize);
    const getBlurrySpiralShader = (rad_scale) => {
      const oCanvas = offscreenSurface.getCanvas();

      const spiralShader = spiralEffect.makeShader([
      rad_scale,
      quadrantSize/2, quadrantSize/2,
      1, 1, 1, 1,
      0, 0, 0, 1], true);

      return spiralShader;
      // TODO(kjlubick): The raster backend does not like atan or fract, so we can't
      // draw the shader into the offscreen canvas and mess with it. When we can, that
      // would be cool to show off.

      const blur = CanvasKit.ImageFilter.MakeBlur(0.1, 0.1, CanvasKit.TileMode.Clamp, null);

      const paint = new CanvasKit.Paint();
      paint.setShader(spiralShader);
      paint.setImageFilter(blur);
      oCanvas.drawRect(CanvasKit.LTRBRect(0, 0, quadrantSize, quadrantSize), paint);

      paint.delete();
      blur.delete();
      spiralShader.delete();
      return offscreenSurface.makeImageSnapshot()
                             .makeShader(CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp);

    };

    const drawFrame = () => {
      surface.requestAnimationFrame(drawFrame);
      const thresholdShader = getBlurrySpiralShader(Math.sin(Date.now() / 5000) / 2);

      const blendShader = thresholdEffect.makeShaderWithChildren(
        [0.5, 10],
        true, [dogShader, mandrillShader, thresholdShader]);
      draw(0, 0, blendShader);
      draw(quadrantSize, 0, thresholdShader);
      draw(0, quadrantSize, dogShader);
      draw(quadrantSize, quadrantSize, mandrillShader);

      blendShader.delete();
    };

    surface.requestAnimationFrame(drawFrame);
  });

  function SkpExample(CanvasKit, skpData) {
    if (!skpData || !CanvasKit) {
      return;
    }

    const surface = CanvasKit.MakeSWCanvasSurface('skp');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    const pic = CanvasKit.MakePicture(skpData);

    function drawFrame(canvas) {
      canvas.clear(CanvasKit.TRANSPARENT);
      // this particular file has a path drawing at (68,582) that's 1300x1300 pixels
      // scale it down to 500x500 and translate it to fit.
      const scale = 500.0/1300;
      canvas.scale(scale, scale);
      canvas.translate(-68, -582);
      canvas.drawPicture(pic);
    }
    // Intentionally just draw frame once
    surface.drawOnce(drawFrame);
  }

  function Camera3D(canvas, textureImgData, normalImgData, robotoData) {
    const surface = CanvasKit.MakeCanvasSurface('camera3d');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }

    const sizeX = document.getElementById('camera3d').width;
    const sizeY = document.getElementById('camera3d').height;

    let clickToWorld = CanvasKit.M44.identity();
    let worldToClick = CanvasKit.M44.identity();
    // rotation of the cube shown in the demo
    let rotation = CanvasKit.M44.identity();
    // temporary during a click and drag
    let clickRotation = CanvasKit.M44.identity();

    // A virtual sphere used for tumbling the object on screen.
    const vSphereCenter = [sizeX/2, sizeY/2];
    const vSphereRadius = Math.min(...vSphereCenter);

    // The rounded rect used for each face
    const margin = vSphereRadius / 20;
    const rr = CanvasKit.RRectXY(CanvasKit.LTRBRect(margin, margin,
      vSphereRadius - margin, vSphereRadius - margin), margin*2.5, margin*2.5);

    const camAngle = Math.PI / 12;
    const cam = {
      'eye'  : [0, 0, 1 / Math.tan(camAngle/2) - 1],
      'coa'  : [0, 0, 0],
      'up'   : [0, 1, 0],
      'near' : 0.05,
      'far'  : 4,
      'angle': camAngle,
    };

    let mouseDown = false;
    let clickDown = [0, 0]; // location of click down
    let lastMouse = [0, 0]; // last mouse location

    // keep spinning after mouse up. Also start spinning on load
    let axis = [0.4, 1, 1];
    let totalSpin = 0;
    let spinRate = 0.1;
    let lastRadians = 0;
    let spinning = setInterval(keepSpinning, 30);

    const textPaint = new CanvasKit.Paint();
    textPaint.setColor(CanvasKit.BLACK);
    textPaint.setAntiAlias(true);
    const roboto = CanvasKit.FontMgr.RefDefault().MakeTypefaceFromData(robotoData);
    const textFont = new CanvasKit.Font(roboto, 30);

    const imgscale = CanvasKit.Matrix.scaled(2, 2);
    const textureShader = CanvasKit.MakeImageFromEncoded(textureImgData).makeShaderCubic(
      CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp, 1/3, 1/3, imgscale);
    const normalShader = CanvasKit.MakeImageFromEncoded(normalImgData).makeShaderCubic(
      CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp, 1/3, 1/3, imgscale);
    const children = [textureShader, normalShader];

    const prog = `
      uniform shader color_map;
      uniform shader normal_map;

      uniform float3   lightPos;
      layout (marker=local_to_world)          uniform float4x4 localToWorld;
      layout (marker=normals(local_to_world)) uniform float4x4 localToWorldAdjInv;

      float3 convert_normal_sample(half4 c) {
        float3 n = 2 * c.rgb - 1;
        n.y = -n.y;
        return n;
      }

      half4 main(float2 p) {
        float3 norm = convert_normal_sample(sample(normal_map, p));
        float3 plane_norm = normalize(localToWorldAdjInv * float4(norm, 0)).xyz;

        float3 plane_pos = (localToWorld * float4(p, 0, 1)).xyz;
        float3 light_dir = normalize(lightPos - plane_pos);

        float ambient = 0.2;
        float dp = dot(plane_norm, light_dir);
        float scale = min(ambient + max(dp, 0), 1);

        return sample(color_map, p) * half4(float4(scale, scale, scale, 1));
      }
`;

    const fact = CanvasKit.RuntimeEffect.Make(prog);

    // properties of light
    let lightLocation = [...vSphereCenter];
    let lightDistance = vSphereRadius;
    let lightIconRadius = 12;
    let draggingLight = false;

    function computeLightWorldPos() {
      return CanvasKit.Vector.add(CanvasKit.Vector.mulScalar([...vSphereCenter, 0], 0.5),
        CanvasKit.Vector.mulScalar(vSphereUnitV3(lightLocation), lightDistance));
    }

    let lightWorldPos = computeLightWorldPos();

    function drawLight(canvas) {
      const paint = new CanvasKit.Paint();
      paint.setAntiAlias(true);
      paint.setColor(CanvasKit.WHITE);
      canvas.drawCircle(...lightLocation, lightIconRadius + 2, paint);
      paint.setColor(CanvasKit.BLACK);
      canvas.drawCircle(...lightLocation, lightIconRadius, paint);
    }

    // Takes an x and y rotation in radians and a scale and returns a 4x4 matrix used to draw a
    // face of the cube in that orientation.
    function faceM44(rx, ry, scale) {
      return CanvasKit.M44.multiply(
        CanvasKit.M44.rotated([0,1,0], ry),
        CanvasKit.M44.rotated([1,0,0], rx),
        CanvasKit.M44.translated([0, 0, scale]));
    }

    const faceScale = vSphereRadius/2
    const faces = [
      {matrix: faceM44(         0,         0, faceScale ), color:CanvasKit.RED}, // front
      {matrix: faceM44(         0,   Math.PI, faceScale ), color:CanvasKit.GREEN}, // back

      {matrix: faceM44( Math.PI/2,         0, faceScale ), color:CanvasKit.BLUE}, // top
      {matrix: faceM44(-Math.PI/2,         0, faceScale ), color:CanvasKit.CYAN}, // bottom

      {matrix: faceM44(         0, Math.PI/2, faceScale ), color:CanvasKit.MAGENTA}, // left
      {matrix: faceM44(         0,-Math.PI/2, faceScale ), color:CanvasKit.YELLOW}, // right
    ];

    // Returns a component of the matrix m indicating whether it faces the camera.
    // If it's positive for one of the matrices representing the face of the cube,
    // that face is currently in front.
    function front(m) {
      // Is this invertible?
      var m2 = CanvasKit.M44.invert(m);
      if (m2 === null) {
        m2 = CanvasKit.M44.identity();
      }
      // look at the sign of the z-scale of the inverse of m.
      // that's the number in row 2, col 2.
      return m2[10]
    }

    function setClickToWorld(canvas, matrix) {
      const l2d = canvas.getLocalToDevice();
      worldToClick = CanvasKit.M44.multiply(CanvasKit.M44.mustInvert(matrix), l2d);
      clickToWorld = CanvasKit.M44.mustInvert(worldToClick);
    }

    function drawCubeFace(canvas, m, color) {
      const trans = new CanvasKit.M44.translated([vSphereRadius/2, vSphereRadius/2, 0]);
      canvas.concat(CanvasKit.M44.multiply(trans, m, CanvasKit.M44.mustInvert(trans)));
      const znormal = front(canvas.getLocalToDevice());
      if (znormal < 0) {
        return; // skip faces facing backwards
      }
      // Pad with space for two 4x4 matrices. Even though the shader uses a layout()
      // statement to populate them, we still have to reserve space for them.
      const uniforms = [...lightWorldPos, ...Array(32).fill(0)];
      const paint = new CanvasKit.Paint();
      paint.setAntiAlias(true);
      const shader = fact.makeShaderWithChildren(uniforms, true /*=opaque*/, children);
      paint.setShader(shader);
      canvas.drawRRect(rr, paint);
      canvas.drawText(znormal.toFixed(2), faceScale*0.25, faceScale*0.4, textPaint, textFont);
    }

    function drawFrame(canvas) {
      const clickM = canvas.getLocalToDevice();
      canvas.save();
      canvas.translate(vSphereCenter[0] - vSphereRadius/2, vSphereCenter[1] - vSphereRadius/2);
      // pass surface dimensions as viewport size.
      canvas.concat(CanvasKit.M44.setupCamera(
        CanvasKit.LTRBRect(0, 0, vSphereRadius, vSphereRadius), vSphereRadius/2, cam));
      // Mark the matrix to make it available to the shader by this name.
      canvas.markCTM('local_to_world');
      setClickToWorld(canvas, clickM);
      for (let f of faces) {
        const saveCount = canvas.getSaveCount();
        canvas.save();
        drawCubeFace(canvas, CanvasKit.M44.multiply(clickRotation, rotation, f.matrix), f.color);
        canvas.restoreToCount(saveCount);
      }
      canvas.restore();  // camera
      canvas.restore();  // center the following content in the window

      // draw virtual sphere outline.
      const paint = new CanvasKit.Paint();
      paint.setAntiAlias(true);
      paint.setStyle(CanvasKit.PaintStyle.Stroke);
      paint.setColor(CanvasKit.Color(64, 255, 0, 1.0));
      canvas.drawCircle(vSphereCenter[0], vSphereCenter[1], vSphereRadius, paint);
      canvas.drawLine(vSphereCenter[0], vSphereCenter[1] - vSphereRadius,
                       vSphereCenter[0], vSphereCenter[1] + vSphereRadius, paint);
      canvas.drawLine(vSphereCenter[0] - vSphereRadius, vSphereCenter[1],
                       vSphereCenter[0] + vSphereRadius, vSphereCenter[1], paint);

      drawLight(canvas);
    }

    // convert a 2D point in the circle displayed on screen to a 3D unit vector.
    // the virtual sphere is a technique selecting a 3D direction by clicking on a the projection
    // of a hemisphere.
    function vSphereUnitV3(p) {
      // v = (v - fCenter) * (1 / fRadius);
      let v = CanvasKit.Vector.mulScalar(CanvasKit.Vector.sub(p, vSphereCenter), 1/vSphereRadius);

      // constrain the clicked point within the circle.
      let len2 = CanvasKit.Vector.lengthSquared(v);
      if (len2 > 1) {
          v = CanvasKit.Vector.normalize(v);
          len2 = 1;
      }
      // the closer to the edge of the circle you are, the closer z is to zero.
      const z = Math.sqrt(1 - len2);
      v.push(z);
      return v;
    }

    function computeVSphereRotation(start, end) {
      const u = vSphereUnitV3(start);
      const v = vSphereUnitV3(end);
      // Axis is in the scope of the Camera3D function so it can be used in keepSpinning.
      axis = CanvasKit.Vector.cross(u, v);
      const sinValue = CanvasKit.Vector.length(axis);
      const cosValue = CanvasKit.Vector.dot(u, v);

      let m = new CanvasKit.M44.identity();
      if (Math.abs(sinValue) > 0.000000001) {
          m = CanvasKit.M44.rotatedUnitSinCos(
            CanvasKit.Vector.mulScalar(axis, 1/sinValue), sinValue, cosValue);
          const radians = Math.atan(cosValue / sinValue);
          spinRate = lastRadians - radians;
          lastRadians = radians;
      }
      return m;
    }

    function keepSpinning() {
      totalSpin += spinRate;
      clickRotation = CanvasKit.M44.rotated(axis, totalSpin);
      spinRate *= .998;
      if (spinRate < 0.01) {
        stopSpinning();
      }
      surface.requestAnimationFrame(drawFrame);
    }

    function stopSpinning() {
        clearInterval(spinning);
        rotation = CanvasKit.M44.multiply(clickRotation, rotation);
        clickRotation = CanvasKit.M44.identity();
    }

    function interact(e) {
      const type = e.type;
      let eventPos = [e.offsetX, e.offsetY];
      if (type === 'lostpointercapture' || type === 'pointerup' || type == 'pointerleave') {
        if (draggingLight) {
          draggingLight = false;
        } else if (mouseDown) {
          mouseDown = false;
          if (spinRate > 0.02) {
            stopSpinning();
            spinning = setInterval(keepSpinning, 30);
          }
        } else {
          return;
        }
        return;
      } else if (type === 'pointermove') {
        if (draggingLight) {
          lightLocation = eventPos;
          lightWorldPos = computeLightWorldPos();
        } else if (mouseDown) {
          lastMouse = eventPos;
          clickRotation = computeVSphereRotation(clickDown, lastMouse);
        } else {
          return;
        }
      } else if (type === 'pointerdown') {
        // Are we repositioning the light?
        if (CanvasKit.Vector.dist(eventPos, lightLocation) < lightIconRadius) {
          draggingLight = true;
          return;
        }
        stopSpinning();
        mouseDown = true;
        clickDown = eventPos;
        lastMouse = eventPos;
      }
      surface.requestAnimationFrame(drawFrame);
    };

    document.getElementById('camera3d').addEventListener('pointermove', interact);
    document.getElementById('camera3d').addEventListener('pointerdown', interact);
    document.getElementById('camera3d').addEventListener('lostpointercapture', interact);
    document.getElementById('camera3d').addEventListener('pointerleave', interact);
    document.getElementById('camera3d').addEventListener('pointerup', interact);

    surface.requestAnimationFrame(drawFrame);
  }

  // Shows a hidden message by rotating all the characters in a kind of way that makes you
  // search with your mouse.
  function GlyphGame(canvas, robotoData) {
    const surface = CanvasKit.MakeCanvasSurface('glyphgame');
    if (!surface) {
      console.error('Could not make surface');
      return;
    }
    const sizeX = document.getElementById('glyphgame').width;
    const sizeY = document.getElementById('glyphgame').height;
    const halfDim = Math.min(sizeX, sizeY) / 2;
    const margin = 50;
    const marginTop = 25;
    let rotX = 0; //  expected to be updated in interact()
    let rotY = 0;
    let pointer = [500, 450];
    const radPerPixel = 0.005; // radians of subject rotation per pixel distance moved by mouse.

    const camAngle = Math.PI / 12;
    const cam = {
      'eye'  : [0, 0, 1 / Math.tan(camAngle/2) - 1],
      'coa'  : [0, 0, 0],
      'up'   : [0, 1, 0],
      'near' : 0.02,
      'far'  : 4,
      'angle': camAngle,
    };

    let lastImage = null;

    const fontMgr = CanvasKit.FontMgr.FromData([robotoData]);

    const paraStyle = new CanvasKit.ParagraphStyle({
        textStyle: {
            color: CanvasKit.Color(105, 56, 16), // brown
            fontFamilies: ['Roboto'],
            fontSize: 28,
        },
        textAlign: CanvasKit.TextAlign.Left,
    });
    const hStyle = CanvasKit.RectHeightStyle.Max;
    const wStyle = CanvasKit.RectWidthStyle.Tight;

    const quotes = [
      'Some activities superficially familiar to you are merely stupid and should be avoided for your safety, although they are not illegal as such. These include: giving your bank account details to the son of the Nigerian Minister of Finance; buying title to bridges, skyscrapers, spacecraft, planets, or other real assets; murder; selling your identity; and entering into financial contracts with entities running Economics 2.0 or higher.',
      // Charles Stross - Accelerando
      'If only there were evil people somewhere insidiously committing evil deeds, and it were necessary only to separate them from the rest of us and destroy them. But the line dividing good and evil cuts through the heart of every human being. And who is willing to destroy a piece of his own heart?',
      // Aleksandr Solzhenitsyn - The Gulag Archipelago
      'There is one metaphor of which the moderns are very fond; they are always saying, “You can’t put the clock back.” The simple and obvious answer is “You can.” A clock, being a piece of human construction, can be restored by the human finger to any figure or hour. In the same way society, being a piece of human construction, can be reconstructed upon any plan that has ever existed.',
      // G. K. Chesterton - What's Wrong With The World?
    ];

    // pick one at random
    const text = quotes[Math.floor(Math.random()*3)];
    const builder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
    builder.addText(text);
    const paragraph = builder.build();
    const font = new CanvasKit.Font(null, 18);
    // wrap the text to a given width.
    paragraph.layout(sizeX - margin*2);

    // to rotate every glyph individually, calculate the bounding rect of each one,
    // construct an array of rects and paragraphs that would draw each glyph individually.
    const letters = Array(text.length);
    for (let i = 0; i < text.length; i++) {
      const r = paragraph.getRectsForRange(i, i+1, hStyle, wStyle)[0];
      // The character is drawn with drawParagraph so we can pass the paraStyle,
      // and have our character be the exact size and shape the paragraph expected
      // when it wrapped the text. canvas.drawText wouldn't cut it.
      const tmpbuilder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
      tmpbuilder.addText(text[i]);
      const para = tmpbuilder.build();
      para.layout(100);
      letters[i] = {
        'r': r,
        'para': para,
      };
    }

    function drawFrame(canvas) {
      // persistence of vision effect is done by drawing the past frame as an image,
      // then covering with semitransparent background color.
      if (lastImage) {
        canvas.drawImage(lastImage, 0, 0, null);
        canvas.drawColor(CanvasKit.Color(171, 244, 255, 0.1)); // sky blue, almost transparent
      } else {
        canvas.clear(CanvasKit.Color(171, 244, 255)); // sky blue, opaque
      }
      canvas.save();
      // Set up 3D view enviroment
      canvas.concat(CanvasKit.M44.setupCamera(
        CanvasKit.LTRBRect(0, 0, sizeX, sizeY), halfDim, cam));

      // Rotate the whole paragraph as a unit.
      const paraRotPoint = [halfDim, halfDim, 1];
      canvas.concat(CanvasKit.M44.multiply(
        CanvasKit.M44.translated(paraRotPoint),
        CanvasKit.M44.rotated([0,1,0], rotX),
        CanvasKit.M44.rotated([1,0,0], rotY * 0.2),
        CanvasKit.M44.translated(CanvasKit.Vector.mulScalar(paraRotPoint, -1)),
      ));

      // Rotate every glyph in the paragraph individually.
      let i = 0;
      for (const letter of letters) {
        canvas.save();
        let r = letter['r'];
        // rotate about the center of the glyph's rect.
        rotationPoint = [
          margin + r[rectLeft] + (r[rectRight] - r[rectLeft]) / 2,
          marginTop + r[rectTop] + (r[rectBottom] - r[rectTop]) / 2,
          0
        ];
        distanceFromPointer = CanvasKit.Vector.dist(pointer, rotationPoint.slice(0, 2));
        // Rotate more around the Y-axis depending on the glyph's distance from the pointer.
        canvas.concat(CanvasKit.M44.multiply(
          CanvasKit.M44.translated(rotationPoint),
          // note that I'm rotating around the x axis first, undoing some of the rotation done to the whole
          // paragraph above, where x came second. If I rotated y first, a lot of letters would end up
          // upside down, which is a bit too hard to unscramble.
          CanvasKit.M44.rotated([1,0,0], rotY * -0.6),
          CanvasKit.M44.rotated([0,1,0], distanceFromPointer * -0.035),
          CanvasKit.M44.translated(CanvasKit.Vector.mulScalar(rotationPoint, -1)),
        ));
        canvas.drawParagraph(letter['para'], margin + r[rectLeft], marginTop + r[rectTop]);
        i++;
        canvas.restore();
      }
      canvas.restore();
      lastImage = surface.makeImageSnapshot();
    }

    function interact(e) {
      pointer = [e.offsetX, e.offsetY]
      rotX = (pointer[0] - halfDim) * radPerPixel;
      rotY = (pointer[1] - halfDim) * radPerPixel * -1;
      surface.requestAnimationFrame(drawFrame);
    };

    document.getElementById('glyphgame').addEventListener('pointermove', interact);
    surface.requestAnimationFrame(drawFrame);
  }

  function ColorSupport(CanvasKit) {
    const surface = CanvasKit.MakeCanvasSurface('colorsupport', CanvasKit.ColorSpace.ADOBE_RGB);
    if (!surface) {
      console.error('Could not make surface');
      return;
    }
    const canvas = surface.getCanvas();

    // If the surface is correctly initialized with a higher bit depth color type,
    // And chrome is compositing it into a buffer with the P3 color space,
    // then the inner round rect should be distinct and less saturated than the full red background.
    // Even if the monitor it is viewed on cannot accurately represent that color space.

    let red = CanvasKit.Color4f(1, 0, 0, 1);
    let paint = new CanvasKit.Paint();
    paint.setColor(red, CanvasKit.ColorSpace.ADOBE_RGB);
    canvas.drawPaint(paint);
    paint.setColor(red, CanvasKit.ColorSpace.DISPLAY_P3);
    canvas.drawRRect(CanvasKit.RRectXY([50, 50, 250, 250], 30, 30), paint);
    paint.setColor(red, CanvasKit.ColorSpace.SRGB);
    canvas.drawRRect(CanvasKit.RRectXY([100, 100, 200, 200], 30, 30), paint);

    surface.flush();
    surface.delete();
  }
</script>
-												Add markCTM(id) api, to replace functionality of saveCamera.

Will need followups on Vertices and SkSL to use these handles.

Change-Id: If775cb01168f601541e889bfa2421129e505b4a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/282416
Commit-Queue: Mike Reed <reed@google.com>
Reviewed-by: Brian Osman <brianosman@google.com>

											
										
										
											2020-04-09 16:35:09 +00:00
+								<!DOCTYPE html>
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								<title>CanvasKit Extra features (Skia via Web Assembly)</title>
 								<meta charset="utf-8" />
 								<meta http-equiv="X-UA-Compatible" content="IE=edge">
 								<meta name="viewport" content="width=device-width, initial-scale=1.0">
 								<style>
 								  canvas {
 								    border: 1px dashed #AAA;
 								  }
-												[canvaskit] Add full build to npm release.

Also rename //modules/canvaskit/canvaskit to //modules/canvaskit/npm_build
to make it more clear the purpose of that folder (what we ship to
npm and stage our builds for local testing).

Bug: skia:11203
Change-Id: I4299ded97d14f4155c36798d60e88a660ce6fe6a
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/372392
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2021-02-23 14:40:07 +00:00
+								  #sk_legos,#sk_drinks,#sk_party,#sk_onboarding, #sk_animated_gif {
 								      width: 300px;
 								      height: 300px;
 								  }
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
 								</style>
 								<h2> Skottie </h2>
 								<canvas id=sk_legos width=300 height=300></canvas>
 								<canvas id=sk_drinks width=500 height=500></canvas>
 								<canvas id=sk_party width=500 height=500></canvas>
 								<canvas id=sk_onboarding width=500 height=500></canvas>
 								<canvas id=sk_animated_gif width=500 height=500
 								        title='This is an animated gif being animated in Skottie'></canvas>
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
+								<h2> RT Shader </h2>
 								<canvas id=rtshader width=300 height=300></canvas>
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								<canvas id=rtshader2 width=300 height=300></canvas>
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								<h2> Particles </h2>
 								<canvas id=particles width=500 height=500></canvas>
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
+								<h2> Paragraph </h2>
-												[canvaskit] Enable tests for getGlyphPosition

Change-Id: Ibdd5987689305d383699153cdabdb6cbfd528a3e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/247599
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-10 17:18:35 +00:00
+								<canvas id=para1 width=600 height=600></canvas>
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
+								<h2> CanvasKit can serialize/deserialize .skp files</h2>
-												Replace red line skp with a prettier example
https://screenshot.googleplex.com/QqfxdSfccZD.png

Change-Id: Id7328beec06c54593a2f144dc4cd048442d9b443
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272059
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-03-06 15:51:08 +00:00
+								<canvas id=skp width=500 height=500></canvas>
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								<h2> 3D perspective transformations </h2>
 								<canvas id=camera3d width=500 height=500></canvas>
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								<canvas id=glyphgame width=500 height=500></canvas>
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
+								<h2> Support for extended color spaces </h2>
 								<a href="chrome://flags/#force-color-profile">Force P3 profile</a>
 								<canvas id=colorsupport width=300 height=300></canvas>
-												Restore offscreen surface example, Add GPU/CPU reporting function.

Change-Id: Ic360cef53aa22983e8b17a3488e97d6f28b27d97
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/288894
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Commit-Queue: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-05-11 12:24:16 +00:00
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								<script type="text/javascript" src="/node_modules/canvaskit/bin/canvaskit.js"></script>
 								<script type="text/javascript" charset="utf-8">
 								  var CanvasKit = null;
-												Move all canvaskit example resources to CDN

Change-Id: I92c83051017648d5703b06daac77e99ff40aeb2e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/273000
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-24 21:30:20 +00:00
+								  var cdn = 'https://storage.googleapis.com/skia-cdn/misc/';
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  const ckLoaded = CanvasKitInit({locateFile: (file) => '/node_modules/canvaskit/bin/'+file});
-												Restore offscreen surface example, Add GPU/CPU reporting function.

Change-Id: Ic360cef53aa22983e8b17a3488e97d6f28b27d97
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/288894
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Commit-Queue: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-05-11 12:24:16 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  const loadLegoJSON = fetch(cdn + 'lego_loader.json').then((response) => response.text());
 								  const loadDrinksJSON = fetch(cdn + 'drinks.json').then((response) => response.text());
 								  const loadConfettiJSON = fetch(cdn + 'confetti.json').then((response) => response.text());
 								  const loadOnboardingJSON = fetch(cdn + 'onboarding.json').then((response) => response.text());
 								  const loadMultiframeJSON = fetch(cdn + 'skottie_sample_multiframe.json').then((response) => response.text());
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  const loadFlightGif = fetch(cdn + 'flightAnim.gif').then((response) => response.arrayBuffer());
 								  const loadSkp = fetch(cdn + 'picture2.skp').then((response) => response.arrayBuffer());
 								  const loadFont = fetch(cdn + 'Roboto-Regular.ttf').then((response) => response.arrayBuffer());
 								  const loadDog = fetch(cdn + 'dog.jpg').then((response) => response.arrayBuffer());
 								  const loadMandrill = fetch(cdn + 'mandrill_256.png').then((response) => response.arrayBuffer());
 								  const loadBrickTex = fetch(cdn + 'brickwork-texture.jpg').then((response) => response.arrayBuffer());
 								  const loadBrickBump = fetch(cdn + 'brickwork_normal-map.jpg').then((response) => response.arrayBuffer());
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  const curves = {
 								    "MaxCount": 1000,
 								    "Drawable": {
 								      "Type": "SkCircleDrawable",
 								      "Radius": 2
 								    },
-												Update all example particle data to new single-code-chunk format

Change-Id: Ic53dc7ecab1b44761fe06e6b528864d24cc5fa58
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/363940
Reviewed-by: Brian Osman <brianosman@google.com>
Commit-Queue: Brian Osman <brianosman@google.com>

											
										
										
											2021-02-01 19:47:30 +00:00
+								    "Code": [`
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								      void effectSpawn(inout Effect effect) {
 								        effect.rate = 200;
 								        effect.color = float4(1, 0, 0, 1);
 								      }
 								      void spawn(inout Particle p) {
 								        p.lifetime = 3 + rand(p.seed);
 								        p.vel.y = -50;
 								      }
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								      void update(inout Particle p) {
 								        float w = mix(15, 3, p.age);
 								        p.pos.x = sin(radians(p.age * 320)) * mix(25, 10, p.age) + mix(-w, w, rand(p.seed));
 								        if (rand(p.seed) < 0.5) { p.pos.x = -p.pos.x; }
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								        p.color.g = (mix(75, 220, p.age) + mix(-30, 30, rand(p.seed))) / 255;
 								      }
 								      `
 								    ],
 								    "Bindings": []
 								  };
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  const spiralSkSL = `
 								  uniform float rad_scale;
 								  uniform float2 in_center;
 								  uniform float4 in_colors0;
 								  uniform float4 in_colors1;
-												SkRuntimeEffect SkSL has a new signature for main()

There is no more 'inout half4 color'. Effects return their output color.
If an effect wants the input color, it must use the (already existing)
approach of sampling a nullptr input shader.

The change is guarded for Chromium (so we can update their runtime color
filters in skia_renderer.cc).

For the GPU backend, FPs can now override usesExplicitReturn to indicate
that their emitCode will generate a return statement. If that's true,
then writeProcessorFunction doesn't inject the automatic return of the
output color, and emitFragProc will *always* wrap that FP in a helper
function, even as a top-level FP. GrSkSLFP opts in to this behavior, so
that the user-supplied return becomes the actual return in the FP's
emitCode.

Adapting the skvm code to this wasn't too bad: It looks fragile (what
happens if there are multiple returns?), but that's not really possible
today, without varying control flow.

Bug: skia:10613

Change-Id: I205b81fd87dd32bab30b6d6d5fc78853485da036
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/310756
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>
Reviewed-by: Mike Klein <mtklein@google.com>

											
										
										
											2020-08-13 20:59:48 +00:00
+								  half4 main(float2 p) {
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								      float2 pp = p - in_center;
 								      float radius = sqrt(dot(pp, pp));
 								      radius = sqrt(radius);
 								      float angle = atan(pp.y / pp.x);
 								      float t = (angle + 3.1415926/2) / (3.1415926);
 								      t += radius * rad_scale;
 								      t = fract(t);
-												SkRuntimeEffect SkSL has a new signature for main()

There is no more 'inout half4 color'. Effects return their output color.
If an effect wants the input color, it must use the (already existing)
approach of sampling a nullptr input shader.

The change is guarded for Chromium (so we can update their runtime color
filters in skia_renderer.cc).

For the GPU backend, FPs can now override usesExplicitReturn to indicate
that their emitCode will generate a return statement. If that's true,
then writeProcessorFunction doesn't inject the automatic return of the
output color, and emitFragProc will *always* wrap that FP in a helper
function, even as a top-level FP. GrSkSLFP opts in to this behavior, so
that the user-supplied return becomes the actual return in the FP's
emitCode.

Adapting the skvm code to this wasn't too bad: It looks fragile (what
happens if there are multiple returns?), but that's not really possible
today, without varying control flow.

Bug: skia:10613

Change-Id: I205b81fd87dd32bab30b6d6d5fc78853485da036
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/310756
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>
Reviewed-by: Mike Klein <mtklein@google.com>

											
										
										
											2020-08-13 20:59:48 +00:00
+								      return half4(mix(in_colors0, in_colors1, t));
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  }`;
 								  // Examples which only require canvaskit
 								  ckLoaded.then((CK) => {
 								    CanvasKit = CK;
 								    ParticlesAPI1(CanvasKit);
 								    RTShaderAPI1(CanvasKit);
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
+								    ColorSupport(CanvasKit);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  // Examples requiring external resources.
 								  // Set bounds to fix the 4:3 resolution of the legos
 								  Promise.all([ckLoaded, loadLegoJSON]).then(([ck, jsonstr]) => {
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								    SkottieExample(ck, 'sk_legos', jsonstr, [-50, 0, 350, 300]);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  // Re-size to fit
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								  let fullBounds = [0, 0, 500, 500];
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  Promise.all([ckLoaded, loadDrinksJSON]).then(([ck, jsonstr]) => {
 								    SkottieExample(ck, 'sk_drinks', jsonstr, fullBounds);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  Promise.all([ckLoaded, loadConfettiJSON]).then(([ck, jsonstr]) => {
 								    SkottieExample(ck, 'sk_party', jsonstr, fullBounds);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  Promise.all([ckLoaded, loadOnboardingJSON]).then(([ck, jsonstr]) => {
 								    SkottieExample(ck, 'sk_onboarding', jsonstr, fullBounds);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  Promise.all([ckLoaded, loadMultiframeJSON, loadFlightGif]).then(([ck, jsonstr, gif]) => {
 								    SkottieExample(ck, 'sk_animated_gif', jsonstr, fullBounds, {'image_0.png': gif});
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
+								  });
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								  Promise.all([ckLoaded, loadFont]).then((results) => {
 								    ParagraphAPI1(...results);
 								    GlyphGame(...results)
 								  });
-												Clean up promises in example.html and extra.html

Change-Id: I8b8500b4cda3d9b190bd8553ac5a68aef7b9007d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291338
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-26 15:28:55 +00:00
+								  Promise.all([ckLoaded, loadSkp]).then((results) => {SkpExample(...results)});
 								  Promise.all([ckLoaded, loadBrickTex, loadBrickBump, loadFont]).then((results) => {Camera3D(...results)});
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								  const rectLeft = 0;
 								  const rectTop = 1;
 								  const rectRight = 2;
 								  const rectBottom = 3;
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  function SkottieExample(CanvasKit, id, jsonStr, bounds, assets) {
 								    if (!CanvasKit || !jsonStr) {
 								      return;
 								    }
 								    const animation = CanvasKit.MakeManagedAnimation(jsonStr, assets);
 								    const duration = animation.duration() * 1000;
 								    const size = animation.size();
 								    let c = document.getElementById(id);
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								    bounds = bounds || CanvasKit.LTRBRect(0, 0, size.w, size.h);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
 								    // Basic managed animation test.
 								    if (id === 'sk_drinks') {
 								      animation.setColor('BACKGROUND_FILL', CanvasKit.Color(0, 163, 199, 1.0));
 								    }
 								    const surface = CanvasKit.MakeCanvasSurface(id);
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    let firstFrame = Date.now();
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								    function drawFrame(canvas) {
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								      let seek = ((Date.now() - firstFrame) / duration) % 1.0;
-												[canvaskit] Return damage rect from ManagedAnimation::seek()

This is useful to avoid redrawing unnecessarily when the animation
doesn't progress.

Bug: skia:9267
Change-Id: Id4184ae8308b8abd959fbfd1768e3e22d1efe0a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/229006
Reviewed-by: Ravi Mistry <rmistry@google.com>
Commit-Queue: Florin Malita <fmalita@chromium.org>

											
										
										
											2019-07-22 17:48:10 +00:00
+								      let damage = animation.seek(seek);
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
 								      if (damage[rectRight] > damage[rectLeft] && damage[rectBottom] > damage[rectTop]) {
-												[canvaskit] Return damage rect from ManagedAnimation::seek()

This is useful to avoid redrawing unnecessarily when the animation
doesn't progress.

Bug: skia:9267
Change-Id: Id4184ae8308b8abd959fbfd1768e3e22d1efe0a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/229006
Reviewed-by: Ravi Mistry <rmistry@google.com>
Commit-Queue: Florin Malita <fmalita@chromium.org>

											
										
										
											2019-07-22 17:48:10 +00:00
+								        canvas.clear(CanvasKit.WHITE);
 								        animation.render(canvas, bounds);
 								      }
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								      surface.requestAnimationFrame(drawFrame);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								    }
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								    surface.requestAnimationFrame(drawFrame);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
 								    return surface;
 								  }
 								  function ParticlesAPI1(CanvasKit) {
 								    const surface = CanvasKit.MakeCanvasSurface('particles');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const context = CanvasKit.currentContext();
 								    const canvas = surface.getCanvas();
-												Remove SkCurve and SkColorCurve

This was only being used in one effect (and for no good reason). SkSL is
plenty powerful to re-implement something similar if required, at no
real performance cost.

Re-implemented the one effect that used it with simpler math in the
script, updated the copy of that effect in the gallery.

Docs-Preview: https://skia.org/?cl=247040
Change-Id: I68c86d6550dd4f003f6ba5ecd0febab37b86540b
Bug: skia:9513
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/247040
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Brian Osman <brianosman@google.com>
Commit-Queue: Brian Osman <brianosman@google.com>

											
										
										
											2019-10-08 15:07:59 +00:00
+								    canvas.translate(250, 450);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
-												Remove SkCurve and SkColorCurve

This was only being used in one effect (and for no good reason). SkSL is
plenty powerful to re-implement something similar if required, at no
real performance cost.

Re-implemented the one effect that used it with simpler math in the
script, updated the copy of that effect in the gallery.

Docs-Preview: https://skia.org/?cl=247040
Change-Id: I68c86d6550dd4f003f6ba5ecd0febab37b86540b
Bug: skia:9513
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/247040
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Brian Osman <brianosman@google.com>
Commit-Queue: Brian Osman <brianosman@google.com>

											
										
										
											2019-10-08 15:07:59 +00:00
+								    const particles = CanvasKit.MakeParticles(JSON.stringify(curves));
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								    particles.start(Date.now() / 1000.0, true);
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								    function drawFrame(canvas) {
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								      canvas.clear(CanvasKit.BLACK);
 								      particles.update(Date.now() / 1000.0);
 								      particles.draw(canvas);
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								      surface.requestAnimationFrame(drawFrame);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								    }
-												[canvaskit] Add requestAnimationFrame to SkSurface

Bug: skia:
Change-Id: I8a15c10d0d8f20098d0e5357ffd602db97c50c84
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201986
Reviewed-by: Mike Reed <reed@google.com>

											
										
										
											2019-03-19 13:34:37 +00:00
+								    surface.requestAnimationFrame(drawFrame);
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								  }
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
+								  function ParagraphAPI1(CanvasKit, fontData) {
 								    if (!CanvasKit || !fontData) {
 								      return;
 								    }
 								    const surface = CanvasKit.MakeCanvasSurface('para1');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const canvas = surface.getCanvas();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const fontMgr = CanvasKit.FontMgr.FromData([fontData]);
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
 								    const paraStyle = new CanvasKit.ParagraphStyle({
 								        textStyle: {
 								            color: CanvasKit.BLACK,
 								            fontFamilies: ['Roboto'],
 								            fontSize: 50,
 								        },
 								        textAlign: CanvasKit.TextAlign.Left,
 								        maxLines: 5,
 								    });
 								    const builder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
 								    builder.addText('The quick brown fox ate a hamburgerfons and got sick.');
 								    const paragraph = builder.build();
 								    let wrapTo = 0;
 								    let X = 100;
 								    let Y = 100;
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const font = new CanvasKit.Font(null, 18);
 								    const fontPaint = new CanvasKit.Paint();
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
+								    fontPaint.setStyle(CanvasKit.PaintStyle.Fill);
 								    fontPaint.setAntiAlias(true);
 								    function drawFrame(canvas) {
 								      canvas.clear(CanvasKit.WHITE);
 								      wrapTo = 350 + 150 * Math.sin(Date.now() / 2000);
 								      paragraph.layout(wrapTo);
 								      canvas.drawParagraph(paragraph, 0, 0);
 								      canvas.drawLine(wrapTo, 0, wrapTo, 400, fontPaint);
 								      let posA = paragraph.getGlyphPositionAtCoordinate(X, Y);
-												[canvaskit] Enable tests for getGlyphPosition

Change-Id: Ibdd5987689305d383699153cdabdb6cbfd528a3e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/247599
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-10 17:18:35 +00:00
+								      canvas.drawText(`At (${X.toFixed(2)}, ${Y.toFixed(2)}) glyph is ${posA.pos}`, 5, 450, fontPaint, font);
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
 								      surface.requestAnimationFrame(drawFrame);
 								    }
 								    surface.requestAnimationFrame(drawFrame);
 								    let interact = (e) => {
-												[canvaskit] Enable tests for getGlyphPosition

Change-Id: Ibdd5987689305d383699153cdabdb6cbfd528a3e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/247599
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-10 17:18:35 +00:00
+								      X = e.offsetX*2; // multiply by 2 because the canvas is 300 css pixels wide,
 								      Y = e.offsetY*2; // but the canvas itself is 600px wide
-												[canvaskit] Initial addition of SkParagraph

There are more parts of ParagraphStyle and TextStyle, but
this should be a bulk of the components.

Bug: skia:9469
Change-Id: I87fff6700f41cff49ecbee3a1339e84c36699c93
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/244837
Reviewed-by: Julia Lavrova <jlavrova@google.com>

											
										
										
											2019-10-03 15:22:08 +00:00
+								    };
 								    document.getElementById('para1').addEventListener('pointermove', interact);
 								    return surface;
 								  }
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
 								  function RTShaderAPI1(CanvasKit) {
 								    if (!CanvasKit) {
 								      return;
 								    }
 								    const surface = CanvasKit.MakeCanvasSurface('rtshader');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const canvas = surface.getCanvas();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const effect = CanvasKit.RuntimeEffect.Make(spiralSkSL);
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								    const shader = effect.makeShader([
 .5,
 , 150,
 , 1, 0, 1,
 , 0, 0, 1], true);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const paint = new CanvasKit.Paint();
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
+								    paint.setShader(shader);
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								    canvas.drawRect(CanvasKit.LTRBRect(0, 0, 300, 300), paint);
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
 								    surface.flush();
 								    shader.delete();
 								    paint.delete();
-												Add SkRuntimeEffect::makeShader

This makes the effect *be* the factory, so we can get rid of
SkRuntimeShaderFactory (and later, SkColorFilterFactory).

Change-Id: I2cd95f1380a0ec1e65fe5a18b1226c042598a8bd
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/261439
Auto-Submit: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>
Commit-Queue: Brian Osman <brianosman@google.com>

											
										
										
											2019-12-26 13:43:05 +00:00
+								    effect.delete();
-												[canvaskit] Add _RTShaderFactory for demos

Change-Id: Ib6dc1ff861efe4040508fea09c8a66d8d06db597
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/258568
Reviewed-by: Brian Osman <brianosman@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>

											
										
										
											2019-12-06 18:55:58 +00:00
+								  }
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								  // RTShader2 demo
 								  Promise.all([ckLoaded, loadDog, loadMandrill]).then((values) => {
 								    const [CanvasKit, dogData, mandrillData] = values;
 								    const dogImg = CanvasKit.MakeImageFromEncoded(dogData);
 								    if (!dogImg) {
 								      console.error('could not decode dog');
 								      return;
 								    }
 								    const mandrillImg = CanvasKit.MakeImageFromEncoded(mandrillData);
 								    if (!mandrillImg) {
 								      console.error('could not decode mandrill');
 								      return;
 								    }
 								    const quadrantSize = 150;
-												[canvaskit] Add full build to npm release.

Also rename //modules/canvaskit/canvaskit to //modules/canvaskit/npm_build
to make it more clear the purpose of that folder (what we ship to
npm and stage our builds for local testing).

Bug: skia:11203
Change-Id: I4299ded97d14f4155c36798d60e88a660ce6fe6a
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/372392
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2021-02-23 14:40:07 +00:00
+								    const dogShader = dogImg.makeShaderCubic(
 								        CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp,
 /3, 1/3,
 								        CanvasKit.Matrix.scaled(quadrantSize/dogImg.width(),
 								        quadrantSize/dogImg.height()));
 								    const mandrillShader = mandrillImg.makeShaderCubic(
 								        CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp,
 /3, 1/3,
 								        CanvasKit.Matrix.scaled(
 								            quadrantSize/mandrillImg.width(),
 								            quadrantSize/mandrillImg.height()));
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
 								    const surface = CanvasKit.MakeCanvasSurface('rtshader2');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const prog = `
-												Runtime Effects: Support 'uniform shader' (vs. 'in shader')

The previous behavior leaked Skia-internal concepts into public SkSL.
Users coming from GLSL will expect that bindable/sampleable objects are
uniform (just like texture2D). This keeps the old support around (and
tested), but updates all of our examples to use 'uniform'.

Bug: skia:10679
Change-Id: I0c98162f5e21dad7014d9778ceb26143d2f6030e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/332376
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>

											
										
										
											2020-11-04 20:40:50 +00:00
+								      uniform shader before_map;
 								      uniform shader after_map;
 								      uniform shader threshold_map;
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
 								      uniform float cutoff;
 								      uniform float slope;
 								      float smooth_cutoff(float x) {
 								          x = x * slope + (0.5 - slope * cutoff);
 								          return clamp(x, 0, 1);
 								      }
-												SkRuntimeEffect SkSL has a new signature for main()

There is no more 'inout half4 color'. Effects return their output color.
If an effect wants the input color, it must use the (already existing)
approach of sampling a nullptr input shader.

The change is guarded for Chromium (so we can update their runtime color
filters in skia_renderer.cc).

For the GPU backend, FPs can now override usesExplicitReturn to indicate
that their emitCode will generate a return statement. If that's true,
then writeProcessorFunction doesn't inject the automatic return of the
output color, and emitFragProc will *always* wrap that FP in a helper
function, even as a top-level FP. GrSkSLFP opts in to this behavior, so
that the user-supplied return becomes the actual return in the FP's
emitCode.

Adapting the skvm code to this wasn't too bad: It looks fragile (what
happens if there are multiple returns?), but that's not really possible
today, without varying control flow.

Bug: skia:10613

Change-Id: I205b81fd87dd32bab30b6d6d5fc78853485da036
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/310756
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>
Reviewed-by: Mike Klein <mtklein@google.com>

											
										
										
											2020-08-13 20:59:48 +00:00
+								      half4 main(float2 xy) {
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								          half4 before = sample(before_map, xy);
 								          half4 after = sample(after_map, xy);
 								          float m = smooth_cutoff(sample(threshold_map, xy).r);
-												SkRuntimeEffect SkSL has a new signature for main()

There is no more 'inout half4 color'. Effects return their output color.
If an effect wants the input color, it must use the (already existing)
approach of sampling a nullptr input shader.

The change is guarded for Chromium (so we can update their runtime color
filters in skia_renderer.cc).

For the GPU backend, FPs can now override usesExplicitReturn to indicate
that their emitCode will generate a return statement. If that's true,
then writeProcessorFunction doesn't inject the automatic return of the
output color, and emitFragProc will *always* wrap that FP in a helper
function, even as a top-level FP. GrSkSLFP opts in to this behavior, so
that the user-supplied return becomes the actual return in the FP's
emitCode.

Adapting the skvm code to this wasn't too bad: It looks fragile (what
happens if there are multiple returns?), but that's not really possible
today, without varying control flow.

Bug: skia:10613

Change-Id: I205b81fd87dd32bab30b6d6d5fc78853485da036
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/310756
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>
Reviewed-by: Brian Salomon <bsalomon@google.com>
Reviewed-by: Mike Klein <mtklein@google.com>

											
										
										
											2020-08-13 20:59:48 +00:00
+								          return mix(before, after, half(m));
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								      }`;
 								    const canvas = surface.getCanvas();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const thresholdEffect = CanvasKit.RuntimeEffect.Make(prog);
 								    const spiralEffect = CanvasKit.RuntimeEffect.Make(spiralSkSL);
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
 								    const draw = (x, y, shader) => {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const paint = new CanvasKit.Paint();
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								      paint.setShader(shader);
 								      canvas.save();
 								      canvas.translate(x, y);
 								      canvas.drawRect(CanvasKit.LTRBRect(0, 0, quadrantSize, quadrantSize), paint);
 								      canvas.restore();
 								      paint.delete();
 								    };
 								    const offscreenSurface = CanvasKit.MakeSurface(quadrantSize, quadrantSize);
 								    const getBlurrySpiralShader = (rad_scale) => {
 								      const oCanvas = offscreenSurface.getCanvas();
 								      const spiralShader = spiralEffect.makeShader([
 								      rad_scale,
 								      quadrantSize/2, quadrantSize/2,
 , 1, 1, 1,
 , 0, 0, 1], true);
 								      return spiralShader;
 								      // TODO(kjlubick): The raster backend does not like atan or fract, so we can't
 								      // draw the shader into the offscreen canvas and mess with it. When we can, that
 								      // would be cool to show off.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const blur = CanvasKit.ImageFilter.MakeBlur(0.1, 0.1, CanvasKit.TileMode.Clamp, null);
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const paint = new CanvasKit.Paint();
-												[canvaskit] Support children shaders into runtime shaders

Change-Id: I88106babe35f6e5b3ee764e7fbaf82c7f43d136d
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272646
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-02-22 12:37:33 +00:00
+								      paint.setShader(spiralShader);
 								      paint.setImageFilter(blur);
 								      oCanvas.drawRect(CanvasKit.LTRBRect(0, 0, quadrantSize, quadrantSize), paint);
 								      paint.delete();
 								      blur.delete();
 								      spiralShader.delete();
 								      return offscreenSurface.makeImageSnapshot()
 								                             .makeShader(CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp);
 								    };
 								    const drawFrame = () => {
 								      surface.requestAnimationFrame(drawFrame);
 								      const thresholdShader = getBlurrySpiralShader(Math.sin(Date.now() / 5000) / 2);
 								      const blendShader = thresholdEffect.makeShaderWithChildren(
 								        [0.5, 10],
 								        true, [dogShader, mandrillShader, thresholdShader]);
 								      draw(0, 0, blendShader);
 								      draw(quadrantSize, 0, thresholdShader);
 								      draw(0, quadrantSize, dogShader);
 								      draw(quadrantSize, quadrantSize, mandrillShader);
 								      blendShader.delete();
 								    };
 								    surface.requestAnimationFrame(drawFrame);
 								  });
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
+								  function SkpExample(CanvasKit, skpData) {
 								    if (!skpData || !CanvasKit) {
 								      return;
 								    }
 								    const surface = CanvasKit.MakeSWCanvasSurface('skp');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const pic = CanvasKit.MakePicture(skpData);
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
 								    function drawFrame(canvas) {
 								      canvas.clear(CanvasKit.TRANSPARENT);
-												Replace red line skp with a prettier example
https://screenshot.googleplex.com/QqfxdSfccZD.png

Change-Id: Id7328beec06c54593a2f144dc4cd048442d9b443
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272059
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-03-06 15:51:08 +00:00
+								      // this particular file has a path drawing at (68,582) that's 1300x1300 pixels
 								      // scale it down to 500x500 and translate it to fit.
 								      const scale = 500.0/1300;
 								      canvas.scale(scale, scale);
 								      canvas.translate(-68, -582);
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
+								      canvas.drawPicture(pic);
 								    }
-												Add drawOnce() API to SkSurface.

The existing |SkSurface.requestAnimationFrame| API provides a convenient way of
drawing Skia animations using the same idiom as the well known
|Window.requestAnimationFrame|.  It gracefully handles providing the caller with
access to the right canvas, as well as flushing after the user-supplied
callback.

The new |SkSurface.drawOnce| API added in this change provides the same
conveniences around access to the right canvas and flushing, but for the
use-case where the user wishes to draw a single frame only.  Importantly, this
new API disposes of the SkSurface upon completion, i.e. frees the memory
associated with the underlying pixel storage an surface.  This avoids memory
leaks that occur when |SkSurface.requestAnimationFrame| is used for single-frame
purposes.

Bug: NONE
Change-Id: Ic4e48e65dffc4809513ceaf72260ac0432b98952
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/265604
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-22 21:49:41 +00:00
+								    // Intentionally just draw frame once
 								    surface.drawOnce(drawFrame);
-												Add support for reading .skp files in CanvasKit.

Bug: skia:9760
Change-Id: Ifecd819a0e4b6b8f8818ce593afd546e10c36df3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/262159
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-01-14 13:39:09 +00:00
+								  }
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								  function Camera3D(canvas, textureImgData, normalImgData, robotoData) {
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    const surface = CanvasKit.MakeCanvasSurface('camera3d');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const sizeX = document.getElementById('camera3d').width;
 								    const sizeY = document.getElementById('camera3d').height;
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    let clickToWorld = CanvasKit.M44.identity();
 								    let worldToClick = CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    // rotation of the cube shown in the demo
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    let rotation = CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    // temporary during a click and drag
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    let clickRotation = CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
 								    // A virtual sphere used for tumbling the object on screen.
 								    const vSphereCenter = [sizeX/2, sizeY/2];
 								    const vSphereRadius = Math.min(...vSphereCenter);
 								    // The rounded rect used for each face
 								    const margin = vSphereRadius / 20;
 								    const rr = CanvasKit.RRectXY(CanvasKit.LTRBRect(margin, margin,
 								      vSphereRadius - margin, vSphereRadius - margin), margin*2.5, margin*2.5);
 								    const camAngle = Math.PI / 12;
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								    const cam = {
 								      'eye'  : [0, 0, 1 / Math.tan(camAngle/2) - 1],
 								      'coa'  : [0, 0, 0],
 								      'up'   : [0, 1, 0],
 								      'near' : 0.05,
 								      'far'  : 4,
 								      'angle': camAngle,
 								    };
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								    let mouseDown = false;
 								    let clickDown = [0, 0]; // location of click down
 								    let lastMouse = [0, 0]; // last mouse location
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
 								    // keep spinning after mouse up. Also start spinning on load
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								    let axis = [0.4, 1, 1];
 								    let totalSpin = 0;
 								    let spinRate = 0.1;
 								    let lastRadians = 0;
 								    let spinning = setInterval(keepSpinning, 30);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const textPaint = new CanvasKit.Paint();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    textPaint.setColor(CanvasKit.BLACK);
 								    textPaint.setAntiAlias(true);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const roboto = CanvasKit.FontMgr.RefDefault().MakeTypefaceFromData(robotoData);
 								    const textFont = new CanvasKit.Font(roboto, 30);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const imgscale = CanvasKit.Matrix.scaled(2, 2);
-												[canvaskit] Add full build to npm release.

Also rename //modules/canvaskit/canvaskit to //modules/canvaskit/npm_build
to make it more clear the purpose of that folder (what we ship to
npm and stage our builds for local testing).

Bug: skia:11203
Change-Id: I4299ded97d14f4155c36798d60e88a660ce6fe6a
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/372392
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2021-02-23 14:40:07 +00:00
+								    const textureShader = CanvasKit.MakeImageFromEncoded(textureImgData).makeShaderCubic(
 								      CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp, 1/3, 1/3, imgscale);
 								    const normalShader = CanvasKit.MakeImageFromEncoded(normalImgData).makeShaderCubic(
 								      CanvasKit.TileMode.Clamp, CanvasKit.TileMode.Clamp, 1/3, 1/3, imgscale);
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								    const children = [textureShader, normalShader];
 								    const prog = `
-												Runtime Effects: Support 'uniform shader' (vs. 'in shader')

The previous behavior leaked Skia-internal concepts into public SkSL.
Users coming from GLSL will expect that bindable/sampleable objects are
uniform (just like texture2D). This keeps the old support around (and
tested), but updates all of our examples to use 'uniform'.

Bug: skia:10679
Change-Id: I0c98162f5e21dad7014d9778ceb26143d2f6030e
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/332376
Commit-Queue: Brian Osman <brianosman@google.com>
Reviewed-by: John Stiles <johnstiles@google.com>

											
										
										
											2020-11-04 20:40:50 +00:00
+								      uniform shader color_map;
 								      uniform shader normal_map;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
 								      uniform float3   lightPos;
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								      layout (marker=local_to_world)          uniform float4x4 localToWorld;
 								      layout (marker=normals(local_to_world)) uniform float4x4 localToWorldAdjInv;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
 								      float3 convert_normal_sample(half4 c) {
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								        float3 n = 2 * c.rgb - 1;
 								        n.y = -n.y;
 								        return n;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								      }
-												Fix cube map demo

Change-Id: Id8d3fce0840627de0414e26d1b2a60d89cfd2fe1
Docs-Preview: https://skia.org/?cl=316942
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/316942
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-09-15 17:08:50 +00:00
+								      half4 main(float2 p) {
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								        float3 norm = convert_normal_sample(sample(normal_map, p));
 								        float3 plane_norm = normalize(localToWorldAdjInv * float4(norm, 0)).xyz;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								        float3 plane_pos = (localToWorld * float4(p, 0, 1)).xyz;
 								        float3 light_dir = normalize(lightPos - plane_pos);
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								        float ambient = 0.2;
 								        float dp = dot(plane_norm, light_dir);
 								        float scale = min(ambient + max(dp, 0), 1);
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
-												Fix cube map demo

Change-Id: Id8d3fce0840627de0414e26d1b2a60d89cfd2fe1
Docs-Preview: https://skia.org/?cl=316942
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/316942
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-09-15 17:08:50 +00:00
+								        return sample(color_map, p) * half4(float4(scale, scale, scale, 1));
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								      }
 								`;
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const fact = CanvasKit.RuntimeEffect.Make(prog);
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
 								    // properties of light
 								    let lightLocation = [...vSphereCenter];
 								    let lightDistance = vSphereRadius;
 								    let lightIconRadius = 12;
 								    let draggingLight = false;
 								    function computeLightWorldPos() {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      return CanvasKit.Vector.add(CanvasKit.Vector.mulScalar([...vSphereCenter, 0], 0.5),
 								        CanvasKit.Vector.mulScalar(vSphereUnitV3(lightLocation), lightDistance));
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								    }
 								    let lightWorldPos = computeLightWorldPos();
 								    function drawLight(canvas) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const paint = new CanvasKit.Paint();
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								      paint.setAntiAlias(true);
 								      paint.setColor(CanvasKit.WHITE);
 								      canvas.drawCircle(...lightLocation, lightIconRadius + 2, paint);
 								      paint.setColor(CanvasKit.BLACK);
 								      canvas.drawCircle(...lightLocation, lightIconRadius, paint);
 								    }
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    // Takes an x and y rotation in radians and a scale and returns a 4x4 matrix used to draw a
 								    // face of the cube in that orientation.
 								    function faceM44(rx, ry, scale) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      return CanvasKit.M44.multiply(
 								        CanvasKit.M44.rotated([0,1,0], ry),
 								        CanvasKit.M44.rotated([1,0,0], rx),
 								        CanvasKit.M44.translated([0, 0, scale]));
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    }
 								    const faceScale = vSphereRadius/2
 								    const faces = [
 								      {matrix: faceM44(         0,         0, faceScale ), color:CanvasKit.RED}, // front
 								      {matrix: faceM44(         0,   Math.PI, faceScale ), color:CanvasKit.GREEN}, // back
 								      {matrix: faceM44( Math.PI/2,         0, faceScale ), color:CanvasKit.BLUE}, // top
 								      {matrix: faceM44(-Math.PI/2,         0, faceScale ), color:CanvasKit.CYAN}, // bottom
 								      {matrix: faceM44(         0, Math.PI/2, faceScale ), color:CanvasKit.MAGENTA}, // left
 								      {matrix: faceM44(         0,-Math.PI/2, faceScale ), color:CanvasKit.YELLOW}, // right
 								    ];
 								    // Returns a component of the matrix m indicating whether it faces the camera.
 								    // If it's positive for one of the matrices representing the face of the cube,
 								    // that face is currently in front.
 								    function front(m) {
 								      // Is this invertible?
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      var m2 = CanvasKit.M44.invert(m);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      if (m2 === null) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        m2 = CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      }
 								      // look at the sign of the z-scale of the inverse of m.
 								      // that's the number in row 2, col 2.
 								      return m2[10]
 								    }
 								    function setClickToWorld(canvas, matrix) {
-												Remove experimental from name of skm44 canvas methods

Change-Id: If275ede5049b74c0c4c36eb5ac5697ec63737228
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/275047
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-03-04 20:50:42 +00:00
+								      const l2d = canvas.getLocalToDevice();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      worldToClick = CanvasKit.M44.multiply(CanvasKit.M44.mustInvert(matrix), l2d);
 								      clickToWorld = CanvasKit.M44.mustInvert(worldToClick);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    }
 								    function drawCubeFace(canvas, m, color) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const trans = new CanvasKit.M44.translated([vSphereRadius/2, vSphereRadius/2, 0]);
 								      canvas.concat(CanvasKit.M44.multiply(trans, m, CanvasKit.M44.mustInvert(trans)));
-												Remove experimental from name of skm44 canvas methods

Change-Id: If275ede5049b74c0c4c36eb5ac5697ec63737228
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/275047
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-03-04 20:50:42 +00:00
+								      const znormal = front(canvas.getLocalToDevice());
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      if (znormal < 0) {
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								        return; // skip faces facing backwards
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      }
-												Add markCTM to canvaskit API, use in 3D cube example

Change-Id: Id0eafdf0fd69f080e26e2bee5c7b38eb55b6a5c0
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/287897
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-05-06 20:22:33 +00:00
+								      // Pad with space for two 4x4 matrices. Even though the shader uses a layout()
 								      // statement to populate them, we still have to reserve space for them.
 								      const uniforms = [...lightWorldPos, ...Array(32).fill(0)];
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const paint = new CanvasKit.Paint();
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								      paint.setAntiAlias(true);
 								      const shader = fact.makeShaderWithChildren(uniforms, true /*=opaque*/, children);
 								      paint.setShader(shader);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      canvas.drawRRect(rr, paint);
 								      canvas.drawText(znormal.toFixed(2), faceScale*0.25, faceScale*0.4, textPaint, textFont);
 								    }
 								    function drawFrame(canvas) {
-												Remove experimental from name of skm44 canvas methods

Change-Id: If275ede5049b74c0c4c36eb5ac5697ec63737228
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/275047
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-03-04 20:50:42 +00:00
+								      const clickM = canvas.getLocalToDevice();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      canvas.save();
 								      canvas.translate(vSphereCenter[0] - vSphereRadius/2, vSphereCenter[1] - vSphereRadius/2);
 								      // pass surface dimensions as viewport size.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      canvas.concat(CanvasKit.M44.setupCamera(
-												Helper function for camera setup

Change-Id: I839fea29c2e56cfc2a4e4557da3197bf211513eb
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/299654
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-07-06 23:50:13 +00:00
+								        CanvasKit.LTRBRect(0, 0, vSphereRadius, vSphereRadius), vSphereRadius/2, cam));
 								      // Mark the matrix to make it available to the shader by this name.
 								      canvas.markCTM('local_to_world');
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      setClickToWorld(canvas, clickM);
 								      for (let f of faces) {
 								        const saveCount = canvas.getSaveCount();
 								        canvas.save();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        drawCubeFace(canvas, CanvasKit.M44.multiply(clickRotation, rotation, f.matrix), f.color);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								        canvas.restoreToCount(saveCount);
 								      }
 								      canvas.restore();  // camera
 								      canvas.restore();  // center the following content in the window
 								      // draw virtual sphere outline.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      const paint = new CanvasKit.Paint();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      paint.setAntiAlias(true);
 								      paint.setStyle(CanvasKit.PaintStyle.Stroke);
 								      paint.setColor(CanvasKit.Color(64, 255, 0, 1.0));
 								      canvas.drawCircle(vSphereCenter[0], vSphereCenter[1], vSphereRadius, paint);
 								      canvas.drawLine(vSphereCenter[0], vSphereCenter[1] - vSphereRadius,
 								                       vSphereCenter[0], vSphereCenter[1] + vSphereRadius, paint);
 								      canvas.drawLine(vSphereCenter[0] - vSphereRadius, vSphereCenter[1],
 								                       vSphereCenter[0] + vSphereRadius, vSphereCenter[1], paint);
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
 								      drawLight(canvas);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    }
 								    // convert a 2D point in the circle displayed on screen to a 3D unit vector.
 								    // the virtual sphere is a technique selecting a 3D direction by clicking on a the projection
 								    // of a hemisphere.
 								    function vSphereUnitV3(p) {
 								      // v = (v - fCenter) * (1 / fRadius);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      let v = CanvasKit.Vector.mulScalar(CanvasKit.Vector.sub(p, vSphereCenter), 1/vSphereRadius);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
 								      // constrain the clicked point within the circle.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      let len2 = CanvasKit.Vector.lengthSquared(v);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      if (len2 > 1) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								          v = CanvasKit.Vector.normalize(v);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								          len2 = 1;
 								      }
 								      // the closer to the edge of the circle you are, the closer z is to zero.
 								      const z = Math.sqrt(1 - len2);
 								      v.push(z);
 								      return v;
 								    }
 								    function computeVSphereRotation(start, end) {
 								      const u = vSphereUnitV3(start);
 								      const v = vSphereUnitV3(end);
 								      // Axis is in the scope of the Camera3D function so it can be used in keepSpinning.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      axis = CanvasKit.Vector.cross(u, v);
 								      const sinValue = CanvasKit.Vector.length(axis);
 								      const cosValue = CanvasKit.Vector.dot(u, v);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      let m = new CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      if (Math.abs(sinValue) > 0.000000001) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								          m = CanvasKit.M44.rotatedUnitSinCos(
 								            CanvasKit.Vector.mulScalar(axis, 1/sinValue), sinValue, cosValue);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								          const radians = Math.atan(cosValue / sinValue);
 								          spinRate = lastRadians - radians;
 								          lastRadians = radians;
 								      }
 								      return m;
 								    }
 								    function keepSpinning() {
 								      totalSpin += spinRate;
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      clickRotation = CanvasKit.M44.rotated(axis, totalSpin);
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      spinRate *= .998;
 								      if (spinRate < 0.01) {
 								        stopSpinning();
 								      }
 								      surface.requestAnimationFrame(drawFrame);
 								    }
 								    function stopSpinning() {
 								        clearInterval(spinning);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        rotation = CanvasKit.M44.multiply(clickRotation, rotation);
 								        clickRotation = CanvasKit.M44.identity();
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								    }
 								    function interact(e) {
 								      const type = e.type;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								      let eventPos = [e.offsetX, e.offsetY];
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      if (type === 'lostpointercapture' || type === 'pointerup' || type == 'pointerleave') {
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								        if (draggingLight) {
 								          draggingLight = false;
 								        } else if (mouseDown) {
 								          mouseDown = false;
 								          if (spinRate > 0.02) {
 								            stopSpinning();
 								            spinning = setInterval(keepSpinning, 30);
 								          }
 								        } else {
 								          return;
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								        }
 								        return;
 								      } else if (type === 'pointermove') {
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								        if (draggingLight) {
 								          lightLocation = eventPos;
 								          lightWorldPos = computeLightWorldPos();
 								        } else if (mouseDown) {
 								          lastMouse = eventPos;
 								          clickRotation = computeVSphereRotation(clickDown, lastMouse);
 								        } else {
 								          return;
 								        }
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      } else if (type === 'pointerdown') {
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								        // Are we repositioning the light?
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        if (CanvasKit.Vector.dist(eventPos, lightLocation) < lightIconRadius) {
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								          draggingLight = true;
 								          return;
 								        }
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								        stopSpinning();
 								        mouseDown = true;
-												Modify 3D example with light and bump shader.

Depends on what I assume the final version of https://skia-review.googlesource.com/c/skia/+/272646 will be
Change-Id: I53485c5f47e0fef120c8a1bd6d0620fddfb3cde9
Bug: skia:9866
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/272529
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-23 19:26:33 +00:00
+								        clickDown = eventPos;
 								        lastMouse = eventPos;
-												Expose 4x4 matrices on canvas in a way similar to SimpleMatrix, add example.

Bug: skia:9866
Change-Id: I718455743e482e4f60a462027b629dc19b1dbad3
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/270201
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-02-21 22:15:22 +00:00
+								      }
 								      surface.requestAnimationFrame(drawFrame);
 								    };
 								    document.getElementById('camera3d').addEventListener('pointermove', interact);
 								    document.getElementById('camera3d').addEventListener('pointerdown', interact);
 								    document.getElementById('camera3d').addEventListener('lostpointercapture', interact);
 								    document.getElementById('camera3d').addEventListener('pointerleave', interact);
 								    document.getElementById('camera3d').addEventListener('pointerup', interact);
 								    surface.requestAnimationFrame(drawFrame);
 								  }
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								  // Shows a hidden message by rotating all the characters in a kind of way that makes you
 								  // search with your mouse.
 								  function GlyphGame(canvas, robotoData) {
 								    const surface = CanvasKit.MakeCanvasSurface('glyphgame');
 								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const sizeX = document.getElementById('glyphgame').width;
 								    const sizeY = document.getElementById('glyphgame').height;
 								    const halfDim = Math.min(sizeX, sizeY) / 2;
 								    const margin = 50;
 								    const marginTop = 25;
 								    let rotX = 0; //  expected to be updated in interact()
 								    let rotY = 0;
 								    let pointer = [500, 450];
 								    const radPerPixel = 0.005; // radians of subject rotation per pixel distance moved by mouse.
 								    const camAngle = Math.PI / 12;
 								    const cam = {
 								      'eye'  : [0, 0, 1 / Math.tan(camAngle/2) - 1],
 								      'coa'  : [0, 0, 0],
 								      'up'   : [0, 1, 0],
 								      'near' : 0.02,
 								      'far'  : 4,
 								      'angle': camAngle,
 								    };
 								    let lastImage = null;
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const fontMgr = CanvasKit.FontMgr.FromData([robotoData]);
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
 								    const paraStyle = new CanvasKit.ParagraphStyle({
 								        textStyle: {
 								            color: CanvasKit.Color(105, 56, 16), // brown
 								            fontFamilies: ['Roboto'],
 								            fontSize: 28,
 								        },
 								        textAlign: CanvasKit.TextAlign.Left,
 								    });
 								    const hStyle = CanvasKit.RectHeightStyle.Max;
 								    const wStyle = CanvasKit.RectWidthStyle.Tight;
 								    const quotes = [
 								      'Some activities superficially familiar to you are merely stupid and should be avoided for your safety, although they are not illegal as such. These include: giving your bank account details to the son of the Nigerian Minister of Finance; buying title to bridges, skyscrapers, spacecraft, planets, or other real assets; murder; selling your identity; and entering into financial contracts with entities running Economics 2.0 or higher.',
 								      // Charles Stross - Accelerando
 								      'If only there were evil people somewhere insidiously committing evil deeds, and it were necessary only to separate them from the rest of us and destroy them. But the line dividing good and evil cuts through the heart of every human being. And who is willing to destroy a piece of his own heart?',
 								      // Aleksandr Solzhenitsyn - The Gulag Archipelago
 								      'There is one metaphor of which the moderns are very fond; they are always saying, “You can’t put the clock back.” The simple and obvious answer is “You can.” A clock, being a piece of human construction, can be restored by the human finger to any figure or hour. In the same way society, being a piece of human construction, can be reconstructed upon any plan that has ever existed.',
 								      // G. K. Chesterton - What's Wrong With The World?
 								    ];
 								    // pick one at random
 								    const text = quotes[Math.floor(Math.random()*3)];
 								    const builder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
 								    builder.addText(text);
 								    const paragraph = builder.build();
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const font = new CanvasKit.Font(null, 18);
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								    // wrap the text to a given width.
 								    paragraph.layout(sizeX - margin*2);
 								    // to rotate every glyph individually, calculate the bounding rect of each one,
 								    // construct an array of rects and paragraphs that would draw each glyph individually.
 								    const letters = Array(text.length);
 								    for (let i = 0; i < text.length; i++) {
 								      const r = paragraph.getRectsForRange(i, i+1, hStyle, wStyle)[0];
 								      // The character is drawn with drawParagraph so we can pass the paraStyle,
 								      // and have our character be the exact size and shape the paragraph expected
 								      // when it wrapped the text. canvas.drawText wouldn't cut it.
 								      const tmpbuilder = CanvasKit.ParagraphBuilder.Make(paraStyle, fontMgr);
 								      tmpbuilder.addText(text[i]);
 								      const para = tmpbuilder.build();
 								      para.layout(100);
 								      letters[i] = {
 								        'r': r,
 								        'para': para,
 								      };
 								    }
 								    function drawFrame(canvas) {
 								      // persistence of vision effect is done by drawing the past frame as an image,
 								      // then covering with semitransparent background color.
 								      if (lastImage) {
 								        canvas.drawImage(lastImage, 0, 0, null);
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								        canvas.drawColor(CanvasKit.Color(171, 244, 255, 0.1)); // sky blue, almost transparent
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								      } else {
 								        canvas.clear(CanvasKit.Color(171, 244, 255)); // sky blue, opaque
 								      }
 								      canvas.save();
 								      // Set up 3D view enviroment
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      canvas.concat(CanvasKit.M44.setupCamera(
-												Helper function for camera setup

Change-Id: I839fea29c2e56cfc2a4e4557da3197bf211513eb
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/299654
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-07-06 23:50:13 +00:00
+								        CanvasKit.LTRBRect(0, 0, sizeX, sizeY), halfDim, cam));
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
 								      // Rotate the whole paragraph as a unit.
 								      const paraRotPoint = [halfDim, halfDim, 1];
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								      canvas.concat(CanvasKit.M44.multiply(
 								        CanvasKit.M44.translated(paraRotPoint),
 								        CanvasKit.M44.rotated([0,1,0], rotX),
 								        CanvasKit.M44.rotated([1,0,0], rotY * 0.2),
 								        CanvasKit.M44.translated(CanvasKit.Vector.mulScalar(paraRotPoint, -1)),
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								      ));
 								      // Rotate every glyph in the paragraph individually.
 								      let i = 0;
 								      for (const letter of letters) {
 								        canvas.save();
 								        let r = letter['r'];
 								        // rotate about the center of the glyph's rect.
 								        rotationPoint = [
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								          margin + r[rectLeft] + (r[rectRight] - r[rectLeft]) / 2,
 								          marginTop + r[rectTop] + (r[rectBottom] - r[rectTop]) / 2,
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
 								        ];
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        distanceFromPointer = CanvasKit.Vector.dist(pointer, rotationPoint.slice(0, 2));
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								        // Rotate more around the Y-axis depending on the glyph's distance from the pointer.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								        canvas.concat(CanvasKit.M44.multiply(
 								          CanvasKit.M44.translated(rotationPoint),
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								          // note that I'm rotating around the x axis first, undoing some of the rotation done to the whole
 								          // paragraph above, where x came second. If I rotated y first, a lot of letters would end up
 								          // upside down, which is a bit too hard to unscramble.
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								          CanvasKit.M44.rotated([1,0,0], rotY * -0.6),
 								          CanvasKit.M44.rotated([0,1,0], distanceFromPointer * -0.035),
 								          CanvasKit.M44.translated(CanvasKit.Vector.mulScalar(rotationPoint, -1)),
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								        ));
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								        canvas.drawParagraph(letter['para'], margin + r[rectLeft], marginTop + r[rectTop]);
-												A example of 3D rotation that shows a quotation with all the glyphs rotated.

Change-Id: Id8a4320be2700c38f7f6de2ddedfe0fb410e4a23
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/293445
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>

											
										
										
											2020-06-02 17:47:47 +00:00
+								        i++;
 								        canvas.restore();
 								      }
 								      canvas.restore();
 								      lastImage = surface.makeImageSnapshot();
 								    }
 								    function interact(e) {
 								      pointer = [e.offsetX, e.offsetY]
 								      rotX = (pointer[0] - halfDim) * radPerPixel;
 								      rotY = (pointer[1] - halfDim) * radPerPixel * -1;
 								      surface.requestAnimationFrame(drawFrame);
 								    };
 								    document.getElementById('glyphgame').addEventListener('pointermove', interact);
 								    surface.requestAnimationFrame(drawFrame);
 								  }
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
+								  function ColorSupport(CanvasKit) {
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    const surface = CanvasKit.MakeCanvasSurface('colorsupport', CanvasKit.ColorSpace.ADOBE_RGB);
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
+								    if (!surface) {
 								      console.error('Could not make surface');
 								      return;
 								    }
 								    const canvas = surface.getCanvas();
 								    // If the surface is correctly initialized with a higher bit depth color type,
 								    // And chrome is compositing it into a buffer with the P3 color space,
 								    // then the inner round rect should be distinct and less saturated than the full red background.
 								    // Even if the monitor it is viewed on cannot accurately represent that color space.
 								    let red = CanvasKit.Color4f(1, 0, 0, 1);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    let paint = new CanvasKit.Paint();
 								    paint.setColor(red, CanvasKit.ColorSpace.ADOBE_RGB);
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
+								    canvas.drawPaint(paint);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    paint.setColor(red, CanvasKit.ColorSpace.DISPLAY_P3);
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								    canvas.drawRRect(CanvasKit.RRectXY([50, 50, 250, 250], 30, 30), paint);
-												[canvaskit] Remove Sk from nearly all function/type names.

This is a massive breaking change for all existing users of CanvasKit.

It will be (one of the only) changes in 0.19.0 to make the transition
easier.

Suggested reviewing order:
 - index.d.ts (to see type changes). Notice SkPicture still has Sk
   prefix, but no other types do (this felt "right" since Sk is
   part of the name of the type, but I can be swayed on this).
 - canvaskit-wasm-tests.ts
 - tests/*.spec.js
 - interface.js and helper.js
 - html examples
 - markdown files

Change-Id: I3b3d3815df2078f986893df3c70101d6248c117d
Docs-Preview: https://skia.org/?cl=322617
Bug: skia:10717
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/322617
Commit-Queue: Kevin Lubick <kjlubick@google.com>
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-10-07 20:09:22 +00:00
+								    paint.setColor(red, CanvasKit.ColorSpace.SRGB);
-												Reland "[canvaskit] Change SkRects to be arrays, not objects."

This is a reland of bdc214a50e854fabb62bda126977b63e298dea9f

The CPU version of SkottieWasm is timing out for reasons unknown,
but the GPU version is happy. I think we can get rid of the CPU
version of the job since it has been more or less superseded by
the SkottieFrames one (and the latter is more stable).

Original change's description:
> [canvaskit] Change SkRects to be arrays, not objects.
>
> This changes several APIs, so there are lots of breaking
> notes in the Changelog.
>
> This made the "draw 100 colored regions" benchmark about
> 20% faster (1ms -> .8ms).
>
> In theory, rendering should stay the same.
>
> Change-Id: Ib80b15e2d980ad5d568fff4460d2b529766c1b36
> Reviewed-on: https://skia-review.googlesource.com/c/skia/+/312491
> Reviewed-by: Nathaniel Nifong <nifong@google.com>

Change-Id: I674aba85ecfb30b72e94cbaf89b2d97bfae3b7a4
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/315142
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2020-09-03 14:02:10 +00:00
+								    canvas.drawRRect(CanvasKit.RRectXY([100, 100, 200, 200], 30, 30), paint);
-												Wide color gamut support and working example.

Fixes release-cpu build issue, un-revert cl 289733

Color space arguments accepted at surface creation, paint, gradient, and other call sites.
Works correctly only when chrome happens to be rendering itself in the same color space
the canvaskit user has chosen, there's not yet end to end color management of
canvases supported in browsers.

readPixels not yet working due to possible chrome bug.

Reviewed-on: https://skia-review.googlesource.com/c/skia/+/289733
Commit-Queue: Nathaniel Nifong <nifong@google.com>
Reviewed-by: Kevin Lubick <kjlubick@google.com>
Change-Id: I65ce1c643dac57e14b8476f598c96b12b7e040ce
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/291896

											
										
										
											2020-05-26 17:10:20 +00:00
 								    surface.flush();
 								    surface.delete();
 								  }
-												[canvaskit] Various cleanups around docs/build

 - Break up example into two pages
 - Deprecate SkCanvas.flush()
 - add build flag that helps with certain GPU's webgl support

Bug: skia:
Change-Id: I49b1dbfecc10265a14ef4cbe54f7e8f0306e12ac
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/201649
Reviewed-by: Nathaniel Nifong <nifong@google.com>

											
										
										
											2019-03-18 15:20:53 +00:00
+								</script>