From 303140565e66f21c48d7570f56aebec6866e0478 Mon Sep 17 00:00:00 2001
From: Kakarot <57848836+GhzGarage@users.noreply.github.com>
Date: Sat, 4 Nov 2023 08:35:15 -0500
Subject: [PATCH] css re-write + more
---
client/main.lua | 4 +
html/css/main.css | 1189 ++++++++++++---------------------------------
html/js/app.js | 284 ++++++-----
html/ui.html | 52 +-
4 files changed, 499 insertions(+), 1030 deletions(-)
diff --git a/client/main.lua b/client/main.lua
index aa2e9e63d..3cbced908 100644
--- a/client/main.lua
+++ b/client/main.lua
@@ -116,9 +116,13 @@ end
---@param itemdata table Data of an item
---@return table attachments
local function FormatWeaponAttachments(itemdata)
+ if not itemdata.info or not itemdata.info.attachments or #itemdata.info.attachments == 0 then
+ return {}
+ end
local attachments = {}
local weaponName = itemdata.name
local WeaponAttachments = exports['qb-weapons']:getConfigWeaponAttachments()
+ if not WeaponAttachments then return {} end
for attachmentType, weapons in pairs(WeaponAttachments) do
local componentHash = weapons[weaponName]
if componentHash then
diff --git a/html/css/main.css b/html/css/main.css
index 154dd86c2..0f70d8fad 100644
--- a/html/css/main.css
+++ b/html/css/main.css
@@ -1,982 +1,441 @@
-@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap');
-
-p {
- margin: 0 !important;
+:root {
+ --text-color: #000000;
+ --background-color: #c0c0c0;
+ --font-size: 0.7vh;
+ --hover-color: #bdbdbd;
}
-:root {
- --main-label-color: 0, 0, 0;
+body {
+ background: none !important;
+ font-family: "Roboto", sans-serif;
}
-input[type=number]::-webkit-inner-spin-button,
-input[type=number]::-webkit-outer-spin-button {
- -webkit-appearance: none;
- margin: 0;
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
}
::-webkit-scrollbar {
- width: 2px;
+ width: 2px;
}
::-webkit-scrollbar-thumb {
- border-radius: 50px;
- background: #dc143c;
-}
-
-body {
- overflow-x: hidden;
+ background: none;
}
#qbcore-inventory {
- position: absolute;
- width: 100%;
- height: 100%;
- left: 0vw;
- display: none;
-}
-
-.inv-background {
- width: 100%;
- height: 100%;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
+ width: 100%;
+ height: 100%;
+ display: none;
}
.inv-container {
- position: absolute;
- width: 100%;
- height: 100%;
-}
-
-.player-inventory {
- position: absolute;
- top: 26%;
- left: 14.2%;
- width: 28%;
- height: 47.16%;
- float: left;
- overflow-x: hidden;
- overflow-y: scroll;
- z-index: 100;
-}
-
-.other-inventory {
- position: absolute;
- top: 26%;
- right: 16%;
- width: 28%;
- height: 47.16%;
- float: left;
- overflow-x: hidden;
- overflow-y: scroll;
- z-index: 100;
-}
-
-.ply-hotbar-inventory {
- position: absolute;
- bottom: 10%;
- left: 35.5%;
- z-index: 105;
-}
-
-.player-inventory>.item-slot>.item-slot-key>p {
- position: absolute;
- font-weight: bolder;
- color: white;
- padding: .3vh;
- padding-left: .5vh;
- text-align: left;
- font-size: 1.1vh;
- line-height: 1.8vh;
- font-family: 'Poppins', sans-serif;
-}
-
-.inv-options {
- position: absolute;
- margin: 0 auto;
- right: 0;
- width: 9%;
- top: 28%;
- left: 1vh;
-}
-
-.combine-option-container {
- display: none;
- position: absolute;
- margin: 0 auto;
- right: 0;
- width: 8.5%;
- top: 59%;
- left: 0vh;
-}
-
-.item-slot {
- position: relative;
- width: 9.5vh;
- height: 11.5vh;
- float: left;
- background-color: rgba(0, 0, 0, 0.3);
- border: 1px solid rgb(68 68 68 / 40%);
- margin: 2px;
- transition: opacity 0.2s;
- opacity: 1.0;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
-}
-
-.item-slot-hoverClass {
- opacity: .6;
-}
-
-.item-slot:hover {
- opacity: .7;
-}
-
-.inv-option-item {
- margin-top: 10%;
-}
-
-.btn-inv {
- width: 100% !important;
- max-width: 100% !important;
- padding: 10% !important;
- background-color: rgba(235, 235, 235, 0);
-}
-
-#item-amount {
- color: white;
- text-align: center;
- font-size: 1.25vh;
- font-family: 'Poppins', sans-serif;
- outline: none;
-}
-
-.ammo-info-block {
- position: absolute;
- margin: 0 auto;
- left: 0;
- right: 0;
- width: 22vh;
- height: 11vh;
- background-color: rgba(235, 235, 235, 0.08);
- border: 1px solid rgba(255, 255, 255, 0.01);
- top: 2vh;
-}
-
-.ammo-info-header {
- width: 100%;
- color: white;
- font-family: 'Poppins', sans-serif;
- background-color: rgba(0, 0, 0, 0.192);
- font-size: 1.vh;
- padding: .4vh;
- text-align: center;
-}
-
-.ammo-info {
- position: relative;
- color: white;
- font-family: 'Poppins', sans-serif;
- font-weight: 200;
- font-size: 1.vh;
- margin-left: .8vh;
- margin-top: .4vh;
- margin-bottom: .25vh;
- top: .6vh;
-}
-
-.ammo-info span {
- margin-right: 1vh;
- float: right;
-}
-
-.inv-option-item>p {
- color: white;
- text-align: center;
- line-height: 48px;
- text-transform: uppercase;
- font-size: 1.2vh;
- font-weight: 900;
- background-color: rgba(220, 20, 60, 0.6);
- font-family: 'Poppins', sans-serif;
+ position: absolute;
+ width: 100%;
+ height: 100%;
}
-.inv-option-item {
- width: 75%;
- height: 50px;
- background-color: rgb(0 0 0 / 30%);
- border: 1px solid rgba(255, 255, 255, .01);
- color: white;
- transition: background-color .1s linear;
-}
-
-.inv-option-item:hover {
- background-color: rgb(0 0 0 / 20%);
-}
-
-.btn-combine {
- position: relative;
- margin-top: 20px;
- width: 78%;
- left: 2px;
- color: white;
- border: 1px solid rgba(255, 255, 255, .01);
- background-color: rgba(220, 20, 60, 0.6);
- text-align: center;
- line-height: 48px;
- text-transform: uppercase;
- font-size: 1.2vh;
- transition: background-color .1s linear;
- font-weight: 900;
- font-family: 'Poppins', sans-serif;
-}
-
-.btn-combine>p {
- color: white;
- text-align: center;
- line-height: 48px;
- text-transform: uppercase;
- font-size: 1.1vh;
- font-family: 'Poppins', sans-serif;
- background-color: rgb(0 0 0 / 20%);
-}
-
-.item-slot-amount {
- position: absolute;
- top: 0.6vh;
- right: 0.2vw;
-}
-
-.item-slot-amount>p {
- color: #ffffff;
- text-align: right;
- font-size: 0.8vh;
-}
-
-.item-slot-label {
- position: absolute;
- bottom: 0;
- width: 100%;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
- background-color: rgba(var(--main-label-color), 0.7);
-}
-
-.item-slot-label>p {
- text-transform: uppercase;
- font-weight: 900;
- color: white;
- font-size: 0.8vh;
- padding: 3px;
- text-align: center;
- letter-spacing: 1px;
- font-family: 'Poppins', sans-serif;
-}
-
-.item-slot-quality {
- position: absolute;
- bottom: 1.7vh;
- width: 100%;
- height: .3vh;
- background-color: rgba(32, 6, 6, 0.15);
-}
-
-.item-slot-quality-bar {
- position: absolute;
- width: 0%;
- height: 100%;
- background-color: green;
- z-index: 1;
-}
-
-.item-slot-quality p {
- color: transparent;
-}
-
-.item-slot-img {
- max-width: 100%;
- max-height: 100%;
- padding: 0.5vw;
-}
-
-.item-slot-img img {
- display: block;
- position: relative;
- margin: 0 auto;
- margin-top: 21%;
- width: 70px;
- height: 70px;
- max-width: 100%;
- max-height: 100%;
-}
-
-.ui-draggable-dragging {
- background: rgba(0, 0, 0, 0.3);
+.player-inv-info {
+ position: absolute;
+ top: 23%;
+ left: 14.1%;
+ width: 28%;
+ height: fit-content;
+ float: left;
+ font-weight: bolder;
+ color: white;
+ display: flex;
+ flex-direction: row;
+ align-items: flex-start;
+ padding: 5px;
+ justify-content: space-between;
+ align-items: center;
+}
+
+#player-inv-progressbar {
+ height: 5px;
+ top: 25.5%;
+ left: 14.2%;
+ width: 27.8%;
+ position: absolute;
+ transition: width 0.2s;
+ background-color: #2d2d2d;
}
-.player-inv-info {
- position: absolute;
- left: 14.5%;
- top: 22.2%;
- width: 695px;
-}
-
-#player-inv-label {
- position: relative;
- color: white;
- font-size: 16px;
- font-style: italic;
- font-family: 'Poppins', sans-serif;
- font-weight: bold;
- letter-spacing: 0.2vh;
- bottom: 0px;
- float: left;
- text-transform: uppercase;
-}
-
-#player-inv-weight {
- color: white;
- font-size: 12px;
- font-weight: 900;
- font-family: 'Poppins', sans-serif;
- letter-spacing: 0.2vh;
- float: left;
- width: 100%;
-}
-
-#other-inv-label {
- position: relative;
- color: white;
- font-size: 16px;
- font-style: italic;
- font-family: 'Poppins', sans-serif;
- font-weight: bold;
- letter-spacing: 0.2vh;
- bottom: 0px;
- float: left;
- text-transform: uppercase;
-}
-
-#other-inv-weight {
- color: white;
- font-size: 12px;
- font-weight: 900;
- font-family: 'Poppins', sans-serif;
- letter-spacing: 0.2vh;
- float: left;
- width: 100%;
-}
-
-.player-inv-weight {
- position: absolute;
- left: 38%;
- top: 12%;
-}
-
-.player-inv-weight>p {
- color: white;
- font-size: 12px;
- font-family: 'Poppins', sans-serif;
+.other-inv-info {
+ position: absolute;
+ top: 23%;
+ right: 14.3%;
+ width: 28%;
+ height: fit-content;
+ float: left;
+ font-weight: bolder;
+ color: white;
+ display: flex;
+ flex-direction: row;
+ align-items: flex-start;
+ padding: 5px;
+ justify-content: space-between;
+ align-items: center;
+}
+
+#other-inv-progressbar {
+ position: absolute;
+ top: 25.5%;
+ width: 27.8%;
+ right: 14.4%;
+ height: 5px;
+ transition: width 0.2s;
+ background-color: #2d2d2d;
}
.ui-progressbar.ui-widget.ui-widget-content {
- border: none;
+ border: none;
}
.ui-progressbar.ui-widget-content {
- border: none;
- background-color: rgba(var(--main-label-color), 0.5);
+ border: none;
}
.ui-progressbar .ui-widget-header {
- border: none;
- background: #dc143c;
+ border: none;
}
.ui-progressbar-value {
- transition: width 0.5s;
- -webkit-transition: width 0.5s;
+ transition: width 0.5s;
+ -webkit-transition: width 0.5s;
}
-.other-inv-info {
- position: absolute;
- left: 56%;
- top: 22.2%;
- width: 695px;
-}
-
-.ply-iteminfo-container {
- font-family: 'Poppins', sans-serif;
- display: none;
- position: absolute;
- bottom: 3%;
- margin: 0 auto;
- left: 100px;
- right: 0;
- text-align: right;
- width: 103.4vh;
- height: 23vh;
-}
-
-.item-info-title {
- text-transform: uppercase;
- font-weight: 900;
- font-family: 'Poppins', sans-serif;
- font-size: 1.3vh;
- color: white;
- padding-top: 1px;
-}
-
-.item-info-line {
- position: absolute;
- font-family: 'Poppins', sans-serif;
- width: 100%;
- background-color: white;
- height: 0vh;
-}
-
-.item-info-description {
- text-transform: uppercase;
- font-size: 1vh;
- font-family: 'Poppins', sans-serif;
- color: white;
- padding-top: .5vh;
-}
-
-.itemboxes-container {
- height: 130px;
- min-width: 110px;
- max-width: 550px;
- width: fit-content;
- position: absolute;
- left: 47%;
- bottom: 20%;
- overflow: hidden;
-}
-
-.template {
- display: none;
-}
-
-.itembox-container {
- display: none;
- position: relative;
- float: left;
- margin: 0 auto;
- margin-right: 1vh;
- width: 9vh;
- height: 11vh;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
- background-color: rgba(0, 0, 0, 0.3);
- border: 1px solid rgb(68 68 68 / 40%);
-}
-
-#itembox-action {
- position: absolute;
- color: white;
- border-top-left-radius: 1px;
- padding: 4px;
- top: 0;
- left: 0;
-}
-
-#itembox-action>p {
- font-size: 10px;
- font-family: 'Poppins', sans-serif;
+.ui-progressbar .ui-progressbar-value {
+ background-color: green;
}
-#itembox-label {
- position: absolute;
- bottom: 0;
- width: 100%;
- background-color: rgba(var(--main-label-color), 0.35);
- min-height: 2.2vh;
- height: fit-content;
+.ui-progressbar-medium .ui-progressbar-value {
+ background-color: yellow;
}
-#itembox-label>p {
- color: #ffffff;
- font-size: 11px;
- text-align: center;
- text-transform: uppercase;
- line-height: 3vh;
+.ui-progressbar-high .ui-progressbar-value {
+ background-color: red;
}
-.requiredItem-container {
- display: none;
- position: absolute;
- height: 100vh;
- width: 100vw;
-}
-
-.requiredItem-box {
- position: relative;
- top: 70%;
- left: 42%;
- width: 9vh;
- height: 11vh;
- float: left;
- margin-left: 20px;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
- background-color: rgba(0, 0, 0, 0.3);
- border: 1px solid rgb(68 68 68 / 40%);
-}
-
-#requiredItem-action {
- position: absolute;
- left: 0;
- top: 0;
- color: white;
- padding: 3px;
- font-size: 10px;
- font-family: 'Poppins', sans-serif;
-}
-
-#requiredItem-label {
- position: absolute;
- bottom: 0;
- width: 100%;
- background-color: rgb(0 0 0 / 20%);
- height: 2.6vh;
-}
-
-#requiredItem-label>p {
- color: #ffffff;
- font-size: 11px;
- text-align: center;
- text-transform: uppercase;
- line-height: 3vh;
+.player-inventory {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ align-content: flex-start;
+ position: absolute;
+ top: 26%;
+ left: 14.2%;
+ width: 28%;
+ height: 47.16%;
+ float: left;
+ overflow-x: hidden;
+ overflow-y: scroll;
}
-.z-hotbar-inventory {
- display: none;
- position: absolute;
- bottom: 1%;
- margin: 0 auto;
- left: 0;
- right: 0;
- width: fit-content;
- z-index: 105;
-}
-
-.z-hotbar-inventory>.z-hotbar-item-slot>.z-hotbar-item-slot-key>p {
- position: absolute;
- color: #ffffff;
- border-top-left-radius: 1px;
- padding: .3vh;
- padding-left: .5vh;
- padding-right: .5vh;
- text-align: left;
- font-size: 1.1vh;
- line-height: 1.8vh;
- font-family: 'Poppins', sans-serif;
-}
-
-.z-hotbar-item-slot {
- position: relative;
- width: 8.5vh;
- height: 10.5vh;
- float: left;
- margin-left: 2px;
- margin-bottom: 2px;
- border: 1px solid rgb(68 68 68 / 40%);
- margin: 3px;
- transition: opacity 0.2s;
- opacity: 1.0;
- background-color: rgba(0, 0, 0, 0.3);
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
-}
-
-.z-hotbar-item-slot-amount {
- position: absolute;
- top: 0.3vh;
- right: 0.3vw;
-}
-
-.z-hotbar-item-slot-amount>p {
- color: #ffffff;
- text-align: right;
- font-size: 10px;
-}
-
-.z-hotbar-item-slot-label {
- position: absolute;
- bottom: 0;
- width: 100%;
- background-color: rgba(var(--main-label-color), 0.35);
- min-height: 2.2vh;
- height: fit-content;
+.other-inventory {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ align-content: flex-start;
+ position: absolute;
+ top: 26%;
+ right: 14.2%;
+ width: 28%;
+ height: 47.16%;
+ float: left;
+ overflow-x: hidden;
+ overflow-y: scroll;
}
-.z-hotbar-item-slot-label>p {
- color: rgb(247, 247, 247);
- font-size: 11.5px;
- text-align: center;
- text-transform: lowercase;
- font-family: 'Poppins', sans-serif;
- font-variant: small-caps;
+.item-slot {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: calc(20% - 1.5px);
+ margin: 0.5px;
+ height: 10vh;
+ background-color: rgba(0, 0, 0, 0.3);
}
-.z-hotbar-item-slot-img {
- max-width: 100%;
- max-height: 100%;
- padding: 0.9vw;
+.item-slot-img {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
-.z-hotbar-item-slot-img img {
- margin-top: 21%;
- display: block;
- width: 60px;
- height: 60px;
- max-width: 100%;
- max-height: 100%;
+.item-slot-img img {
+ width: 50%;
+ height: auto;
}
-.ammo-container {
- position: absolute;
- background-color: rgba(20, 18, 32, 0.2);
- width: 3.25%;
- height: 44.16%;
- top: 26%;
- left: 6%;
+.item-slot-key {
+ font-weight: bolder;
+ color: var(--text-color);
+ position: absolute;
+ top: 5px;
+ left: 5px;
+ width: 20px;
+ height: 20px;
+ background-color: var(--background-color);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 3px;
+ box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.2);
+ background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.1));
}
-.ammo-container-header {
- position: absolute;
- top: 0;
- width: 100%;
- height: 5vh;
- background-color: rgba(120, 10, 20, 0.5);
- text-align: center;
- color: rgba(216, 216, 216, 0.897);
+.item-slot-key p {
+ margin: 0;
}
-.ammo-container-header>i {
- line-height: 5vh;
- font-size: 1.8vh;
+.item-slot-amount {
+ font-size: var(--font-size);
+ color: white;
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ width: 100%;
+ height: 20px;
+ display: flex;
+ justify-content: flex-end;
}
-.ammo-box {
- position: relative;
- width: 100%;
- height: 6vh;
- top: 5vh;
- background-color: rgba(0, 0, 0, .4);
- margin-bottom: .5vh;
- margin-top: .5vh;
+.item-slot-label {
+ position: absolute;
+ white-space: nowrap;
+ bottom: 0;
+ height: 1vh;
+ width: 100%;
+ background-color: var(--background-color);
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
-.ammo-box>img {
- position: absolute;
- top: .15vh;
- left: .2vh;
- width: 5.25vh;
- opacity: .25;
+.item-slot-label p {
+ margin: 0;
+ font-size: var(--font-size);
+ text-transform: uppercase;
+ color: var(--text-color);
+ font-weight: bolder;
}
-.ammo-box>span {
- position: absolute;
- color: rgba(255, 255, 255, 0.95);
- font-size: .93vh;
- bottom: 0;
- right: 0;
- margin: .3vh;
- font-family: 'Poppins', sans-serif;
+.item-slot-quality {
+ position: absolute;
+ bottom: 1vh;
+ width: 100%;
+ height: 4px;
+ background-color: #2d2d2d;
}
-.ammo-box-amount {
- position: absolute;
- width: 100%;
- background-color: rgba(36, 36, 36, 0.4);
- bottom: 0;
- max-height: 100%;
+.item-slot-quality-bar {
+ height: 4px;
}
-#pistol_ammo>.ammo-box-amount {
- height: 0%;
+.inv-options {
+ position: absolute;
+ width: 10%;
+ top: 45%;
+ left: 50%;
+ transform: translate(-50%, -50%);
}
-#smg_ammo>.ammo-box-amount {
- height: 0%;
+.inv-options-list {
+ width: 90%;
+ display: flex;
+ flex-direction: column;
}
-#shotgun_ammo>.ammo-box-amount {
- height: 0%;
+.inv-option-item {
+ width: 100%;
+ margin: 10px;
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+ height: 3vh;
+ font-weight: bolder;
+ color: var(--text-color);
+ background-color: var(--background-color);
+}
+
+#item-use p,
+#item-give p,
+#inv-close p,
+#weapon-attachments p {
+ margin: 0;
}
-#rifle_ammo>.ammo-box-amount {
- height: 0%;
+.ply-iteminfo-container {
+ display: flex;
+ justify-content: center;
+ position: fixed;
+ top: 67%;
+ left: 50%;
+ width: 15vw;
+ transform: translate(-50%, -50%);
+ align-items: center;
+ text-align: center;
+ background-color: var(--background-color);
+ border-radius: 5px;
}
-/* Weapon Attachments */
-
.weapon-attachments-container {
- position: absolute;
- left: -100vw;
- width: 100%;
- height: 100%;
- background-color: rgba(0, 0, 0, 0.5);
+ width: 100%;
+ height: 100%;
+ display: none;
}
.weapon-attachments-container-title {
- position: absolute;
- margin: 5vh;
- font-size: 3vh;
- color: rgb(255, 255, 255);
- font-family: 'Poppins', sans-serif;
+ position: fixed;
+ top: 30%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 3vh;
}
.weapon-attachments-container-description {
- position: absolute;
- margin: 5vh;
- top: 5vh;
- font-size: 1.7vh;
- color: rgba(255, 255, 255, 0.8);
- font-family: 'Poppins', sans-serif;
+ position: fixed;
+ top: 35%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 2vh;
}
.weapon-attachments-container-details {
- position: absolute;
- margin: 5vh;
- top: 9vh;
- font-size: 1.4vh;
- color: rgba(255, 255, 255, 0.8);
- font-family: 'Poppins', sans-serif;
+ position: fixed;
+ top: 65%;
+ left: 50%;
+ transform: translate(-50%, -50%);
}
.weapon-attachments-container-detail-durability {
- height: 1.5vh;
- width: 10vh;
- background-color: rgba(0, 0, 0, 0.3);
- border-radius: 1px;
+ height: 1.5vh;
+ width: 10vh;
+ background-color: rgba(0, 0, 0, 0.3);
+ border-radius: 1px;
}
.weapon-attachments-container-detail-durability-total {
- height: 100%;
- width: 50%;
- background-color: rgb(39, 174, 96);
+ height: 100%;
+ width: 50%;
+ background-color: rgb(39, 174, 96);
}
.weapon-attachments-container-image {
- position: absolute;
- margin: 0 auto;
- left: 0;
- right: 0;
- top: 32%;
- width: 30%;
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
}
-.weapon-attachments {
- position: absolute;
- bottom: 0;
- left: 0;
- margin: 5vh;
- width: 50vh;
- height: 12.5vh;
+.weapon-attachments-title {
+ position: fixed;
+ top: 85%;
+ left: 50%;
+ transform: translate(-50%, -50%);
}
-.weapon-attachments-title {
- position: absolute;
- bottom: 14vh;
- left: 0;
- margin: 5vh;
- color: rgba(255, 255, 255, 0.8);
- font-family: 'Poppins', sans-serif;
- font-size: 1.4vh
-}
-
-.weapon-attachment {
- position: relative;
- height: 12.5vh;
- width: 10.5vh;
- background-color: rgba(0, 0, 0, 0.3);
- border: 1px solid rgb(75, 75, 75);
- margin-right: 1vh;
- float: left;
- transition: .05s linear;
-}
-
-.weapon-attachment:hover {
- background-color: rgba(0, 0, 0, 0.4);
- border: 1px solid rgb(29, 29, 29);
- transition: .05s linear;
-}
-
-.weapon-attachment-label {
- position: absolute;
- bottom: 0;
- width: 100%;
- background-color: rgba(var(--main-label-color), 0.3);
- padding: 2.1%;
-}
-
-.weapon-attachment-label>p {
- color: #ffffff;
- font-size: 1.1vh;
- text-align: center;
- text-transform: uppercase;
- line-height: 1.9vh;
- font-family: 'Poppins', sans-serif;
- font-weight: 100;
-}
-
-.weapon-attachment-img {
- max-width: 100%;
- max-height: 100%;
- padding: 0.5vw;
-}
-
-.weapon-attachment-img>img {
- display: block;
- position: relative;
- margin: 0 auto;
- margin-top: 10%;
- width: auto;
- height: auto;
- max-width: 100%;
- max-height: 100%;
+.weapon-attachments {
+ display: flex;
+ justify-content: center;
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ width: 30vw;
+ transform: translateX(-50%);
+ padding-bottom: 3vh;
}
.weapon-attachments-remove {
- position: absolute;
- width: 6.5vh;
- height: 6.5vh;
- background-color: rgb(15, 15, 15);
- border-radius: 1px;
- margin: 0 auto;
- left: 0;
- right: 0;
- bottom: 20vh;
- text-align: center;
- color: white;
- font-size: 2vh;
- transition: background-color .05s linear;
+ position: fixed;
+ top: 80%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ background-color: var(--background-color);
}
-.weapon-attachments-remove:hover {
- background-color: rgb(18, 18, 18);
+.weapon-attachments-remove > i {
+ color: var(--text-color);
+ font-size: 2vh;
+ padding: 1vh;
}
-.weapon-attachments-remove>i {
- line-height: 6.5vh;
+.weapon-attachments-remove:hover {
+ background-color: var(--hover-color);
}
-.weapon-attachments-remove-hover {
- background-color: rgb(39, 174, 96);
+.weapon-attachments-back {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ width: 10vh;
+ height: 6vh;
+ margin: 5vh;
+ color: var(--text-color);
+ text-align: center;
+ line-height: 6vh;
+ background-color: var(--background-color);
+ transition: 0.05s linear;
}
-.weapon-dragging-class {
- animation: ShakeEffect .75s;
- animation-iteration-count: infinite;
+.weapon-attachments-back:hover {
+ background-color: var(--hover-color);
}
-@keyframes ShakeEffect {
- 0% {
- transform: translate(1px, 1px) rotate(0deg);
- }
-
- 10% {
- transform: translate(-1px, -2px) rotate(-1deg);
- }
-
- 20% {
- transform: translate(-3px, 0px) rotate(1deg);
- }
-
- 30% {
- transform: translate(3px, 2px) rotate(0deg);
- }
-
- 40% {
- transform: translate(1px, -1px) rotate(1deg);
- }
-
- 50% {
- transform: translate(-1px, 2px) rotate(-1deg);
- }
-
- 60% {
- transform: translate(-3px, 1px) rotate(0deg);
- }
-
- 70% {
- transform: translate(3px, 1px) rotate(-1deg);
- }
-
- 80% {
- transform: translate(-1px, -1px) rotate(1deg);
- }
-
- 90% {
- transform: translate(1px, 2px) rotate(0deg);
- }
-
- 100% {
- transform: translate(1px, -2px) rotate(-1deg);
- }
+.combine-option-container {
+ display: none;
+ position: absolute;
+ width: 10%;
+ top: 58%;
+ left: 50%;
+ margin: 0;
+ transform: translate(-50%, -50%);
}
-.weapon-attachments-back {
- position: absolute;
- bottom: 0;
- right: 0;
- width: 10vh;
- height: 6vh;
- margin: 5vh;
- background-color: rgb(15, 15, 15);
- border-radius: 1px;
- text-align: center;
- line-height: 6vh;
- color: white;
- font-family: 'Poppins', sans-serif;
- transition: .05s linear;
+.CombineItem p,
+.SwitchItem p {
+ margin: 0;
}
-.weapon-attachments-back:hover {
- background-color: rgb(18, 18, 18);
+.itemboxes-container {
+ display: flex;
+ justify-content: center;
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ width: 30vw;
+ transform: translateX(-50%);
+ padding-bottom: 3vh;
}
-
-@media screen and (max-width: 1920px) {
- .player-inv-info {
- position: absolute;
- left: 14.5%;
- top: 21%;
- width: 530px;
- }
-
- .other-inv-info {
- position: absolute;
- left: 56%;
- top: 21%;
- width: 530px;
- }
+.requiredItem-container {
+ display: flex;
+ justify-content: center;
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ width: 30vw;
+ transform: translateX(-50%);
+ padding-bottom: 3vh;
}
-@media screen and (max-width:3840px) and (max-height: 2160px) {
- .inv-options {
- width: 10%;
- top: 38%;
- }
-
- #player-inv-label {
- font-weight: 28px;
- }
-
- #player-inv-weight {
- width: 27.8vw;
- }
-
- #other-inv-label {
- font-weight: 28px;
- }
-
- #other-inv-weight {
- width: 28vw;
- }
+.z-hotbar-inventory {
+ display: flex;
+ justify-content: center;
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ width: 30vw;
+ transform: translateX(-50%);
+ padding-bottom: 3vh;
}
diff --git a/html/js/app.js b/html/js/app.js
index 04f533d7e..3b3f289e9 100644
--- a/html/js/app.js
+++ b/html/js/app.js
@@ -1,4 +1,3 @@
-var InventoryOption = "0, 0, 0";
var totalWeight = 0;
var totalWeightOther = 0;
var playerMaxWeight = 0;
@@ -125,7 +124,7 @@ $(document).on("mousedown", ".item-slot", function (event) {
$(document).on("click", ".item-slot", function (e) {
e.preventDefault();
var ItemData = $(this).data("item");
-
+ $(".combine-option-container").hide();
if (ItemData !== null && ItemData !== undefined) {
if (ItemData.name !== undefined) {
if (ItemData.name.split("_")[0] == "weapon") {
@@ -175,21 +174,10 @@ $(document).on("click", "#inv-close", function (e) {
$(document).on("click", ".weapon-attachments-back", function (e) {
e.preventDefault();
$("#qbcore-inventory").css({ display: "block" });
- $("#qbcore-inventory").animate(
- {
- left: 0 + "vw",
- },
- 200
- );
- $(".weapon-attachments-container").animate(
- {
- left: -100 + "vw",
- },
- 200,
- function () {
- $(".weapon-attachments-container").css({ display: "none" });
- }
- );
+ $("#qbcore-inventory").animate({ left: 0 + "vw" }, 200);
+ $(".weapon-attachments-container").animate({ left: -100 + "vw" }, 200, function () {
+ $(".weapon-attachments-container").css({ display: "none" });
+ });
AttachmentScreenActive = false;
});
@@ -226,7 +214,7 @@ function FormatAttachmentInfo(data) {
$(".weapon-attachments-title").html('Attachments');
$.each(data.AttachmentData, function (i, attachment) {
var WeaponType = data.WeaponData.ammotype.split("_")[1].toLowerCase();
- $(".weapon-attachments").append('');
+ $(".weapon-attachments").append('');
attachment.id = i;
$("#weapon-attachment-" + i).data("AttachmentData", attachment);
});
@@ -251,9 +239,14 @@ function handleAttachmentDrag() {
scroll: true,
revertDuration: 0,
revert: "invalid",
+ cursorAt: { top: Math.floor($(".item-slot").outerHeight() / 2), left: Math.floor($(".item-slot").outerWidth() / 2) },
start: function (event, ui) {
var ItemData = $(this).data("AttachmentData");
$(this).addClass("weapon-dragging-class");
+ $(ui.helper).css({
+ width: $(this).width(),
+ height: $(this).height(),
+ });
AttachmentDraggingData = ItemData;
},
stop: function () {
@@ -331,86 +324,81 @@ $(document).on("click", "#weapon-attachments", function (e) {
}
});
-function FormatItemInfo(itemData) {
- if (itemData != null && itemData.info != "") {
- if (itemData.name == "id_card") {
- var gender = "Man";
- if (itemData.info.gender == 1) {
- gender = "Woman";
- }
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("CSN: " + itemData.info.citizenid + "
First Name: " + itemData.info.firstname + "
Last Name: " + itemData.info.lastname + "
Birth Date: " + itemData.info.birthdate + "
Gender: " + gender + "
Nationality: " + itemData.info.nationality + "
");
- } else if (itemData.name == "driver_license") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("First Name: " + itemData.info.firstname + "
Last Name: " + itemData.info.lastname + "
Birth Date: " + itemData.info.birthdate + "
Licenses: " + itemData.info.type + "
");
- } else if (itemData.name == "weaponlicense") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("First Name: " + itemData.info.firstname + "
Last Name: " + itemData.info.lastname + "
Birth Date: " + itemData.info.birthdate + "
");
- } else if (itemData.name == "lawyerpass") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("Pass-ID: " + itemData.info.id + "
First Name: " + itemData.info.firstname + "
Last Name: " + itemData.info.lastname + "
CSN: " + itemData.info.citizenid + "
");
- } else if (itemData.name == "harness") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("" + itemData.info.uses + " uses left.
");
- } else if (itemData.type == "weapon") {
- $(".item-info-title").html("" + itemData.label + "
");
- if (itemData.info.ammo == undefined) {
- itemData.info.ammo = 0;
- } else {
- itemData.info.ammo != null ? itemData.info.ammo : 0;
- }
- if (itemData.info.attachments != null) {
- var attachmentString = "";
- $.each(itemData.info.attachments, function (i, attachment) {
- if (i == itemData.info.attachments.length - 1) {
- attachmentString += attachment.label;
- } else {
- attachmentString += attachment.label + ", ";
- }
- });
- $(".item-info-description").html("Serial Number: " + itemData.info.serie + "
Munition: " + itemData.info.ammo + "
Attachments: " + attachmentString + "
");
- } else {
- $(".item-info-description").html("Serial Number: " + itemData.info.serie + "
Munition: " + itemData.info.ammo + "
" + itemData.description + "
");
- }
- } else if (itemData.name == "filled_evidence_bag") {
- $(".item-info-title").html("" + itemData.label + "
");
+function getGender(info) {
+ return info.gender === 1 ? "Woman" : "Man";
+}
+
+function setItemInfo(title, description) {
+ $(".item-info-title").html(`${title}
`);
+ $(".item-info-description").html(description);
+}
+
+function generateDescription(itemData) {
+ switch (itemData.name) {
+ case "id_card":
+ return `CSN: ${itemData.info.citizenid}
+ First Name: ${itemData.info.firstname}
+ Last Name: ${itemData.info.lastname}
+ Birth Date: ${itemData.info.birthdate}
+ Gender: ${getGender(itemData.info)}
+ Nationality: ${itemData.info.nationality}
`;
+ case "driver_license":
+ return `First Name: ${itemData.info.firstname}
+ Last Name: ${itemData.info.lastname}
+ Birth Date: ${itemData.info.birthdate}
+
Licenses: ${itemData.info.type}
`;
+ case "weaponlicense":
+ return `First Name: ${itemData.info.firstname}
`;
+ case "lawyerpass":
+ return `Pass-ID: ${itemData.info.id}
+ First Name: ${itemData.info.firstname}
+ Last Name: ${itemData.info.lastname}
+ CSN: ${itemData.info.citizenid}
`;
+ case "harness":
+ return `${itemData.info.uses} uses left
`;
+ case "filled_evidence_bag":
if (itemData.info.type == "casing") {
- $(".item-info-description").html("Evidence material: " + itemData.info.label + "
Type number: " + itemData.info.ammotype + "
Caliber: " + itemData.info.ammolabel + "
Serial Number: " + itemData.info.serie + "
Crime scene: " + itemData.info.street + "
" + itemData.description + "
");
+ return `Evidence material: ${itemData.info.label}
+ Type number: ${itemData.info.ammotype}
+ Caliber: ${itemData.info.ammolabel}
+ Serial Number: ${itemData.info.serie}
+ Crime scene: ${itemData.info.street}
${itemData.description}
`;
} else if (itemData.info.type == "blood") {
- $(".item-info-description").html("Evidence material: " + itemData.info.label + "
Blood type: " + itemData.info.bloodtype + "
DNA Code: " + itemData.info.dnalabel + "
Crime scene: " + itemData.info.street + "
" + itemData.description + "
");
+ return `Evidence material: ${itemData.info.label}
+ Blood type: ${itemData.info.bloodtype}
+ DNA Code: ${itemData.info.dnalabel}
+ Crime scene: ${itemData.info.street}
${itemData.description}
`;
} else if (itemData.info.type == "fingerprint") {
- $(".item-info-description").html("Evidence material: " + itemData.info.label + "
Fingerprint: " + itemData.info.fingerprint + "
Crime Scene: " + itemData.info.street + "
" + itemData.description + "
");
+ return `Evidence material: ${itemData.info.label}
+ Fingerprint: ${itemData.info.fingerprint}
+ Crime Scene: ${itemData.info.street}
${itemData.description}
`;
} else if (itemData.info.type == "dna") {
- $(".item-info-description").html("Evidence material: " + itemData.info.label + "
DNA Code: " + itemData.info.dnalabel + "
" + itemData.description + "
");
+ return `Evidence material: ${itemData.info.label}
+ DNA Code: ${itemData.info.dnalabel}
${itemData.description}
`;
}
- } else if (itemData.info.costs != undefined && itemData.info.costs != null) {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("" + itemData.info.costs + "
");
- } else if (itemData.name == "stickynote") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("" + itemData.info.label + "
");
- } else if (itemData.name == "moneybag") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("Amount of cash: $" + itemData.info.cash + "
");
- } else if (itemData.name == "markedbills") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("Worth: $" + itemData.info.worth + "
");
- } else if (itemData.name == "visa" || itemData.name == "mastercard") {
- $(".item-info-title").html("" + itemData.label + "
");
- var str = "" + itemData.info.cardNumber + "";
- var res = str.slice(12);
- var cardNumber = "************" + res;
- $(".item-info-description").html("Card Holder: " + itemData.info.name + "
Citizen ID: " + itemData.info.citizenid + "
Card Number: " + cardNumber + "
");
- } else if (itemData.name == "labkey") {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("Lab: " + itemData.info.lab + "
");
- } else {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("" + itemData.description + "
");
- }
+ case "stickynote":
+ return `${itemData.info.label}
`;
+ case "moneybag":
+ return `Amount of cash: $${itemData.info.cash}
`;
+ case "markedbills":
+ return `Worth: $${itemData.info.worth}
`;
+ case "visa":
+ return `Card Holder: ${itemData.info.name}
`;
+ case "mastercard":
+ return `Card Holder: ${itemData.info.name}
`;
+ case "labkey":
+ return `Lab: ${itemData.info.lab}
`;
+ default:
+ return itemData.description;
+ }
+}
+
+function FormatItemInfo(itemData) {
+ if (itemData && itemData.info !== "") {
+ const description = generateDescription(itemData);
+ setItemInfo(itemData.label, description);
} else {
- $(".item-info-title").html("" + itemData.label + "
");
- $(".item-info-description").html("" + itemData.description + "
");
+ setItemInfo(itemData.label, itemData.description || "");
}
}
@@ -422,16 +410,16 @@ function handleDragDrop() {
revertDuration: 0,
revert: "invalid",
cancel: ".item-nodrag",
+ cursorAt: { top: Math.floor($(".item-slot").outerHeight() / 2), left: Math.floor($(".item-slot").outerWidth() / 2) },
start: function (event, ui) {
IsDragging = true;
$(this).find("img").css("filter", "brightness(50%)");
- $(".item-slot").css("border", "1px solid rgba(255, 255, 255, 0.1)");
+ $(ui.helper).css({
+ width: $(this).width(),
+ height: $(this).height(),
+ });
var itemData = $(this).data("item");
var dragAmount = $("#item-amount").val();
- if (!itemData.useable) {
- $("#item-use").css("background", "rgba(35,35,35, 0.5");
- }
-
if (dragAmount == 0) {
if (itemData.price != null) {
$(this).find(".item-slot-amount p").html("0 (0.0)");
@@ -503,7 +491,6 @@ function handleDragDrop() {
}, 300);
$(this).css("background", "rgba(0, 0, 0, 0.3)");
$(this).find("img").css("filter", "brightness(100%)");
- $("#item-use").css("background", "rgba(" + InventoryOption + ", 0.3)");
},
});
@@ -578,6 +565,46 @@ function handleDragDrop() {
});
}
+function updateProgressBar(totalWeight, playerMaxWeight) {
+ var percentage = (totalWeight / playerMaxWeight) * 100;
+ var progressBarClass;
+
+ if (percentage < 50) {
+ progressBarClass = "";
+ } else if (percentage >= 50 && percentage < 75) {
+ progressBarClass = "ui-progressbar-medium";
+ } else {
+ progressBarClass = "ui-progressbar-high";
+ }
+
+ $("#player-inv-progressbar")
+ .progressbar({ value: parseInt(totalWeight), max: playerMaxWeight })
+ .removeClass("ui-progressbar-medium ui-progressbar-high")
+ .addClass(progressBarClass);
+
+ $("#player-inv-weight-value").text(totalWeight / 1000 + "/" + playerMaxWeight / 1000);
+}
+
+function updateOtherProgressBar(totalWeightOther, otherMaxWeight) {
+ var percentage = (totalWeightOther / otherMaxWeight) * 100;
+ var progressBarClass;
+
+ if (percentage < 50) {
+ progressBarClass = "";
+ } else if (percentage >= 50 && percentage < 75) {
+ progressBarClass = "ui-progressbar-medium";
+ } else {
+ progressBarClass = "ui-progressbar-high";
+ }
+
+ $("#other-inv-progressbar")
+ .progressbar({ value: parseInt(totalWeightOther), max: otherMaxWeight })
+ .removeClass("ui-progressbar-medium ui-progressbar-high")
+ .addClass(progressBarClass);
+
+ $("#other-inv-weight-value").text(totalWeightOther / 1000 + "/" + otherMaxWeight / 1000);
+}
+
function updateweights($fromSlot, $toSlot, $fromInv, $toInv, $toAmount) {
var otherinventory = otherLabel.toLowerCase();
if (otherinventory.split("-")[0] == "dropped") {
@@ -663,13 +690,11 @@ function updateweights($fromSlot, $toSlot, $fromInv, $toInv, $toAmount) {
InventoryError($fromInv, $fromSlot);
return false;
}
-
- $("#player-inv-weight").progressbar({ value: parseInt(totalWeight), max: playerMaxWeight });
+ updateProgressBar(parseInt(totalWeight), playerMaxWeight);
if ($fromInv.attr("data-inventory").split("-")[0] != "itemshop" && $toInv.attr("data-inventory").split("-")[0] != "itemshop" && $fromInv.attr("data-inventory") != "crafting" && $toInv.attr("data-inventory") != "crafting") {
$("#other-inv-label").html(otherLabel);
- $("#other-inv-weight").progressbar({ value: parseInt(totalWeightOther), max: otherMaxWeight });
+ updateOtherProgressBar(parseInt(totalWeightOther), otherMaxWeight);
}
-
return true;
}
@@ -805,7 +830,7 @@ function swap($fromSlot, $toSlot, $fromInv, $toInv, $toAmount) {
if ($toSlot < 6 && $toInv.attr("data-inventory") == "player") {
$toInv.find("[data-slot=" + $toSlot + "]").html('' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newData.amount + " (" + ((newData.weight * newData.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
If you combine these items you get: " + item.label + "
");
});
+ $(".combine-option-container").css("display", "flex");
$(".combine-option-container").fadeIn(100);
combineslotData = [];
combineslotData.fromData = fromData;
@@ -1023,7 +1049,7 @@ function swap($fromSlot, $toSlot, $fromInv, $toInv, $toAmount) {
if ($toSlot < 6 && $toInv.attr("data-inventory") == "player") {
$toInv.find("[data-slot=" + $toSlot + "]").html('' + fromData.amount + " (" + ((fromData.weight * fromData.amount) / 1000).toFixed(1) + ")
' + fromData.amount + " (" + ((fromData.weight * fromData.amount) / 1000).toFixed(1) + ")
' + fromData.amount + " (" + ((fromData.weight * fromData.amount) / 1000).toFixed(1) + ")
' + fromData.amount + " (" + ((fromData.weight * fromData.amount) / 1000).toFixed(1) + ")
' + toData.amount + " (" + ((toData.weight * toData.amount) / 1000).toFixed(1) + ")
' + toData.amount + " (" + ((toData.weight * toData.amount) / 1000).toFixed(1) + ")
' + toData.amount + " (" + ((toData.weight * toData.amount) / 1000).toFixed(1) + ")
' + toData.amount + " (" + ((toData.weight * toData.amount) / 1000).toFixed(1) + ")
' + newDataTo.amount + " (" + ((newDataTo.weight * newDataTo.amount) / 1000).toFixed(1) + ")
' + newDataTo.amount + " (" + ((newDataTo.weight * newDataTo.amount) / 1000).toFixed(1) + ")
' + newDataTo.amount + " (" + ((newDataTo.weight * newDataTo.amount) / 1000).toFixed(1) + ")
' + newDataTo.amount + " (" + ((newDataTo.weight * newDataTo.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + newDataFrom.amount + " (" + ((newDataFrom.weight * newDataFrom.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ')
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ')
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
' + item.amount + " (" + ((item.weight * item.amount) / 1000).toFixed(1) + ")
- Player Inventory
-
+ Player Inventory
+ 0
+
-
-
+
+
+
-
-
-
+
Pistol | 9mm
This is a water gun yaay ...
Serial Number 12345678
Durability
-
Attachments
-
-
-
-
-
-
-
-
+
+
-
+ 