> For the complete documentation index, see [llms.txt](https://theobsidianstudio-1.gitbook.io/theobsidianstudio-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://theobsidianstudio-1.gitbook.io/theobsidianstudio-docs/assets/obs_loadingscreen/configuration-guide.md).

# CONFIGURATION GUIDE

All configurations are located in `script/config.js`. Below is the complete breakdown of every feature available in version 1.0.2.

{% hint style="warning" %}
**Important:** If you rename the resource folder, you **MUST** update `general.resourceName` in the config to match your new folder name EXACTLY, otherwise the script will not load.
{% endhint %}

***

### 🎨 1. General & Performance

```javascript
general: {
    serverName: "OBSIDIAN",
    logoUrl: "img/logo.png",
    loadingText: "Loading",
    defaultTheme: "red",
    resourceName: "obs_loadingscreen",
    
    // Performance Mode: "normal" | "low_end"
    // "low_end" aggressively disables shadows, blurs, and canvas animations for potato PCs.
    performanceMode: "normal",
}
```

### 🖼️ 2. Backgrounds

```javascript
background: {
    type: "video", // Choose: "video" | "image" | "color" | "slideshow" | "youtube"

    // YouTube Settings
    youtubeVideoId: "jfKfPfyJRdk", // Example: lofi hip hop radio
    youtubeMute: true,
    
    // Local Settings
    localVideoUrl: "video/obs_demo.mp4",
    imageUrl: "img/background.png",
    color: "#ff0040",
    
    // Effects
    opacity: 0.3,
    blur: "2px",

    // Slideshow Settings
    slideshow: {
        images: ["img/background.png", "img/gallery1.png"],
        interval: 6000,
        transition: 1200,
    },
}
```

### ✨ 3. Visual Effects

```javascript
orbs: {
    enabled: true,
    count: 25,        // Reduced for better performance
    speed: 0.2,       // Movement speed
    minSize: 1, 
    maxSize: 3,
    color: null,      // Follows theme color automatically if null
},
decoLine: {
    enabled: true,
    width: "3px",
    color: null,
    shimmerSpeed: "fast", // "slow" | "normal" | "fast"
}
```

### 👋 4. Welcome & Socials

```javascript
welcome: {
    title: "WELCOME TO OBSIDIAN STUDIO",
    description: "Your immersive storytelling begins here...",
    showStarDividers: true,
    starCharacter: "✦",
    titleGlow: "#670ad1",
},
social: {
    showLabel: true,
    labelText: "OUR SOCIAL NETWORKS",
    underlineHover: true,
    links: [
        { name: "RULES", url: "https://discord.gg/...", icon: "img/site-logo.svg", color: "#5865F2" },
    ],
}
```

### 💬 5. Discord Integration

```javascript
discordBoxes: {
    enabled: true,
    count: 3,
    showMemberCount: true,
    fakeMemberCount: 254, // ⚠️ Fallback if API is blocked by FiveM
    discordGuildId: "",   // Add your Guild ID here to fetch real live count
    boxes: [
        { label: "Discord", inviteLink: "https://discord.gg/...", buttonText: "CONNECT →", icon: "img/discord-logo.svg", showCount: true },
    ],
}
```

### 👥 6. Team Roster

```javascript
team: {
    title: "TEAM",
    members: [
        {
            name: "Noway", 
            role: "Owner", 
            image: "img/member1.jpg", 
            discordId: "936982480005771365",
            social: { discord: "...", twitter: "..." },
        },
    ],
    cardStyle: { width: "16vw", height: "auto", borderRadius: "0.8vw", borderColor: "#820ad1", hoverEffect: true },
}
```

### 🛒 7. Server Store / VIP Packages

Monetize your server directly from the loading screen by displaying your Tebex packages.

```javascript
store: {
    title: "SERVER STORE",
    description: "Support the server by purchasing VIP packages. All funds go directly towards server costs.",
    packages: [
        {
            name: "VIP Bronze", 
            price: "$10.00", 
            color: "#cd7f32",
            perks: ["Priority Queue", "Custom Discord Role", "Weekly Reward"],
            link: "https://yourstore.tebex.io/"
        },
    ]
}
```

### 📅 8. Events & Announcements

Keep your community updated on upcoming wipes, car meets, and roleplay events.

```javascript
events: {
    title: "LIVE EVENTS",
    eventsList: [
        {
            title: "Server Wipe & Season 2 Launch",
            date: "Next Friday @ 8PM EST",
            description: "Get ready for a fresh start! New economy, new cars, and new gangs.",
            image: "img/gallery1.png"
        },
    ]
}
```

### 🎮 9. Snake Minigame

Give your players something fun to do while downloading server assets.

```javascript
minigame: {
    enabled: true,
    tooltip: "Play Snake",
    position: "top-left",
    style: { size: "44px", backgroundColor: "rgba(0,0,0,0.6)", borderColor: "#820ad1", iconColor: "#ffffff" }
}
```

### 🎵 10. Music Player & Visualizer

```javascript
music: {
    enabled: true,
    autoplay: false, // ⚠️ Keep false to prevent audio freezing on initial load!
    defaultOpen: true,
    defaultVolume: 0.7,
    playlist: [
        { label: "Lie 2 You", author: "Dylan Emmet", src: "audio/music1.mp3", cover: "img/music.jpg" },
    ],
    visualizer: { 
        enabled: true, 
        barCount: 16, 
        color: null 
    },
}
```

### ⚖️ 11. Server Rules Modal

Force players to agree to your server rules before they can close the UI.

```javascript
rules: {
    enabled: true,
    rememberAccepted: true, // Only shows once per player (saved to their cache)
    storageKey: "obsidian_rules_accepted",
    title: "SERVER RULES",
    subtitle: "Please read carefully before entering",
    agreeText: "I have read and agree to the server rules",
    buttonText: "ENTER SERVER",
    rules: [
        "Respect all players and staff at all times.",
        "No hacking, cheating, or exploiting game bugs.",
    ],
}
```

### 📊 12. Server Status & Uptime

```javascript
status: {
    title: "SERVER STATUS",
    server: {
        maxPlayers: 64,
        ip: "play.yourserver.com:30120", // ⚠️ REQUIRED for uptime check!
        version: "v1.0.0",
    },
    services: [
        { name: "Main Gameserver", online: true },
        { name: "Database", online: true },
    ],
}
```

### 📝 13. Changelogs

```javascript
changelogs: {
    title: "CHANGELOGS",
    showVersions: true,
    showTypes: true,
    showDates: true,
    usePlusPrefix: true,
    entries: [
        {
            date: "15/06/2026",
            version: "v1.0.2",
            type: "update",
            title: "UI & PERFORMANCE TWEAKS",
            description: "Removed audio unlock hint from the music player and adjusted loading screen optimization settings.",
        },
    ],
}
```

### ⌨️ 14. Keybinds

```javascript
keybinds: {
    title: "KEYBINDS",
    showKeyboard: true,
    highlightColor: "#a235e8",
    categories: [
        {
            name: "General",
            binds: [
                { key: "F1", function: "Phone", description: "Opens your phone" },
                { key: "F2", function: "Inventory", description: "Opens your inventory" },
            ],
        },
    ],
}
```

### 🖼️ 15. Gallery / Image Viewer

```javascript
gallery: {
    enabled: true,
    buttonIcon: "img/camera-icon.png",
    images: [
        { label: "Main City", src: "img/gallery1.png" },
        { label: "Police HQ", src: "img/gallery2.png" },
    ],
}
```

### 💡 16. Hint System

```javascript
hints: {
    enabled: true,
    interval: 10000,
    displayTime: 5000,
    messages: [
        "💡 Press the three lines in the corner to toggle the UI!",
        "💡 Press F2 to open your inventory.",
    ],
    style: { backgroundColor: "rgba(0,0,0,0.8)", textColor: "#ffffff", borderColor: "#820ad1", borderRadius: "0.4vw" },
}
```

### 📊 17. Loading Bar

```javascript
loadingBar: {
    style: "vertical",        // "vertical" | "horizontal"
    position: "right",        // "right" | "left"
    backgroundColor: "rgba(255,255,255,0.1)",
    progressColor: "linear-gradient(to bottom, var(--primary-color), var(--secondary-color))",
    width: "0.2vw",
    height: "15vw",
    showPercentage: true,
},
advancedLoading: {
    enabled: true,
    textColor: "rgba(255, 255, 255, 0.7)",
    fontSize: "0.6vw",
}
```

### 🎨 18. Settings & Themes

Allow players to change the loading screen colors locally.

```javascript
settings: {
    allowThemeChange: true,
    themes: {
        purple: { name: "Default Purple", primary: "#820ad1", secondary: "#a235e8" },
        dark: { name: "Dark Mode", primary: "#333333", secondary: "#555555" },
        blue: { name: "Ocean Blue", primary: "#0066cc", secondary: "#0099ff" },
    },
}
```

### 🧭 19. Navigation Menu & Buttons

```javascript
navigation: {
    items: [
        { label: "HOME", section: "home", enabled: true },
        { label: "STORE", section: "store", enabled: true },
        { label: "CHANGELOGS", section: "changelogs", enabled: true },
    ],
    buttonStyle: { backgroundColor: "#820ad1", hoverColor: "#a235e8", textColor: "#ffffff", padding: "0.4vw 1.5vw" },
},

overlayToggle: {
    enabled: true,                     
    position: "top-right",             
    style: { size: "44px", backgroundColor: "rgba(0,0,0,0.6)", borderColor: "#820ad1", iconColor: "#ffffff" },
    tooltip: "Toggle UI",
},

cameraButton: {
    enabled: true,
    position: "top-right",
    offset: "74px",
    style: { size: "44px", backgroundColor: "rgba(0,0,0,0.6)", borderColor: "#820ad1" },
}
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://theobsidianstudio-1.gitbook.io/theobsidianstudio-docs/assets/obs_loadingscreen/configuration-guide.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.