Tradingcards
Frameworks: VORP
Last updated
Frameworks: VORP
Last updated
twh_tradingcards script brings a unique and immersive trading card experience to your game environment and is part of the . It allows for extensive customization and interactive features, creating an engaging card collecting and trading experience.
Key Features:
View your cards in single view: This script allows you to view cards with metadata in your inventory in a more detailed view.
Add to Collection: You can add cards to your collection and view them in a beautifully designed scrapbook.
Custom Rarity and Set Reward: The script allows you to set as many rarities as you want for each set, with each rarity having its own set of rewards. Rewards can be items, currency or weapons.
Sort Cards: Cards can be sorted by set and rarity, making it easier for you to manage and view your collection.
Customize Cards: Each card can be individually customized as per your liking. You can also remove cards from the scrapbook with a simple right-click.
Beautiful and Clean UI: The user interface has been designed to be clean and visually appealing, enhancing the overall user experience.
Remember, any further development or customization outside of the base functionality is considered as a paid service, but updates to the script itself are, of course, free of charge.
Add following line to your server.cfg or ressource.cfg:
ensure twh_tradingcards
There are 5 different important configuration files.
NUI:
html/build/data/config.json - config for card background and language selection
html/build/data/cards.json - configuration file for sets and cards (detailed documentation see below)
html/build/data/language.json - language file
Client Config:
config/config.lua - rewards, webhook, language selection
config/language.lua - language file
IMPORTANT! Some of the configuration files have to have the same values in order to work correctly. E.g. the names of Configs.rewards in
config/config.luahave to be the same as the "set" attribute inhtml/build/data/cards.json. Also the numbers for rewards for the set inconfig/config.luahas to be the exact same numbers as raritiesNumbers inhtml/build/data/cards.json, which also has to have the same amount of entries as rarities and raritiesToCSSClasses.
The Script contain multiple config files for various purposes. We now take a closer look on the cards.json. This file is used to configure the card sets and the card appearence as well as the actual card images and is found in html/build/data/cards.json.
Remember, you need to provide values based on your requirement. This JSON is highly configurable and can adapt to changes quickly. If you want to add a new card set, you can simply copy the structure and replace the values with the new set details.
This JSON file is a list of dictionaries, each representing a different card set. Here are the key fields for each card set:
set: This is the internal identifier of the card set. This helps the game engine to distinguish between different card sets.
setname: This is the name of the card set that will be displayed in the collection view.
rarities: This is a list of different rarities available for the cards in the set.
raritiesNumbers: These are numeric values representing each rarity level. The ordering of these numbers corresponds with the ordering of the rarities. So, 'common' corresponds to '1', 'uncommon' corresponds to '2', etc.
raritiesToCSSClasses: These are the names of the CSS classes used to style cards of different rarities. This list is also in the same order as 'rarities' and 'raritiesNumbers'.
cards: This is a dictionary of cards available in this set. Each card has a numeric key, which can be thought of as the card's internal identifier.
Each card in the "cards" dictionary has the following key fields:
cardname: The name of the card to be displayed in the collection view.
supertype and subtypes (for future use): Currently without function. These are classifications for the card. The supertype is the overall type, and subtypes are more specific classifications within that type.
images: This contains the path to the image file representing the card.
rarities (not to be confused with the set - rarities): This is a dictionary where each key is a rarity level, and the value is another dictionary that defines the images for the card at that rarity level. Here you can define how each card should look like in this rarity level.
Within each card, there is also a rarities section. This section specifies the different types of images that will be used based on the rarity of the card. Here you can set individual overlay images and special mask and foil images for each card rarity level.
Let's take a closer look at one of the cards in the "cities" set:
This card is called "Valentine" and it's a basic trading card. Its main image can be found at img/set-cities-valentine.png. Depending on its rarity, it has different overlay images (for example, img/common1.png - which is a semi-transparent "dirt" overlay - for common cards and img/signature_rr_1.png - which is a transparent layer with a signature - for rare cards). If it's an ultra-rare card, a special mask image (../../img/ultrarare_mask.png) will be used instead of an overlay.
img/common1.png
img/signature_rr_1.png
Before adding a new set, let's understand the structure of a set:
set: It's the identification code for the set. This must be unique. Player will never see this.
setname: It's the name of the set as it will be displayed in the collection and seen by players.
rarities: It's an array of different rarities that a card can have. These are the rarity identifies as used in e.g. language files to translate them. If you dont need more, keep them as some styles in the UI are hard coded to these names. If you need more or less rarity levels per set, just remove them. Make sure to also remove them from the next two variables as they have to be in sync.
raritiesNumbers: It's an array of numbers representing each rarity level. When removing or adding new rarity levels you need to sync it with rarities and raritiesToCSSClasses
raritiesToCSSClasses: It's an array of classes related to each rarity level. There is a fixed amount of different classes that you can use here. The available classes are: "Common", "Uncommon", "Rare Secret", "Rare Holo", "Rare Holo Cosmos", "Radiant Rare", "trainer gallery rare holo", "Rare Holo V", "Rare Rainbow", "Rare Holo VMAX", "Rare Holo VSTAR", "Amazing Rare", "Rare Shiny"
cards: It's an object that contains different cards. Each card has its properties such as cardname, supertype, subtypes, images, and rarities.
To add a new set, add a new object at the end of the JSON array:
Inside the cards object, we can add our new cards. Each card is a new object inside cards with a unique identification code:
Each card can have different rarities. Each rarity is represented by a new object inside rarities with a unique identification number. You just have to define individual rarities per card if you want the card rarity level to have a different overlay or mask or foil.
You could use more cards, but the UI is optimized for 5 cards per set. More rarities are possible but you may also encounter problems when using much more because of UI limitations.
After adding your set, cards, and rarities, save the changes. Make sure the JSON structure is valid. Errors in you cards.json can have also impact on other scripts, as twh_boosterpacks and twh_tradingcardUpgrades are also using this file.
And that's it! You have added a new set of cards to the JSON file. The same procedure can be used to add more cards to the existing sets, just make sure the cards ID and rarities ID you are using are unique.
In the following section we will talk about more advanced options and customizations you can do with the cards config in twh_tradingcards.
We also offer payed service to create your mask and foil images for you cards. You can only pick from the available styles, but we can personalize it with your custom logo other other geometrical elements. Just open a ticket on our Discord and we can talk about your personalizations.
The rarities object has multiple inner objects numbered from 1 to 5. These numbers match the raritiesNumbers from the card set.
Each number object contains an images object that describes the images associated with the card's rarity. There are different types of images: large, overlay, mask, and foil. Not every card contains all these image types.
Here's what each one means:
large: Path to the main image of the card. In most cases, this image is the same for every rarity level.
overlay: Path to an image that is displayed on top of the main image, giving it a visual representation of its rarity.
mask: Path to an image that is used as a mask for the main image to make some areas not affected by the foil or the effect. Can also used to make the effects less dominant (opacity).
foil: Path to a foil texture that can extra effects on cards.
Making use of the shiny / holo card effect to make a card even more individual can be easily done with a mix of a mask and foil texture. Here are some examples to show you what they do.
When not using a mask or foil, some effects are applying a default foil onto it.
A mask will remove the shiny or holo effect from parts of the map or reduces the effect.
The base effects are from a Pokemon project, so the effects are the same as known from the Pokemon trading cards game. "Common", "Uncommon", "Rare Secret", "Radiant Rare", "Rare Holo V", "Rare Holo VMAX", "Rare Holo VSTAR", "Rare Rainbow", "Amazing Rare"
We also offer payed service to slightly change effects e.g. colors. Just open a ticket on our Discord and we can talk about your individual whishes.
Common and Uncommon are "normal" cards without any effect. Best used for overlay effects which makes them "dirty".
This software includes code licensed under the GNU General Public License (GPL). The full text of the license can be found in the LICENSE file included within the GPL parts of the software.
