Dessiner à l'écran

Mettons en pratique tout ce que nous venons de voir avec un exemple où nous allons dessiner un carré rouge à l'écran. Voici les fonctions dont nous aurons besoin:

let get_2d_context = register_function("
  (context, selectorStart, selectorEnd) => {
    let selector = context.getUtf8FromMemory(
      selectorStart,selectorEnd);
    let domEl = document.querySelector(selector);
    let ctx = domEl.getContext("2d");
    let objHandle = context.storeObject(ctx);
    return objHandle;
  }");

let set_context_color = register_function("
  (context, ctxHandle, colorStart, colorEnd) => {
    let color = context.getUtf8FromMemory(
      colorStart,colorEnd);
    let ctx = context.getObject(ctxHandle);
    ctx.fillStyle = color;
  }");

let draw_rect = register_function("
  (context, ctxHandle, x, y, width, height) => {
    let ctx = context.getObject(ctxHandle);
    ctx.fillRect(x,y,width,height);
  }");