🛠️Config File

This will help you configure the script.

You can find it in the html folder

1. Loading Page Configuration

The loadingPage variable defines the elements displayed on the loading page of the server.

loadingPage = {
  tittle: 'Welcome to RP Fivem',
  description: `      
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis, impedit
  corporis! Necessitatibus alias quam quas itaque, accusamus sunt
  quaerat similique animi sequi deleniti distinctio quis ipsam laborum
  ea suscipit at.`,
  text: 'Loading'
}

• tittle: The title displayed on the loading page.

• description: A placeholder text serving as a welcome message.

• text: The loading status text.

2. Rules URL Configuration

The rulesUrl variable provides the link to the server rules PDF document.

But you can add any URL or just use a local file because it uses an iframe, so it will display any page. However, you should be careful as this can be exploited by hackers. I really recommend you just use a PDF.

rulesUrl = 'https://pdfobject.com/pdf/sample.pdf#toolbar=0&navpanes=0&scrollbar=0&view=Fit'

This link is configured to:

• Hide the toolbar.

• Disable navigation panes.

• Hide the scrollbar.

• Fit the document to the view.

3. Help Information Configuration

The helpinfo variable contains instructions on how to navigate through the rules document.

javascriptCopiar códigoconst helpinfo = {
  rules: {
    title: 'Help - Rules',
    text: `
    To navigate through the regulations:<br>
    Use the mouse wheel to scroll up or down the page, you can also use the keyboard arrows to do so.<br>
    Keyboard arrows:<br>
    Up/Down: Scrolls up and down just like with the mouse wheel.<br>
    Left/Right/Space: Jumps from one page to another.<br>
    CTRL + Mouse wheel: Zooms in within the PDF.<br>
`
  },

  openIcon: 'fa-solid fa-question',
  closeIcon: 'fa-solid fa-xmark'
}

• rules.title: Title for the help section.

• rules.text: Detailed instructions for scrolling and zooming in the PDF.

• openIcon: Icon to open the help section.

• closeIcon: Icon to close the help section.

4. Social Media Configuration

The socialsConfig variable is a list of configurations for social media links.

javascriptCopiar códigoconst socialsConfig = [
  {
    name: 'Twitter',
    link: 'https://twitter.com/RPserver',
    icon: 'fa-brands fa-x-twitter'
  },
  {
    name: 'Discord',
    link: 'https://discord.gg/RPserver',
    icon: 'fa-brands fa-discord'
  },
  {
    name: 'Twitch',
    link: 'https://twitch.tv/RPserver',
    icon: 'fa-brands fa-twitch'
  },
  {
    name: 'YouTube',
    link: 'https://youtube.com/RPserver',
    icon: 'fa-brands fa-youtube'
  },
  {
    name: 'Instagram',
    link: 'https://instagram.com/RPserver',
    icon: 'fa-brands fa-instagram'
  },
  {
    name: 'Website',
    link: 'https://RPserver.github.io',
    icon: 'fa-solid fa-globe'
  }
]

Each entry includes:

• name: The name of the social media platform.

• link: The URL to the social media account.

• icon: The FontAwesome icon for the platform.

5. Commands and Keys Configuration

The commandsAndKeys variable defines the server commands and keys.

commandsAndKeys = {
  commands: [
    {
      name: 'ExampleCommand',
      description:
        'This command is an example and this is an example description'
    },
    {
      name: 'ExampleCommand2',
      description:
        'This command is an example and this is an example description'
    }
  ],
  keys: [
    {
      name: 'F1',
      description: 'This is an example key description'
    },
    {
      name: 'F2',
      description: 'This is an example key description'
    }
  ]
}

• commands: A list of server commands, each with a name and description.

• keys: A list of keys, each with a name and description of its function.

6. Button Configuration

The buttonConfig variable defines the configuration for various buttons in the interface.

buttonConfig = [
  {
    id: 'playButton',
    title: 'Play',
    description: `Click to play, remember that we have our own virtual currency with which you can buy a variety of things on the server, including more character slots that will allow you to have more than one character at a time.`,
    icon: 'fa-solid fa-play buttonicons'
  },
  {
    id: 'rulesButton',
    title: 'Rules',

    icon: 'fa-solid fa-scroll buttonicons'
  },
  {
    id: 'commandsButton',
    title: 'Commands & Keys',

    icon: 'fa-solid fa-keyboard buttonicons'
  },
  {
    id: 'infoButton',
    title: 'Player',
    charInfo: {
      name: {
        title: 'Name:',
        icon: 'fa-solid fa-user buttonicons'
      },
      coins: {
        title: 'Coins:',
        icon: 'fa-sharp fa-solid fa-coins buttonicons'
      },
      characters: {
        title: 'Characters:',
        icon: 'fa-solid fa-masks-theater buttonicons'
      }
    },
    icon: 'fa-solid fa-user-alien buttonicons'
  }
]

• playButton: Button to start playing, with a description of the virtual currency and character slots.

• rulesButton: Button to view the rules, with a scroll icon.

• commandsButton: Button to view commands and keys, with a keyboard icon.

• infoButton: Button for player information, including name, coins, and characters, with various representative icons.