title: Update canvas with kinetic js
body: <p>I'm dragging a rectangle 'left_handle' using Kinetic JS.  During the drag I want to also position the left edge of another rectangle 'box' on top of it.  I'm not getting any errors, so I'm assuming what I'm doing is working, but I think I need to do something to update the canvas or...?</p>
  
  <p>The left_handle rectangle moves as expected, but nothing happens to the box.</p>
  
  <pre><code>    var STAGE_WIDTH = 500;    
  
      var stage = new Kinetic.Stage({
        container: "container",
        width: STAGE_WIDTH,
        height: 200
      });
      var layer = new Kinetic.Layer();
      var rectX = 80;
      var rectY = stage.getHeight() / 2 - 25;
  
      var box = new Kinetic.Rect({
        x: rectX,
        y: rectY,
        width: 100,
        height: 50,
        fill: "#00D2FF",
        stroke: "black",
        strokeWidth: 4
      });
  
      var handle_left = new Kinetic.Rect({
          x: rectX,
          y: rectY,
          height: 50,
          width: 10,
          fill:'#FFC400',
          stroke:'black',
          strokeWidth:3,
          draggable:true,
          dragConstraint:'horizontal',
          dragBounds: {
              left: 10, right: STAGE_WIDTH - 20
          }
      });    
  
      // - - - - - - - this is the bit that doesn't work - - - - - 
      handle_left.on('dragmove', function(evt) {
        box.setX(handle_left.x);
        layer.draw();
      });
      // - - - - - - - - - - - - 
  
      layer.add(box);
      layer.add(handle_left);
      stage.add(layer);
  </code></pre>
  
  <p>​</p>