On overlap, slow sprite down: different behaviour in Chrome & Safari.

[JMD]

Hey, I'm having a few problems with Phaser. I have a maze with a ball and some sludge. The sludge should slow the balls velocity to 40/-40 (respective to the arrow key direction, up, right, down and left) when it overlaps. It works as desired in Chrome, but in Safari, it almost does nothing. It definitely doesn't slow the ball down if you pass over it fast enough and almost doesn't slow it down at all if you go over the sludge sprite, but does "react" to it in some form. 

 

Here's my ball defaults:

this.ballSettings = {	dragRate: 15,	sludgeStrength: 1,	sludgeDrag: 50,	bounceRate: 0.3,	velocity: 2,	startPosition: [54, 38]};

Here's my `update`:

update: function() {	if (!this.gameOver) {		var overlappingAny = false;		for (var i = 0, l = this.slowSpots.length; i < l; i++) {			if (this.ball.overlap(this.slowSpots.children[i])) {				overlappingAny = true;				break;			}		}		if (this.keys.left.isDown) {			if (overlappingAny) {				if (this.ball.body.velocity.x < -35) {					this.ball.body.velocity.x = -40;					this.ball.body.velocity.x += this.ballSettings.sludgeStrength * 2;;				}				this.ball.body.velocity.x -= this.ballSettings.sludgeStrength;			} else {				this.ball.body.velocity.x -= this.ballSettings.velocity;			}		}		else if (this.keys.right.isDown) {			if (overlappingAny) {				if (this.ball.body.velocity.x > 35) {					this.ball.body.velocity.x = 40;					this.ball.body.velocity.x -= this.ballSettings.sludgeStrength * 2;				}				this.ball.body.velocity.x += this.ballSettings.sludgeStrength;			} else {				this.ball.body.velocity.x += this.ballSettings.velocity;			}		}		if (this.keys.up.isDown) {			if (overlappingAny) {				if (this.ball.body.velocity.y < -35) {					this.ball.body.velocity.y = -40;					this.ball.body.velocity.y += this.ballSettings.sludgeStrength * 2;;				}				this.ball.body.velocity.y -= this.ballSettings.sludgeStrength;			} else {				this.ball.body.velocity.y -= this.ballSettings.velocity;			}		}		else if (this.keys.down.isDown) {			if (overlappingAny) {				if (this.ball.body.velocity.y > 35) {					this.ball.body.velocity.y = 40;					this.ball.body.velocity.y -= this.ballSettings.sludgeStrength * 2;;				}				this.ball.body.velocity.y += this.ballSettings.sludgeStrength;			} else {				this.ball.body.velocity.y += this.ballSettings.velocity;			}		}		if (overlappingAny) {			this.ball.body.drag.setTo(this.ballSettings.sludgeDrag, this.ballSettings.sludgeDrag);		} else {			this.ball.body.drag.setTo(this.ballSettings.dragRate, this.ballSettings.dragRate);		}		if (this.timer.running) {			this.timerText.text = Math.floor(this.timer.duration / 1000);		}		if (this.timer.duration < 1) {			this.endLevel();		}	}},

Not sure if this is enough without a test case but if needed I will set one up. It's just I don't know if there's any easier method to do the following: 

 

1. Ball is moving around normally with normal velocity.

2. Ball overlaps sludge sprite and reduces the velocity and limits the velocity so the ball moves slower. 

3. This involves using the arrow inputs on a keyboard.

 

Regards,

JMD