Game Catalog Management

Overview

The Game Catalog is a centralized master list of games available across all companies. It provides:

Consistent game names across companies
Official game platform links
Auto-fill functionality when adding games to companies
Dropdown options in the game credential editor

The catalog is independent from company game assignments. Modifying the catalog does NOT affect existing games already added to companies.

Accessing the Catalog

The catalog is accessed via the 📋 Catálogo button in the navbar.

Click Catalog Button

Located in the top navbar next to the theme toggle and Edit button.

Authenticate

A password modal appears asking for the admin password (superctrl2023).

operapedia/app.js

const password = await showPasswordModal(
  'Gestión de Catálogo',
  'Ingresa la contraseña de administrador:'
);

if (password !== ADMIN_PASSWORD) {
  showToast('Contraseña incorrecta');
  return;
}

Catalog Modal Opens

The modal displays the full catalog with editable fields:

Order number (for sorting)
Game name
Official link URL

Catalog Data Structure

Games are stored in Firebase at gameCatalog/:

gameCatalog/
  0/
    id: 1
    name: "Aviator"
    link: "https://game-platform.com/aviator"
  1/
    id: 2
    name: "JetX"
    link: "https://game-platform.com/jetx"
  ...

Each game has:

id: Unique numeric identifier
name: Display name of the game
link: Official game platform URL

Managing the Catalog

Adding New Games

Click Add Game Button

Click + Agregar juego al catálogo at the bottom of the catalog modal.

Fill in Game Details

A new empty row appears with three fields:

Order #: Auto-incremented (editable)
Name: Enter the official game name
Link: Enter the complete game platform URL

Save Catalog

Click Guardar catálogo to persist all changes to Firebase.

Editing Existing Games

All fields in the catalog are editable:

Name: Click to edit the game name
Link: Click to edit the URL
Order: Change the sort order

Changes are highlighted until saved.

Deleting Games

Click Delete Icon

Each game row has a ✕ delete button on the right.

Confirm Deletion

A confirmation modal appears showing the game name:

operapedia/app.js

const confirmed = await showConfirmModal(
  'Eliminar juego',
  `¿Estás seguro de eliminar "${gameName}" del catálogo?`,
  'Eliminar',
  'Cancelar'
);

Save Catalog

After confirming, click Guardar catálogo to persist the deletion.

Deleting a game from the catalog does NOT remove it from companies that already use it. It only removes it from the dropdown when adding new games.

Catalog Usage in Companies

When adding a game to a company’s credentials:

In edit mode on the Credenciales tab, click the add game card
A dropdown selector shows all catalog games
Select a game from the list
The link field auto-fills with the catalog’s official URL
Enter the username manually
Save the game to the company

Custom Games (Not in Catalog)

If a game isn’t in the catalog:

Select “✏️ Otro” from the dropdown
Manually enter:
- Game name
- Username
- Link
Save to company

Add frequently used games to the catalog to save time and ensure consistent URLs across companies.

Bulk Loading: Seed Catalog

For initial setup, Operapedia includes a bulk seed utility.

seed-catalog.html

This standalone HTML file (~/workspace/source/operapedia/seed-catalog.html) can load the entire catalog in one operation:

Open Seed Page

Navigate to /operapedia/seed-catalog.html in your browser.

Review Game List

The page contains a hardcoded array of 74 games with names and links.

Click Upload Button

Click Subir catálogo to push all games to Firebase at once.

Verify Upload

Check the catalog modal in Operapedia to confirm all games were loaded.

The seed utility is typically used once during initial setup. After that, use the catalog modal for individual additions/edits.

Firebase Integration

The catalog uses Firebase Realtime Database with the modular SDK:

Loading Catalog

operapedia/app.js

if (window.gameCatalogRef && window.firebaseOnValue) {
  window.firebaseOnValue(window.gameCatalogRef, (snapshot) => {
    if (snapshot.exists()) {
      gameCatalog = [];
      snapshot.forEach(child => {
        gameCatalog.push(child.val());
      });
      gameCatalog.sort((a, b) => a.id - b.id);
    }
  });
}

Saving Catalog

operapedia/app.js

await window.firebaseSet(
  window.firebaseRef(window.db, 'gameCatalog'),
  gameCatalog
);

The catalog is loaded once on page load and cached in memory. Changes are saved back to Firebase when Guardar catálogo is clicked.

Catalog vs Company Games

Aspect	Game Catalog	Company Games
Location	`gameCatalog/`	`companies/{id}/games/`
Purpose	Master reference list	Actual credentials per company
Fields	id, name, link	id, name, username, link, active, lastModified
Independence	Changes don’t affect companies	Independent per company
Usage	Dropdown source	Credentials storage

Why Separation Matters

Link Updates: If a game platform changes domains, updating the catalog doesn’t break existing company games
Custom Games: Companies can have games not in the catalog (using “Otro” option)
Flexibility: Different companies may have different URLs for the same game (regional variants)

Search and Filtering

The catalog modal doesn’t have built-in search, but you can:

Use browser search (Ctrl+F / Cmd+F) within the modal
Sort by name or ID using the order column
Scroll through the full list (typically 74+ games)

Best Practices

Game Naming

Use official game names (check the game platform)
Maintain consistent capitalization (e.g., “JetX” not “Jetx”)
Avoid regional suffixes unless truly different games
Use English names for international games

Link Accuracy

Always use complete URLs with https://
Test links before adding to catalog
Use the official platform URL (not third-party aggregators)
Update links if platforms migrate domains

Catalog Maintenance

Periodically review and remove defunct games
Add new popular games as they launch
Fix typos immediately to prevent propagation
Document platform changes in company Notes tabs

Order Management

Keep popular games at the top (lower IDs)
Group similar games together
Maintain alphabetical order within categories
Re-number after major additions/deletions

Troubleshooting

Catalog Button Not Visible

The catalog button (📋) only appears if:

You are logged in as a supervisor
The button is enabled in the UI (not hidden by role logic)

Analista and Chats roles may not see this button.

Cannot Save Catalog Changes

If Guardar catálogo fails:

Check Firebase connection in browser console
Verify Firebase rules allow write to gameCatalog/
Ensure all game objects have id, name, and link fields
Check for duplicate IDs in the catalog

Games Not Appearing in Dropdown

Link Auto-Fill Not Working

If selecting a catalog game doesn’t fill the link:

Ensure the catalog entry has a valid link field
Check that the link field isn’t read-only or disabled
Verify JavaScript isn’t throwing errors (check console)
Try refreshing and re-entering edit mode

Migration from Data.js

Original Operapedia versions used a hardcoded data.js file. The catalog system replaced this with:

Before: Games hardcoded in operapedia/data.js
After: Games stored in Firebase at gameCatalog/
Migration: Use migration.html tool to import data.js to Firebase

The Firebase-based catalog allows:

✅ Real-time updates without code deployments
✅ Multi-user editing without merge conflicts
✅ No need to redeploy when adding games
✅ Centralized source of truth

Cashouts System

Operapedia

Administration

Overview

Accessing the Catalog

Catalog Data Structure

Managing the Catalog

Adding New Games

Editing Existing Games

Deleting Games

Catalog Usage in Companies

Custom Games (Not in Catalog)

Bulk Loading: Seed Catalog

seed-catalog.html

Firebase Integration

Loading Catalog

Saving Catalog

Catalog vs Company Games

Why Separation Matters

Search and Filtering

Best Practices

Troubleshooting

Migration from Data.js

Build docs developers (and LLMs) love

Cashouts System

Operapedia

Administration

​Overview

​Accessing the Catalog

​Catalog Data Structure

​Managing the Catalog

​Adding New Games

​Editing Existing Games

​Deleting Games

​Catalog Usage in Companies

​Dropdown Auto-Population

​Custom Games (Not in Catalog)

​Bulk Loading: Seed Catalog

​seed-catalog.html

​Firebase Integration

​Loading Catalog

​Saving Catalog

​Catalog vs Company Games

​Why Separation Matters

​Search and Filtering

​Best Practices

​Troubleshooting

​Migration from Data.js

Build docs developers (and LLMs) love

Overview

Accessing the Catalog

Catalog Data Structure

Managing the Catalog

Adding New Games

Editing Existing Games

Deleting Games

Catalog Usage in Companies

Dropdown Auto-Population

Custom Games (Not in Catalog)

Bulk Loading: Seed Catalog

seed-catalog.html

Firebase Integration

Loading Catalog

Saving Catalog

Catalog vs Company Games

Why Separation Matters

Search and Filtering

Best Practices

Troubleshooting

Migration from Data.js