closes #1432

src/client/js/components/keyboardMover.js

@@ -13,10 +13,11 @@ define([
 		type: 'keyboardMover',
 
 		moveCd: 0,
-		moveCdMax: 8,
+		moveCdMax: 4,
 
 		init: function () {
 			this.hookEvent('onCanvasKeyDown', this.onCanvasKeyDown.bind(this));
+			this.hookEvent('onGetStats', this.onGetStats.bind(this));
 		},
 
 		update: function () {
@@ -31,6 +32,13 @@ define([
 			this.keyMove();
 		},
 
+		//Changes the moveCdMax variable
+		// sprintChance: 0		|	moveCdMax: 8
+		// sprintChance: 200	|	moveCdMax: 4
+		onGetStats: function ({ sprintChance = 0 }) {
+			this.moveCdMax = Math.ceil(4 + (((200 - sprintChance) / 200) * 4));
+		},
+
 		onCanvasKeyDown: function (keyEvent) {
 			if (keyEvent.key === 'esc') {
 				client.request({

src/client/js/main.js

@@ -25,8 +25,14 @@ define([
 	sound,
 	globals
 ) {
+	let fnQueueTick = null;
+	const getQueueTick = updateMethod => {
+		return () => requestAnimationFrame(updateMethod);
+	};
+
 	return {
 		hasFocus: true,
+
 		lastRender: 0,
 		msPerFrame: ~~(1000 / 60),
 
@@ -71,7 +77,8 @@ define([
 			uiFactory.init(null, globals.clientConfig.uiList);
 			uiFactory.build('login', 'body');
 
-			this.update();
+			fnQueueTick = getQueueTick(this.update.bind(this));
+			fnQueueTick();
 
 			$('.loader-container').remove();
 		},
@@ -95,7 +102,7 @@ define([
 		update: function () {
 			const time = +new Date();
 			if (time - this.lastRender < this.msPerFrame - 1) {
-				requestAnimationFrame(this.update.bind(this));
+				fnQueueTick();
 
 				return;
 			}
@@ -103,13 +110,13 @@ define([
 			objects.update();
 			renderer.update();
 			uiFactory.update();
+			numbers.update();
 
-			numbers.render();
 			renderer.render();
 
 			this.lastRender = time;
 
-			requestAnimationFrame(this.update.bind(this));
+			fnQueueTick();
 		}
 	};
 });

src/client/js/rendering/numbers.js

@@ -61,7 +61,7 @@ define([
 			this.list.push(numberObj);
 		},
 
-		render: function () {
+		update: function () {
 			let list = this.list;
 			let lLen = list.length;
 

src/client/js/rendering/renderer.js

@@ -77,6 +77,7 @@ define([
 
 			events.on('onGetMap', this.onGetMap.bind(this));
 			events.on('onToggleFullscreen', this.toggleScreen.bind(this));
+			events.on('onGetStats', this.adaptCameraMoveSpeed.bind(this));
 
 			let zoom = isMobile ? 1 : window.devicePixelRatio;
 			this.width = $('body').width() * zoom;
@@ -641,15 +642,14 @@ define([
 				let deltaY = this.moveTo.y - this.pos.y;
 
 				if (deltaX !== 0 || deltaY !== 0) {
-					let moveSpeed = this.moveSpeed;
 					let distance = Math.max(Math.abs(deltaX), Math.abs(deltaY));
 
 					let moveSpeedMax = this.moveSpeedMax;
-					if (distance > 100)
-						moveSpeedMax *= 1.75;
 					if (this.moveSpeed < moveSpeedMax)
 						this.moveSpeed += this.moveSpeedInc;
 
+					let moveSpeed = this.moveSpeed;
+
 					let elapsed = time - this.lastTick;
 					moveSpeed *= (elapsed / 16.67);
 
@@ -821,6 +821,19 @@ define([
 				obj.sprite.parent.removeChild(obj.sprite);
 		},
 
+		//Changes the moveSpeedMax and moveSpeedInc variables
+		// sprintChance: 0		|	moveSpeedMax: 1.5		|		moveSpeedInc: 0.5
+		// sprintChance: 200	|	moveSpeedMax: 5.5		|		moveSpeedInc: 0.2
+		//  Between these values we should follow an exponential curve for moveSpeedInc since
+		//   a higher chance will proc more often, meaning the buildup in distance becomes greater
+		adaptCameraMoveSpeed: function ({ sprintChance }) {
+			const factor = Math.sqrt(sprintChance);
+			const maxValue = Math.sqrt(200);
+
+			this.moveSpeedMax = 1.5 + ((sprintChance / 200) * 4);
+			this.moveSpeedInc = 0.2 + (((maxValue - factor) / maxValue) * 0.3);
+		},
+
 		render: function () {
 			if (!this.stage)
 				return;