我怎樣才能讓一半的玩家出現在另一邊？

Question

這裏是我的代碼：

var canvas = document.getElementById("canvas") 
var ctx = canvas.getContext("2d") 

var w = canvas.width 
var h = canvas.height 

var player = { 
x: w/2, 
y: h/2, 
r: 10, 
vx: 0, 
vy: 0, 
speed: 5, 
} 

var keys = [] 


window.onkeydown = function(event) {keys[event.keyCode] = true} 
window.onkeyup = function(event) {keys[event.keyCode] = false} 

setInterval(update, 1000/60) 
function update() { 
if (keys[38] && player.vy > -player.speed) { 
    player.vy-- 
} 
if (keys[40] && player.vy < player.speed) { 
    player.vy++ 
} 
if (keys[37] && player.vx > -player.speed) { 
    player.vx-- 
} 
if (keys[39] && player.vx < player.speed) { 
    player.vx++ 
} 

player.vx *= 0.9 
player.vy *= 0.9 
player.x += player.vx 
player.y += player.vy 

ctx.clearRect(0,0,w,h) 
ctx.beginPath() 
ctx.arc(player.x, player.y, player.r, 0, Math.PI * 2, false) 
ctx.fillStyle = "red" 
ctx.fill() 
} 

http://jsfiddle.net/wfNse/

所以，我的問題是，如何才能讓玩家出來的另一邊，當你外出側界？現在，這是很容易做到，所以有一兩件事，當一半的球員出界，我希望它可以看到一半兩側，像這樣：

Answer 1

你可以這樣做：

// coordinates replaced in the board 
player.x = (player.x+w)%w; 
player.y = (player.y+h)%h; 

// player position drawing 
ctx.clearRect(0,0,w,h) 
ctx.beginPath() 
for (var i=-1; i<=1; i++) { 
    for (var j=-1; j<=1; j++) { 
     var x = player.x+i*w, y = player.y+j*h; 
     if (x+player.r<0 || x-player.r>w || y+player.r<0 || y-player.r>h) continue; 
     ctx.arc(x, y, player.r, 0, Math.PI * 2, false)  
    } 
}  

Demonstration