diff --git a/client/garageserver.io.js b/client/garageserver.io.js index 75e1b59..2f5d0d4 100644 --- a/client/garageserver.io.js +++ b/client/garageserver.io.js @@ -24,6 +24,7 @@ window.GarageServerIO = (function (window, socketio) { inputs = [], currentState = {}, currentTime, + currentFrameTime = new Date().getTime(), currentDelta, currentPlayerId, options = null, @@ -81,6 +82,7 @@ window.GarageServerIO = (function (window, socketio) { updateState = function (data) { currentTime = data.time - pingDelay / 2; + currentFrameTime = new Date().getTime(); currentDelta = data.delta; updatePlayerState(data); @@ -197,10 +199,12 @@ window.GarageServerIO = (function (window, socketio) { var target = playerUpdates[updateIdx + 1]; if(previous && target && currentTime > previous.time && currentTime < target.time) { + var frameDiff = new Date().getTime() - currentFrameTime; + range = target.time - previous.time; - difference = currentTime - previous.time; + difference = currentTime - previous.time + frameDiff; amount = parseFloat((difference / range).toFixed(3)); - + positions.previousState = previous.state; positions.targetState = target.state; positions.amount = amount; @@ -220,7 +224,7 @@ window.GarageServerIO = (function (window, socketio) { if (options.interpolation && options.onInterpolation) { var positions = getPositions(players[playerIdx].updates); if (positions.previousState && positions.targetState) { - stateCallback(options.onInterpolation(players[playerIdx].updates[maxUpdate].state, positions.previousState, positions.targetState, positions.amount, 0.015)); + stateCallback(options.onInterpolation(players[playerIdx].updates[maxUpdate].state, positions.previousState, positions.targetState, positions.amount)); } else { stateCallback(players[playerIdx].updates[maxUpdate].state); diff --git a/example/public/javascripts/game.js b/example/public/javascripts/game.js index e1dcffe..0d851a2 100644 --- a/example/public/javascripts/game.js +++ b/example/public/javascripts/game.js @@ -22,17 +22,13 @@ $(function () { } return state; }, - onInterpolation: function (currentState, previousState, targetState, amount, delta) { - var interpolationState = {}, - smoothState = {}; + onInterpolation: function (currentState, previousState, targetState, amount) { + var interpolationState = {}; interpolationState.x = (previousState.x + amount * (targetState.x - previousState.x)); interpolationState.y = (previousState.y + amount * (targetState.y - previousState.y)); - - smoothState.x = (currentState.x + (20 * delta) * (interpolationState.x - currentState.x)); - smoothState.y = (currentState.y + (20 * delta) * (interpolationState.y - currentState.y)); - return smoothState; + return interpolationState; } });