diff --git a/client/garageserver.io.js b/client/garageserver.io.js index bd95945..75e1b59 100644 --- a/client/garageserver.io.js +++ b/client/garageserver.io.js @@ -7,7 +7,7 @@ options = { onPlayerRemove: function (id), onPing: function (data), onUpdatePlayerPhysics: function (state, inputs), - onInterpolation: function(previousState, targetState, amount) + onInterpolation: function(currentState, previousState, targetState, amount, delta) logging: true, clientSidePrediction: true, interpolation: true, @@ -220,7 +220,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(positions.previousState, positions.targetState, positions.amount)); + stateCallback(options.onInterpolation(players[playerIdx].updates[maxUpdate].state, positions.previousState, positions.targetState, positions.amount, 0.015)); } else { stateCallback(players[playerIdx].updates[maxUpdate].state); diff --git a/example/public/javascripts/game.js b/example/public/javascripts/game.js index fa5e52e..e1dcffe 100644 --- a/example/public/javascripts/game.js +++ b/example/public/javascripts/game.js @@ -2,7 +2,7 @@ $(function () { GarageServerIO.connectToGarageServer('http://garageserver_io.jbillmann.c9.io', { logging: true, clientSidePrediction: true, - //interpolation: true, + interpolation: true, onUpdatePlayerPhysics: function (state, inputs) { var i = 0; if (!state.x && !state.y) { @@ -22,13 +22,17 @@ $(function () { } return state; }, - onInterpolation: function (previousState, targetState, amount) { - var newState = {}; + onInterpolation: function (currentState, previousState, targetState, amount, delta) { + var interpolationState = {}, + smoothState = {}; - newState.x = (previousState.x + amount * (targetState.x - previousState.x)); - newState.y = (previousState.y + amount * (targetState.y - previousState.y)); + 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 newState; + return smoothState; } });