js，jq斗地主小项目

斗地主小项目

运用JS，JQ混合编写，在页面上实现斗地主的基本功能

斗地主游戏的主要流程：

1. 洗牌
2. 发牌
3. 抢地主
4. 进入出牌阶段
5. 胜负结算

斗地主中数据流程：

在游戏中我们需要进行画面与数据的分离

• 生成初始牌组的数据

  • 设计牌组数据

• 洗牌就是把初始数据进行打乱

• 洗牌：

  • 生成牌组。
  • 触发洗牌。
  • 执行洗牌动画。
    • 设计动画：（自己喜欢怎么洗就怎么写，这是最简易的动画）
    1. 把一份牌变成三份
    2. 把三份牌中的一份往左移动，另一份往移动
    3. 把再牌集中回来。连续多次，让玩家觉得动画就是一个洗牌的动作。

• 发牌：

  • 绑定发牌事件。

    • 如果绑定事件的元素已经发生改变，则绑定的事件也会失效。

  • 通过动画把桌面的牌发给玩家们，对应的玩家生成对应牌面。

    • 需要考虑的是玩家们的数据结构
    • 正真的牌在电脑中它应该是以数据的形式出现的，并不是画面形式出现的。所以这时个我们应该先考虑把数据完成了分配再考虑画面的生成。
    • 生成了玩家对应的数据后，再想办法把这些数据变成画面。
    • 最好是先有数据，再生成画面。

  • 发完牌后，需要对所有玩家的手牌进行排序。

    • 需要进行些简单的动画效果。所有牌翻过来，等一小会再翻回去，这时牌已经是排好序的牌的了。

• 抢地主：

  • 随机一位玩家开始抢地主。
  • 抢地主的玩家有两种选择：1、抢地主，2、不抢。
    • 在页面中每个玩家对应的位置应该有这两个选择按钮
    • 对应的按钮绑定对应的事件
  • 如果玩家直接抢地主的话，则该玩家就是地主，如果不抢则选择权给下一位玩家。
  1. 抢地主成功，把桌面上最后的三张牌发给地主，然后进入出牌流程
  2. 不抢的话，就会让下一位玩家进入抢地主功能流程
  • 如果所有玩家都不抢地主的话，本局为流局

• 出牌阶段：

  • 确定哪一位玩家出牌。
  • 选择：
    • 出牌
    1. 绑定选中牌的事件
    2. 绑定取消选中牌的事件
    3. 点击出牌。
       • 判断用户选的牌能否打出去（牌型判断）
       • 判断用户合法的牌组能否打得了，上一玩家出的牌
    • 过牌
  • 当该玩家选择之后，到下一位玩家进入出牌阶段。
  • 如果在倒计时结束后没有点击出牌，将自动选择最小的单张牌打出去

• 胜负结算：

  • 当某位玩家胜出后。
    • 进行身份判断并获取玩家当前的积分与底分倍数进行运算

详细代码在这→仓库

效果展示

• 开场动画
  

• 游戏界面
  

• 洗完牌准备发牌
  

• 发完牌
  

• 抢地主
  

• 出牌阶段
  

• 某些牌型打出去后的特效
  

写着玩，欢迎大佬们指点指点，多交流多学习