mouse-controlled quadratic

index.html

<canvas/>

main.dart

import 'dart:html';

main() async {
  CanvasElement canvas = querySelector("canvas");
  canvas.width = 500;
  canvas.height = 500;
  
  var ctx = canvas.context2D;
  
  var mousepos = Point<num>(250.0, 250.0);
  void handle_mouse(MouseEvent e) {
    mousepos = e.offset;
  }
  canvas.onMouseMove.listen(handle_mouse);
  
  var start = [0, 250];
  var end = [500, 250];
  while (true) {
    	ctx.fillStyle = 'green';
      ctx.fillRect(0, 0, 500, 500);
    
      var path = Path2D();
      path.moveTo(start[0], start[1]);
    	path.quadraticCurveTo(mousepos.x, mousepos.y, end[0], end[1]);
    
    	ctx.strokeStyle = 'black';
  		ctx.lineWidth = 10;
    	ctx.stroke(path);
    
    	ctx.fillStyle = 'red';
    	
    	ctx.fillRect(mousepos.x-5, mousepos.y-5, 10, 10);
    
      await window.animationFrame;
  }
}