DHBW/Projektmanagement-Game
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

- Fixed "your turn"

Browse Source 
- Scoreboard
This commit is contained in:
H4CK3R-01 2021-06-21 22:45:58 +02:00 committed by H4CK3R-01
parent 0411b85736
commit f538fa4bfe
3 changed files with 93 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
Webservice/server.js
View File

@ -55,6 +55,8 @@ io.on('connection', socket => {
socket.emit('login');
socket.join(socket.room);
if (game[socket.room].players.length === 1) io.to(socket.id).emit('first player');
socket.broadcast.to(socket.room).emit('user joined', socket.username);
generate_log_message(socket.room, socket.username, "JOINED", "");
@ -130,18 +132,19 @@ io.on('connection', socket => {
if (answerIsCorrect) {
game[socket.room].move_player(socket.username, difficulty);
generate_log_message(socket.room, socket.username, "MOVE", difficulty);
let index = game[socket.room].get_player_index(socket.username);
let next_player = game[socket.room].players[game[socket.room].currentPlayerIndex].name;
io.in(socket.room).emit('player moved', {
"next_player": next_player,
"player": index,
"position": game[socket.room].players[index].position
});
}
let index = game[socket.room].get_player_index(socket.username);
let position = game[socket.room].players[index].position;
game[socket.room].finish_turn();
io.in(socket.room).emit('player moved', {
"next_player": game[socket.room].players[game[socket.room].currentPlayerIndex].name,
"player": index,
"position": position
});
switch (game[socket.room].currentStatus) {
case Game.STATUS.IS_WON:
//TODO show clients the winner

42
public/js/Card.js
View File

@ -38,7 +38,12 @@ function Card(game_board_size, s, a1, a2, a3, a4, d, your_turn) {
this.card.drawRoundedRect(this.card_x, this.card_y, this.card_width, this.card_height, 10);
this.card.endFill();
const header = new PIXI.Text("Schwierigkeit " + this.d, header_style);
let header;
if (this.d === 0) {
header = new PIXI.Text("Scoreboard", header_style);
} else {
header = new PIXI.Text("Schwierigkeit " + this.d, header_style);
}
header.x = this.card_x + 20 + this.card.width / 2 - header.width / 2 - 2.5 - 20;
header.y = this.card_y + 20;
this.card.addChild(header);
@ -49,25 +54,41 @@ function Card(game_board_size, s, a1, a2, a3, a4, d, your_turn) {
this.card.addChild(basicText);
// Answers
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 4, this.a1.text, this.a1.status, function () {
let color = 0xffffff;
if (this.d === 0) {
color = 0xFFDDA1;
}
this.buttons.push(new Button(color, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 4, this.a1.text, this.a1.status, function () {
if (_this.your_turn) {
select_answer(0, _this.a1.text);
}
}));
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 3, this.a2.text, this.a2.status, function () {
color = 0xffffff;
if (this.d === 0) {
color = 0x4169E1;
}
this.buttons.push(new Button(color, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 3, this.a2.text, this.a2.status, function () {
if (_this.your_turn) {
select_answer(1, _this.a2.text);
}
}));
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 2, this.a3.text, this.a3.status, function () {
color = 0xffffff;
if (this.d === 0) {
color = 0x6C9A8B;
}
this.buttons.push(new Button(color, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 2, this.a3.text, this.a3.status, function () {
if (_this.your_turn) {
select_answer(2, _this.a3.text);
}
}));
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 1, this.a4.text, this.a4.status, function () {
color = 0xffffff;
if (this.d === 0) {
color = 0xF47A93;
}
this.buttons.push(new Button(color, 0xcccccc, 0x4169E1, this.card_width - 40, 200, this.card_x + 20, this.card_y + this.card_height - 120 - 220 * 1, this.a4.text, this.a4.status, function () {
if (_this.your_turn) {
select_answer(3, _this.a4.text);
}
@ -91,7 +112,16 @@ function Card(game_board_size, s, a1, a2, a3, a4, d, your_turn) {
diced = false;
rolled_number = null;
} else {
alert("Bitte wähle eine Antwortmöglichkeit aus");
if (your_turn === true) {
alert("Bitte wähle eine Antwortmöglichkeit aus");
} else {
show_card = false;
answer = null;
diced = false;
rolled_number = null;
card.destroyCard();
border_card_stack.clear();
}
}
}).getButton());

49
public/js/game.js
View File

@ -1,10 +1,11 @@
/*
Images
background.jpg: https://www.lignaushop.de/images/product_images/popup_images/treppenstufe-buecherregal-fensterbank-eiche-country-rustikal-unbehandelt-wuppertal.JPG
background.jpg: https://pixabay.com/get/ge3fe775ba1a5bfd2cc937b0687982214d547e5cf538543560fc25041c070ad5b860d8dd24df751dbc5c7d5ede3f672e7_1920.jpg?attachment=
card_stack.png: https://www.google.de/url?sa=i&url=https%3A%2F%2Fwww.pngegg.com%2Fpt%2Fsearch%3Fq%3Drainha%2Bde%2Bcopas&psig=AOvVaw3wwfk87wAXBxqmdXnoGSfe&ust=1623254731054000&source=images&cd=vfe&ved=0CAIQjRxqFwoTCMjUoaG1iPECFQAAAAAdAAAAABA5
dice.svg: https://www.svgrepo.com/download/198836/gambler-casino.svg
sprite.jpg: https://media.istockphoto.com/photos/gray-granite-stone-texture-seamless-square-background-tile-ready-picture-id1096464726
*/
let positions = [0, 0, 0, 0];
let card;
let answer = null;
let show_card = false;
@ -15,6 +16,7 @@ let game = document.getElementById('game');
let app;
let border_card_stack = new PIXI.Graphics();
let my_turn;
let score_button;
let game_board_size = 2000;
let max_size = calculate_size();
@ -118,7 +120,7 @@ function start_game() {
// Logo
let logo = PIXI.Sprite.from('/img/logo_2.png');
let logo = PIXI.Sprite.from('/img/logo.png');
logo.x = sprite_size * 3 - sprite_size * 0.2;
logo.y = sprite_size * 5.5 - sprite_size * 0.2;
logo.width = sprite_size * 3.5;
@ -132,7 +134,7 @@ function start_game() {
fontSize: 70,
fontWeight: 'bold',
}));
my_turn.x = sprite_size * 3;
my_turn.x = sprite_size * 6;
my_turn.y = sprite_size * 8;
app.stage.addChild(my_turn);
@ -149,6 +151,43 @@ function start_game() {
app.stage.addChild(rolled_number_text);
let score_button_text = new PIXI.Text("Scoreboard", new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 40,
wordWrap: true,
wordWrapWidth: this.width,
breakWords: true,
padding: 50
}));
score_button_text.x = sprite_size * 3 + 25 - sprite_size * 0.2;
score_button_text.y = sprite_size * 7 + 25 - sprite_size * 0.2 + sprite_size * 0.5;
score_button = new PIXI.Graphics();
score_button.lineStyle(4, 0x000000, 1);
score_button.beginFill(0x7d7d7d);
score_button.drawRect(sprite_size * 3 - sprite_size * 0.2, sprite_size * 7 - sprite_size * 0.2 + sprite_size * 0.5, score_button_text.width + 50, score_button_text.height + 50);
score_button.endFill();
score_button.interactive = true;
score_button.buttonMode = true;
score_button.defaultCursor = 'pointer';
score_button.on('pointerdown', function () {
card = new Card(game_board_size, "",
{"text": "Spieler 1: " + positions[0], "status": false},
{"text": "Spieler 2: " + positions[1], "status": false},
{"text": "Spieler 3: " + positions[2], "status": false},
{"text": "Spieler 4: " + positions[3], "status": false}, 0, false);
card.showCard();
show_card = true;
});
app.stage.addChild(score_button);
score_button.addChild(score_button_text);
socket.on('first player', function () {
my_turn.text = "Your Turn";
});
socket.on('dice', function (randomInt) {
rolled_number = randomInt;
diced = true;
@ -189,21 +228,25 @@ function start_game() {
switch (player) {
case 0:
positions[0] = data.position;
player_a.clear();
player_a = generate_circle(new PIXI.Graphics(), y, x, 'yellow', 1);
app.stage.addChild(player_a);
break;
case 1:
positions[1] = data.position;
player_b.clear();
player_b = generate_circle(new PIXI.Graphics(), y, x, 'blue', 2);
app.stage.addChild(player_b);
break;
case 2:
positions[2] = data.position;
player_c.clear();
player_c = generate_circle(new PIXI.Graphics(), y, x, 'green', 3);
app.stage.addChild(player_c);
break;
case 3:
positions[3] = data.position;
player_d.clear();
player_d = generate_circle(new PIXI.Graphics(), y, x, 'red', 4);
app.stage.addChild(player_d);