### Install Dependencies and Prepare Commit Hook Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Install project dependencies and prepare the commit hook. Run these commands in the root folder of the cloned txAdmin repository. ```sh # In your root folder run the following npm install npm run prepare ``` -------------------------------- ### Start Vite and Core Builder for Development Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md This workflow is for developing the core, panel, and resources. First, start the Vite development server for the panel, then in a new terminal, start the core builder. ```sh # run vite cd panel npm run dev # In a new terminal - run the builder cd core npm run dev ``` -------------------------------- ### Example: Logging Data from /car Command Source: https://github.com/citizenfx/txadmin/blob/master/docs/custom-server-log.md This example demonstrates how to integrate the txAdmin logging callback into the '/car' command script. It shows the placement of the TriggerServerEvent call within the command's handler function. ```lua RegisterCommand('car', function(source, args, rawCommand) TriggerServerEvent('txaLogger:CommandExecuted', rawCommand) -- txAdmin logging Callback local x,y,z = table.unpack(GetOffsetFromEntityInWorldCoords(PlayerPedId(), 0.0, 8.0, 0.5)) -- there is more code here, no need to edit end) ``` -------------------------------- ### Start NUI Development Server Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Navigate to the nui directory and start the Vite development server for NUI components. Use 'npm run dev' for game development mode and 'npm run browser' for browser development mode. ```sh cd nui #To run Vite on game dev mode: npm run dev #To run Vite on browser dev mode: npm run browser ``` -------------------------------- ### Clone and Compile CoreUI Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Steps to clone the CoreUI repository, install dependencies, checkout a specific version, and compile SCSS to CSS. This is useful for understanding or modifying the legacy UI's styling. ```bash git clone https://github.com/coreui/coreui-free-bootstrap-admin-template.git coreui cd coreui npm i # If you want to make sure you used the same version of CoreUI git checkout 0cb1d81a8471ff4b6eb80c41b45c61a8e2ab3ef6 # Edit your stuff and then to compile: npx node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 src/scss/style.scss src/css/style.css ``` -------------------------------- ### Example Recipe Structure Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md This YAML defines a recipe named 'PlumeESX2' with version, author, and description. It includes variables for database configuration and tasks like downloading files. ```yaml name: PlumeESX2 version: v1.2.3 author: Toybarra description: A full featured (8 jobs) and highly configurable yet lightweight ESX v2 base that can be easily extendable. variables: dbHost: localhost dbUsername: root dbPassword: "" dbName: null tasks: - action: download_file url: https://github.com/citizenfx/cfx-server-data/archive/master.zip path: ./tmp/cfx-server-data.zip - action: another_task optionA: aaaa optionB: bbbbbb ``` -------------------------------- ### Invoke Native Function Example Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Example of invoking a native function to change a name, demonstrating character encoding. ```javascript window.invokeNative('changeName', '\u{1160}\u{3164}'); ``` -------------------------------- ### Clone txAdmin Repository Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Clone the txAdmin repository to a directory outside of your fxserver installation. This is the first step in setting up the development environment. ```sh git clone https://github.com/tabarra/txAdmin ``` -------------------------------- ### D3 Time Hours Example Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Example of using d3.timeHours to get the first hour within a date range. Used for time-based filtering. ```javascript d3.timeHours(new Date(1715741829000), new Date())[0] ``` -------------------------------- ### Get Resource Runtimes Native Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md A potential new native function to retrieve runtime statistics for a specific resource. ```csharp GetResourceRuntimes(resName) ``` -------------------------------- ### Setting up a dev server on Windows with env.bat Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Configure a development server on Windows by setting default values for database connection and server ports using an env.bat file. ```batch @REM Deployer defaults set TXHOST_DEFAULT_CFXKEY=cfxk_11hIT156dX0F0ekFVsuda_fQ0ZYS set TXHOST_DEFAULT_DBHOST=127.0.0.1 set TXHOST_DEFAULT_DBPORT=3306 set TXHOST_DEFAULT_DBUSER=root set TXHOST_DEFAULT_DBPASS=4b6c3_1919_ab04df6 set TXHOST_DEFAULT_DBNAME=coolrp_dev @REM Prevent conflicting with main server set TXHOST_DATA_PATH=C:/test-server/txData set TXHOST_FXS_PORT=30125 set TXHOST_MAX_SLOTS=8 ``` -------------------------------- ### Connect to Database Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Establishes a connection to a MySQL/MariaDB server. Creates the database if `dbName` is null. Must be executed before `query_database`. ```yaml # Yes, that's just it - action: connect_database ``` -------------------------------- ### Migrate start.bat to use environment variables Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Replace an old start.bat script with a new version that utilizes environment variables for data path and port configuration. ```batch @echo off "E:/FiveM/13079//FXServer.exe" +set serverProfile "server2" +set txAdminPort "40125" pause ``` ```batch @echo off set TXHOST_DATA_PATH=E:\FiveM\txData-dev set TXHOST_TXA_PORT=40125 "E:/FiveM/13079//FXServer.exe" pause ``` -------------------------------- ### Configure FXServer Path Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Create a .env file at the root of the txAdmin project and set the TXDEV_FXSERVER_PATH variable to point to your FXServer directory. ```sh TXDEV_FXSERVER_PATH='E:/FiveM/10309/' ``` -------------------------------- ### Using an env.bat File in Windows Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Create a separate env.bat file with 'set' commands and execute it before your main server script using 'call env.bat && FXServer.exe'. ```batch call env.bat && FXServer.exe +exec server.cfg ``` -------------------------------- ### Using an env.sh File in Linux Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Create a separate env.sh file with 'export' commands and execute it before your main server script using 'source env.sh && ./run.sh'. ```shell source env.sh && ./run.sh ``` -------------------------------- ### Player Data Initialization Source: https://github.com/citizenfx/txadmin/blob/master/scripts/dev/quick_playerlist_tester.html Initializes player data for testing. Use this to populate the player input fields. ```javascript const el = (id) => document.getElementById(id); const initialData1 = { "name": "Tabarra", "ids": [ "license:9b9fc300cc65d22ad3b536175a4d15c0e4933753", "fivem:271816", "ip:0.0.0.1" ], "hwids": [ "9:0000000000000000000000000000000000000000000000000000000000000001", "9:0000000000000000000000000000000000000000000000000000000000000002", "9:0000000000000000000000000000000000000000000000000000000000000003", "9:0000000000000000000000000000000000000000000000000000000000000004", "9:0000000000000000000000000000000000000000000000000000000000000005", "9:0000000000000000000000000000000000000000000000000000000000000006" ] }; const initialData2 = { "name": "fulano", "ids": [ "license:00000000000000000000000000000000deadbeef", "fivem:123456", "ip:0.0.0.0" ], "hwids": [] }; el('player1').textContent = JSON.stringify(initialData1, null, 2); el('player2').textContent = JSON.stringify(initialData2, null, 2); ``` -------------------------------- ### Local Build and Test Command Source: https://github.com/citizenfx/txadmin/blob/master/docs/development.md Build and test the txAdmin project locally. The output of the build process will be in the dist/ folder. This command is typically used only when the GitHub Action workflow is not sufficient. ```sh npm run test --workspaces GITHUB_REF="refs/tags/v9.9.9" npm run build ``` -------------------------------- ### Ensure Directory Exists Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Creates a directory and any necessary parent directories if they do not already exist. ```yaml - action: ensure_dir path: ./resources ``` -------------------------------- ### React Rendering Visualizer Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Includes a script tag to load a React rendering visualizer library. ```html ``` -------------------------------- ### Setting GSP configuration on Docker with .env file Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Configure a Dockerized txAdmin instance for a GSP by setting environment variables for data path, database connection, account details, and provider information. ```dotenv # So txAdmin suggests the right path during setup TXHOST_DATA_PATH=/home/container # Deployer defaults TXHOST_DEFAULT_DBHOST=123.123.123 TXHOST_DEFAULT_DBPORT=3306 TXHOST_DEFAULT_DBUSER=u538241 TXHOST_DEFAULT_DBPASS=4b6c3_1919_ab04df6 TXHOST_DEFAULT_DBNAME=db538241 # Customer FiveM-linked account TXHOST_DEFAULT_ACCOUNT=tabarra:271816 # Provider details TXHOST_PROVIDER_NAME=ExampleHosting TXHOST_PROVIDER_LOGO=https://github.com/tabarra/txAdmin/raw/master/docs/banner.png ``` -------------------------------- ### Handle Scheduled Restart Event Source: https://github.com/citizenfx/txadmin/blob/master/docs/events.md This snippet shows how to subscribe to the 'txAdmin:events:scheduledRestart' event and perform actions based on the remaining time before a restart. It's useful for saving player data or performing other critical tasks before the server shuts down. ```lua ESX = nil TriggerEvent('esx:getSharedObject', function(obj) ESX = obj end) AddEventHandler('txAdmin:events:scheduledRestart', function(eventData) if eventData.secondsRemaining == 60 then CreateThread(function() Wait(45000) print("15 seconds before restart... saving all players!") ESX.SavePlayers(function() -- do something end) end) end end) ``` -------------------------------- ### Download GitHub Repository Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md This action downloads a GitHub repository to a specified destination path. If no reference is provided, the default branch is used. ```yaml - action: download_github src: esx-framework/es_extended dest: ./resources/[esx]/es_extended ``` -------------------------------- ### Check Git Diffs for Notes Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Git commands to diff the repository and highlight lines containing specific keywords like NOTE, TODO, FIXME, and !NC. ```bash # check changes git diff --unified=0 --no-color | grep '^+' | grep --color 'NOTE' git diff --unified=0 --no-color | grep '^+' | grep --color 'TODO' git diff --unified=0 --no-color | grep '^+' | grep --color 'FIXME' git diff --unified=0 --no-color | grep '^+' | grep --color '!NC' ``` -------------------------------- ### Repository Management Commands Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Commands for managing the project repository, including dependency updates and code analysis. ```bash # repo stuff npx knip npm-upgrade bunx madge --warning --circular --ts-config="core/tsconfig.json" core/index.ts ``` -------------------------------- ### Apply Playerlist Functionality Source: https://github.com/citizenfx/txadmin/blob/master/scripts/dev/quick_playerlist_tester.html Processes a playerlist from a JSON input and sends 'playerJoining' events for each player. Useful for bulk testing. ```javascript async function copyPlayerlist(){ const playerlist = JSON.parse(el('playerlistInput').value); for (const player of playerlist) { const eventData = { type: "txAdminPlayerlistEvent", event: 'playerJoining', id: player.id, player: { name: player.name, ids: [...player.identifiers, `ip:${player.endpoint}`], hwids: [], }, } try { const resp = await sendPost('event', eventData); console.log(resp); } catch (error) { console.log(eventData); console.log(error); } } console.log(playerlist.length); } ``` -------------------------------- ### txAdmin Debugging Commands Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Commands for enabling debug modes and interacting with the NUI system. ```bash # other stuff con_miniconChannels script:monitor* con_miniconChannels script:runcode +setr txAdmin-debugMode true nui_devtools mpMenu ``` -------------------------------- ### Setting Environment Variables in Windows Batch File Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Add 'set' commands to your existing .bat file before the FXServer.exe line to configure environment variables for txAdmin. ```batch set TXHOST_PORT=40120 set TXHOST_INTERFACE=127.0.0.1 set TXHOST_MAXPLAYERS=32 ./FXServer.exe +exec server.cfg ``` -------------------------------- ### Download GitHub Repository with Subpath and Reference Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Use this action to download a specific subpath of a GitHub repository using a given commit hash as a reference. The downloaded content is placed in the specified destination path. ```yaml - action: download_github src: https://github.com/citizenfx/cfx-server-data ref: 6eaa3525a6858a83546dc9c4ce621e59eae7085c subpath: resources dest: ./resources ``` -------------------------------- ### Load Variables from JSON Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Loads variables from a specified JSON file into the deployer context. ```yaml - action: load_vars src: ./toload.json ``` -------------------------------- ### Basic NUI Styling Source: https://github.com/citizenfx/txadmin/blob/master/nui/index.html Basic CSS for styling the txAdmin NUI. This is intended for in-browser development and debugging. ```css /* DEBUG: for in-browser dev only */ body { /* background-image: url("https://images.pexels.com/photos/1210276/pexels-photo-1210276.jpeg"); */ /* background-size: cover; */ } ``` -------------------------------- ### Registering Adaptive Cards Interface Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Resources can register their adaptive cards interface by adding a 'ui_cards' definition to their fxmanifest.lua. This allows for custom UI elements to be displayed in txAdmin, such as in the player info card or the main NUI tab. ```lua ui_cards 'list' { ['playerInfo'] = { title = 'RP Info', type = 'player', --show in player card }, ['generalStatsNui'] = { title = 'RP Stats', type = 'mainmenu', --show in nui main menu }, ['generalStatsWeb'] = { title = 'RP Stats', type = 'web', --show in the web panel }, } ``` -------------------------------- ### Query Database Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Executes a SQL query against the connected database. The query can be provided as a file path or a string. ```yaml # Running a query from a file - action: query_database file: ./tmp/create_tables.sql ``` ```yaml # Running a query from a string - action: query_database query: | CREATE TABLE IF NOT EXISTS `users` ( `id` int(10) unsigned NOT NULL, `name` tinytext NOT NULL ); INSERT INTO `users` (`name`) VALUES ('tabarra'); ``` -------------------------------- ### Download File Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Downloads a file from a given URL to a specified destination path. Ensure the destination path is a file name. ```yaml - action: download_file url: https://github.com/citizenfx/cfx-server-data/archive/master.zip path: ./tmp/cfx-server-data.zip ``` -------------------------------- ### Copy File or Directory Source: https://github.com/citizenfx/txadmin/blob/master/docs/recipe.md Copies a file or directory to a specified destination. Overwrites by default. Use `errorOnExist` to prevent overwriting. ```yaml - action: copy_path src: ./tmp/cfx-server-data-master/resources/ dest: ./resources ``` -------------------------------- ### txAdmin Playerlist Event Handler Source: https://github.com/citizenfx/txadmin/blob/master/scripts/dev/quick_playerlist_tester.html Handles player join and leave events. It parses player data and sends the appropriate event to txAdmin. ```javascript async function txAdminPlayerlistEvent(action, which) { const pDataString = el(`player${which}`).value; const playerId = parseInt(el('idCounter').value); let eventData; if(action === 'join'){ el('idCounter').value = playerId + 1; eventData = { type: "txAdminPlayerlistEvent", event: 'playerJoining', id: playerId, player: JSON.parse(pDataString), } }else if(action === 'leave'){ eventData = { type: "txAdminPlayerlistEvent", event: 'playerDropped', id: playerId, reason: 'tester', } }else{ throw new Error(`unknown action`); } try { const resp = await sendPost('event', eventData); console.log(resp); } catch (error) { console.log(error); } } ``` -------------------------------- ### Trigger Server Event for Command Logging Source: https://github.com/citizenfx/txadmin/blob/master/docs/custom-server-log.md Add this event call inside a client command function to log its execution. 'rawCommand' can be replaced with any string or variable containing command details. ```lua TriggerServerEvent('txaLogger:CommandExecuted', rawCommand) ``` -------------------------------- ### Check External Chart Data Source: https://github.com/citizenfx/txadmin/blob/master/docs/dev-notes.md Commands to download and check external chart data from a local server. ```bash # check external chart cdt cd web/public/ curl -o svMain.json http://localhost:40120/chartData/svMain ``` -------------------------------- ### Configure FXServer Log Rotation Source: https://github.com/citizenfx/txadmin/blob/master/docs/logs.md This JSON snippet shows how to configure the log rotation for FXServer logs. You can set the interval, maximum size, and maximum number of files to keep. ```json { //... "logger": { "fxserver": { "interval": "1d", "maxSize": "2G", //max size of rotated files to keep "maxFiles": 14 //max number of rotated files to keep } } //... } ``` -------------------------------- ### Configuring Environment Variables in Docker .env File Source: https://github.com/citizenfx/txadmin/blob/master/docs/env-config.md Define environment variables in a .env file for Docker containers. Load this file using the '--env-file' flag during 'docker run'. ```dotenv TXHOST_PORT=40120 TXHOST_INTERFACE=127.0.0.1 TXHOST_MAXPLAYERS=32 ``` -------------------------------- ### Check for txConsts in Browser Source: https://github.com/citizenfx/txadmin/blob/master/panel/index.html This snippet checks if the 'txConsts' object is available in the browser's window. If not, it displays an error message and a link to the support Discord server. ```javascript if (!window?.txConsts) { document.body.innerHTML = '
Error: window.txConsts is undefined.
This likely means you didn\'t open this page through txAdmin.
Support: discord.gg/txAdmin