Merge branch 'main' into multiplayer
This commit is contained in:
H4CK3R-01
GitHub
@@ -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 {
|
||||
@@ -15,4 +19,13 @@ header {
|
||||
align-items: center;
|
||||
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,7 +53,7 @@
|
||||
</footer>
|
||||
|
||||
<script crossorigin="anonymous" referrerpolicy="no-referrer"
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.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.2/browser/pixi.js"></script>
|
||||
<script src="js/Card.js"></script>
|
||||
<script src="js/Button.js"></script>
|
||||
|
||||
@@ -9,7 +9,7 @@ function Button(default_color, hover_color, select_color, width, height, x, y, t
|
||||
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,17 +20,17 @@ 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({
|
||||
@@ -55,7 +55,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 () {
|
||||
this.graphics.on('pointerdown', function () {
|
||||
click();
|
||||
});
|
||||
this.graphics.on('mouseover', function () {
|
||||
@@ -67,5 +67,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;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@@ -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();
|
||||
}
|
||||
};
|
||||
@@ -64,7 +64,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
|
||||
@@ -126,7 +126,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');
|
||||
}
|
||||
@@ -185,7 +185,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;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user