test test

This commit is contained in:
Flummi 2018-08-15 17:52:50 +02:00
parent 987e668e32
commit 7a8d362af1
6 changed files with 30 additions and 26 deletions

View File

@ -215,7 +215,8 @@ div[dropable=true] > * > * {
}
.player::before {
content: 'Spielername';
/*content: 'Spielername';*/
content: attr(data-name);
font-weight: bold;
text-align: center;
display: block;

View File

@ -24,7 +24,7 @@
<div id="p0_pile_card_3" class="pile"></div>
<div id="p0_pile_card_4" class="pile"></div>
</div>
<div id="p0_discard" class="player">
<div id="p0_discard" class="player" data-name="blah0">
<div id="p0_discard_0" class="pile"></div>
<div></div>
<div id="p0_discard_1" class="pile" dropable="true"></div>
@ -32,7 +32,7 @@
<div id="p0_discard_3" class="pile" dropable="true"></div>
<div id="p0_discard_4" class="pile" dropable="true"></div>
</div>
<div id="p1" class="player">
<div id="p1" class="player" data-name="blah1">
<div id="p1_pile_card_0" class="pile"></div>
<div></div>
<div id="p1_pile_card_1" class="pile"></div>
@ -40,7 +40,7 @@
<div id="p1_pile_card_3" class="pile"></div>
<div id="p1_pile_card_4" class="pile"></div>
</div>
<div id="p2" class="player">
<div id="p2" class="player" data-name="blah2">
<div id="p2_pile_card_0" class="pile"></div>
<div></div>
<div id="p2_pile_card_1" class="pile"></div>
@ -48,7 +48,7 @@
<div id="p2_pile_card_3" class="pile"></div>
<div id="p2_pile_card_4" class="pile"></div>
</div>
<div id="p3" class="player">
<div id="p3" class="player" data-name="blah3">
<div id="p3_pile_card_0" class="pile"></div>
<div></div>
<div id="p3_pile_card_1" class="pile"></div>

View File

@ -1,9 +1,11 @@
const colors = [...Array(12)].map((_,i) => ["blue","green","red"][i % 3]).sort();
export const card = ({ val, drag, joker = false }) =>
const cardtpl = ({ val, drag, joker = false }) =>
`<div class="card_outer" data-val="${val}"${drag ? 'draggable="true"' : ''}>
<div class="card_tri card_color_${joker?"joker":colors[val]}"></div>
<div class="card_tri card_color_${joker?"joker":colors[val-1]}"></div>
<div class="card_number card_number${joker?"_joker":""}_1">${val>0?val:""}</div>
<div class="card_number${joker?"_joker":""}_middle ${joker?"":colors[val]}">${joker?"Skip-Bo":val}</div>
<div class="card_number${joker?"_joker":""}_middle ${joker?"":colors[val-1]}">${joker?"Skip-Bo":val}</div>
<div class="card_number card_number${joker?"_joker":""}_2">${val>0?val:""}</div>
</div>`;
export const card = e => [e].map(cardtpl).join``;

View File

@ -10,11 +10,15 @@ document.querySelector("#menu button.menu_join").addEventListener("click", () =>
msgBox("joinGame");
});
document.querySelector("#p0_pile_card_0").insertAdjacentHTML("beforeend",
[{ val: 0, drag: true, joker: true }].map(card).join``
document.querySelector("#p0_discard_1").insertAdjacentHTML("beforeend",
card({ val: 0, drag: true, joker: true })
);
document.querySelector("#p0_pile_card_1").insertAdjacentHTML("beforeend",
[{ val: 1, drag: true, joker: false }].map(card).join``
card({ val: 1, drag: true, joker: false })
);
document.querySelector("#mainstack_card_1").insertAdjacentHTML("beforeend",
card({ val: 4 })
);
events.createCardEvents();

View File

@ -1,3 +1,5 @@
import { connect } from "./socket.js";
const msgBoxes = {
tpl: ({ title, content, buttons }) => `
<div class="msgBox">

View File

@ -1,3 +1,5 @@
import { msgBox, removeAllmsgBox } from "./msgbox.js";
let socket = false
, _playername
, _gameroom;
@ -36,20 +38,13 @@ const socketevents = () => {
document.querySelector("#menu").style.display = "none";
document.querySelector("#black").style.display = "none";
render.renderAll();
_game.player.forEach((player, i) => {
game.stackables.set(player[0], new game.player(i));
const _player = game.stackables.get(player[0]);
_player.id = i;
if(i === 0) {
player[1].cards.hand.forEach(card => {
_player.hand.push(new game.card({ type: card === 13 ? "joker" : "normal", val: card === 13 ? "" : card }));
});
}
player[1].cards.stock.forEach(card => {
_player.stock.push(new game.card({ type: card === 13 ? "joker" : "normal", val: card === 13 ? "" : card }));
});
render.renderAll();
console.log(player);
});
});
};
const clear = playerid => {
console.log([...document.querySelectorAll(`div[id^='p${playerid}_']:not(#p0_discard)`)]);
}
clear("1");