Java Websocket Canvas实现井字棋网络游戏

2022-05-20 0 533

本文实例为大家分享了Java Websocket Canvas实现井字棋网络游戏的具体代码,供大家参考,具体内容如下

Java Websocket Canvas实现井字棋网络游戏

TicTacToeGame.java 

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.Set;
import java.util.concurrent.CopyOnWriteArraySet;
 
@ServerEndpoint(\"/tictactoe\")
public class TicTacToeGame {
 private static final Set<TicTacToeGame> games = new CopyOnWriteArraySet<>();
 private Session session;
 private String player;
 private static String b1 = \"\";
 private static String b2 = \"\";
 private static String b3 = \"\";
 private static String b4 = \"\";
 private static String b5 = \"\";
 private static String b6 = \"\";
 private static String b7 = \"\";
 private static String b8 = \"\";
 private static String b9 = \"\";
 
 @OnOpen
 public void onOpen(Session session) throws IOException {
  System.out.println(\"Connection from\" + session.getId());
  this.session = session;
 
  System.out.println(games.size());
  if (games.size() == 0) {
   this.player = \"X\";
  }
  if (games.size() == 1) {
   this.player = \"O\";
  }
  if (games.size() > 1) {
   System.out.println(\"房间人满\");
   session.getBasicRemote().sendText(\"roomfull\");
//            session.close();
  } else {
   games.add(this);
   session.getBasicRemote().sendText(\"player-\" + player);
   if (games.size() == 1) {
    sendText(\"wait\");
   }
   if (games.size() == 2) {
    sendText(\"start\");
   }
   sendText(\"turn-\" + \"X\");
  }
 }
 
 @OnMessage
 public void onMessage(String message) {
  System.out.println(player);
  System.out.println(message);
  System.out.println(message.indexOf(\"place\"));
  if (message.indexOf(\"place\") != -1) {
   String[] words = message.split(\"-\");
   System.out.println(\"words[1]=\" + words[1]);
   System.out.println(\"words[2]=\" + words[2]);
   System.out.println(\"games.size()=\" + games.size());
 
   if (games.size() > 1) {
    if (\"\".equals(getPlayer(words[1]))) {
     place3(words[1], words[2]);
     sendText(message);
     check();
     if (\"X\".equals(words[2])) {
      sendText(\"turn-\" + \"O\");
     } else {
      sendText(\"turn-\" + \"X\");
     }
    }
   }
   System.out.println(\"b1=\" + b1);
   System.out.println(\"b2=\" + b2);
   System.out.println(\"b3=\" + b3);
   System.out.println(\"b4=\" + b4);
   System.out.println(\"b5=\" + b5);
   System.out.println(\"b6=\" + b6);
   System.out.println(\"b7=\" + b7);
   System.out.println(\"b8=\" + b8);
   System.out.println(\"b9=\" + b9);
 
  } else if (\"reset\".equals(message)) {
   if (player.equals(\"X\") || player.equals(\"O\")) {
    b1 = \"\";
    b2 = \"\";
    b3 = \"\";
    b4 = \"\";
    b5 = \"\";
    b6 = \"\";
    b7 = \"\";
    b8 = \"\";
    b9 = \"\";
    sendText(message);
   }
  } else {
   sendText(message);
  }
 
 }
 
 private static void sendText(String msg) {
  for (TicTacToeGame game : games) {
   try {
    synchronized (game) {
     game.session.getBasicRemote().sendText(msg);
    }
   } catch (IOException e) {
    games.remove(game);
    try {
     game.session.close();
    } catch (IOException e1) {
    }
    sendText(\"leave-\" + game.player);
   }
  }
 }
 
 @OnClose
 public void onClose(Session session) {
  System.out.println(session.getId());
  System.out.println(this.player + \"已下线\");
  if (!\"\".equals(this.player)) {
   games.remove(this);
   sendText(\"leave-\" + this.player);
  }
 }
 
 public void place3(String id, String player) {
  if (\"b1\".equals(id)) {
   b1 = player;
  }
  if (\"b2\".equals(id)) {
   b2 = player;
  }
  if (\"b3\".equals(id)) {
   b3 = player;
  }
  if (\"b4\".equals(id)) {
   b4 = player;
  }
  if (\"b5\".equals(id)) {
   b5 = player;
  }
  if (\"b6\".equals(id)) {
   b6 = player;
  }
  if (\"b7\".equals(id)) {
   b7 = player;
  }
  if (\"b8\".equals(id)) {
   b8 = player;
  }
  if (\"b9\".equals(id)) {
   b9 = player;
  }
 }
 
 public String getPlayer(String id) {
  String player = \"\";
  if (\"b1\".equals(id)) {
   player = b1;
  }
  if (\"b2\".equals(id)) {
   player = b2;
  }
  if (\"b3\".equals(id)) {
   player = b3;
  }
  if (\"b4\".equals(id)) {
   player = b4;
  }
  if (\"b5\".equals(id)) {
   player = b5;
  }
  if (\"b6\".equals(id)) {
   player = b6;
  }
  if (\"b7\".equals(id)) {
   player = b7;
  }
  if (\"b8\".equals(id)) {
   player = b8;
  }
  if (\"b9\".equals(id)) {
   player = b9;
  }
  return player;
 }
 
 public void check() {
 
  if (b1.equals(\"X\") && b2.equals(\"X\") && b3.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b1.equals(\"X\") && b4.equals(\"X\") && b7.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b7.equals(\"X\") && b8.equals(\"X\") && b9.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b3.equals(\"X\") && b6.equals(\"X\") && b9.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b1.equals(\"X\") && b5.equals(\"X\") && b9.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b3.equals(\"X\") && b5.equals(\"X\") && b7.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b2.equals(\"X\") && b5.equals(\"X\") && b8.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  } else if (b4.equals(\"X\") && b5.equals(\"X\") && b6.equals(\"X\")) {
   sendText(\"xwon\");
   sendText(\"gameover-YES\");
  }
 
  else if (b1.equals(\"O\") && b2.equals(\"O\") && b3.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b1.equals(\"O\") && b4.equals(\"O\") && b7.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b7.equals(\"O\") && b8.equals(\"O\") && b9.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b3.equals(\"O\") && b6.equals(\"O\") && b9.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b1.equals(\"O\") && b5.equals(\"O\") && b9.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b3.equals(\"O\") && b5.equals(\"O\") && b7.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b2.equals(\"O\") && b5.equals(\"O\") && b8.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  } else if (b4.equals(\"O\") && b5.equals(\"O\") && b6.equals(\"O\")) {
   sendText(\"owon\");
   sendText(\"gameover-YES\");
  }
 
  // Checking of Player O finsh
  // Here, Checking about Tie
  else if ((b1.equals(\"X\") || b1.equals(\"O\")) && (b2.equals(\"X\") || b2.equals(\"O\"))
    && (b3.equals(\"X\") || b3.equals(\"O\")) && (b4.equals(\"X\") || b4.equals(\"O\"))
    && (b5.equals(\"X\") || b5.equals(\"O\")) && (b6.equals(\"X\") || b6.equals(\"O\"))
    && (b7.equals(\"X\") || b7.equals(\"O\")) && (b8.equals(\"X\") || b8.equals(\"O\"))
    && (b9.equals(\"X\") || b9.equals(\"O\"))) {
   sendText(\"tie\");
   sendText(\"gameover-YES\");
  } else {
 
  }
 }
}

index.html

<!DOCTYPE html>
 
<head>
 <meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\">
    <meta name=\"viewport\" content=
          \"width=device-width, initial-scale=1.0\">
    <!-- JavaScript file included -->
    
</head>
 
<body>
    <div id=\"main\">
        <h1>TIC TAC TOE</h1>
 
 
 
        <!-- Space to show player turn -->
        <p id=\"player\"></p>
 
        <br>
       
        <div id=\"game\">
            <canvas id=\"canvas\" width=\"300\" height=\"300\"></canvas>
        </div>
 
        <!-- Grid end here -->
        <br>
 
        <!-- Button to reset game -->
        <button id=\"but\" onclick=\"reset()\">
            重新开始
        </button>
        
        <br>
        <!-- Space to show player turn -->
        <p id=\"print2\"></p>        
 
        <br>
        <!-- Space to show player turn -->
        <p id=\"print\"></p>
        
 
 
    </div>
    <script src=\"tic.js\"></script>
</body>
 
</html>

tic.js

// Function called whenever user tab on any box
player = \"\";
turn = \"\";
gameover = \"NO\";
// Function to reset game
function reset() {
    message = \"reset\";
    websocket.send(message);
    message = \"turn-X\";
    websocket.send(message);
}
function reset2() {
    clear();
    drawboard();
    gameover = \"NO\";
    document.getElementById(\"print2\")
            .innerHTML = \"游戏开始, 请开始放置棋子\";
}
 
// Here onwards, functions check turn of the player
// and put accordingly innerText X or O
flag = 1;
function place(id) {
    if (gameover === \"NO\") {
        if (flag === 1) {
            if (document.getElementById(id).innerText === \"\") {
                document.getElementById(id).innerText = \"X\";
                flag = 0;
            }
        } else {
            if (document.getElementById(id).innerText === \"\") {
                document.getElementById(id).innerText = \"O\";
                flag = 1;
            }
        }
    }
    check();
}
function place2(id) {
    if (gameover === \"NO\") {
        if (turn === player) {
            if (document.getElementById(id).innerText === \"\") {
                message = \"place-\" + id + \"-\" + player;
                websocket.send(message);
            }
        }
    }
}
 
//function place3(id, player) {
//    document.getElementById(id).innerText = player;
//check();
//}
 
function getRootUri() {
    return \"ws://\" + (document.location.hostname == \"\" ? \"localhost\" : document.location.hostname) + \":\" +
            (document.location.port == \"\" ? \"8080\" : document.location.port);
}
 
function init() {
    output = document.getElementById(\"output\");
    websocket = new WebSocket(getRootUri() + \"/TicTacToeWebSocket/tictactoe\");
    websocket.onopen = function (evt) {
        onOpen(evt)
    };
    websocket.onmessage = function (evt) {
        onMessage(evt)
    };
    websocket.onerror = function (evt) {
        onError(evt)
    };
}
 
function onMessage(evt) {
    console.log(evt.data);
    if (evt.data == \"roomfull\") {
        document.getElementById(\"print\")
                .innerHTML = \"游戏玩家已满\";
        websocket.close(-1);
    }
    if (evt.data == \"reset\") {
        reset2();
    }
    if (evt.data == \"wait\") {
        //window.alert(\"Waiting for Second Player\");
        document.getElementById(\"print2\")
                .innerHTML = \"等待第二个玩家\";
 
    }
    if (evt.data == \"start\") {
        reset();
    }
    if (evt.data == \"xwon\") {
        document.getElementById(\"print2\")
                .innerHTML = \"玩家X赢了\";
 
    }
    if (evt.data == \"owon\") {
        document.getElementById(\"print2\")
                .innerHTML = \"玩家O赢了\";
 
    }
    if (evt.data == \"tie\") {
        document.getElementById(\"print2\")
                .innerHTML = \"平局\";
 
    }
    if (evt.data.indexOf(\"leave\") != -1) {
        //window.alert(evt.data);
        words = evt.data.split(\"-\");
        //window.alert(words[1]);
        player = words[1];
        //window.alert(player);
        document.getElementById(\"print2\")
                .innerHTML = \"玩家\" + player+\"已离开游戏,请退出游戏\";
    }
    if (evt.data.indexOf(\"player\") != -1) {
        //window.alert(evt.data);
        words = evt.data.split(\"-\");
        //window.alert(words[1]);
        player = words[1];
        //window.alert(player);
        document.getElementById(\"player\")
                .innerHTML = \"你是玩家\" + player;
    }
    if (evt.data.indexOf(\"turn\") != -1) {
        //window.alert(evt.data);
        words = evt.data.split(\"-\");
        //window.alert(words[1]);
        turn = words[1];
        //window.alert(turn);
        document.getElementById(\"print\")
                .innerHTML = \"当前由玩家\" + turn + \"放置棋子\";
    }
    if (evt.data.indexOf(\"place\") != -1) {
        //window.alert(evt.data);
        words = evt.data.split(\"-\");
        //window.alert(words[1]);
        place3(words[1], words[2]);
    }
    if (evt.data.indexOf(\"gameover\") != -1) {
        //window.alert(evt.data);
        words = evt.data.split(\"-\");
        //window.alert(words[1]);
        gameover = words[1];
        //window.alert(turn);
        document.getElementById(\"print\")
                .innerHTML = \"游戏结束!\";
    }
}
 
function onOpen(evt) {
}
function onError(evt) {
}
 
 
 
players = 2;
cell_count = 3;
winCount = 3;
cell_size = 100;
size = cell_size * cell_count;
 
 
var canvas = document.getElementById(\'canvas\');
canvas.width = size;
canvas.height = size;
 
canvas.addEventListener(\'click\', click, false);
 
 
var ctx = canvas.getContext(\'2d\');
 
ctx.imageSmoothingEnabled = false;
ctx.lineWidth = 3;
 
 
function clear() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
}
 
function line(x, y, w, h, color = \'#ccc\') {
    ctx.beginPath();
    ctx.moveTo(x, y);
    ctx.lineTo(x + w, y + h);
    ctx.strokeStyle = color;
    ctx.stroke();
    ctx.closePath();
}
 
function click(e) {
    if (gameover === \"NO\") {
        if (turn === player) {
            i = e.offsetX / cell_size | 0;
            j = e.offsetY / cell_size | 0;
            id = \"\";
            if (i == 0 && j == 0) {
                id = \"b1\";
            }
            if (i == 1 && j == 0) {
                id = \"b2\";
            }
            if (i == 2 && j == 0) {
                id = \"b3\";
                ;
            }
            if (i == 0 && j == 1) {
                id = \"b4\";
            }
            if (i == 1 && j == 1) {
                id = \"b5\";
            }
            if (i == 2 && j == 1) {
                id = \"b6\";
            }
            if (i == 0 && j == 2) {
                id = \"b7\";
            }
            if (i == 1 && j == 2) {
                id = \"b8\";
            }
            if (i == 2 && j == 2) {
                id = \"b9\";
            }
            message = \"place-\" + id + \"-\" + player;
            websocket.send(message);
        }
    }
}
function place3(id, player) {
    i = 0;
    j = 0;
    if (id === \"b1\") {
        i = 0;
        j = 0;
    }
    if (id === \"b2\") {
        i = 1;
        j = 0;
    }
    if (id === \"b3\") {
        i = 2;
        j = 0;
    }
    if (id === \"b4\") {
        i = 0;
        j = 1;
    }
    if (id === \"b5\") {
        i = 1;
        j = 1;
    }
    if (id === \"b6\") {
        i = 2;
        j = 1;
    }
    if (id === \"b7\") {
        i = 0;
        j = 2;
    }
    if (id === \"b8\") {
        i = 1;
        j = 2;
    }
    if (id === \"b9\") {
        i = 2;
        j = 2;
    }
 
    if (player === \"X\") {
//         window.alert(\"X\");
        // draw X figure
        color = \'#3F51B5\';
 
        left = (i + 0.1) * cell_size;
        up = (j + 0.1) * cell_size;
        size = 0.8 * cell_size;
//        window.alert(left);
//        window.alert(\"up=\"+up);
//        window.alert(size);
 
        line(left, up, size, size, color);
        line(left + size, up, -size, size, color);
    }
    if (player === \"O\") {
        color = \'#FF5722\';
        left = (i + 0.1) * cell_size;
        up = (j + 0.1) * cell_size;
        size = 0.8 * cell_size;
        ctx.beginPath();
        ctx.arc((i + 0.5) * cell_size, (j + 0.5) * cell_size, 0.4 * cell_size, 0, Math.PI * 2, false);
        ctx.strokeStyle = color;
        ctx.stroke();
        ctx.closePath();
    }
}
 
function drawboard() {
    for (let i = 0; i < cell_count; i++) {
        for (let j = 0; j < cell_count; j++) {
            left = i * cell_size;
            up = j * cell_size;
            size = cell_size;
            ctx.beginPath();
            ctx.lineWidth = \"6\";
            ctx.strokeStyle = \"gray\";
            ctx.rect(left, up, size, size);
            ctx.stroke();
        }
 
    }
 
}
drawboard();
 
 
window.addEventListener(\"load\", init, false);

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持自学编程网。

遇见资源网 JAVA Java Websocket Canvas实现井字棋网络游戏 http://www.ox520.com/21330.html

常见问题

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务