Estou aqui criando um 'editor' de imagen utilizando Javascript com auxilio da biblioteca [CamanJs][1] e do elemento canvas do HTML5, porém não estou conseguindo fazer ele desenhar uma caixa em cima da minha imagem (ela some assim que começa a desenhar); `<canvas id="cavas-id"></canvas>`, pensei em algo como canvas dentro de canvas, porém meu fundo fica branco.

    var canvas = document.getElementById('crop'),
    ctx = canvas.getContext('2d'),
    rect = {},
    drag = false;

    function init() {
      canvas.addEventListener('mousedown', mouseDown, false);
      canvas.addEventListener('mouseup', mouseUp, false);
      canvas.addEventListener('mousemove', mouseMove, false);
    }

    function mouseDown(e) {
      alert('asd');
      rect.startX = e.pageX - this.offsetLeft;
      rect.startY = e.pageY - this.offsetTop;
      drag = true;
    }

    function mouseUp() {
      drag = false;
    }

    function mouseMove(e) {
      if (drag) {
        rect.w = (e.pageX - this.offsetLeft) - rect.startX;
        rect.h = (e.pageY - this.offsetTop) - rect.startY ;
        ctx.clearRect(0,0,canvas.width,canvas.height);
        draw();
      }
    }

    function draw() {
      ctx.fillRect(rect.startX, rect.startY, rect.w, rect.h);
    }
    init();

 e a minha imagem 

    Caman('#canvas-id', 'balanco.jpg', function()
		{
			
			this.render();
		});

  [1]: http://camanjs.com