Use Gitea actions instead of drone #2

Update README.md

.gitea/workflows/build.yaml

@@ -0,0 +1,40 @@
+name: Build & Publish
+on: [push]
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out the repo
+        uses: actions/checkout@v3
+
+      - name: Docker meta
+        id: meta
+        uses: https://github.com/docker/metadata-action@v4
+        with:
+          images: git.flokaiser.com/dhbw/pmgame
+          tags: |
+             type=sha,enable=true,priority=100,prefix={{branch}}-,suffix=,format=short
+             type=raw,value=latest,enable={{is_default_branch}}
+
+      - name: Get get-docker.sh
+        run: curl -fsSL https://get.docker.com -o get-docker.sh
+
+      - name: Install docker
+        run: sh get-docker.sh
+        
+      - name: Login to Registry
+        uses: docker/login-action@v2
+        with:
+          registry: git.flokaiser.com
+          username: ${{ secrets.REGISTRY_USERNAME }}
+          password: ${{ secrets.REGISTRY_TOKEN }}
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Build and push
+        uses: docker/build-push-action@v4
+        with:
+          platforms: linux/amd64
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}

.renovaterc.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "schedule": ["* 5 * * *"],
+  "packageRules": [
+    {
+      "matchUpdateTypes": ["minor", "patch", "pin", "digest"],
+      "automerge": true
+    }
+  ]
+}

Dockerfile

@@ -16,8 +16,8 @@ COPY minimize.sh minimize.sh
 RUN chmod +x minimize.sh
 RUN ./minimize.sh
 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
+RUN sed -i "s/COMMIT_TO_BE_REPLACED/GitHub: $(git ls-remote https://git.flokaiser.com/DHBW/Projektmanagement-Game refs/heads/main | awk '{print $1;}' | cut -c1-7)/" public/index.html
+RUN sed -i "s/COMMIT_LINK_TO_BE_REPLACED/https\:\/\/git.flokaiser.com\/DHBW\/Projektmanagement-Game\/commit\/$(git ls-remote https://git.flokaiser.com/DHBW/Projektmanagement-Game refs/heads/main | awk '{print $1;}')/" public/index.html
 
 EXPOSE 5000
 

README.md

@@ -1,4 +1,4 @@
-# Projektmanagement Game
+# Wer wird Projektmanager 2021?
 
 ## Docker
 ### Build

Webservice/Game.js

@@ -16,7 +16,6 @@ class Game {
         this.currentStatus = Game.STATUS.SETTING_UP;
         this.players = [];
         this.currentPlayerIndex = 0;
-        this.winnerIndex = 0;
         this.round = 0;
         this.hunter = new Hunter();
         this.playerNames = [];
@@ -90,7 +89,6 @@ class Game {
         let index = this.players.findIndex(player => player.position >= Game.MAX_POSITION);
         if (index !== -1) {
             this.currentStatus = Game.STATUS.IS_WON;
-            this.winnerIndex = index;
         }
     }
 

Webservice/server.js

@@ -7,7 +7,7 @@ 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 cards = JSON.parse(fs.readFileSync(__dirname + '/../data/fragen_12_07_21_new_format.json'));
 
 let game = {};
 
@@ -56,7 +56,7 @@ io.on('connection', socket => {
 
                 socket.emit('login', game[socket.room].get_player_index(socket.username));
                 socket.join(socket.room);
-                io.in(socket.room).emit('updatePlayerNames', game[socket.room].getPlayerNames());
+                io.in(socket.room).emit('update player names', game[socket.room].getPlayerNames());
 
                 if (game[socket.room].players.length === 1) io.to(socket.id).emit('first player');
 
@@ -87,7 +87,7 @@ io.on('connection', socket => {
             if (game[socket.room].current_player_is(socket.username)) socket.broadcast.to(socket.room).emit('card destroyed');
 
             game[socket.room].removePlayerName(socket.username);
-            io.in(socket.room).emit('updatePlayerNames', game[socket.room].getPlayerNames());
+            io.in(socket.room).emit('update player names', game[socket.room].getPlayerNames());
 
             socket.broadcast.to(socket.room).emit('user left', socket.username);
             game[socket.room].remove_player(socket.username);
@@ -150,19 +150,20 @@ io.on('connection', socket => {
 
         game[socket.room].finish_turn();
 
+        io.in(socket.room).emit('update hunter', game[socket.room].hunter.getPosition());
+
         io.in(socket.room).emit('player moved', {
             "next_player": game[socket.room].players[game[socket.room].currentPlayerIndex].name,
             "player": index,
             "position": position,
             "state": game[socket.room].currentStatus,
         });
-
-        io.in(socket.room).emit('update Hunter', game[socket.room].hunter.getPosition());
     });
 });
 
 function generate_log_message(room, user, type, message) {
     let color;
+
     switch (type) {
         case 'LEFT':
             color = '\x1b[31m';
@@ -185,12 +186,12 @@ function generate_log_message(room, user, type, message) {
         default:
             color = '\x1b[0m';
     }
+
     room = pad(10, room, ' ').substr(0, 10);
     user = pad(10, user, ' ').substr(0, 10);
     type = pad(10, type, ' ').substr(0, 10);
 
-    let reset_color = '\x1b[0m';
-    console.info("%s[%s] [%s] [%s]\x1b[0m %s", color, room, user, type, reset_color, message);
+    console.info("%s[%s] [%s] [%s] \x1b[36m%s\x1b[0m", color, room, user, type, message);
 }
 
 function getRandomCard(difficulty, room) {

data/main.py

@@ -1,59 +1,19 @@
 import json
+import io
 
 if __name__ == '__main__':
     array = []
-    with open('fragen_10_06_21_final.json') as file:
+    with io.open('fragen_12_07_21.json', 'r', encoding='utf-8-sig') 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'])
+            new = { 'id': int(data[i]['ID']), 'difficulty': int(data[i]['Schwierigkeit']), 'question': data[i]['Frage'], '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']})
             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:
+    with open('fragen_12_07_21_new_format.json', 'w', encoding='utf8') as file:
         json.dump(array, file, ensure_ascii=False)

package.json

@@ -2,8 +2,8 @@
   "name": "projektmanagement-game",
   "version": "1.0.0",
   "dependencies": {
-    "@socket.io/admin-ui": "^0.2.0",
+    "@socket.io/admin-ui": "^0.5.0",
     "express": "^4.17.1",
-    "socket.io": "^4.1.2"
+    "socket.io": "^4.1.3"
   }
 }

public/css/game.css

@@ -5,7 +5,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    background: url(/img/background.jpg) no-repeat center center fixed;
+    background: url(../img/background.jpg) no-repeat center center fixed;
     -webkit-background-size: cover; /* For WebKit*/
     -moz-background-size: cover; /* Mozilla*/
     -o-background-size: cover; /* Opera*/

public/css/index.css

@@ -55,20 +55,20 @@
 }
 
 @media only screen and (max-width: 980px) {
-
     #login {
         align-items: flex-start;
     }
 
+    #login form {
+        padding-top: 10px;
+    }
+
     #login label {
         font-size: 2.5em;
-
     }
 
     #login input, #login button {
-        height: 4.0em;
+        height: 2.0em;
         font-size: 2.5em;
-
     }
-
 }

public/index.html

@@ -4,22 +4,19 @@
     <meta charset="UTF-8" content="user-scalable=no, autoRotate:disabled" name="viewport"/>
     <title>Wer wird Projektmanager?</title>
 
-    <link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet">
-
     <link href="css/components.css" rel="stylesheet">
     <link href="css/header.css" rel="stylesheet">
-
     <link href="css/chat.css" rel="stylesheet">
     <link href="css/game.css" rel="stylesheet">
-
     <link href="css/index.css" rel="stylesheet">
 
+    <link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet">
     <link href="img/favicon.ico" rel="shortcut icon" type="image/x-icon">
 </head>
 <body>
 <header>
     <div class="spielanleitung"><span
-            onclick="open_manual();">Spielanleitung</span></div>
+            onclick="open_manual();">Instructions</span></div>
     <div class="title">WWPM</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>
@@ -29,13 +26,13 @@
         <div id="login">
             <form>
                 <h2 id="error"></h2>
-                <label for="username">Benutzername: </label>
-                <input id="username" name="username" placeholder="Benutzername" type="text">
+                <label for="username">Username: </label>
+                <input id="username" name="username" placeholder="Username" type="text">
 
-                <label for="room">Raumnummer: </label>
-                <input id="room" name="room" placeholder="Raumnummer" type="text">
+                <label for="room">Room name: </label>
+                <input id="room" name="room" placeholder="Room name" type="text">
 
-                <button id="ok" type="button">Bestätigen</button>
+                <button id="ok" type="button">Submit</button>
             </form>
         </div>
         <div id="game">
@@ -56,9 +53,11 @@
     <div id="modal">
         <div id="content">
             <div id="modal_header">
-                <h3 id="modal_title">Spielanleitung</h3>
-                <span><i class="material-icon"
-                         onclick="document.getElementById('modal').style.display = 'none';">close</i></span>
+                <h3 id="modal_title">Instructions</h3>
+                <span>
+                    <i class="material-icon"
+                       onclick="document.getElementById('modal').style.display = 'none';">close</i>
+                </span>
             </div>
             <div class="divider"></div>
             <div id="manual"></div>
@@ -69,9 +68,8 @@
 
 </footer>
 
-<script crossorigin="anonymous" referrerpolicy="no-referrer"
-        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="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.6.1/socket.io.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/6.5.8/browser/pixi.min.js"></script>
 <script src="js/Card.js"></script>
 <script src="js/Button.js"></script>
 <script src="js/Sprite.js"></script>

public/js/Card.js

@@ -117,7 +117,7 @@ function Card(game_board_size, question, answer_1, answer_2, answer_3, answer_4,
         if (this.difficulty === 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.answer_4.text, this.answer_4.status, function () {
+        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, this.answer_4.text, this.answer_4.status, function () {
             if (_this.your_turn) {
                 select_answer(3, _this.answer_4.text);
             }
@@ -135,10 +135,8 @@ function Card(game_board_size, question, answer_1, answer_2, answer_3, answer_4,
             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) { //TODO: do this in backend instead to prevent cheating
-                        console.log("Richtig");
                         socket.emit('card finished', difficulty, true);
                     } else {
-                        console.log("Falsch");
                         socket.emit('card finished', difficulty, false);
                     }
                     show_card = false;
@@ -147,7 +145,7 @@ function Card(game_board_size, question, answer_1, answer_2, answer_3, answer_4,
                     rolled_number = null;
                 } else {
                     if (your_turn === true) {
-                        alert("Bitte wähle eine Antwortmöglichkeit aus");
+                        alert("Please choose your answer!");
                     } else {
                         show_card = false;
                         answer = null;

public/js/game.js

@@ -1,7 +1,5 @@
 /*
     Images
-        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
 */
@@ -57,8 +55,8 @@ function start_game() {
     sprites.forEach(sprite => app.stage.addChild(sprite.getSprite()));
 
     // Red border
-    let red_border = generate_red_border(new PIXI.Graphics(), 1, 9);
-    app.stage.addChild(red_border);
+    let hunter = generate_hunter(new PIXI.Graphics(), 1, 9);
+    app.stage.addChild(hunter);
 
 
     // Player circles
@@ -77,26 +75,17 @@ function start_game() {
 
     // Card stacks
     let cards_1 = generate_card_stack(PIXI.Sprite.from('/img/card_stack_1.png'), 3, 3, function () {
-        if (diced && !show_card && rolled_number === 1) {
-            console.log("1");
-            socket.emit('get card', 1);
-        }
+        if (diced && !show_card && rolled_number === 1) socket.emit('get card', 1);
     });
     app.stage.addChild(cards_1);
 
     let cards_2 = generate_card_stack(PIXI.Sprite.from('/img/card_stack_2.png'), 5, 3, function () {
-        if (diced && !show_card && rolled_number === 2) {
-            console.log("2");
-            socket.emit('get card', 2);
-        }
+        if (diced && !show_card && rolled_number === 2) socket.emit('get card', 2);
     });
     app.stage.addChild(cards_2);
 
     let cards_3 = generate_card_stack(PIXI.Sprite.from('/img/card_stack_3.png'), 7, 3, function () {
-        if (diced && !show_card && rolled_number === 3) {
-            console.log("3");
-            socket.emit('get card', 3);
-        }
+        if (diced && !show_card && rolled_number === 3) socket.emit('get card', 3);
     });
     app.stage.addChild(cards_3);
 
@@ -112,9 +101,7 @@ function start_game() {
     dice.buttonMode = true;
     dice.defaultCursor = 'pointer';
     dice.on('pointerdown', function () {
-        if (!diced) {
-            socket.emit('roll dice');
-        }
+        if (!diced) socket.emit('roll dice');
     });
     app.stage.addChild(dice);
 
@@ -127,7 +114,6 @@ function start_game() {
     logo.y = sprite_size * 5.5 - sprite_size * 0.2;
     logo.width = sprite_size * 3.5;
     logo.height = sprite_size * 1.5;
-    // logo.rotation -= Math.PI / 8;
     app.stage.addChild(logo);
 
 
@@ -174,13 +160,11 @@ function start_game() {
     score_button.defaultCursor = 'pointer';
     score_button.on('pointerdown', function () {
         card = new Card(game_board_size, "",
-            {"text": playerNames[0] ? playerNames[0] + ": " + positions[0] : ("Kein Spieler"), "status": false},
-            {"text": playerNames[1] ? playerNames[1] + ": " + positions[1] : ("Kein Spieler"), "status": false},
-            {"text": playerNames[2] ? playerNames[2] + ": " + positions[2] : ("Kein Spieler"), "status": false},
-            {
-                "text": playerNames[3] ? playerNames[3] + ": " + positions[3] : ("Kein Spieler"),
-                "status": false
-            }, 0, false);
+            {"text": playerNames[0] ? playerNames[0] + ": " + positions[0] : ("N/A"), "status": false},
+            {"text": playerNames[1] ? playerNames[1] + ": " + positions[1] : ("N/A"), "status": false},
+            {"text": playerNames[2] ? playerNames[2] + ": " + positions[2] : ("N/A"), "status": false},
+            {"text": playerNames[3] ? playerNames[3] + ": " + positions[3] : ("N/A"), "status": false},
+            0, false);
         card.showCard();
         show_card = true;
     });
@@ -188,11 +172,11 @@ function start_game() {
     app.stage.addChild(score_button);
     score_button.addChild(score_button_text);
 
-    socket.on('updatePlayerNames', function (p) {
+
+    socket.on('update player names', function (p) {
         playerNames = p;
     });
 
-
     socket.on('first player', function () {
         my_turn.text = "Your Turn";
     });
@@ -208,11 +192,9 @@ function start_game() {
     });
 
     socket.on('card', function (data) {
-        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);
+        if (show_card === true) card.destroyCard();
+
+        card = new Card(game_board_size, data.card.question, data.card['answers'][0], data.card['answers'][1], data.card['answers'][2], data.card['answers'][3], data.card['difficulty'], data.username === username);
         card.showCard();
         show_card = true;
     });
@@ -270,12 +252,12 @@ function start_game() {
 
         if (data.state === 2 || data.state === 3) {
             card = new Card(game_board_size, "",
-                {"text": playerNames[0] ? playerNames[0] + ": " + positions[0] : ("Kein Spieler"), "status": false},
-                {"text": playerNames[1] ? playerNames[1] + ": " + positions[1] : ("Kein Spieler"), "status": false},
-                {"text": playerNames[2] ? playerNames[2] + ": " + positions[2] : ("Kein Spieler"), "status": false},
-                {"text": playerNames[3] ? playerNames[3] + ": " + positions[3] : ("Kein Spieler"), "status": false},
+                {"text": playerNames[0] ? playerNames[0] + ": " + positions[0] : ("N/A"), "status": false},
+                {"text": playerNames[1] ? playerNames[1] + ": " + positions[1] : ("N/A"), "status": false},
+                {"text": playerNames[2] ? playerNames[2] + ": " + positions[2] : ("N/A"), "status": false},
+                {"text": playerNames[3] ? playerNames[3] + ": " + positions[3] : ("N/A"), "status": false},
                 0, false, data.state);
-            red_border.clear();
+            hunter.clear();
             card.showCard();
             show_card = true;
         }
@@ -283,12 +265,12 @@ function start_game() {
         if (next_player === username) my_turn.text = "Your Turn";
     });
 
-    socket.on('update Hunter', function (position) {
+    socket.on('update hunter', function (position) {
         let x = sprites[position].coord_x;
         let y = sprites[position].coord_y;
-        red_border.clear();
-        red_border = generate_red_border(new PIXI.Graphics(), x, y);
-        app.stage.addChild(red_border);
+        hunter.clear();
+        hunter = generate_hunter(new PIXI.Graphics(), x, y);
+        app.stage.addChild(hunter);
     });
 
     resize();
@@ -306,7 +288,7 @@ function generate_card_stack(sprite, x, y, onclick) {
     return sprite;
 }
 
-function generate_red_border(graphics, x, y) {
+function generate_hunter(graphics, x, y) {
     graphics.lineStyle(sprite_size * 0.10, 0x862323, 1);
     graphics.drawRect(sprite_size * x - sprite_size * 0.2, sprite_size * y - sprite_size * 0.2, sprite_size * 1.5, sprite_size * 1.5);
     return graphics;
@@ -331,6 +313,7 @@ function generate_circle(graphics, x, y, color, offset) {
             graphics.beginFill(0xFFFFFF, 1);
             break;
     }
+
     switch (offset) {
         case 1:
             graphics.drawCircle(sprite_size * x - 65 - sprite_size * 0.2 + sprite_size * 0.75, sprite_size * y + 65 - sprite_size * 0.2 + sprite_size * 0.75, sprite_size / 4);
@@ -345,6 +328,7 @@ function generate_circle(graphics, x, y, color, offset) {
             graphics.drawCircle(sprite_size * x + 65 - sprite_size * 0.2 + sprite_size * 0.75, sprite_size * y - 65 - sprite_size * 0.2 + sprite_size * 0.75, sprite_size / 4);
             break; // lower right
     }
+
     graphics.endFill();
     return graphics;
 }

public/js/index.js

@@ -2,8 +2,11 @@ let username;
 let room_name;
 
 window.addEventListener('beforeunload', function (e) {
-    // Prevent user from exiting page
-    e.preventDefault();
+    e.preventDefault(); // Prevent user from exiting page
+});
+
+window.addEventListener('keydown', function (event) {
+    if (event.code === 'Enter' && app == null) document.getElementById('ok').click();
 });
 
 document.getElementById('ok').addEventListener('click', function () {