diff --git a/css/main.css b/css/main.css index 434baba..9035555 100644 --- a/css/main.css +++ b/css/main.css @@ -311,6 +311,22 @@ margin-top: 5px; } +.item_consumable_fish1 { + background: url(../img/items.png) -268px -146px; + width: 30px; + background-size: 476px; + margin-left: 5px; + margin-top: 5px; +} + +.item_consumable_fish2 { + background: url(../img/items.png) -298px -148px; + width: 30px; + background-size: 476px; + margin-left: 5px; + margin-top: 5px; +} + .item_item_dimond1 { background: url(../img/items.png) -350px -150px; width: 50px; @@ -333,8 +349,7 @@ background: url(../img/items.png) -100px 0px; width: 50px; background-size: 800px; - margin-left: 5px; - margin-top: 5px; + opacity: 25%; } .slot_chest { diff --git a/index.html b/index.html index 6a1e8f2..b992530 100644 --- a/index.html +++ b/index.html @@ -33,7 +33,7 @@ - + diff --git a/js/main.js b/js/main.js index 04efbb1..75e393e 100644 --- a/js/main.js +++ b/js/main.js @@ -40,8 +40,10 @@ var tooltiptexts = { "item_weapon_sword5": "Schwert: Schaden erhöht 600", "item_weapon_stick1": "Stock: Schaden erhöht 50", "item_item_bone1": "Mach nix, ehöht aber dein Level um 1", + "item_consumable_fish1": "Erhöht deine Lebenspunkte um 20", + "item_consumable_fish2": "Erhöht deine Lebenspunkte um 10", "item_item_dimond1": "Verkaufe den Diamand für 10 Siegpunkte! Bewegungsgeschwindigkeit verlangsamt!", - "item_item_woods1" : "Bündel Holz: Schiff verstärken +1" + "item_item_woods1": "Bündel Holz: Schiff verstärken +1" } socket.on('connect', function () { @@ -109,11 +111,13 @@ socket.on('stopAction', function (socketId) { socket.on('removeUtil', function (obj) { console.log(obj); $("." + obj["mapY"] + '-' + obj["mapX"] + '.' + obj["name"]).removeClass(obj["name"]) + utilMap[obj["mapY"]][obj["mapX"]] = ""; }); socket.on('replaceUtil', function (obj) { console.log(obj); $("." + obj["mapY"] + '-' + obj["mapX"] + '.' + obj["name"]).removeClass(obj["name"]).addClass(obj["newName"]); + utilMap[obj["mapY"]][obj["mapX"]] = obj["newName"]; }); socket.on('dropItem', function (obj) { @@ -250,7 +254,10 @@ socket.on('setpos', function (allPlayers) { }); playerImg.addClass("guy" + top2Btn + "-" + left2right + "-" + picStep); } + } + playerImg.attr("top2Btn", top2Btn) + playerImg.attr("left2right", left2right) playerElement.css({ "top": player["y"], "left": player["x"], "-webkit-transform": "rotate(" + angle + "rad)" }); } } @@ -276,6 +283,10 @@ socket.on('displayMsg', function (msg) { showDisplayMsg(msg); }); +socket.on('showHitAnimation', function (playerId) { + showHitAnimation(playerId); +}); + function showDisplayMsg(msg) { $(".msgDiv").remove(); @@ -289,10 +300,30 @@ function showDisplayMsg(msg) { function showHitAnimation(playerId) { let player = g_allPlayers[playerId]; if (player) { + let picWidth = 30; let y = player["y"]; - let x = player["x"]; - let hitImg = $(''); + let x = player["x"] - picWidth; + + var playerElement = $("#" + playerId); + var playerImg = playerElement.find("img"); + let top2Btn = playerImg.attr("top2Btn"); + let left2right = playerImg.attr("left2right"); + var angle = Math.atan2(top2Btn, left2right); + + console.log(top2Btn, left2right) + // $(".hitbox").remove(); + // $("#main").append('
') + let hitImg = $(''); $("#main").append(hitImg); + hitImg.animate({ borderSpacing: (angle + Math.PI / 2 + Math.PI) }, { + step: function (now, fx) { + $(this).css('transform', 'rotate(' + now + 'rad)'); + }, + duration: 150, + complete : function () { + hitImg.hide(); + } + }, 'swing'); } } @@ -317,6 +348,7 @@ $(document).ready(function () { } $(document).keydown(function (event) { + //console.log(event.which) if (event.ctrlKey == true && (event.which == '61' || event.which == '107' || event.which == '173' || event.which == '109' || event.which == '187' || event.which == '189')) { event.preventDefault(); } @@ -326,7 +358,7 @@ $(document).ready(function () { event.preventDefault(); if (!keys[key]) { - if (key == 32) { + if (key == 69) { socket.emit("actionKey", key); } else { socket.emit("keyDown", key); @@ -338,7 +370,7 @@ $(document).ready(function () { $(document).keyup(function (event) { var key = event.which; socket.emit("keyUp", key); - if (key == 32) { + if (key == 69) { $("#animationDiv").remove(); } keys[key] = false; diff --git a/server.js b/server.js index 876286c..02398fe 100644 --- a/server.js +++ b/server.js @@ -66,95 +66,99 @@ var itemAttrs = { }, "item_head_head1": { lvl: 1, - armor: 200 + armor: 10 }, "item_head_head2": { lvl: 2, - armor: 300 + armor: 18 }, "item_head_head3": { lvl: 3, - armor: 400 + armor: 23 }, "item_head_head4": { lvl: 4, - armor: 500 + armor: 25 }, "item_head_head5": { lvl: 5, - armor: 600 + armor: 30 }, "item_chest_chest1": { lvl: 1, - armor: 200 + armor: 10 }, "item_chest_chest2": { lvl: 2, - armor: 300 + armor: 18 }, "item_chest_chest3": { lvl: 3, - armor: 400 + armor: 23 }, "item_chest_chest4": { lvl: 4, - armor: 500 + armor: 25 }, "item_chest_chest5": { lvl: 5, - armor: 600 + armor: 30 }, "item_legs_legs1": { lvl: 1, - armor: 200 + armor: 10 }, "item_legs_legs2": { lvl: 2, - armor: 300 + armor: 18 }, "item_legs_legs3": { lvl: 3, - armor: 400 + armor: 23 }, "item_legs_legs4": { lvl: 4, - armor: 500 + armor: 28 }, "item_legs_legs5": { lvl: 5, - armor: 600 - }, - "item_legs_legs5": { - lvl: 5, - armor: 600 + armor: 30 }, "item_weapon_sword1": { lvl: 1, - armor: 200 + dmg: 40 }, "item_weapon_sword2": { lvl: 2, - armor: 300 + dmg: 60 }, "item_weapon_sword3": { lvl: 3, - armor: 400 + dmg: 80 }, "item_weapon_sword4": { lvl: 4, - armor: 500 + dmg: 100 }, "item_weapon_sword5": { lvl: 5, - armor: 600 + dmg: 130 }, "item_weapon_stick1": { lvl: 1, - armor: 50 + dmg: 20 }, "item_item_bone1": { lvl: 1, }, + "item_consumable_fish1": { + lvl: 3, + hp: 30, + }, + "item_consumable_fish2": { + lvl: 1, + hp: 10 + }, "item_item_dimond1": { lvl: 10, changeMovementSpeed: -0.5 @@ -183,6 +187,8 @@ io.on('connection', function (socket) { x: 10, y: 10, mvnt: defaultMvnt, + lookingLeft : 0, + lookingUp : 0, special: {}, mode: 0, //0 = ship //1 foot slots: { @@ -190,10 +196,11 @@ io.on('connection', function (socket) { chest: null, legs: null, boots: null, - weapon: null, + weapon: 'item_weapon_sword2', tool: null, item: null - } + }, + hp : 100 }; var player = allPlayers[socket.id]; io.sockets.emit("newPlayer", { @@ -205,13 +212,15 @@ io.on('connection', function (socket) { for (var i in player.slots) { if (player.slots[i]) { let nearFieldCoords = getNearEmptyField(Math.floor(player["x"] / 32), Math.floor(player["y"] / 32)); - let newObj = { - mapY: nearFieldCoords["y"], - mapX: nearFieldCoords["x"], - newName: player.slots[i] + if(nearFieldCoords) { + let newObj = { + mapY: nearFieldCoords["y"], + mapX: nearFieldCoords["x"], + newName: player.slots[i] + } + utilMap[nearFieldCoords["y"]][nearFieldCoords["x"]] = newObj["newName"]; + io.sockets.emit("dropItem", newObj); } - utilMap[nearFieldCoords["y"]][nearFieldCoords["x"]] = newObj["newName"]; - io.sockets.emit("dropItem", newObj); } } userCnt--; @@ -230,7 +239,7 @@ io.on('connection', function (socket) { socket.on('keyUp', function (key) { allPlayers[socket.id]["keys"][key] = false; - if (key == 32) { //space + if (key == 69) { //space player["action"] = false; if (playerActionTimer) { clearTimeout(playerActionTimer); @@ -242,6 +251,23 @@ io.on('connection', function (socket) { socket.on('keyDown', function (key) { allPlayers[socket.id]["keys"][key] = true; + if(key == 32) { //Space HIT SOMEONE + //if(allPlayers[socket.id]["mode"] == 1) { // On land + if(!allPlayers[socket.id]["hitPending"]) { + io.sockets.emit("showHitAnimation", socket.id); + allPlayers[socket.id]["hitPending"] = true; + let allPlayersWithCollision = checkHitWithOtherPlayers(socket.id); + for(var i=0;i= minLvl && itemAttrs[item]["lvl"] <= maxLvl))) { + return item; } } @@ -415,7 +463,7 @@ function getNearestObject(x, y) { } } - if (utilMap[mapY + sY][mapX + sX] != "") { + if (utilMap[mapY + sY] && utilMap[mapY + sY][mapX + sX] != "") { obj = { mapY: mapY + sY, mapX: mapX + sX, @@ -447,6 +495,10 @@ setInterval(function () { ty = mvnt; } + player.lookingLeft = tx > 0 ? -1 : (tx < 0 ? 1 : player.lookingLeft) + player.lookingUp = ty > 0 ? -1 : (ty < 0 ? 1 : player.lookingUp) + + //console.log(player) if (!player["action"]) { var newX = player["x"] + tx; var newY = player["y"] + ty; @@ -543,4 +595,59 @@ function getPlayerMvnt(player, groundUnderPlayer) { function getRandomNumber(min, max) { //min (inclusive) and max (exclusive) return Math.floor(Math.random() * (max - min + 1)) + min; +} + +function checkHitWithOtherPlayers(socketId) { + let playersWithCollision = []; + let mainPlayer = allPlayers[socketId]; + for(var sid in allPlayers) { + if(sid != socketId) { //Dont check collision with self + let targetPlayer = allPlayers[sid]; + let bottom = mainPlayer.keys["40"]; + let left = mainPlayer.keys["37"]; + //console.log(mainPlayer.x, mainPlayer.y, 28, targetPlayer.x, targetPlayer.y, 8) + if(isCircleCircleCollision(mainPlayer.x, mainPlayer.y, 28, targetPlayer.x, targetPlayer.y, 8)) { + let hit = false; + console.log(mainPlayer.lookingLeft, mainPlayer.lookingUp , mainPlayer.x, mainPlayer.y, targetPlayer.x, targetPlayer.y) + if(mainPlayer.lookingLeft == 1 && mainPlayer.x >= targetPlayer.x) { + hit = true; + } else if(mainPlayer.lookingLeft == -1 && mainPlayer.x <= targetPlayer.x) { + hit = true; + } else if(mainPlayer.lookingUp == 1 && mainPlayer.y >= targetPlayer.y) { + hit = true; + } else if(mainPlayer.lookingUp == -1 && mainPlayer.y <= targetPlayer.y) { + hit = true; + } + + if(hit) { + playersWithCollision.push(sid); + } + } + } + } + return playersWithCollision; +} + +function isCircleRecCollision(cx, cy, cr, rx, ry, rw, rh) { + var cDistx = Math.abs(cx - rx); + var cDisty = Math.abs(cy - ry); + if (cDistx > rw / 2 + cr) + return false; + if (cDisty > rh / 2 + cr) + return false; + if (cDistx <= rw / 2) + return true; + if (cDisty <= rh / 2) + return false; + return (cDistx - rw / 2) * (cDistx - rw / 2) + (cDisty - rh / 2) * (cDisty - rh / 2) <= cr * cr; +} + +function isCircleCircleCollision(x1, y1, r1, x2, y2, r2) { + var dx = x1 - x2; + var dy = y1 - y2; + var sr = r1 + r2; + if (Math.abs(dx) <= sr && Math.abs(dy) <= sr) { //Check main condition + return Math.sqrt(dx * dx + dy * dy) < sr // true = collision detected! + } + return false; } \ No newline at end of file
Space