diff --git a/ReallifeGamemode.Client/assets/css/inventory/style.css b/ReallifeGamemode.Client/assets/css/inventory/style.css new file mode 100644 index 00000000..9ccfa3e0 --- /dev/null +++ b/ReallifeGamemode.Client/assets/css/inventory/style.css @@ -0,0 +1,327 @@ +/* *** FOR TESTING ONLY *** */ +.greyFont { + color: gray; + font-size: 14px; + width: 250px; +} + +#commandOpts { + width: 250px; + height: 50px; + overflow: hidden; + overflow-y: scroll; +} + +#commandOpts li{ + cursor: pointer; +} + +/* *** FOR TESTING ONLY *** */ + +body { + overflow: hidden; + font-family: 'Roboto', sans-serif; + font-weight: 500; + color: #222; + margin: 0; + padding: 0; +} +#buttonbenutzen { + background-color: #4CAF50; /* gruen */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} +#buttonwegwerfen { + background-color: #f44336; /* rot */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} +#buttonhandeln { + background-color: #008CBA; /* blau */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} + +button { + width: 125px; + background-color: lightGrey; + padding: 5px; + margin: 2px 0px; + border: none; + cursor: pointer; +} + +button:hover { + background-color: grey; +} + + +h2 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 18px; + color: white; + margin:5px; + padding: 5px; + border: 1px solid #808080; + width: 20.75em; +} +.box1 { + float: left; + width: 50%; +} +.box2 { + + padding: 2px; + + } + .left { text-align: left; } + .right { text-align: right; } +h4 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 18px; + color: white; + margin:5px; + padding: 5px; + text-align:right; + border: none; +} + +h3 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 16px; + padding: 0px 0px; +} +h5 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 18px; + color: white; + margin:5px; + padding: 5px; + border: 1px solid #808080; + width: 20.75em; +} + +.pInvWrapper { + background: rgba(0,0,0,0.4); + height: 395px; + width: 394px; + display: block; + padding: 5px; + position: absolute; + left: 38%; + top: 0; +} + +.pInvWrapper { + background: rgba(0,0,0,0.4); + height: 395px; + width: 394px; + display: block; + padding: 5px; + position: absolute; + left: 38%; + top: 0; +} + +.phanWrapper { + background: rgba(0,0,0,0.4); + height: 170px; + width: 394px; + display: block; + padding: 5px; + position: absolute; + left: 38%; + top: 50%; +} + +#invContainer{ + width: 110%; + height: auto; +} +#handelContainer{ + width: 110%; + height: auto; +} + +#invContainer h3 { + padding: 0px 10px; +} + +.itemSlot { + width: 54px; + height: 54px; + margin: 5px; + float: left; + border: 1px solid #808080; + border-radius: 5px; + position: relative; + cursor: pointer; +} + +.itemSlot:hover { + border: 1px solid #999999; +} + +.itemAmount p { + color: white; + font-family: 'Roboto', sans-serif; + font-weight: 700; + text-shadow: 0px 0px 2px black; + position: absolute; + top: 16px; + left: 4px; +} + + +.selected { + box-shadow: 0px 0px 6px white; + border: 1px solid yellow; +} + +.common { + box-shadow: 0 0 2px 1px white inset; +} + +.common h3 { + color: white; + text-shadow: 0 0 0 1px black; +} + +.uncommon { + box-shadow: 0 0 2px 1px #3333ff inset; +} + +.uncommon h3 { + color: #3333ff; + text-shadow: 0 0 0 1px black; +} + +.rare { + box-shadow: 0 0 2px 1px #66ff33 inset; +} + +.rare h3 { + color: #66ff33; + text-shadow: 0 0 0 1px black; +} + +.superior { + box-shadow: 0 0 3px 1px #990099 inset; +} + +.superior h3 { + color: #990099; + text-shadow: 0px 0px 1px black; +} + +.mythic { + box-shadow: 0 0 3px 1px #ffa333 inset; +} + +.mythic h3 { + color: #ffa333; + text-shadow: 0px 0px 1px black; +} + +.pForgeWrapper { + background: #222; + height: 176px; + width: 330px; + display: block; + padding: 5px; + position: absolute; + left: 0; + top: 0; +} + +/*item description */ +.itemSlot:hover > .itemDesc { + display: block; +} + +.itemDesc { + width: 250px; + height: auto; + top: 60px; + border: 1px solid #808080; + border-radius: 5px; + background: #1a1a1a; + position: absolute; + display: none; + z-index: 9999; +} + +.itemDesc p{ + color: white; +} +/*Handelfenster */ +#tf_betrag { + background-color: #313131; /* blau */ + border: none; + height: 30px; + width: 124px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 12px; + position: relative; + left: 1.5%; + color:#ffffff; +} +#tf_name { + background-color: #313131; /* blau */ + border: none; + height: 30px; + width: 124px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 12px; + position: relative; + left: 1.5%; + color: #ffffff; +} +::placeholder { + color: #696969; + opacity: 1; +} +#tf_submit { + background-color: #008CBA; /* blau */ + border: none; + height: 32px; + width: 124px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + font-color: white; + position: relative; + left: 1.5%; + color: #ffffff; +} + /* tasks */ \ No newline at end of file diff --git a/ReallifeGamemode.Client/assets/html/inventory/handel/handelakzeptieren.html b/ReallifeGamemode.Client/assets/html/inventory/handel/handelakzeptieren.html new file mode 100644 index 00000000..cf260543 --- /dev/null +++ b/ReallifeGamemode.Client/assets/html/inventory/handel/handelakzeptieren.html @@ -0,0 +1,30 @@ + + + + + Inventory + + + + + + + + + +
+
+

Handel Akzeptieren

+

Preis: 0$

+
+
+ +
+ + +
+ + + + + \ No newline at end of file diff --git a/ReallifeGamemode.Client/assets/html/inventory/handel/script.js b/ReallifeGamemode.Client/assets/html/inventory/handel/script.js new file mode 100644 index 00000000..e3515e0c --- /dev/null +++ b/ReallifeGamemode.Client/assets/html/inventory/handel/script.js @@ -0,0 +1,312 @@ + +$(document).ready(function () { + //fire functions before page load + drawToPage(); + moveItemsInv(); + console.log("loading finished"); + mp.trigger("CEF:BrowserLoadedTrade"); +}); + +function setItems(itemIdArr1, itemAmountArr1, money1) { + var itemIdArr = JSON.parse(itemIdArr1); + var money = JSON.parse(money1); + var itemAmountArr = JSON.parse(itemAmountArr1); + document.getElementById('gewicht').innerText = 'Preis: '+money+'$'; + var itemAmountArr = JSON.parse(itemAmountArr1); + for (var i = 0; i < itemIdArr.length; i++) { + for (x = 0; x < itemAmountArr[i]; x++) { + commands.addToPlayerInv(itemIdArr[i]); + console.log(i); + } + } +} + + + +var fish = { + name: "Fisch", + weight: 1, + currentWeight: 1, + dropweight: function () { + var randomweight = Math.floor((Math.random() * 10) + 1); + this.weight = randomweight; + this.currentWeight = randomweight; + }, + def: 15, + rarity: 'common', + statSlots: [], + runes: [], + amount: 1, + usable: 'false', + selected: 'false', + stackable: 'false', + object: 'true', + itemId: 1, + img: 'package://assets/img/items/fish.svg' +} + +var hamburger = { + name: "Hamburger", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.3, + stackable: 'true', + object: 'true', + itemId: 2, + img: "package://assets/img/items/burger.svg" +} + +var cocaine = { + name: "Koks", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.05, + stackable: 'true', + object: 'true', + itemId: 3, + img: "package://assets/img/items/cocaine.svg" +} + +var cannabis = { + name: "Cannabis", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.05, + stackable: 'true', + object: 'true', + itemId: 4, + img: "package://assets/img/items/cannabis.svg" +} + +var allItems = [fish, hamburger, cocaine, cannabis]; + + + +//////////////////////// +// Player Invenotry // +//////////////////////// + +var playerInventory = []; +var EmptySlot = { name: 'blankSpace', rarity: '', object: 'false' }; + + +function addToInvenotry(addItem) { + var cloneItem = Object.assign({}, addItem); + var getExsistingId = cloneItem.itemId; + var unfininshedStack; + + + //Checks to see if any items can be stacked, the location, and stack amount + for (var i = 0; i < playerInventory.length; i++) { + if (playerInventory[i].itemId === getExsistingId && cloneItem.stackable === 'true' && playerInventory[i].amount < 10) { + unfininshedStack = i + break; + } + } + if (cloneItem.currentWeight * cloneItem.amount + weightInv >= 25) { + return; + } + + //Adds item to inventory + for (var i = 0; i < playerInventory.length; i++) { + if (unfininshedStack != undefined) { + if (playerInventory[unfininshedStack].amount + cloneItem.amount <= 10) { + playerInventory[unfininshedStack].amount += cloneItem.amount; + unfininshedStack = undefined; + drawToPage(); + moveItemsInv(); + break; + } + else if (playerInventory[unfininshedStack].amount + cloneItem.amount > 10) { + var stackRemainder = 10 - playerInventory[unfininshedStack].amount; + playerInventory[unfininshedStack].amount += stackRemainder; + cloneItem.amount -= stackRemainder; + var recycleCloned = cloneItem; + addToInvenotry(recycleCloned); + unfininshedStack = undefined; + drawToPage(); + moveItemsInv(); + break; + } + } + else if (cloneItem.amount > 10 && playerInventory[i].object === 'false') { + var reduceCloneAmount = Object.assign({}, cloneItem); + reduceCloneAmount.amount = 10; + playerInventory[i] = reduceCloneAmount; + cloneItem.amount -= 10; + addToInvenotry(cloneItem); + drawToPage(); + moveItemsInv(); + break; + } + else if (unfininshedStack == undefined && playerInventory[i].object === 'false') { + playerInventory[i] = cloneItem; + drawToPage(); + moveItemsInv(); + break; + } + } +} + +var getItemSlotData; +function getAllItemSlotData() { + getItemSlotData = document.getElementsByClassName('itemSlot'); +} + + +var currentSelected; +function moveItemsInv() { + getAllItemSlotData(); + for (var i = 0; i < getItemSlotData.length; i++) { + getItemSlotData[i].addEventListener("click", function () { + if (this.classList.contains('selected')) { + this.classList.remove('selected'); + currentSelected = undefined; + } + else if (this.getAttribute('object') === 'false' && isNaN(currentSelected)) { + return; + } + else if (currentSelected) { + if (playerInventory[currentSelected].stackable === 'false' || playerInventory[currentSelected].itemId != playerInventory[this.getAttribute('data-value')].itemId) { + var swap = playerInventory[this.getAttribute('data-value')]; + playerInventory[this.getAttribute('data-value')] = playerInventory[currentSelected]; + playerInventory[currentSelected] = swap; + drawToPage(); + currentSelected = undefined; + getItemSlotData = document.getElementsByClassName('itemSlot'); + moveItemsInv(); + } + else if (playerInventory[currentSelected].itemId == playerInventory[this.getAttribute('data-value')].itemId && playerInventory[currentSelected].stackable) { + playerInventory[this.getAttribute('data-value')].amount += playerInventory[currentSelected].amount + playerInventory[currentSelected] = EmptySlot; + drawToPage(); + currentSelected = undefined; + getItemSlotData = document.getElementsByClassName('itemSlot'); + moveItemsInv(); + } + } + else { + this.className += ' selected' + currentSelected = this.getAttribute('data-value') + } + }); + } +} + +function refreshAllCurrentItems() { + var remove = document.getElementById('invContainer'); + while (remove.firstChild) remove.removeChild(remove.firstChild); +} + + +function fillOutEmptyInv() { + for (var i = 0; i < 6; i++) { + if (!playerInventory[i]) { + playerInventory.push(EmptySlot); + drawToPage(); + } + } +} +var weightInv = 0; +function drawToPage() { + refreshAllCurrentItems(); + weightInv = 0; + for (var i = 0; i < playerInventory.length; i++) { + if (playerInventory[i].selected == 'true') { + var className = ' selected'; + } + else { + var className = ''; + } + + if (i >= 6) { + //Keeps inventory set to 10 items max + console.log('Inventory is full!') + return; + } + else { + //creates item element + var item = document.createElement("div"); + item.className = "itemSlot " + playerInventory[i].rarity + className; + item.setAttribute("data-value", i); + item.setAttribute("inv-type", 'p'); + item.setAttribute("object", playerInventory[i].object); + item.setAttribute('style', 'background: url(' + playerInventory[i].img + '); background-size: contain;'); + + //show element amounts + var itemAmount = document.createElement("div"); + itemAmount.className = "itemAmount"; + var itemAmountDisplay = document.createElement("p"); + if (playerInventory[i].amount) { + var itemDisplayStatsName = document.createTextNode(playerInventory[i].amount); + } + else { + var itemDisplayStatsName = document.createTextNode(''); + } + item.appendChild(itemAmount); + itemAmount.appendChild(itemAmountDisplay); + itemAmountDisplay.appendChild(itemDisplayStatsName); + + + //adds item element or elements + document.getElementById("invContainer").appendChild(item); + + //creates item display information + if (playerInventory[i].object === 'true') { + var itemDesc = document.createElement("div"); + var itemDescTitle = document.createElement("h3"); + + var getItemTitle = document.createTextNode(playerInventory[i].name + " (" + Math.round(playerInventory[i].currentWeight * playerInventory[i].amount * 100) / 100 + " kg)"); + itemDesc.className = "itemDesc"; + item.appendChild(itemDesc); + itemDesc.appendChild(itemDescTitle); + itemDescTitle.appendChild(getItemTitle); + } + } + } + fillOutEmptyInv(); +} + + +/////////////////// +// Dev Commands // +/////////////////// + +var commands = { + addToPlayerInv: function (itemGiveId) { + for (var i = 0; i < allItems.length; i++) { + if (allItems[i].itemId === itemGiveId) { + addToInvenotry(allItems[i]); + } + } + }, + clearPlayerInv: function () { + playerInventory = []; + drawToPage(); + }, +} + + +// Button funktionen +var elemakzeptieren = document.getElementById("buttonakzeptieren"); +elemakzeptieren.addEventListener('click', akzeptieren); + +var elemablehnen = document.getElementById("buttonablehnen"); +elemablehnen.addEventListener('click', ablehnen); + + +//Handel Akzeptierenfenster + +function akzeptieren() { + mp.trigger('CEF:acceptTrade'); +} + +function ablehnen() { + mp.trigger('CEF:declineTrade'); +} diff --git a/ReallifeGamemode.Client/assets/html/inventory/handel/style.css b/ReallifeGamemode.Client/assets/html/inventory/handel/style.css new file mode 100644 index 00000000..3beb72fe --- /dev/null +++ b/ReallifeGamemode.Client/assets/html/inventory/handel/style.css @@ -0,0 +1,284 @@ +/* *** FOR TESTING ONLY *** */ +.greyFont { + color: gray; + font-size: 14px; + width: 250px; +} + +body { + overflow: hidden; + font-family: 'Roboto', sans-serif; + font-weight: 500; + color: #222; + margin: 0; + padding: 0; +} +#buttonbenutzen { + background-color: #4CAF50; /* gruen */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} +#buttonwegwerfen { + background-color: #f44336; /* rot */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} +#buttonhandeln { + background-color: #008CBA; /* blau */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 1.5%; +} +#buttonablehnen { + background-color: #f44336; /* rot */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 18%; +} +#buttonakzeptieren { + background-color: #008CBA; /* blau */ + border: none; + color: white; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + position: relative; + left: 18%; +} + +button { + width: 125px; + background-color: lightGrey; + padding: 5px; + margin: 2px 0px; + border: none; + cursor: pointer; +} + +button:hover { + background-color: grey; +} + +h2 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 18px; + color: white; + margin:5px; + padding: 5px; + border: 1px solid #808080; + width: 20.75em; +} +.box1 { + float: left; + width: 50%; +} +.box2 { + + padding: 2px; + + } + +h4 { + font-family: 'Roboto', sans-serif; + font-weight: 700; + font-size: 18px; + color: white; + margin:5px; + padding: 5px; + text-align:right; + border: none; +} + +.pakWrapper { + background: rgba(0,0,0,0.4); + height: 170px; + width: 394px; + display: block; + padding: 5px; + position: absolute; + left: 38%; + top: 35%; +} + +#invContainer{ + width: 110%; + height: auto; +} + +#invContainer h3 { + padding: 0px 10px; +} + +.itemSlot { + width: 54px; + height: 54px; + margin: 5px; + float: left; + border: 1px solid #808080; + border-radius: 5px; + position: relative; + cursor: pointer; +} + +.itemSlot:hover { + border: 1px solid #999999; +} + +.itemAmount p { + color: white; + font-family: 'Roboto', sans-serif; + font-weight: 700; + text-shadow: 0px 0px 2px black; + position: absolute; + top: 16px; + left: 4px; +} + + +.selected { + box-shadow: 0px 0px 6px white; + border: 1px solid yellow; +} + +.common { + box-shadow: 0 0 2px 1px white inset; +} + +.common h3 { + color: white; + text-shadow: 0 0 0 1px black; +} + +.uncommon { + box-shadow: 0 0 2px 1px #3333ff inset; +} + +.uncommon h3 { + color: #3333ff; + text-shadow: 0 0 0 1px black; +} + +.rare { + box-shadow: 0 0 2px 1px #66ff33 inset; +} + +.rare h3 { + color: #66ff33; + text-shadow: 0 0 0 1px black; +} + +.superior { + box-shadow: 0 0 3px 1px #990099 inset; +} + +.superior h3 { + color: #990099; + text-shadow: 0px 0px 1px black; +} + +.mythic { + box-shadow: 0 0 3px 1px #ffa333 inset; +} + +.mythic h3 { + color: #ffa333; + text-shadow: 0px 0px 1px black; +} + +.pForgeWrapper { + background: #222; + height: 176px; + width: 330px; + display: block; + padding: 5px; + position: absolute; + left: 0; + top: 0; +} + +/*item description */ +.itemSlot:hover > .itemDesc { + display: block; +} + +.itemDesc { + width: 250px; + height: auto; + top: 60px; + border: 1px solid #808080; + border-radius: 5px; + background: #1a1a1a; + position: absolute; + display: none; + z-index: 9999; +} + +.itemDesc p{ + color: white; +} +/*Handelfenster */ +#tf_betrag { + background-color: #008CBA; /* blau */ + border: none; + height: 30px; + width: 124px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + font-color: white; + position: relative; + left: 1.5%; + color:#ffffff; +} +::placeholder { + color: white; + opacity: 1; +} +#tf_submit { + background-color: #008CBA; /* blau */ + border: none; + height: 32px; + width: 124px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + font-color: white; + position: relative; + left: 1.5%; + color:#ffffff; +} + + + +/* tasks */ \ No newline at end of file diff --git a/ReallifeGamemode.Client/assets/html/inventory/index.html b/ReallifeGamemode.Client/assets/html/inventory/index.html new file mode 100644 index 00000000..ec2ba455 --- /dev/null +++ b/ReallifeGamemode.Client/assets/html/inventory/index.html @@ -0,0 +1,55 @@ + + + + + Inventory + + + + +
+
+

Inventar

+

0/25 kg

+
+
+

+

+ +
+ + + +
+ + +
+

Handel

+
+ +
+ + + + + +
+ +
+
+
+ +
+
+

+ + + + + + + + + + + diff --git a/ReallifeGamemode.Client/assets/img/items/burger.svg b/ReallifeGamemode.Client/assets/img/items/burger.svg new file mode 100644 index 00000000..f890542f --- /dev/null +++ b/ReallifeGamemode.Client/assets/img/items/burger.svg @@ -0,0 +1,101 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ReallifeGamemode.Client/assets/img/items/cannabis.svg b/ReallifeGamemode.Client/assets/img/items/cannabis.svg new file mode 100644 index 00000000..92a41b9c --- /dev/null +++ b/ReallifeGamemode.Client/assets/img/items/cannabis.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ReallifeGamemode.Client/assets/img/items/cocaine.svg b/ReallifeGamemode.Client/assets/img/items/cocaine.svg new file mode 100644 index 00000000..b8e9aea0 --- /dev/null +++ b/ReallifeGamemode.Client/assets/img/items/cocaine.svg @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ReallifeGamemode.Client/assets/img/items/fish.svg b/ReallifeGamemode.Client/assets/img/items/fish.svg new file mode 100644 index 00000000..ded220af --- /dev/null +++ b/ReallifeGamemode.Client/assets/img/items/fish.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/ReallifeGamemode.Client/assets/js/inventory/script.js b/ReallifeGamemode.Client/assets/js/inventory/script.js new file mode 100644 index 00000000..77316876 --- /dev/null +++ b/ReallifeGamemode.Client/assets/js/inventory/script.js @@ -0,0 +1,486 @@ + + +$(document).ready(function () { + //fire functions before page load + drawToPage(); + moveItemsInv(); + console.log("loading finished"); + mp.trigger("CEF:BrowserLoaded"); +}); + +function setItems(itemIdArr1, itemAmountArr1) { + var itemIdArr = JSON.parse(itemIdArr1); + var itemAmountArr = JSON.parse(itemAmountArr1); + for (var i = 0; i < itemIdArr.length; i++) { + for (x = 0; x < itemAmountArr[i]; x++) { + commands.addToPlayerInv(itemIdArr[i]); + console.log(i); + } + } +} + + + +var fish = { + name: "Fisch", + weight: 1, + currentWeight: 1, + dropweight: function () { + var randomweight = Math.floor((Math.random() * 10) + 1); + this.weight = randomweight; + this.currentWeight = randomweight; + }, + def: 15, + rarity: 'common', + statSlots: [], + runes: [], + amount: 1, + usable: 'false', + selected: 'false', + stackable: 'false', + object: 'true', + itemId: 1, + img: 'package://assets/img/items/fish.svg' +} + +var hamburger = { + name: "Hamburger", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.3, + stackable: 'true', + object: 'true', + itemId: 2, + img: "package://assets/img/items/burger.svg" +} + +var cocaine = { + name: "Koks", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.05, + stackable: 'true', + object: 'true', + itemId: 3, + img: "package://assets/img/items/cocaine.svg" +} + +var cannabis = { + name: "Cannabis", + rarity: 'common', + selected: 'false', + usable: 'true', + amount: 1, + currentWeight: 0.05, + stackable: 'true', + object: 'true', + itemId: 4, + img: "package://assets/img/items/cannabis.svg" +} + +var allItems = [fish, hamburger, cocaine, cannabis]; + + + +//////////////////////// +// Player Invenotry // +//////////////////////// + +var playerInventory = []; +var EmptySlot = { name: 'blankSpace', rarity: '', object: 'false' }; + + +function addToInvenotry(addItem) { + var cloneItem = Object.assign({}, addItem); + var getExsistingId = cloneItem.itemId; + var unfininshedStack; + + + //Checks to see if any items can be stacked, the location, and stack amount + for (var i = 0; i < playerInventory.length; i++) { + if (playerInventory[i].itemId === getExsistingId && cloneItem.stackable === 'true' && playerInventory[i].amount < 10) { + unfininshedStack = i + break; + } + } + if (cloneItem.currentWeight * cloneItem.amount + weightInv >= 25) { + return; + } + + //Adds item to inventory + for (var i = 0; i < playerInventory.length; i++) { + if (unfininshedStack != undefined) { + if (playerInventory[unfininshedStack].amount + cloneItem.amount <= 10) { + playerInventory[unfininshedStack].amount += cloneItem.amount; + unfininshedStack = undefined; + drawToPage(); + moveItemsInv(); + break; + } + else if (playerInventory[unfininshedStack].amount + cloneItem.amount > 10) { + var stackRemainder = 10 - playerInventory[unfininshedStack].amount; + playerInventory[unfininshedStack].amount += stackRemainder; + cloneItem.amount -= stackRemainder; + var recycleCloned = cloneItem; + addToInvenotry(recycleCloned); + unfininshedStack = undefined; + drawToPage(); + moveItemsInv(); + break; + } + } + else if (cloneItem.amount > 10 && playerInventory[i].object === 'false') { + var reduceCloneAmount = Object.assign({}, cloneItem); + reduceCloneAmount.amount = 10; + playerInventory[i] = reduceCloneAmount; + cloneItem.amount -= 10; + addToInvenotry(cloneItem); + drawToPage(); + moveItemsInv(); + break; + } + else if (unfininshedStack == undefined && playerInventory[i].object === 'false') { + playerInventory[i] = cloneItem; + drawToPage(); + moveItemsInv(); + break; + } + } +} + +var getItemSlotData; +function getAllItemSlotData() { + getItemSlotData = document.getElementsByClassName('itemSlot'); +} + + +var currentSelected; +function moveItemsInv() { + getAllItemSlotData(); + for (var i = 0; i < getItemSlotData.length; i++) { + getItemSlotData[i].addEventListener("click", function () { + if (this.classList.contains('selected')) { + this.classList.remove('selected'); + currentSelected = undefined; + } + else if (this.getAttribute('object') === 'false' && isNaN(currentSelected)) { + return; + } + else if (currentSelected) { + if (playerInventory[currentSelected].stackable === 'false' || playerInventory[currentSelected].itemId != playerInventory[this.getAttribute('data-value')].itemId) { + var swap = playerInventory[this.getAttribute('data-value')]; + playerInventory[this.getAttribute('data-value')] = playerInventory[currentSelected]; + playerInventory[currentSelected] = swap; + drawToPage(); + drawToHandel(); + currentSelected = undefined; + getItemSlotData = document.getElementsByClassName('itemSlot'); + moveItemsInv(); + } + else if (playerInventory[currentSelected].itemId == playerInventory[this.getAttribute('data-value')].itemId && playerInventory[currentSelected].stackable) { + playerInventory[this.getAttribute('data-value')].amount += playerInventory[currentSelected].amount + playerInventory[currentSelected] = EmptySlot; + drawToPage(); + drawToHandel(); + currentSelected = undefined; + getItemSlotData = document.getElementsByClassName('itemSlot'); + moveItemsInv(); + } + } + else { + this.className += ' selected' + currentSelected = this.getAttribute('data-value') + } + }); + } +} + +function refreshAllCurrentItems() { + var remove = document.getElementById('invContainer'); + while (remove.firstChild) remove.removeChild(remove.firstChild); +} + + +function fillOutEmptyInv() { + for (var i = 0; i < 24; i++) { + if (!playerInventory[i]) { + playerInventory.push(EmptySlot); + drawToPage(); + } + } +} +var weightInv = 0; +function drawToPage() { + refreshAllCurrentItems(); + weightInv = 0; + for (var i = 0; i < playerInventory.length; i++) { + if (playerInventory[i].selected == 'true') { + var className = ' selected'; + } + else { + var className = ''; + } + + if (i >= 24) { + //Keeps inventory set to 10 items max + console.log('Inventory is full!') + return; + } + else { + //creates item element + var item = document.createElement("div"); + item.className = "itemSlot " + playerInventory[i].rarity + className; + item.setAttribute("data-value", i); + item.setAttribute("inv-type", 'p'); + item.setAttribute("object", playerInventory[i].object); + item.setAttribute('style', 'background: url(' + playerInventory[i].img + '); background-size: contain;'); + + //show element amounts + var itemAmount = document.createElement("div"); + itemAmount.className = "itemAmount"; + var itemAmountDisplay = document.createElement("p"); + if (playerInventory[i].amount) { + var itemDisplayStatsName = document.createTextNode(playerInventory[i].amount); + } + else { + var itemDisplayStatsName = document.createTextNode(''); + } + item.appendChild(itemAmount); + itemAmount.appendChild(itemAmountDisplay); + itemAmountDisplay.appendChild(itemDisplayStatsName); + + + //adds item element or elements + document.getElementById("invContainer").appendChild(item); + + //creates item display information + if (playerInventory[i].object === 'true') { + var itemDesc = document.createElement("div"); + var itemDescTitle = document.createElement("h3"); + + var getItemTitle = document.createTextNode(playerInventory[i].name + " (" + Math.round(playerInventory[i].currentWeight * playerInventory[i].amount * 100) / 100 + " kg)"); + itemDesc.className = "itemDesc"; + item.appendChild(itemDesc); + itemDesc.appendChild(itemDescTitle); + itemDescTitle.appendChild(getItemTitle); + + weightInv += playerInventory[i].currentWeight * playerInventory[i].amount; + document.getElementById('gewicht').innerText = Math.round(weightInv * 100) / 100 + "/25 kg"; + } + } + } + fillOutEmptyInv(); +} + +function refreshAllCurrentHandelItems() { + var remove = document.getElementById('handelContainer'); + while (remove.firstChild) remove.removeChild(remove.firstChild); +} + + +function fillOutEmptyInvHandel() { + for (var i = 24; i < 30; i++) { + if (!playerInventory[i]) { + playerInventory.push(EmptySlot); + drawToHandel(); + } + } +} + +function drawToHandel() { + refreshAllCurrentHandelItems(); + for (var i = 24; i < playerInventory.length; i++) { + if (playerInventory[i].selected == 'true') { + var className = ' selected'; + } + else { + var className = ''; + } + + if (i >= 30) { + //Keeps inventory set to 10 items max + console.log('Inventory is full!') + return; + } + else { + //creates item element + var item = document.createElement("div"); + item.className = "itemSlot " + playerInventory[i].rarity + className; + item.setAttribute("data-value", i); + item.setAttribute("inv-type", 'p'); + item.setAttribute("object", playerInventory[i].object); + item.setAttribute('style', 'background: url(' + playerInventory[i].img + '); background-size: contain;'); + + //show element amounts + var itemAmount = document.createElement("div"); + itemAmount.className = "itemAmount"; + var itemAmountDisplay = document.createElement("p"); + if (playerInventory[i].amount) { + var itemDisplayStatsName = document.createTextNode(playerInventory[i].amount); + } + else { + var itemDisplayStatsName = document.createTextNode(''); + } + item.appendChild(itemAmount); + itemAmount.appendChild(itemAmountDisplay); + itemAmountDisplay.appendChild(itemDisplayStatsName); + + + //adds item element or elements + document.getElementById("handelContainer").appendChild(item); + + if (playerInventory[i].object === 'true') { + var itemDesc = document.createElement("div"); + var itemDescTitle = document.createElement("h3"); + + var getItemTitle = document.createTextNode(playerInventory[i].name + " (" + Math.round(playerInventory[i].currentWeight * playerInventory[i].amount * 100) / 100 + " kg)"); + itemDesc.className = "itemDesc"; + item.appendChild(itemDesc); + itemDesc.appendChild(itemDescTitle); + itemDescTitle.appendChild(getItemTitle); + } + + } + + } + fillOutEmptyInvHandel(); +} + + + +/////////////////// +// Dev Commands // +/////////////////// + +var commands = { + addToPlayerInv: function (itemGiveId) { + for (var i = 0; i < allItems.length; i++) { + if (allItems[i].itemId === itemGiveId) { + addToInvenotry(allItems[i]); + } + } + }, + clearPlayerInv: function () { + playerInventory = []; + drawToPage(); + drawToHandel(); + }, +} + + +// Button funktionen +var elembenutzen = document.getElementById("buttonbenutzen"); +elembenutzen.addEventListener('click', benutzen); + +var elemwegwerfen = document.getElementById("buttonwegwerfen"); +elemwegwerfen.addEventListener('click', wegwerfen); + +var elemsubmit = document.getElementById("tf_submit"); +elemsubmit.addEventListener('click', handeln); + + +function benutzen() { + if (currentSelected) { + if (playerInventory[currentSelected].usable == 'true') { + if (playerInventory[currentSelected].stackable == 'true') { + playerInventory[currentSelected].amount -= 1; + if (playerInventory[currentSelected].amount <= 0) { + playerInventory[currentSelected] = EmptySlot; + } else { + if (getItemSlotData[currentSelected].classList.contains('selected')) { + getItemSlotData[currentSelected].classList.remove('selected'); + playerInventory[currentSelected].selected = 'false'; + currentSelected = undefined; + } + } + drawToPage(); + drawToHandel(); + moveItemsInv(); + getCommands(); + } else { + playerInventory[currentSelected] = EmptySlot; + currentSelected = undefined; + drawToPage(); + drawToHandel(); + moveItemsInv(); + + } + mp.trigger("CEF:UseItemInv", playerInventory[currentSelected].itemId); + } + } +} + + +function wegwerfen() { + if (currentSelected) { + playerInventory[currentSelected] = EmptySlot; + currentSelected = undefined; + drawToPage(); + drawToHandel(); + moveItemsInv(); + mp.events.callRemote('invThrowItem', playerInventory[currentSelected].itemId); + } + +} +$(".phanWrapper").hide(); +var trade = 1; +$("#buttonhandeln").click(function () { + if (trade == 1) { + $(".phanWrapper").show(); + drawToHandel(); + drawToPage(); + moveItemsInv(); + trade = 0; + } else { + $(".phanWrapper").hide(); + trade = 1; + } +}); + +function handeln() { + var Money = document.getElementById("tf_betrag").value; + var User = document.getElementById("tf_name").value; + if (User == '') { + return; + } + if (Money == '') { + getTradeSlotItems(); + playerInventory[currentSelected] = EmptySlot; + currentSelected = undefined; + drawToPage(); + drawToHandel(); + moveItemsInv(); + + mp.trigger("CEF:tradeItem", 0, User, JSON.stringify(tradeItems), JSON.stringify(tradeItemAmount)); + return; + } + getTradeSlotItems(); + playerInventory[currentSelected] = EmptySlot; + currentSelected = undefined; + drawToPage(); + drawToHandel(); + moveItemsInv(); + mp.trigger("CEF:tradeItem", $('#tf_betrag').val(), User, JSON.stringify(tradeItems), JSON.stringify(tradeItemAmount)); + return; +} +var tradeItems = []; +var tradeItemAmount = []; +function getTradeSlotItems() { + tradeItems = []; + tradeItemAmount = []; + for (var i = 24; i < playerInventory.length; i++) { + if (playerInventory[i].object == 'true') { + for (var x = 0; x < allItems.length; x++) { + if (playerInventory[i].itemId == allItems[x].itemId) { + tradeItems.push(playerInventory[i].itemId); + tradeItemAmount.push(playerInventory[i].amount); + } + } + } + } +} + diff --git a/ReallifeGamemode.Client/index.ts b/ReallifeGamemode.Client/index.ts index 97d698ba..88897968 100644 --- a/ReallifeGamemode.Client/index.ts +++ b/ReallifeGamemode.Client/index.ts @@ -79,8 +79,7 @@ Infobox(globalData); import playerList from './Gui/playerlist'; playerList(); -import inventory from './Gui/Inventory/inventory'; -inventory(globalData); + import vehicleMenu from './Gui/vehiclemenu/main'; vehicleMenu(globalData); @@ -103,6 +102,9 @@ playerInteraction(globalData); import interactionMenu from './Interaction/interactionmenu'; interactionMenu(globalData); +import inventory from './inventory/inventory'; +inventory(globalData); + import Login from './Login/main'; Login(globalData); diff --git a/ReallifeGamemode.Client/inventory/inventory.ts b/ReallifeGamemode.Client/inventory/inventory.ts new file mode 100644 index 00000000..4aa691ba --- /dev/null +++ b/ReallifeGamemode.Client/inventory/inventory.ts @@ -0,0 +1,78 @@ + + +export default function inventory(globalData: GlobalData): void { + + var invBrowser: BrowserMp = null; + + var itemIdArr; + var itemAmountArr; + var money; + + mp.events.add("openTradeWindow", (money1, itemIdArr1, itemAmountArr1) => { + if (!globalData.InMenu) { + if (invBrowser !== null) { + invBrowser.destroy() + invBrowser = null; + mp.gui.cursor.show(false, false); + return; + } + mp.gui.cursor.show(true, true); + invBrowser = mp.browsers.new("package://assets/html/inventory/handel/handelakzeptieren.html"); + + itemIdArr = itemIdArr1; + itemAmountArr = itemAmountArr1; + money = money1; + + } + }); + + mp.events.add('inventoryShow', (itemIdArr1, itemAmountArr1) => { + if (!globalData.InMenu) { + if (invBrowser !== null) { + invBrowser.destroy() + invBrowser = null; + mp.gui.cursor.show(false, false); + return; + } + + mp.gui.cursor.show(true, true); + invBrowser = mp.browsers.new("package://assets/html/inventory/index.html"); + + itemIdArr = itemIdArr1; + itemAmountArr = itemAmountArr1; + } + }); + + mp.events.add("CEF:BrowserLoaded", () => { + invBrowser.execute(`setItems("${JSON.stringify(itemIdArr)}","${JSON.stringify(itemAmountArr)}");`); + }); + mp.events.add("CEF:BrowserLoadedTrade", () => { + invBrowser.execute(`setItems("${JSON.stringify(itemIdArr)}","${JSON.stringify(itemAmountArr)}","${JSON.stringify(money)}");`); + }); + + mp.events.add("CEF:acceptTrade", () => { + mp.events.callRemote('acceptTrade'); + invBrowser.destroy() + invBrowser = null; + mp.gui.cursor.show(false, false); + }); + + mp.events.add("CEF:declineTrade", () => { + mp.events.callRemote('declineTrade'); + invBrowser.destroy() + invBrowser = null; + mp.gui.cursor.show(false, false); + }); + + mp.events.add("CEF:UseItemInv", (itemId) => { + mp.events.callRemote('invUseItem', itemId); + }); + + mp.events.add("CEF:tradeItem", (money, User, tradeItems, tradeItemAmount) => { + mp.events.callRemote('tradeItem', money, User, tradeItems, tradeItemAmount); + invBrowser.destroy() + invBrowser = null; + mp.gui.cursor.show(false, false); + }); + +} \ No newline at end of file diff --git a/ReallifeGamemode.Server/Events/Key.cs b/ReallifeGamemode.Server/Events/Key.cs index c81f02c3..3d1946de 100644 --- a/ReallifeGamemode.Server/Events/Key.cs +++ b/ReallifeGamemode.Server/Events/Key.cs @@ -287,7 +287,7 @@ namespace ReallifeGamemode.Server.Events public void KeyPressI(Client player) { if (!player.IsLoggedIn()) return; - InventoryManager.GetUserItems(player); + ManagerOfInventory.GetUserItems(player); } [RemoteEvent("keyPress:O")] @@ -368,12 +368,19 @@ namespace ReallifeGamemode.Server.Events public void KeyPressN(Client player) { if (!player.IsLoggedIn()) return; + } [RemoteEvent("keyPress:X")] public void KeyPressX(Client player) { if (!player.IsLoggedIn()) return; + + if (player.HasData("inTrade") && player.GetData("inTrade") == true) + { + ManagerOfInventory.OpenTradeAccept(player); + } + if (player.IsInVehicle && player.VehicleSeat == -1) { ServerVehicle veh = player.Vehicle.GetServerVehicle(); diff --git a/ReallifeGamemode.Server/Inventory/Items/Cheeseburger.cs b/ReallifeGamemode.Server/Inventory/Items/Cheeseburger.cs index 818ada87..507ddb93 100644 --- a/ReallifeGamemode.Server/Inventory/Items/Cheeseburger.cs +++ b/ReallifeGamemode.Server/Inventory/Items/Cheeseburger.cs @@ -14,9 +14,9 @@ namespace ReallifeGamemode.Server.Inventory.Items public class Cheeseburger : FoodItem { public override int Id => 2; - public override string Name => "Cheeseburger"; - public override string Description => "Wie der Hamburger, nur mit Käse."; - public override int Gewicht => 320; + public override string Name => "Hamburger"; + public override string Description => "Ein Burger"; + public override int Gewicht => 300; public override string Einheit => "g"; public override int HpAmount => 20; public override uint Object => 2240524752; diff --git a/ReallifeGamemode.Server/Managers/ManagerOfInventory.cs b/ReallifeGamemode.Server/Managers/ManagerOfInventory.cs new file mode 100644 index 00000000..572f7efc --- /dev/null +++ b/ReallifeGamemode.Server/Managers/ManagerOfInventory.cs @@ -0,0 +1,198 @@ +using System; +using System.Collections.Generic; +using System.Linq; +using System.Text; +using System.Timers; +using GTANetworkAPI; +using Newtonsoft.Json; +using ReallifeGamemode.Server.Entities; +using ReallifeGamemode.Server.Extensions; +using ReallifeGamemode.Server.Models; +using ReallifeGamemode.Server.Services; + +namespace ReallifeGamemode.Server.Managers +{ + class ManagerOfInventory : Script + { + private static Dictionary TradeItems { get; set; } = new Dictionary(); + private static Dictionary TradeTimer { get; set; } = new Dictionary(); + private static Dictionary TradeValue { get; set; } = new Dictionary(); + + public static void GetUserItems(Client client) + { + User user = client.GetUser(); + + List ItemId = new List(); + List amount = new List(); + + using (var context = new DatabaseContext()) + { + List userItems = context.UserItems.ToList().FindAll(i => i.UserId == user.Id); + + foreach (var item in userItems) + { + ItemId.Add(item.ItemId); + amount.Add(item.Amount); + } + client.TriggerEvent("inventoryShow", ItemId.ToArray(), amount.ToArray()); + } + } + + [RemoteEvent("invUseItem")] + public void ServerEvent_invUseItem(Client client, int itemId) + { + User user = client.GetUser(); + + using (var context = new DatabaseContext()) + { + UserItem item = context.UserItems.Where(u => u.UserId == user.Id && u.ItemId == itemId).FirstOrDefault(); + if (item.Amount > 1) + { + item.Amount -= 1; + } + else + { + context.UserItems.Remove(item); + } + context.SaveChanges(); + return; + } + } + + [RemoteEvent("tradeItem")] + public void ServerEvent_tradeItem(Client client, int value, string nameOrId, string itemIdArrStr, string itemAmountArrStr) + { + int[] itemIdArr = JsonConvert.DeserializeObject(itemIdArrStr); + int[] itemAmountArr = JsonConvert.DeserializeObject(itemAmountArrStr); + User user = client.GetUser(); + Client target = ClientService.GetClientByNameOrId(nameOrId); + if (target == null || !target.IsLoggedIn()) + { + ChatService.PlayerNotFound(client); + return; + } + if (target.HasData("inTrade") && target.GetData("inTrade") == true) + { + ChatService.SendMessage(client, $"~r~[FEHLER] ~w~{target.Name} befindet sich bereits in einem Handel."); + return; + } + using (var context = new DatabaseContext()) + { + for (int x = 0; x < itemIdArr.Length; x++) + { + int itemId = itemIdArr[x]; + int itemAmount = itemAmountArr[x]; + UserItem item = context.UserItems.Where(u => u.UserId == user.Id && u.ItemId == itemId).FirstOrDefault(); + if (item.Amount - itemAmount > 0) + { + item.Amount -= itemAmount; + } + else + { + context.UserItems.Remove(item); + } + context.SaveChanges(); + } + } + TradeItems[user.Id] = (itemIdArr, itemAmountArr); + TradeValue[user.Id] = value; + target.SetData("tradePartner", user.Id); + SendTradeOffer(target,client); + } + + public void SendTradeOffer(Client client, Client sender) + { + client.SetData("inTrade", true); + ChatService.SendMessage(client, $"~b~ Du hast eine Handelsanfrage von {sender.Name} bekommen."); + ChatService.SendMessage(client, $"~b~ Drücke '~w~N~b~' um die Handelsanfrage zu akzeptieren."); + User user = client.GetUser(); + Timer tradeTimer = new Timer(30000); + TradeTimer[user.Id] = tradeTimer; + tradeTimer.Start(); + tradeTimer.Elapsed += (s, e) => { SendBackToSender(sender); client.SetData("inTrade", false); }; + } + + + [RemoteEvent("declineTrade")] + public void SendBackToSender(Client client) + { + User user = client.GetUser(); + ChatService.SendMessage(client, "Dein Handelpartner hat die Anfrage nicht angenommen."); + (int[] itemIdArr, int[] itemAmountArr) = TradeItems[user.Id]; + Timer timer = TradeTimer[user.Id]; + timer.Stop(); + using (var context = new DatabaseContext()) + { + for (int x = 0; x < itemIdArr.Length; x++) + { + int itemId = itemIdArr[x]; + int itemAmount = itemAmountArr[x]; + UserItem item = context.UserItems.Where(u => u.UserId == user.Id && u.ItemId == itemId).FirstOrDefault(); + if (item != null) + { + item.Amount += itemAmount; + } + else + { + var newItem = new UserItem + { + ItemId = itemId, + UserId = user.Id, + Amount = itemAmount, + Slot = -1 + }; + + context.UserItems.Add(newItem); + } + context.SaveChanges(); + } + } + } + + public static void OpenTradeAccept(Client client) + { + User user = client.GetUser(); + int id = client.GetData("tradePartner"); + (int[] itemIdArr, int[] itemAmountArr) = TradeItems[id]; + Timer tradeTimer = TradeTimer[id]; + tradeTimer.Stop(); + client.SetData("inTrade", false); + client.TriggerEvent("openTradeWindow", TradeValue[id], itemIdArr, itemAmountArr); + } + + [RemoteEvent("acceptTrade")] + public void ServerEvent_AcceptTrade(Client client) + { + User user = client.GetUser(); + int id = client.GetData("tradePartner"); + (int[] itemIdArr, int[] itemAmountArr) = TradeItems[id]; + + using (var context = new DatabaseContext()) + { + for (int x = 0; x < itemIdArr.Length; x++) + { + int itemId = itemIdArr[x]; + int itemAmount = itemAmountArr[x]; + UserItem item = context.UserItems.Where(u => u.UserId == user.Id && u.ItemId == itemId).FirstOrDefault(); + if (item != null) + { + item.Amount += itemAmount; + } + else + { + var newItem = new UserItem + { + ItemId = itemId, + UserId = user.Id, + Amount = itemAmount, + Slot = -1 + }; + + context.UserItems.Add(newItem); + } + context.SaveChanges(); + } + } + } + } +}