_bindHammer() {
    if (this.hammer !== undefined) {
      this.hammer.destroy();
    }
    this.drag = {};
    this.pinch = {};

    // init hammer
    this.hammer = new Hammer(this.frame.canvas);
    this.hammer.get("pinch").set({ enable: true });
    // enable to get better response, todo: test on mobile.
    this.hammer
      .get("pan")
      .set({ threshold: 5, direction: Hammer.DIRECTION_ALL });

    onTouch(this.hammer, (event) => {
      this.body.eventListeners.onTouch(event);
    });
    this.hammer.on("tap", (event) => {
      this.body.eventListeners.onTap(event);
    });
    this.hammer.on("doubletap", (event) => {
      this.body.eventListeners.onDoubleTap(event);
    });
    this.hammer.on("press", (event) => {
      this.body.eventListeners.onHold(event);
    });
    this.hammer.on("panstart", (event) => {
      this.body.eventListeners.onDragStart(event);
    });
    this.hammer.on("panmove", (event) => {
      this.body.eventListeners.onDrag(event);
    });
    this.hammer.on("panend", (event) => {
      this.body.eventListeners.onDragEnd(event);
    });
    this.hammer.on("pinch", (event) => {
      this.body.eventListeners.onPinch(event);
    });

    // TODO: neatly cleanup these handlers when re-creating the Canvas, IF these are done with hammer, event.stopPropagation will not work?
    this.frame.canvas.addEventListener("wheel", (event) => {
      this.body.eventListeners.onMouseWheel(event);
    });

    this.frame.canvas.addEventListener("mousemove", (event) => {
      this.body.eventListeners.onMouseMove(event);
    });
    this.frame.canvas.addEventListener("contextmenu", (event) => {
      this.body.eventListeners.onContext(event);
    });

    this.hammerFrame = new Hammer(this.frame);
    onRelease(this.hammerFrame, (event) => {
      this.body.eventListeners.onRelease(event);
    });
  }
This function binds hammer, it can be repeated over and over due to the uniqueness check.
@private