Newest Version
This commit is contained in:
parent
ed781fe80f
commit
9e7279ebd4
@ -51,6 +51,7 @@ Board.prototype.enableAll = function() {
|
||||
* @param cupId
|
||||
*/
|
||||
Board.prototype.mark = function(cupId) {
|
||||
alert(' mark bsjs');
|
||||
var cup = this.cups[cupId];
|
||||
|
||||
if (!cup) {
|
||||
|
@ -4,8 +4,8 @@
|
||||
*/
|
||||
var Board = function(scoreBoard) {
|
||||
this.cups = [];
|
||||
this.dom = document.createElement('table');
|
||||
this.dom.addEventListener('click', this.mark.bind(this));
|
||||
this.dom = document.getElementById('cont');
|
||||
this.dom.addEventListener('keypress', this.mark.bind(this));
|
||||
this.players = [];
|
||||
this.currentTurn = 0;
|
||||
this.ready = false;
|
||||
@ -21,61 +21,30 @@ Board.prototype.onMark = function(cupId){};
|
||||
*
|
||||
*/
|
||||
Board.prototype.init = function() {
|
||||
/* var row = document.createElement('tr');
|
||||
var rowCol = document.createElement('td');
|
||||
var col = document.createElement('td');
|
||||
var cup = document.createElement('td');
|
||||
|
||||
rowCol.classList.add('boardRow');
|
||||
rowCol.classList.add('bgWhite');
|
||||
rowCol.setAttribute('colspan', 5);
|
||||
row.appendChild(rowCol);
|
||||
|
||||
col.classList.add('boardCol');
|
||||
col.classList.add('bgWhite');
|
||||
|
||||
cup.classList.add('gamecup');
|
||||
cup.classList.add('notActive');
|
||||
cup.setAttribute('marked', 'false');
|
||||
cup.setAttribute('data-intent', 'gamecup');
|
||||
|
||||
this.dom.classList.add('gameBoard');
|
||||
|
||||
for (var i = 0; i < 9; i++) {
|
||||
this.cups.push(cup.cloneNode(true));
|
||||
for (var i = 1; i <= 10; i++) {
|
||||
var cupname = "cup" + i;
|
||||
var cup = document.getElementById(cupname);
|
||||
cup.setAttribute('marked', 'false');
|
||||
cup.setAttribute('data-intent', 'gamecup');
|
||||
this.cups.push(cup);
|
||||
}
|
||||
|
||||
for (var r, i = 0; i < 9; i += 3) {
|
||||
r = row.cloneNode(false);
|
||||
r.appendChild(this.cups[i]);
|
||||
r.appendChild(col.cloneNode(false));
|
||||
r.appendChild(this.cups[i + 1]);
|
||||
r.appendChild(col.cloneNode(false));
|
||||
r.appendChild(this.cups[i + 2]);
|
||||
|
||||
this.dom.appendChild(r);
|
||||
|
||||
if (i < 6) {
|
||||
this.dom.appendChild(row.cloneNode(true));
|
||||
}
|
||||
}*/
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param container
|
||||
*/
|
||||
Board.prototype.bindTo = function(container) {
|
||||
container.appendChild(this.dom);
|
||||
};
|
||||
|
||||
|
||||
Board.prototype.disableAll = function() {
|
||||
alert('disableAll');
|
||||
this.cups.forEach(function(cup) {
|
||||
//cup.classList.add('notActive');
|
||||
});
|
||||
};
|
||||
|
||||
Board.prototype.enableAll = function() {
|
||||
alert('enableAll');
|
||||
this.cups.forEach(function(cup) {
|
||||
//cup.classList.remove('notActive');
|
||||
cup.setAttribute('marked', 'false');
|
||||
@ -83,6 +52,7 @@ Board.prototype.enableAll = function() {
|
||||
};
|
||||
|
||||
Board.prototype.enableTurn = function() {
|
||||
alert('enableTurn');
|
||||
this.cups.forEach(function(cup) {
|
||||
if (cup.getAttribute('marked') === 'false') {
|
||||
//cup.classList.remove('notActive');
|
||||
@ -93,6 +63,7 @@ Board.prototype.enableTurn = function() {
|
||||
|
||||
Board.prototype.highlightcups = function(pos) {
|
||||
var cups = this.cups;
|
||||
alert('highlightcups');
|
||||
pos.forEach(function(i) {
|
||||
// cups[i].classList.add('colorRed');
|
||||
});
|
||||
@ -110,16 +81,101 @@ Board.prototype.lowlightcups = function() {
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
Board.prototype.getCup = function(code) {
|
||||
alert(code);
|
||||
switch (code)
|
||||
{
|
||||
case 'e':
|
||||
case 'E':
|
||||
//root.style.setProperty('--top325', "-350"+ "px");
|
||||
ball.style.top = "-350px"
|
||||
ball.style.left = "-155px";
|
||||
return "cup1";
|
||||
break;
|
||||
case 'r':
|
||||
case 'R':
|
||||
//root.style.setProperty('--top325', "-350"+ "px");
|
||||
ball.style.top = "-350px"
|
||||
ball.style.left = "-50px";
|
||||
//removeCup("2");
|
||||
break;
|
||||
case 't':
|
||||
case 'T':
|
||||
//root.style.setProperty('--top325', "-350"+ "px");
|
||||
ball.style.top = "-350px"
|
||||
ball.style.left = "55px";
|
||||
//removeCup("3");
|
||||
break;
|
||||
case 'z':
|
||||
case 'Z':
|
||||
//root.style.setProperty('--top325', "-350"+ "px");
|
||||
ball.style.top = "-350px"
|
||||
ball.style.left = "160px";
|
||||
//removeCup("4");
|
||||
break;
|
||||
case 'd':
|
||||
case 'D':
|
||||
//root.style.setProperty('--top325', "-290"+ "px");
|
||||
ball.style.top = "-290px"
|
||||
ball.style.left = "-100px";
|
||||
//removeCup("5");
|
||||
break;
|
||||
case 'f':
|
||||
case 'F':
|
||||
//root.style.setProperty('--top325', "-290"+ "px");
|
||||
ball.style.top = "-290px"
|
||||
ball.style.left = "0px";
|
||||
//removeCup("6");
|
||||
break;
|
||||
case 'g':
|
||||
case 'G':
|
||||
//root.style.setProperty('--top325', "-290"+ "px");
|
||||
ball.style.top = "-290px"
|
||||
ball.style.left = "110px";
|
||||
//removeCup("7");
|
||||
break;
|
||||
case 'c':
|
||||
case 'C':
|
||||
//root.style.setProperty('--top325', "-220"+ "px");
|
||||
ball.style.top = "-220px"
|
||||
ball.style.left = "-50px";
|
||||
//removeCup("8");
|
||||
break;
|
||||
case 'v':
|
||||
case 'V':
|
||||
//root.style.setProperty('--top325', "-220"+ "px");
|
||||
ball.style.top = "-220px"
|
||||
ball.style.left = "55px";
|
||||
//removeCup("9");
|
||||
break;
|
||||
case 'b':
|
||||
case 'B':
|
||||
//root.style.setProperty('--top325', "-160"+ "px");
|
||||
ball.style.top = "-160px"
|
||||
ball.style.left = "0px";
|
||||
//removeCup("10");
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param event
|
||||
*/
|
||||
Board.prototype.mark = function(event) {
|
||||
var target = event.target;
|
||||
alert(this.ready);
|
||||
if (this.ready) {
|
||||
var target = document.getElementById(this.getCup(event.key));
|
||||
alert(target);
|
||||
if (target.getAttribute('data-intent') === 'gamecup' && target.getAttribute('active') === 'true') {
|
||||
|
||||
if (this.ready && target.getAttribute('data-intent') === 'gamecup' && target.getAttribute('active') === 'true') {
|
||||
this.onMark(this.cups.indexOf(target));
|
||||
this.disableAll();
|
||||
this.onMark(this.cups.indexOf(target));
|
||||
this.disableAll();
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -158,12 +214,12 @@ Board.prototype.doDraw = function() {
|
||||
*/
|
||||
Board.prototype.highlightScoreboard = function(playerId) {
|
||||
this.scoreBoard.forEach(function(score) {
|
||||
// score.classList.remove('active');
|
||||
score.classList.remove('active');
|
||||
});
|
||||
|
||||
this.scoreBoard.forEach(function(board){
|
||||
if (board.getAttribute('playerId') == playerId) {
|
||||
// board.classList.add('active');
|
||||
board.classList.add('active');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
@ -1,4 +1,4 @@
|
||||
var socket = new WebSocket('ws://192.168.2.131:2667');
|
||||
var socket = new WebSocket('ws://localhost:2667');
|
||||
var events = {
|
||||
outgoing: {
|
||||
JOIN_GAME: 'csJoinGame',
|
||||
@ -37,6 +37,7 @@ nameInput.setAttribute('placeholder', 'Loading...');
|
||||
*
|
||||
* @param action
|
||||
* @param data
|
||||
|
||||
* @returns {*}
|
||||
*/
|
||||
function makeMessage(action, data){
|
||||
@ -53,6 +54,7 @@ function makeMessage(action, data){
|
||||
* @param cupId
|
||||
*/
|
||||
board.onMark = function(cupId){
|
||||
alert('onMark');
|
||||
socket.send(makeMessage(events.outgoing.MARK, {playerId: hero.id, cupId: cupId}));
|
||||
};
|
||||
|
||||
@ -68,7 +70,6 @@ function start() {
|
||||
scoreBoard[1].textContent = 'waiting...';
|
||||
}
|
||||
|
||||
board.bindTo(container);
|
||||
}
|
||||
|
||||
|
||||
@ -108,6 +109,7 @@ socket.onmessage = function(event){
|
||||
|
||||
break;
|
||||
case events.incoming.MARK:
|
||||
alert('incoming.mARK');
|
||||
board.doMark(msg.data.cupId, msg.data.player.label);
|
||||
|
||||
break;
|
||||
|
@ -88,7 +88,7 @@ wss.on('connection', function connection(ws) {
|
||||
try {
|
||||
switch (msg.action) {
|
||||
case events.incoming.JOIN_GAME:
|
||||
var player = new Player(board.players.length + 1, board.players.length === 0 ? 'X' : 'O', msg.data);
|
||||
var player = new Player(board.players.length + 1, board.players.length === 0 ? '1' : '2', msg.data);
|
||||
board.addPlayer(player);
|
||||
|
||||
break;
|
||||
@ -98,7 +98,7 @@ wss.on('connection', function connection(ws) {
|
||||
return player.id == msg.data.playerId;
|
||||
}).pop();
|
||||
|
||||
board.mark(msg.data.cellId);
|
||||
board.mark(msg.data.cupId);
|
||||
}
|
||||
|
||||
break;
|
||||
|
Loading…
x
Reference in New Issue
Block a user