मैं एचटीएमएल 5 कैनवास, जावास्क्रिप्ट (जॉन रेसिग सरल विरासत पुस्तकालय का उपयोग करके) और सॉकेट.आईओ के साथ नोड.जेएस के साथ सरल मल्टी प्लेयर बनाने की कोशिश कर रहा हूं। मेरे क्लाइंट कोड:मल्टीप्लेयर एचटीएमएल 5, नोड.जेएस, सॉकेट.आईओ
var canvas = document.getElementById('game');
var context = canvas.getContext('2d');
var socket = new io.Socket('127.0.0.1', {port: 8080});
var player = null;
var UP = 'UP',
LEFT = 'LEFT',
DOWN = 'DOWN',
RIGHT = 'RIGHT';
socket.connect();
socket.on('connect', function() {socket.send();
console.log('Connected!');
player = new Player(50, 50);
});
socket.on('message', function(msg) {
if(msg == 'UP') {
player.moveUP();
} else if(msg == 'LEFT') {
player.moveLEFT();
} else if(msg == 'DOWN') {
player.moveDOWN();
} else if(msg == 'RIGHT') {
player.moveRIGHT();
} else {
}
});
socket.on('disconnect', function() {
console.log('Disconnected!');
});
var Player = Class.extend({
init : function(x, y) {
this.x = x;
this.y = y;
},
setX : function(x){
this.x = x;
},
getX : function(){
return this.x;
},
setY : function(y){
this.y = y;
},
getY : function(){
return this.y;
},
draw : function(){
context.clearRect(0, 0, 350, 150);
context.fillRect(this.x, this.y, 15, 15);
},
move : function() {
this.x += 1;
this.y += 1;
},
moveUP : function() {
this.y--;
},
moveLEFT : function() {
this.x--;
},
moveDOWN : function() {
this.y++;
},
moveRIGHT : function() {
this.x++;
}
});
function checkKeyCode(event) {
var keyCode;
if(event == null) {
keyCode = window.event.keyCode;
} else {
keyCode = event.keyCode;
}
switch(keyCode) {
case 38: // UP
player.moveUP();
socket.send(UP);
break;
case 37: // LEFT
player.moveLEFT();
socket.send(LEFT);
break;
case 40: //DOWN
player.moveDOWN();
socket.send(DOWN);
break;
case 39: // RIGHT
player.moveRIGHT();
socket.send(RIGHT);
break;
default:
break;
}
}
function update() {
player.draw();
}
var FPS = 30;
setInterval(function() {
update();
player.draw();
}, 1000/FPS);
function init() {
document.onkeydown = checkKeyCode;
}
init();
और सर्वर कोड:
var http = require('http'),
io = require('socket.io'),
buffer = new Array(),
server = http.createServer(function(req, res){
res.writeHead(200, {'Content-Type': 'text/html'});
res.end('<h1>Hello world</h1>');
});
server.listen(8080);
var socket = io.listen(server);
socket.on('connection', function(client){
client.on('message', function(message){
console.log(message);
client.broadcast(message);
})
client.on('disconnect', function(){
})
});
और जब मैं पहली बार ग्राहक के साथ दो ग्राहक की मैं चलाने के दूसरे ग्राहक रेक्ट स्थानांतरित कर सकते हैं और दूसरे ग्राहक के साथ ले जाने के पहले ग्राहक रेक्ट और साथ की तरह कुछ तीसरा ग्राहक पहले और दूसरे क्लाइंट रेक्ट को स्थानांतरित कर सकता है।
मुझे सवाल है कि असली मल्टी प्लेयर कैसे बनाएं? कुछ ऐसा: तीन क्लाइंट खोलें और पहले क्लाइंट को rect1, दूसरा rect2 और अंतिम rect3 प्राप्त करें। पहला ग्राहक केवल rect1 को स्थानांतरित कर सकता है, क्लाइंट तीसरा केवल rect3 को स्थानांतरित कर सकता है।
शायद किसी को भी विचार है? मैं Google में खोज करता हूं लेकिन उत्तर नहीं मिला।
मेरी अंग्रेजी भाषा के लिए खेद है।
एचटीएमएल 5 खेल के विकास के लिए सुपर ब्राउज़र 2 टर्बो एच.डी. रीमिक्स परिचय भयानक है में से एक हूँ! उत्तर के लिए धन्यवाद! जनरलहेनरी, मैं आपके संशोधित क्लाइंट/सर्वर कोड का प्रयास करता हूं लेकिन मेरे काम नहीं करता है। लेकिन मल्टी प्लेयर को समझने में मेरी सहायता के लिए धन्यवाद! – rhavd
मैंने अपने संशोधित कोड का परीक्षण नहीं किया है, इसलिए कुछ बग्स हैं, लेकिन आपको विचार मिलता है^_^ – generalhenry
सभी लिंक वर्तमान में इस उत्तर से मर चुके हैं। –