About This File
RAGE Multiplayer Inventory System
A simple inventory system with plenty of features and a neat UI!
*This script does not provide a saving or loading system, that's your doing, there's a 'save' method in the inventory class where you can implement your own saving system depending on what database you're using.
*Comes in typescript & javascript version.
*The keys binded in the clientside script are temporary, you should change them based on your preference.
*Easy to use & implement.
> Will be generally maintained and updated.
Items
Down below is a list of item properties, each property has its own unique use so read it please.
type: ITEM_TYPES; //item type typeCategory: ITEM_TYPE_CATEGORY; //item category see ITEM_TYPE_CATEGORY enum in index.d.ts isPlaced: boolean; //whether item is 'placed' in clothes quality: number; //item quality level image: string; //item image hash: string; //unique item hash, also used as linked to a child item key: string; //item key which contains clothes data only (such as component id, drawable and texture) render: string; //item render image which later on can be used in CDN if you have plenty items. name: string; //item name description: string; //item description count: number; //item count, also determines whether you can split an item up weight: number; //item weight maxStack: number; //max stack determines how many items can be stacked in one slot options: string[]; //item options (to be used when you right click an item) such gender: number | null; //item gender, used on clothes whether the clothe is for female or male modelHash?: string; //prop model name or hash that will be used to create object when dropping item ammoType?: string; //ammo type that a weapon will contain ammoInClip?: number; //ammo in weapon clip amount?: number; //used for armor to contain its amount effect?: { //a feature to be developed whether the item will have an effect or not [key: string]: number; }; components?: Array<number>; //will be used for weapon attachments in future
Class Structure
The Inventory
class is the main class for managing player inventories in a game. It extends from other classes such as InventoryClothes
, QuickUse
, and InventoryItem
.
-
InventoryBase
: Base class for inventory management. It initializes the inventory structure and handles basic operations. -
InventoryItem
: ExtendsInventoryBase
and adds methods for managing individual items in the inventory. -
QuickUse
: ExtendsInventoryItem
and adds methods for managing quick-use slots. -
InventoryClothes
: ExtendsQuickUse
and adds methods for managing clothing items in the inventory.
This class provides comprehensive functionality for managing player inventories, including adding, removing, equipping, and using items.
Properties
-
items
: Contains the player's inventory items, divided into pockets and clothes. -
quickUse
: Contains items assigned to quick-use slots. -
weight
: Represents the total weight capacity of the inventory. -
equippedWeapons
: Keeps track of equipped weapons.
Constructor
- Initializes the inventory with player-specific data such as clothes, pockets, and quick-use items.
Methods
-
addItem
: Adds an item to the inventory's pockets. -
addClothingItem
: Adds a clothing item to the inventory. -
removeClothes
: Removes a clothing item from the player's character. -
loadClothes
: Loads clothing items onto the player's character. -
setClothes
: Sets clothing items on the player's character. -
reloadClothes
: Reloads clothing items onto the player's character. -
getFreeSlot
: Retrieves a free slot in the inventory pockets. -
getTotalFreeSlots
: Counts the total number of free slots in the inventory. -
getClothingIndex
: Retrieves the index of a specific clothing item type. -
resetItemData
,resetClothingItemData
,resetBackpackItemData
: Resets item data in the inventory. -
updateOnScreenPed
: Updates the player's character appearance on-screen. -
getItemModel
: Retrieves the model hash of an item type. -
getItemAndStack
,getItemsByHashName
,getItemsInCategoryByHashName
,getItemsByHashNameEx
: Methods for retrieving items by their type or category. -
getItemByUUID
: Retrieves an item by its UUID. -
hasPistolItem
,hasShotgun
,hasAssault
,hasSMG
,hasWeaponInFastSlot
: Methods for checking if the inventory contains specific weapon types. -
getActualWeight
,getWeight
,getItemsWeight
: Methods for calculating the weight of the inventory and its items. -
checkWeight
: Checks if adding a new item will exceed the weight limit. -
getFreeSlotCount
: Retrieves the count of free slots in the inventory. -
dropItem
,splitStack
,addPlayerItem
,addPlayerItemEx
,addMultipleItems
,addCountToPlayerItem
,manageFastSlots
,pickupItem
,moveItem
,openItem
,useItem
: Methods for managing inventory actions such as dropping, splitting, adding, and using items. -
deleteItemStack
,deleteItem
: Methods for deleting items from the inventory. -
checkQuickUse
: Checks if an item is in a quick-use slot.
Adding new items:
Javscript
-> Navigate to Items.module.js located inside inventory folder, there you can see a list of already added items, and you can follow the path, after adding an item there make sure the item image exists in the frontend, if it doesn't then add it and rebuild the frontend.
Typescript
-> Navigate to Items.module.ts located inside inventory folder, there you can see a list of already added items, and you can follow the path, after adding an item there make sure the item image exists in the frontend, if it doesn't then add it and rebuild the frontend.
Getting Started with Development
Install the required packages by executing `npm install`
If you're on typescript version after installing packages you can execute `npm run watch:server` to watch/build server side and `npm run watch:client` to watch/build client side, if you're on the javascript version, you don't have to do anything.
Getting started with frontend.
In your terminal navigate to the frontend folder (cd frontend)
Run frontend in development mode by executing: `npm run start`
Build the frontend (inventory ui) by executing `npm run build`
After you're done see the gifs below what to do next:
Creating package2 folder:
https://github.com/shr0x/ragemp-inventory-system/raw/main/gifs/create_package2.gif
Building Inventory UI:
https://github.com/shr0x/ragemp-inventory-system/raw/main/gifs/build_frontend.gif
Moving built files to package2:
https://github.com/shr0x/ragemp-inventory-system/raw/main/gifs/move_to_package2.gif
Edited by shrox