Merge branch 'main' into logic
# Conflicts: # public/js/game.js
This commit is contained in:
Thorsten Rausch
commit
2ac1733251
@ -10,6 +10,10 @@ COPY Webservice Webservice
|
||||
COPY public public
|
||||
COPY data data
|
||||
|
||||
RUN sed -i "s/DATE_TO_BE_REPLACED/$(date +%s)/" public/index.html
|
||||
RUN sed -i "s/COMMIT_TO_BE_REPLACED/GitHub: $(git ls-remote https://github.com/H4CK3R-01/Projektmanagement-Game refs/heads/main | awk '{print $1;}' | cut -c1-7)/" public/index.html
|
||||
RUN sed -i "s/COMMIT_LINK_TO_BE_REPLACED/https\:\/\/github.com\/H4CK3R-01\/Projektmanagement-Game\/commit\/$(git ls-remote https://github.com/H4CK3R-01/Projektmanagement-Game refs/heads/main | awk '{print $1;}')/" public/index.html
|
||||
|
||||
EXPOSE 5000
|
||||
|
||||
CMD [ "node", "Webservice/server.js" ]
|
||||
|
||||
27
README.md
27
README.md
@ -1,31 +1,46 @@
|
||||
# Projektmanagement Game
|
||||
|
||||
## Docker
|
||||
|
||||
### Build
|
||||
|
||||
```
|
||||
docker build Projektmanagement-Game/ -t pm-game
|
||||
```
|
||||
|
||||
### Deploy
|
||||
|
||||
```
|
||||
docker run -d -p 80:5000 pm-game
|
||||
```
|
||||
|
||||
### Check if it works
|
||||
|
||||
Open `http://127.0.0.1` in your Browser
|
||||
|
||||
|
||||
## Without docker
|
||||
### Install dependencies
|
||||
```
|
||||
npm install
|
||||
```
|
||||
|
||||
### (Optional) Use credentials for monitoring
|
||||
Set environment variables `WEBSOCKET_MONITOR_USERNAME` and `WEBSOCKET_MONITOR_PASSWORD`
|
||||
|
||||
`WEBSOCKET_MONITOR_USERNAME`: Username
|
||||
|
||||
`WEBSOCKET_MONITOR_PASDSWORD`: bcrypt hashed password. Generate with
|
||||
```
|
||||
node
|
||||
> require("bcrypt").hashSync("<your-password>", 10)
|
||||
```
|
||||
|
||||
Linux & MacOS: `export NAME="VALUE"`
|
||||
|
||||
Windows: `set NAME="VALUE"`
|
||||
|
||||
|
||||
### Run
|
||||
|
||||
```
|
||||
node Webservice/server.js
|
||||
```
|
||||
|
||||
### Check if it works
|
||||
|
||||
Open `http://127.0.0.1:5000` in your Browser
|
||||
11
Webservice/mobileHandler.js
Normal file
11
Webservice/mobileHandler.js
Normal file
@ -0,0 +1,11 @@
|
||||
function isMobile() {
|
||||
let mobileDeviceIndicator = 0;
|
||||
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
mobileDeviceIndicator = 1;
|
||||
}
|
||||
/*
|
||||
let hasTouchscreen = 'ontouchstart' in window;
|
||||
alert(hasTouchscreen ? 'has touchscreen' : 'doesn\'t have touchscreen');
|
||||
*/
|
||||
}
|
||||
|
||||
@ -1,27 +1,56 @@
|
||||
let express = require('express');
|
||||
let fs = require('fs');
|
||||
let app = express();
|
||||
let server = require('http').createServer(app);
|
||||
let {Server} = require("socket.io");
|
||||
let io = new Server(server);
|
||||
let cards = JSON.parse(fs.readFileSync(__dirname + '/../data/cards.json'));
|
||||
const express = require('express');
|
||||
const fs = require('fs');
|
||||
const {instrument} = require("@socket.io/admin-ui");
|
||||
const app = express();
|
||||
const server = require('http').createServer(app);
|
||||
const {Server} = require("socket.io");
|
||||
const io = new Server(server);
|
||||
let cards = JSON.parse(fs.readFileSync(__dirname + '/../data/fragen_10_06_21_final_new_format.json'));
|
||||
|
||||
let gameState = {
|
||||
players: [],
|
||||
positions: [],
|
||||
whosNext: 0,
|
||||
started: false
|
||||
};
|
||||
|
||||
let port = 5000;
|
||||
server.listen(port, function () {
|
||||
generate_log_message("MAIN", "Server", 'RUNNING', "PORT " + port);
|
||||
});
|
||||
|
||||
// Monitor websockets
|
||||
if (process.env.WEBSOCKET_MONITOR_USERNAME && process.env.WEBSOCKET_MONITOR_PASSWORD) {
|
||||
instrument(io, {
|
||||
auth: {
|
||||
type: "basic",
|
||||
username: process.env.WEBSOCKET_MONITOR_USERNAME,
|
||||
password: process.env.WEBSOCKET_MONITOR_PASSWORD
|
||||
},
|
||||
serverId: `${require("os").hostname()}#${process.pid}`
|
||||
});
|
||||
} else {
|
||||
instrument(io, {
|
||||
auth: false,
|
||||
serverId: `${require("os").hostname()}#${process.pid}`
|
||||
});
|
||||
}
|
||||
|
||||
// Serve static files (html, css, js)
|
||||
app.use(express.static(__dirname + '/../public'));
|
||||
|
||||
|
||||
// Websockets
|
||||
io.on('connection', socket => {
|
||||
let addedUser = false;
|
||||
|
||||
socket.on('add user', function (data) {
|
||||
if (gameState['players'].length < 4 && !gameState['started']) {
|
||||
socket.username = data.username;
|
||||
socket.room = data.room_name;
|
||||
|
||||
gameState['players'].push(socket.username);
|
||||
gameState['positions'].push(1);
|
||||
addedUser = true;
|
||||
|
||||
socket.emit('login');
|
||||
@ -30,6 +59,9 @@ io.on('connection', socket => {
|
||||
socket.broadcast.to(socket.room).emit('user joined', socket.username);
|
||||
|
||||
generate_log_message(socket.room, socket.username, "JOINED", "");
|
||||
} else {
|
||||
// TODO
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('new message', function (data) {
|
||||
@ -44,6 +76,21 @@ io.on('connection', socket => {
|
||||
socket.on('disconnect', function () {
|
||||
if (addedUser) {
|
||||
socket.broadcast.to(socket.room).emit('user left', socket.username);
|
||||
let index = gameState['players'].indexOf(socket.username);
|
||||
|
||||
if (index > -1) {
|
||||
gameState['players'].splice(index, 1);
|
||||
gameState['positions'].splice(index, 1);
|
||||
}
|
||||
|
||||
socket.leave(socket.room);
|
||||
|
||||
if (gameState['players'].length === 0) {
|
||||
gameState['players'] = [];
|
||||
gameState['positions'] = [];
|
||||
gameState['whosNext'] = 0;
|
||||
gameState['started'] = false;
|
||||
}
|
||||
}
|
||||
|
||||
generate_log_message(socket.room, socket.username, "LEFT", "");
|
||||
@ -52,18 +99,34 @@ io.on('connection', socket => {
|
||||
|
||||
// Game
|
||||
socket.on('roll dice', function () {
|
||||
if (gameState['whosNext'] === gameState['players'].indexOf(socket.username)) {
|
||||
gameState['started'] = true;
|
||||
let sides = 3;
|
||||
let randomNumber = Math.floor(Math.random() * sides) + 1;
|
||||
|
||||
io.in(socket.room).emit('dice', randomNumber);
|
||||
|
||||
generate_log_message(socket.room, socket.username, "DICE", randomNumber);
|
||||
} else {
|
||||
// TODO
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('get card', function (difficulty) {
|
||||
io.in(socket.room).emit('card', getRandomCard(difficulty));
|
||||
if (gameState['whosNext'] === gameState['players'].indexOf(socket.username)) {
|
||||
io.in(socket.room).emit('card', {'username': socket.username, 'card': getRandomCard(difficulty)});
|
||||
|
||||
generate_log_message(socket.room, socket.username, "CARD", difficulty);
|
||||
} else {
|
||||
// TODO
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('card finished', function (difficulty) {
|
||||
gameState['positions'][gameState['players'].indexOf(socket.username)] += difficulty;
|
||||
gameState['whosNext'] += 1;
|
||||
if(gameState['whosNext'] === gameState['players'].length) gameState['whosNext'] = 0;
|
||||
io.in(socket.room).emit('card destroyed');
|
||||
});
|
||||
});
|
||||
|
||||
@ -100,7 +163,6 @@ function getRandomCard(difficulty) {
|
||||
let filtered_cards = cards.filter(card => {
|
||||
return card.difficulty === difficulty;
|
||||
});
|
||||
|
||||
return shuffleAnswers(filtered_cards[Math.floor(Math.random() * filtered_cards.length)]);
|
||||
}
|
||||
|
||||
@ -115,5 +177,5 @@ function shuffleAnswers(card) {
|
||||
|
||||
function pad(width, string, padding) {
|
||||
if (string === undefined || string === null) return pad(width, " ", " ");
|
||||
return (width <= string.length) ? string : pad(width, string + padding, padding)
|
||||
return (width <= string.length) ? string : pad(width, string + padding, padding);
|
||||
}
|
||||
@ -1,71 +0,0 @@
|
||||
[
|
||||
{
|
||||
"id": 1,
|
||||
"difficulty": 1,
|
||||
"question": "Was?",
|
||||
"answers": [
|
||||
{
|
||||
"text": "A",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "B",
|
||||
"status": true
|
||||
},
|
||||
{
|
||||
"text": "C",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "D",
|
||||
"status": false
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"difficulty": 2,
|
||||
"question": "Wie?",
|
||||
"answers": [
|
||||
{
|
||||
"text": "A",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "B",
|
||||
"status": true
|
||||
},
|
||||
{
|
||||
"text": "C",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "D",
|
||||
"status": false
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"difficulty": 3,
|
||||
"question": "Wo?",
|
||||
"answers": [
|
||||
{
|
||||
"text": "A",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "B",
|
||||
"status": true
|
||||
},
|
||||
{
|
||||
"text": "C",
|
||||
"status": false
|
||||
},
|
||||
{
|
||||
"text": "D",
|
||||
"status": false
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
1052
data/fragen_10_06_21_final.json
Normal file
1052
data/fragen_10_06_21_final.json
Normal file
File diff suppressed because it is too large
Load Diff
1
data/fragen_10_06_21_final_new_format.json
Normal file
1
data/fragen_10_06_21_final_new_format.json
Normal file
File diff suppressed because one or more lines are too long
59
data/main.py
Normal file
59
data/main.py
Normal file
@ -0,0 +1,59 @@
|
||||
import json
|
||||
|
||||
if __name__ == '__main__':
|
||||
array = []
|
||||
with open('fragen_10_06_21_final.json') as file:
|
||||
data = json.load(file)
|
||||
|
||||
length_q = 0
|
||||
id_q = 0
|
||||
length = 0
|
||||
id = 0
|
||||
for i in range(0, len(data)):
|
||||
new = {'id': int(data[i]['id']), 'difficulty': int(data[i]['difficulty']), 'question': data[i]['question'],
|
||||
'answers': []}
|
||||
|
||||
new['answers'].append({"text": data[i]['A'],
|
||||
"status": 'A' == data[i]['key']
|
||||
})
|
||||
new['answers'].append({"text": data[i]['B'],
|
||||
"status": 'B' == data[i]['key']
|
||||
})
|
||||
new['answers'].append({"text": data[i]['C'],
|
||||
"status": 'C' == data[i]['key']
|
||||
})
|
||||
new['answers'].append({"text": data[i]['D'],
|
||||
"status": 'D' == data[i]['key']
|
||||
})
|
||||
|
||||
|
||||
if(length_q < len(data[i]['question'])):
|
||||
length_q = len(data[i]['question'])
|
||||
|
||||
|
||||
if(length < len(data[i]['A'])):
|
||||
length = len(data[i]['A'])
|
||||
if(length < len(data[i]['B'])):
|
||||
length = len(data[i]['B'])
|
||||
if(length < len(data[i]['C'])):
|
||||
length = len(data[i]['C'])
|
||||
if(length < len(data[i]['D'])):
|
||||
length = len(data[i]['D'])
|
||||
|
||||
array.append(new)
|
||||
|
||||
print("Längste Frage: " + str(length))
|
||||
print("Längste Antwort: " + str(length_q))
|
||||
|
||||
with open('fragen_10_06_21_final.json') as file:
|
||||
data = json.load(file)
|
||||
|
||||
for i in range(0, len(data)):
|
||||
if(length_q == len(data[i]['question'])):
|
||||
print("Längste Frage ID: " + str(data[i]['id']))
|
||||
|
||||
if(length == len(data[i]['A']) or length == len(data[i]['B']) or length == len(data[i]['C']) or length == len(data[i]['D'])):
|
||||
print("Längste Antwort ID: " + str(data[i]['id']))
|
||||
|
||||
with open('fragen_10_06_21_final_new_format.json', 'w', encoding='utf8') as file:
|
||||
json.dump(array, file, ensure_ascii=False)
|
||||
6288
package-lock.json
generated
6288
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -2,6 +2,7 @@
|
||||
"name": "projektmanagement-game",
|
||||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"@socket.io/admin-ui": "^0.2.0",
|
||||
"express": "^4.17.1",
|
||||
"socket.io": "^4.1.2"
|
||||
}
|
||||
|
||||
@ -5,7 +5,11 @@ header {
|
||||
background-color: #7d7d7d;
|
||||
color: #ffffff;
|
||||
height: 3em;
|
||||
padding-top: 10px;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
display: grid;
|
||||
grid-gap: 5%;
|
||||
grid-template-columns: 25% 40% 25%;
|
||||
}
|
||||
|
||||
.title {
|
||||
@ -16,3 +20,12 @@ header {
|
||||
font-size: 2em;
|
||||
vertical-align: central;
|
||||
}
|
||||
|
||||
.build {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
font-size: 1em;
|
||||
padding-right: 10px;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
35
public/css/mobile.css
Normal file
35
public/css/mobile.css
Normal file
@ -0,0 +1,35 @@
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-family: Arial, sans-serif
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
main {
|
||||
display: grid;
|
||||
grid-template-rows: 80% 20%;
|
||||
height: calc(100% - 3em - 10px);
|
||||
}
|
||||
|
||||
.material-icon {
|
||||
font-family: Material Icons, sans-serif !important;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: "liga";
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
@ -16,7 +16,10 @@
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="title">Projektmanagement Game</div>
|
||||
<div></div>
|
||||
<div class="title">PM-Game</div>
|
||||
<div class="build"><span>DATE_TO_BE_REPLACED</span><span><a href="COMMIT_LINK_TO_BE_REPLACED" target="_blank">COMMIT_TO_BE_REPLACED</a></span>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<div id="login">
|
||||
@ -50,8 +53,8 @@
|
||||
</footer>
|
||||
|
||||
<script crossorigin="anonymous" referrerpolicy="no-referrer"
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/6.0.2/browser/pixi.js"></script>
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.1.2/socket.io.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/6.0.4/browser/pixi.js"></script>
|
||||
<script src="js/Card.js"></script>
|
||||
<script src="js/Button.js"></script>
|
||||
<script src="js/Sprite.js"></script>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
function Button(default_color, hover_color, select_color, width, height, x, y, text, status, button_is_answer, click) {
|
||||
function Button(default_color, hover_color, select_color, width, height, x, y, text, status, click) {
|
||||
this.graphics = new PIXI.Graphics();
|
||||
this.default_color = default_color;
|
||||
this.hover_color = hover_color;
|
||||
@ -8,8 +8,7 @@ function Button(default_color, hover_color, select_color, width, height, x, y, t
|
||||
this.y = y;
|
||||
this.text = text;
|
||||
this.status = status;
|
||||
this.button_is_answer = button_is_answer;
|
||||
this.click = click;
|
||||
this.pointerdown = click;
|
||||
this.selected = false;
|
||||
let _this = this;
|
||||
|
||||
@ -20,24 +19,26 @@ function Button(default_color, hover_color, select_color, width, height, x, y, t
|
||||
this.graphics.beginFill(color);
|
||||
this.graphics.drawRect(this.x, this.y, this.width, this.height);
|
||||
this.graphics.endFill();
|
||||
}
|
||||
};
|
||||
|
||||
this.selectButton = function () {
|
||||
this.selected = true;
|
||||
this.changeButtonColor(select_color);
|
||||
}
|
||||
};
|
||||
|
||||
this.unSelectButton = function () {
|
||||
this.selected = false;
|
||||
this.changeButtonColor(default_color);
|
||||
}
|
||||
};
|
||||
|
||||
this.getButton = function () {
|
||||
const style = new PIXI.TextStyle({
|
||||
fontFamily: 'Arial',
|
||||
fontSize: 60,
|
||||
fontSize: 40,
|
||||
wordWrap: true,
|
||||
wordWrapWidth: game_board_size * 0.5 - 20,
|
||||
wordWrapWidth: this.width,
|
||||
breakWords: true,
|
||||
padding: 50
|
||||
});
|
||||
|
||||
this.graphics.clear();
|
||||
@ -55,14 +56,7 @@ function Button(default_color, hover_color, select_color, width, height, x, y, t
|
||||
this.graphics.interactive = true;
|
||||
this.graphics.buttonMode = true;
|
||||
this.graphics.defaultCursor = 'pointer';
|
||||
this.graphics.on('click', function () {
|
||||
if (_this.button_is_answer) {
|
||||
if (_this.selected === true) {
|
||||
_this.unSelectButton();
|
||||
} else {
|
||||
_this.selectButton();
|
||||
}
|
||||
}
|
||||
this.graphics.on('pointerdown', function () {
|
||||
click();
|
||||
});
|
||||
this.graphics.on('mouseover', function () {
|
||||
@ -74,5 +68,5 @@ function Button(default_color, hover_color, select_color, width, height, x, y, t
|
||||
if (!_this.selected) _this.changeButtonColor(_this.default_color);
|
||||
});
|
||||
return this.graphics;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
function Card(game_board_size, s, a1, a2, a3, a4, d, your_turn) {
|
||||
this.card = new PIXI.Graphics();
|
||||
this.s = s;
|
||||
this.a1 = a1;
|
||||
@ -10,6 +10,7 @@ function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
if (a3.status) this.right_answer = this.a3.text;
|
||||
if (a4.status) this.right_answer = this.a4.text;
|
||||
this.d = d;
|
||||
this.your_turn = your_turn;
|
||||
this.card_x = game_board_size * 0.25 + 2.5;
|
||||
this.card_y = game_board_size / 2 - game_board_size * 0.72 / 2 + 2.5;
|
||||
this.card_height = game_board_size * 0.72;
|
||||
@ -20,7 +21,7 @@ function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
this.showCard = function () {
|
||||
const style = new PIXI.TextStyle({
|
||||
fontFamily: 'Arial',
|
||||
fontSize: 60,
|
||||
fontSize: 50,
|
||||
wordWrap: true,
|
||||
wordWrapWidth: game_board_size * 0.5 - 20,
|
||||
});
|
||||
@ -48,27 +49,35 @@ function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
this.card.addChild(basicText);
|
||||
|
||||
// Answers
|
||||
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 150, this.card_x + 20, this.card_y + this.card_height - 120 - 170 * 4, this.a1.text, this.a1.status, true, function () {
|
||||
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 () {
|
||||
if (_this.your_turn) {
|
||||
select_answer(0, _this.a1.text);
|
||||
}
|
||||
}));
|
||||
|
||||
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 150, this.card_x + 20, this.card_y + this.card_height - 120 - 170 * 3, this.a2.text, this.a2.status, true, function () {
|
||||
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 () {
|
||||
if (_this.your_turn) {
|
||||
select_answer(1, _this.a2.text);
|
||||
}
|
||||
}));
|
||||
|
||||
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 150, this.card_x + 20, this.card_y + this.card_height - 120 - 170 * 2, this.a3.text, this.a3.status, true, function () {
|
||||
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 () {
|
||||
if (_this.your_turn) {
|
||||
select_answer(2, _this.a3.text);
|
||||
}
|
||||
}));
|
||||
|
||||
this.buttons.push(new Button(0xffffff, 0xcccccc, 0x4169E1, this.card_width - 40, 150, this.card_x + 20, this.card_y + this.card_height - 120 - 170 * 1, this.a4.text, this.a4.status, true, function () {
|
||||
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 () {
|
||||
if (_this.your_turn) {
|
||||
select_answer(3, _this.a4.text);
|
||||
}
|
||||
}));
|
||||
|
||||
this.buttons.forEach(button => this.card.addChild(button.getButton()));
|
||||
|
||||
|
||||
// OK-Button
|
||||
this.card.addChild(new Button(0xffffff, 0xcccccc, 0xffffff, this.card_width - 40, 100, this.card_x + 20, this.card_y + this.card_height - 120, "OK", null, false, function () {
|
||||
this.card.addChild(new Button(0xffffff, 0xcccccc, 0xffffff, this.card_width - 40, 100, this.card_x + 20, this.card_y + this.card_height - 120, "OK", null, function () {
|
||||
if (answer !== null) {
|
||||
if (_this.right_answer === answer) {
|
||||
console.log("Richtig");
|
||||
@ -79,9 +88,7 @@ function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
answer = null;
|
||||
diced = false;
|
||||
rolled_number = null;
|
||||
rolled_number_text.destroy();
|
||||
border_card_stack.clear();
|
||||
_this.card.destroy();
|
||||
socket.emit('card finished', d);
|
||||
} else {
|
||||
alert("Bitte wähle eine Antwortmöglichkeit aus");
|
||||
}
|
||||
@ -90,6 +97,11 @@ function Card(game_board_size, s, a1, a2, a3, a4, d) {
|
||||
app.stage.addChild(this.card);
|
||||
};
|
||||
|
||||
this.destroyCard = function () {
|
||||
if (this.card !== null) {
|
||||
this.card.destroy();
|
||||
}
|
||||
};
|
||||
|
||||
function select_answer(id, text) {
|
||||
_this.buttons.forEach(button => button.unSelectButton());
|
||||
|
||||
@ -6,12 +6,12 @@ function Sprite(x, y) {
|
||||
this.getSprite = function () {
|
||||
this.setSize(this.sprite, sprite_size);
|
||||
return this.sprite;
|
||||
}
|
||||
};
|
||||
|
||||
this.setSize = function (sprite, size) {
|
||||
sprite.x = this.coord_x * size - size * 0.2;
|
||||
sprite.y = this.coord_y * size - size * 0.2;
|
||||
sprite.width = size * 1.5;
|
||||
sprite.height = size * 1.5;
|
||||
}
|
||||
};
|
||||
}
|
||||
@ -2,7 +2,9 @@ let socket;
|
||||
let connected = false;
|
||||
|
||||
function start_chat() {
|
||||
socket = io();
|
||||
socket = io("/", {
|
||||
closeOnBeforeunload: false
|
||||
});
|
||||
|
||||
socket.on('login', function () {
|
||||
connected = true;
|
||||
@ -43,6 +45,7 @@ function addLogMessage(message) {
|
||||
li.innerText = message;
|
||||
|
||||
document.getElementById("messages_received").appendChild(li);
|
||||
document.getElementById("messages_received").scrollTop = document.getElementById("messages_received").scrollHeight;
|
||||
}
|
||||
|
||||
function addChatMessage(data) {
|
||||
@ -65,4 +68,12 @@ function addChatMessage(data) {
|
||||
messageDiv.appendChild(messageBody);
|
||||
|
||||
document.getElementById('messages_received').append(messageDiv);
|
||||
document.getElementById("messages_received").scrollTop = document.getElementById("messages_received").scrollHeight;
|
||||
}
|
||||
|
||||
document.getElementById('message_input').onkeydown = function (e) {
|
||||
if (e.key === "Enter") {
|
||||
sendMessage();
|
||||
e.preventDefault();
|
||||
}
|
||||
};
|
||||
@ -11,6 +11,7 @@ let player_color = [0xff0000, 0x00ff00, 0x0000ff, 0xffff00];
|
||||
let player_sprite_array = [];
|
||||
let hunter = new Hunter();
|
||||
|
||||
let card;
|
||||
let answer = null;
|
||||
let show_card = false;
|
||||
let diced = false;
|
||||
@ -56,7 +57,7 @@ let sprites = [
|
||||
function start_game() {
|
||||
app = new PIXI.Application({
|
||||
autoResize: true,
|
||||
resolution: devicePixelRatio,
|
||||
resolution: 1,
|
||||
backgroundAlpha: 0,
|
||||
width: max_size / game_board_size,
|
||||
height: max_size / game_board_size
|
||||
@ -117,7 +118,7 @@ function start_game() {
|
||||
dice.interactive = true;
|
||||
dice.buttonMode = true;
|
||||
dice.defaultCursor = 'pointer';
|
||||
dice.on('click', function () {
|
||||
dice.on('pointerdown', function () {
|
||||
if (!diced) {
|
||||
socket.emit('roll dice');
|
||||
}
|
||||
@ -147,17 +148,26 @@ function start_game() {
|
||||
rolled_number_text.x = sprite_size * 7 - sprite_size * 0.2 + dice.width / 2 - rolled_number_text.width / 2;
|
||||
rolled_number_text.y = sprite_size * 6 - sprite_size * 0.2;
|
||||
app.stage.addChild(rolled_number_text);
|
||||
|
||||
});
|
||||
|
||||
socket.on('card', function (data) {
|
||||
let q = data.question;
|
||||
let a = data.answers;
|
||||
let d = data.difficulty;
|
||||
new Card(game_board_size, q, a[0], a[1], a[2], a[3], d).showCard();
|
||||
let u = data.username;
|
||||
let q = data.card.question;
|
||||
let a = data.card.answers;
|
||||
let d = data.card.difficulty;
|
||||
card = new Card(game_board_size, q, a[0], a[1], a[2], a[3], d, u === username);
|
||||
card.showCard();
|
||||
show_card = true;
|
||||
});
|
||||
|
||||
socket.on('card destroyed', function () {
|
||||
diced = false;
|
||||
show_card = false;
|
||||
card.destroyCard();
|
||||
rolled_number_text.destroy();
|
||||
border_card_stack.clear();
|
||||
});
|
||||
|
||||
resize();
|
||||
}
|
||||
|
||||
@ -169,7 +179,7 @@ function generate_card_stack(sprite, x, y, onclick) {
|
||||
sprite.interactive = true;
|
||||
sprite.buttonMode = true;
|
||||
sprite.defaultCursor = 'pointer';
|
||||
sprite.on('click', onclick);
|
||||
sprite.on('pointerdown', onclick);
|
||||
return sprite;
|
||||
}
|
||||
|
||||
@ -188,10 +198,24 @@ function generate_circle(graphics, x, y) {
|
||||
}
|
||||
|
||||
function calculate_size() {
|
||||
if (game.offsetWidth > game.offsetHeight) {
|
||||
return game.offsetHeight;
|
||||
let width;
|
||||
let height;
|
||||
if (game.offsetWidth > window.innerWidth) {
|
||||
width = window.innerWidth - document.getElementById('chat').offsetWidth;
|
||||
} else {
|
||||
return game.offsetWidth;
|
||||
width = game.offsetWidth;
|
||||
}
|
||||
|
||||
if (game.offsetHeight > window.innerHeight) {
|
||||
height = window.innerHeight - document.getElementsByTagName('header')[0].offsetHeight;
|
||||
} else {
|
||||
height = game.offsetHeight;
|
||||
}
|
||||
|
||||
if (width > height) {
|
||||
return height;
|
||||
} else {
|
||||
return width;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user