斗地主之基本功能实现

斗地主.gif

功能实现

• 默认先进入的人拥有优先发牌权
• 点对点发牌接收牌 discard&receive card
• 发牌后将发牌权移交给另一方
• 一方退出后回到开始页面，对方提示获胜 abandon
• 一方牌全部发完后分别提示获胜方和失败方信息

客户端代码

//洗牌
function shuffle() {
  var pokers = new Array();
  for(var i = 0; i < 54; i++) {
    pokers[i]=i;
  }
  for (var i = 0; i < 54; i++) {
    var rd=parseInt(Math.random()*54);
    var b=pokers[i] ;
    pokers[i]= pokers[rd];
    pokers[rd]=b;
}
   var poker1 = [];
   var poker2 = [];
   for(var i = 0; i < 54; i++) {
    if(i<27)
        poker1[i]=pokers[i];
     else{
        poker2[i-27]=pokers[i];
    }
   }
   sort(poker1);
   sort(poker2);
  result = {
    poker1: poker1,
    poker2: poker2
  };
  return result;
}
//排序
function sort(pokers){
    var i=27;
        var temp;
        while (i > 0) {
            for (var j = 0; j < i - 1; j++) {
              if(pokers[j]===53){
                    temp = pokers[j];
                    pokers[j] = pokers[j + 1];
                    pokers[j + 1] = temp;
              }
              else if(pokers[j]===52&&pokers[j+1]!==52){
                    temp = pokers[j];
                    pokers[j] = pokers[j + 1];
                    pokers[j + 1] = temp;
              }
               else if (((pokers[j]+11)%13> (pokers[j + 1]+11)%13)&&(pokers[j + 1]!==52||pokers[j + 1]!==53)) {
                    temp = pokers[j];
                    pokers[j] = pokers[j + 1];
                    pokers[j + 1] = temp;
                }
            }
            i--;
        }
}



DISCARD=2;

var io = require('socket.io').listen(server);
var count = 0;
//var onlineList=[];
var first;
var second;

io.on('connection', function(socket){
  //用户登录
  socket.on('add user', function (obj) {
    console.log("user login");
    count++;
    console.log(count);
     if(count===1){
        socket.join(obj.from);
        first=obj;
        first.authority=true;
        console.log("first in");
     }
     else if(count===2){
        socket.join(obj.from);
        second=obj;
        console.log("second in");

        //发牌开始
        var res=shuffle();
        first.data.pokers=res.poker1;
        second.data.pokers=res.poker2;
        first.to=second.from;
        second.to=first.from;

        first.data.status=DISCARD;
        second.data.status=DISCARD;
        console.log(first);
        console.log(second);

        io.to(first.from).emit("start poker", first);
        io.to(second.from).emit("start poker", second);
        }
  }
  );
  socket.on('discard',function(data,sendMessage){
    if(data.data.count===0){
        io.to(data.from).emit("game over", 1);
        io.to(data.to).emit("game over",2 );
    }
    else{
        io.to(data.to).emit("receive poker", sendMessage,data.data.count);
    }
  })
  socket.on('abandon',function(data){
      io.to(data.from).emit("game over", 3);
      io.to(data.to).emit("game over",4);
    })
  })

用户端代码

/**
 * Created by Zoe on 2016/11/8.
 */
var socket = io();
INIT=0;
WAITING=1;
DISCARD=2;
GAMEOVER=3;

var fid="";
var id="";
var pkObj = {
    data:{
        status:INIT,
        count:27,
        pokers:[]
    },
    from:id,
    to: fid,
    success:0,
    init:function (){
        if(pkObj.data.status===INIT){
            $("#login").click(doInit);
        }
        socketInit();
    }
};

var htmlWait = "<h3 class='waiting'><h2>Waiting....</h2><h5>正在为你寻找小伙伴</h5></div>";
var htmlPoker="<div class='choose'><div class='oppo-usr'></div><div class='oppo-pokers'></div></div><div class='display'></div><div class='choose'><div class='user'><div class='usr'></div><button class='abandon'></button></div><div class='pokers'></div> <div class='button'> <button class='cancel'></button> <button class='confirm'></button> </div></div>";
var htmlStart="<div class='menu'><button type='button' id='login'></button></div>";
$(init);

function init() {
    $("body").on("click", pkObj.init());
}
function socketInit() {
    socket.on('start poker', function (data) {
        doDiscard(data);
    });
    socket.on('receive poker',function (data,count) {
        doRecieve(data,count);
        console.log(data);
    });
    socket.on('game over',function (data) {
        if(data===1)
        {
            alert("you win！");
        }
        else if(data===2){
            alert("you lose！");
        }
        else if(data===3){
            alert("你放弃啦！");
            //回到初始页面
            $(".wrapper").html("");
            $(".wrapper").append(htmlStart);
            $("#login").click(doInit);
            pkObj.data.status=INIT;
        }
        else{
            alert("对方落荒而逃，恭喜你，不战而胜！");
        }
    })
}
function doInit() {
    //获得唯一的id
    var id = new Date().getTime()+""+Math.floor(Math.random()*11+1);
    pkObj.from=id;
    var obj=pkObj;
    //发送添加用户事件
    socket.emit("add user",obj);
    $(".wrapper").html("");
    $(".wrapper").append(htmlWait);
}
//发牌
function doDiscard(data) {
    pkObj=data;
    console.log(pkObj);
    $(".wrapper").html("");
    $(".wrapper").append(htmlPoker);
    for(var i=0;i<27;i++){
        var html = $("<button class='oppo-poker'></button>");
        html.css({"background-position":"-180px -480px"});
        $(".oppo-pokers").append(html);
    }
    for(var i=0;i<27;i++){
        var x=pkObj.data.pokers[i]%13*(-90);
        var y=parseInt(pkObj.data.pokers[i]/13)*(-120);
        var left=x+"px";
        var top=y+"px";
        var pokeri="poker"+i;
        var html = $("<button class='poker'></button>").addClass(pokeri);
        console.log(html);
        html.css({"background-position":left+" "+top});
        $(".pokers").append(html);
    }
    $(".poker").click(function(){
        if($(this).hasClass("select")){
            $(this).removeClass("select");
            $(this).animate({top:"+=50px"});
        }
        else{
            $(this).addClass("select");
            $(this).animate({top:"-=50px"});
        }
    });
    //发牌
    $(".confirm").click(function(){
        if($(".display").children() != null){
            $(".display .poker").remove();
        }
        var j=0;
        for(var i=0;i<27;i++){
            var index=".poker"+i;
            if($(index).hasClass('select')){
                $(".display").append($(index));
                j++;
            }
        }
        pkObj.data.count-=j;
        var sendMessage=$(".display").html();
        socket.emit('discard', pkObj,sendMessage);
        //把发牌按钮隐藏
        $(".confirm").hide();
        console.log("hide");
    });
    //取消
    $(".cancel").click(function(){
        for(var i=0;i<13;i++){
            var index=".poker"+i;
            if($(index).hasClass('select')){
                $(index).removeClass('select');
                $(index).animate({top:"+=50px"});
            }
        }
    });
    //退出游戏
    $(".abandon").click(function(){
        socket.emit('abandon', pkObj);
    })
}
//接收对方发来的牌
function doRecieve(data,after) {
    $(".confirm").show();
    console.log("show");
    console.log("other count"+after);
     var before= $(".oppo-pokers").children().length;
    console.log("before count"+before);
    for(var i=before;i>after;i--){
        $(".oppo-pokers").children('.oppo-poker:last').remove();
    }
    if($(".display").children() != null){
        $(".display .poker").remove();
    }
    $(".display").append(data);
}

待完成功能

• 发牌逻辑
  Git源码地址.