Hitbox moves away from sprite - what am I doing wrong?

[neils]

Please take a look at the attached screen recording.

The two interesting hitboxes are the main character and the platform. The platform is an object drawn in the "collision" layer in Tiled according to the instructions the platformer tutorial. I can't figure out why the following things happen:

1. Why does the main character's hitbox leave the sprite? It moves faster to the right when the screen is scrolling.
2. Why is the platform fixed on the screen? Shouldn't it be scrolling like the other layers? What makes this layer fixed?

Here is the code for the PlayerEntity which shows that the camera should follow the Entity but it actually follows its renderable. Any help is much appreciated. Thanks.
 

game.PlayerEntity = me.Entity.extend({
    
    /**
     * constructor
     */
    init : function(x, y, settings) {
      this._super(me.Entity, 'init', [x, y, settings]);
      me.game.viewport.follow(this.pos, me.game.viewport.AXIS.BOTH, 0.4);
      this.body.setMaxVelocity(0.6, 4);
      this.body.setFriction(0.4, 0);
      this.body.mass = 1;           
      this.alwaysUpdate = true;
      this.renderable.addAnimation("walk", [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11], 80);
      this.renderable.setCurrentAnimation("stand");
    },

    /**
     * update the entity
     */
     update : function(dt)
     {        
        if(me.input.isKeyPressed('left')) {
            this.renderable.flipX(true);
            if(!this.renderable.isCurrentAnimation("walk")) {
                this.renderable.setCurrentAnimation("walk");
            }
            this.body.force.x = -0.6;
        }
        else if(me.input.isKeyPressed('right')) {
            this.renderable.flipX(false);
            if(!this.renderable.isCurrentAnimation("walk")) {
                this.renderable.setCurrentAnimation("walk");
            }
            this.body.force.x = 0.6;
        }
        else {
            if(this.renderable.isCurrentAnimation("walk") && [3, 9].indexOf(this.renderable.getCurrentAnimationFrame()) > -1) {
                this.body.force.x = 0;
            }
        }
    
        // apply physics to the body (this moves the entity)
        this.body.update(dt);
        // handle collisions against other shapes
        me.collision.check(this);
  
        // return true if we moved or if the renderable was updated
        return (this._super(me.Entity, 'update', [dt]) || this.body.vel.x !== 0 || this.body.vel.y !== 0);
    },
  
    /**
     * colision handler
     * (called when colliding with other objects)
     */
    onCollision : function(response, other)
    {
      // Make all other objects solid
      return true;
    }
  });