title: easeljs - Container mouseEnabled not working
body: <p>I'm having a problem getting container when calling <code>getObjectsUnderPoint</code>.
  According to the documentation of the <code>easeljs</code>, when <code>mouseEnabled</code> property set to <code>true</code> on container, on calling <code>getObjectsUnderPoint</code> it should return the container objects not its children.  </p>
  
  <p>In the sample code, I've two containers and each container has two children (shape and image). Its drag and drop sample. On mouseup event, I'm checking if both the containers overlap. But when I'm calling <code>stage.getObjectsUnderPoint</code>, Its returning array of <code>[Shape, Image, Shape, Image]</code>. What I was expecting is both of the containers.</p>
  
  <p>I may be missing to set some other properties of stage or something else.</p>
  
  <p>Tried to find over web, no luck.</p>
  
  <pre><code>   var canvas = null;
      var stage = null;
      var update = false;
  
      function tick(){
            if(update){
                  stage.update();
                  update = false;
            }
      }
  
  function init(){
      canvas = document.getElementById("mycanvas");
      stage = new createjs.Stage(canvas);
            createjs.Ticker.setFPS(60);
            createjs.Ticker.addListener(window);
            stage.enableMouseOver(36);
  
            var getContainer = function(cname, x, y, imageName){
  
                  var container= new createjs.Container();
                  container.mouseEnabled = true;
                  container.onPress= function(event){
                        var target= event.target;
  
                        stage.addChild(target);
  
                        var offset = {
                              x: target.x - stage.mouseX,
                              y: target.y - stage.mouseY
                        };
  
                        event.onMouseMove = function (ev) {
                              target.x = ev.stageX + offset.x;
                              target.y = ev.stageY + offset.y;
                              update = true;
                        }
  
                        event.onMouseUp = function(ev){
                              var objects = stage.getObjectsUnderPoint(ev.stageX, ev.stageY);
                              event.stageX, event.stageY
                              objects.forEach(function(object){
                                    console.log('name: ' + object.name);
                              });
                        }
                  };
  
                  container.name = cname;
  
                  var shape = new createjs.Shape();
                  shape.graphics
                        .setStrokeStyle(10)
                        .beginFill('#f0f0f0')
                        .beginStroke("#000")
                        .drawCircle(x, y, 100);
                  shape.name = cname + ' - shape';
  
                  container.addChild(shape);
  
                  var image = new Image();
                  image.onload = function(event){
                        var bitmap = new createjs.Bitmap(image);
                        bitmap.regX = image.width/2;
                        bitmap.regY = image.height/2;
                        bitmap.x = x, bitmap.y = y;
                        bitmap.scaleX = bitmap.scaleY = 0.8;
  
                        bitmap.name = cname + ' - image';
  
                        container.addChild(bitmap);
                        update = true;
                  };
                  image.src = imageName;
  
                  return container;
  
            };
  
            var container= getContainer("Original Container", 200, 300, 'cat1.png');
  
            var diffContainer = getContainer("Different Container", 600, 300, 'cat2.png');
  
            stage.addChild(container);
            stage.addChild(diffContainer);
  
            update = true;
  }
  </code></pre>
  
  <p>Any help would be appreciated. Thanks</p>