提交 1d2e18cf 编写于 作者: C changjiuxiong

新增 显示三张地主牌

上级 ee7f35fd
.pokerDesk[data-v-87d8fb88]{width:100px;border:1px solid;border-radius:16px;margin-left:-50px;font-size:30px}.pokerDesk[data-v-87d8fb88],.pokerDizhu[data-v-87d8fb88]{height:100%;float:left;background-color:azure;background-repeat:no-repeat;background-size:cover}.pokerDizhu[data-v-87d8fb88]{width:50px;border:1px solid;border-radius:8px;margin-left:-25px;font-size:20px}.poker[data-v-87d8fb88]:hover{background-color:#faebd7}.selected[data-v-87d8fb88]{margin-top:-20px}.s[data-v-87d8fb88]{background-image:url(../img/s.aa339508.jpg)}.x[data-v-87d8fb88]{background-image:url(../img/x.aa03af01.png)}
\ No newline at end of file
.pokerDesk[data-v-ce27a79c]{height:100%;width:100px;border:1px solid;border-radius:16px;float:left;margin-left:-50px;background-color:azure;font-size:30px;background-repeat:no-repeat;background-size:cover}.poker[data-v-ce27a79c]:hover{background-color:#faebd7}.selected[data-v-ce27a79c]{margin-top:-20px}.s[data-v-ce27a79c]{background-image:url(../img/s.aa339508.jpg)}.x[data-v-ce27a79c]{background-image:url(../img/x.aa03af01.png)}
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><title>Vue App</title><link href=css/app.30813d57.css rel=preload as=style><link href=js/app.ff22e28a.js rel=preload as=script><link href=js/chunk-vendors.fc173c6b.js rel=preload as=script><link href=css/app.30813d57.css rel=stylesheet></head><body><div id=app></div><script src=js/chunk-vendors.fc173c6b.js></script><script src=js/app.ff22e28a.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><title>Vue App</title><link href=css/app.04114e2b.css rel=preload as=style><link href=js/app.32848eb0.js rel=preload as=script><link href=js/chunk-vendors.fc173c6b.js rel=preload as=script><link href=css/app.04114e2b.css rel=stylesheet></head><body><div id=app></div><script src=js/chunk-vendors.fc173c6b.js></script><script src=js/app.32848eb0.js></script></body></html>
\ No newline at end of file
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
......@@ -5,13 +5,11 @@
</template>
<script>
import HelloWorld from './components/HelloWorld.vue';
import Game from './components/Game.vue';
export default {
name: 'App',
components: {
HelloWorld,
Game,
}
}
......
<template>
<div style="user-select: none;position: fixed;left: 0;right: 0;top: 0;bottom: 0;background-repeat: no-repeat;background-size: cover;" :style="{backgroundImage:'url('+require('../img/scene.jpg')+')'}">
<audio muted autoplay loop controls :style="{ marginLeft: buttonMarginLeft + 'px' }">
<audio muted autoplay loop controls style="position: fixed; left: 0;bottom: 0">
<source src="../audio/bgm.mp3">
您的浏览器不支持 audio 元素。
</audio>
<!-- <div v-show="false" style="width: 300px;height:300px;float: left; position: fixed ; left: 0; top: 0px; background-color: aliceblue; text-align: center">-->
<!-- <span>-->
<!-- 手牌:{{player2Str[1]}}-->
<!-- </span>-->
<!-- </div>-->
<!-- <div v-show="false" style="width: 300px;height:300px;float: left; position: fixed ; right: 0; top: 0px; background-color: aliceblue; text-align: center">-->
<!-- <span>-->
<!-- 手牌:{{player1Str[1]}}-->
<!-- </span>-->
<!-- </div>-->
<div v-show="false" style="width: 300px;height:300px;float: left; position: fixed ; left: 600px; top: 0px; background-color: aliceblue; text-align: center">
<div style="width: 300px;word-wrap: break-word;">
已出的牌:
<br/>
{{deskStr[1]}}
<div v-if="game.stage==='play'" :style="{ marginLeft: dizhuPokerMarginLeft + 'px' }" style="position: fixed;top:10px;width: 100%;height: 100px">
<div style="color: red">
地主牌
</div>
<div v-for="item in game.dizhuPokerList" class="pokerDizhu" :class="{ s:item.number===16, x:item.number===17 }">
<span v-show="item.number<16">
{{item.text}}
</span>
</div>
</div>
</div>
<!-- <div style="position: fixed;left: 10px;bottom: 10px;">-->
<!-- <button @click="reStart" style="height: 50px;font-size:30px;">开始新一局</button>-->
<!-- </div>-->
<div v-show="game.stage==='ready'" :style="{ marginLeft: playerMarginLeft-40 + 'px' }" style="font-size: 20px;color:white;position: fixed;bottom:200px;z-index: 999;">
<button v-show="!game.playerList[0].ready" @mousedown="setReady" style="font-size: 40px;height: 60px;line-height: 30px;border-radius: 4px;background-color: lawngreen;">{{game.playerList[0].ready?'已准备':'准备'}}</button>
......@@ -41,9 +28,6 @@
<button v-show="true" @mousedown="game.playerList[0].setJiaoFen(1)" style="font-size: 40px;height: 60px;line-height: 30px;border-radius: 4px;background-color: lawngreen;">1分</button>
<button v-show="true" @mousedown="game.playerList[0].setJiaoFen(2)" style="font-size: 40px;height: 60px;line-height: 30px;border-radius: 4px;background-color: lawngreen;">2分</button>
<button v-show="true" @mousedown="game.playerList[0].setJiaoFen(3)" style="font-size: 40px;height: 60px;line-height: 30px;border-radius: 4px;background-color: lawngreen;">3分</button>
<!-- <div v-show="game.playerList[0].ready" style="color: red;width:80px;border: solid;border-radius: 4px;position: absolute;">-->
<!-- {{game.playerList[0].ready?'已准备':'未准备'}}-->
<!-- </div>-->
</div>
<div v-show="game.stage==='play'" :style="{ marginLeft: playerMarginLeft-150 + 'px' }" style="color:white;position: fixed;bottom:0;width: 100%;height: 200px;line-height: 200px;">
......@@ -201,48 +185,8 @@ export default {
playerJiaoFenMargin: function(){
return window.innerWidth/2 - 30;
},
deskPoker: function(){
if(this.game.deskPokerObj && this.game.deskPokerObj.poker){
if(this.game.deskPokerObj.poker[0] && this.game.deskPokerObj.poker[0].text){
return this.game.deskPokerObj.poker;
}
}
return [];
},
player2Str: function () {
let game = this.game;
let i = 2;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
game.playerList[i].lastSendObjToString()
];
},
player1Str: function () {
let game = this.game;
let i = 1;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
game.playerList[i].lastSendObjToString()
];
},
player0Str: function () {
let game = this.game;
let i = 0;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
game.playerList[i].lastSendObjToString()
];
},
deskStr: function () {
let game = this.game;
return [
'desk',
game.pokerListToString()
];
dizhuPokerMarginLeft: function(){
return (window.innerWidth - (this.game.dizhuPokerList.length*50))/2;
},
},
mounted() {
......@@ -284,23 +228,10 @@ export default {
}
},
sendPoker() {
let game = this.game;
let success = game.playerList[0].playByString(this.playerStr);
if(success){
this.playerStr='';
}
},
pass() {
this.game.playerList[0].playByString('pass');
},
reStart() {
this.game = new Game();
this.playerStr='';
},
},
}
</script>
......@@ -312,6 +243,12 @@ export default {
background-repeat: no-repeat;background-size: cover;
}
.pokerDizhu{
height:100%;width:50px;border: solid 1px;border-radius: 8px;float: left;margin-left:-25px;background-color: azure;
font-size: 20px;
background-repeat: no-repeat;background-size: cover;
}
.poker:hover{
background-color: antiquewhite;
}
......
<template>
<div>
<div style="width: 300px;height:300px;float: left; position: fixed ; left: 0px; top: 0px; background-color: aliceblue; text-align: center">
<span>
{{player2Str[0]}}
</br>
{{player2Str[1]}}
</br></br>
{{player2Str[2]}}
</span>
</div>
<div style="width: 300px;height:300px;float: left; position: fixed ; left: 600px; top: 0px; background-color: aliceblue; text-align: center">
<span>
{{player1Str[0]}}
</br>
{{player1Str[1]}}
</br></br>
{{player1Str[2]}}
</span>
</div>
<div style="width: 300px;height:300px;float: left; position: fixed ; left: 300px; top: 300px; background-color: aliceblue; text-align: center">
<span>
{{player0Str[0]}}
</br>
{{player0Str[1]}}
</br></br>
{{player0Str[2]}}
</span>
<div>
<input v-model="playerStr" type="text"/>
<button @click="sendPoker">send</button>
<button @click="pass">pass</button>
</div>
</div>
<div style="width: 300px;height:300px;float: left; position: fixed ; left: 300px; top: 0px; background-color: aliceblue; text-align: center">
<div style="width: 300px;word-wrap: break-word;">
{{deskStr[0]}}
</br>
{{deskStr[1]}}
</div>
</div>
<div style="position: fixed;left: 300px;top: 600px;">
<button @click="reStart">reStart</button>
</div>
</div>
</template>
<script>
import Game from "../doudizhu/Game";
export default {
name: 'HelloWorld',
data(){
return {
data:'fuck1',
game: new Game(),
playerStr: '',
}
},
computed: {
player2Str: function () {
let game = this.game;
let i = 2;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
'last : '+game.playerList[i].lastSendObjToString()
];
},
player1Str: function () {
let game = this.game;
let i = 1;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
'last : '+game.playerList[i].lastSendObjToString()
];
},
player0Str: function () {
let game = this.game;
let i = 0;
return [
game.playerList[i].name+' : '+game.playerList[i].type+' : '+game.playerList[i].pokerList.length,
game.playerList[i].pokerListToString(),
'last : '+game.playerList[i].lastSendObjToString()
];
},
deskStr: function () {
let game = this.game;
return [
'desk',
game.pokerListToString()
];
},
},
mounted() {
this.data = this.game.playerList[1].name;
},
methods:{
reDraw() {
},
sendPoker() {
let game = this.game;
let success = game.playerList[0].playByString(this.playerStr);
if(success){
this.playerStr='';
}
},
pass() {
this.game.playerList[0].playByString('pass');
},
reStart() {
this.game = new Game();
this.playerStr='';
},
},
}
</script>
<style scoped>
</style>
......@@ -5,6 +5,7 @@ class Game{
constructor() {
this.playerList = [];
this.pokerList = [];
this.dizhuPokerList = [];
this.deskPokerObj = null;
this.oldPokerList = [];
this.currentPlayer = null;
......@@ -106,6 +107,7 @@ class Game{
this.playerList[2].reset();
this.pokerList = [];
this.dizhuPokerList = [];
this.deskPokerObj = null;
this.oldPokerList = [];
this.currentPlayer = null;
......@@ -171,6 +173,8 @@ class Game{
for(let i=0; i<this.playerList.length; i++){
this.playerList[i].sortPoker();
}
this.dizhuPokerList = this.pokerList.slice(0);
}
initPlayerList(){
......@@ -221,21 +225,6 @@ class Game{
}
pokerListToString(){
let result = '';
result += Poker.pokerListToString(this.pokerList);
result += '\n';
for(let i=0; i<this.oldPokerList.length; i++){
result += Poker.pokerListToString(this.oldPokerList[i].poker);
if(i<this.oldPokerList.length-1){
result += ',';
}
}
result += '\n';
result += this.deskPokerObj?Poker.pokerListToString(this.deskPokerObj.poker):'';
return result;
}
getRandomIntInclusive(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册