Unofficial IBJJF Elo Ratings

https://github.com/weisserw/ibjjf-elo
Admin
A web application that tracks matches in IBJJF tournaments and ranks athletes using the Elo rating...
Tokens:15,532
Snippets:133
Trust Score:3.8
License:MIT
Update:4 months ago
Show doc for...
Tokens:
Raw
### Install NPM packages and run Vite dev server

Source: https://github.com/weisserw/ibjjf-elo/blob/main/README.md

Installs NPM packages and starts the Vite development server for the frontend.

```bash
/app/frontend $ npm install
/app/frontend $ npm run dev
```

--------------------------------

### Install Python packages

Source: https://github.com/weisserw/ibjjf-elo/blob/main/README.md

Installs Python packages, assuming a virtual environment is already created.

```bash
$ pip install -r requirements.txt
```

--------------------------------

### ESLint Configuration with React Plugin

Source: https://github.com/weisserw/ibjjf-elo/blob/main/app/frontend/README.md

Example of integrating the eslint-plugin-react into the ESLint configuration, including setting the React version and enabling recommended rules.

```javascript
// eslint.config.js
import react from 'eslint-plugin-react'

export default tseslint.config({
  // Set the react version
  settings: { react: { version: '18.3' } },
  plugins: {
    // Add the react plugin
    react,
  },
  rules: {
    // other rules...
    // Enable its recommended rules
    ...react.configs.recommended.rules,
    ...react.configs['jsx-runtime'].rules,
  },
})
```

--------------------------------

### TypeScript ESLint Configuration for Type-Aware Linting

Source: https://github.com/weisserw/ibjjf-elo/blob/main/app/frontend/README.md

Example of configuring ESLint with TypeScript for type-aware lint rules, including setting parserOptions and tsconfig paths.

```javascript
export default tseslint.config({
  languageOptions: {
    // other options...
    parserOptions: {
      project: ['./tsconfig.node.json', './tsconfig.app.json'],
      tsconfigRootDir: import.meta.dirname,
    },
  },
})
```

--------------------------------

### Python test for bracket slots

Source: https://github.com/weisserw/ibjjf-elo/blob/main/docs/BRACKET_LAYOUT_REVERSE_ENGINEERING.md

An example of an exact regression test to ensure bracket slots match IBJJF visual order.

```python
def test_nXX_slots_match_ibjjf_visual_order(self):
    slots, size = _bracket_slots(XX)
    self.assertEqual(slots, [...])
    self.assertEqual(size, POWER_OF_TWO)
```

--------------------------------

### Run Python unit tests

Source: https://github.com/weisserw/ibjjf-elo/blob/main/AGENTS.md

Command to run Python unit tests from the repository root.

```bash
make test
```

--------------------------------

### Command to run tests

Source: https://github.com/weisserw/ibjjf-elo/blob/main/docs/BRACKET_LAYOUT_REVERSE_ENGINEERING.md

Command to run tests, ensuring the correct Python environment (pyenv) is used.

```bash
env PATH=/Users/will/.pyenv/shims:/opt/homebrew/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin make test
```

--------------------------------

### JavaScript for Date Formatting

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_index.html

Client-side JavaScript to format ISO timestamps into a more human-readable format (Month Day Year Hour:MinuteAM/PM).

```javascript
(function () { function formatTimestamp(iso) { if (!iso) return ''; const utcIso = /\p{Z}|[+-]\d{2}:\d{2}$/.test(iso) ? iso : `${iso}Z`; const date = new Date(utcIso); if (Number.isNaN(date.getTime())) return ''; const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; const month = months[date.getMonth()]; const day = date.getDate(); const year = date.getFullYear(); let hours = date.getHours(); const minutes = String(date.getMinutes()).padStart(2, '0'); const ampm = hours >= 12 ? 'PM' : 'AM'; hours = hours % 12; if (hours === 0) hours = 12; return `${month} ${day} ${year} ${hours}:${minutes}${ampm}`; } const elements = document.querySelectorAll('.local-datetime[data-iso]'); elements.forEach((el) => { const value = formatTimestamp(el.dataset.iso || ''); if (value) { el.textContent = value; } }); })();
```

--------------------------------

### Frontend Build Command

Source: https://github.com/weisserw/ibjjf-elo/blob/main/AGENTS.md

Command to trigger a frontend build in the app/frontend directory, which rewrites SEO snippet files.

```bash
npm run build
```

--------------------------------

### Task Detail Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/task_detail.html

The main HTML template for displaying task details, including Jinja2 templating for dynamic content and conditional rendering.

```html
{% extends "base.html" %} {% block title %}Task Log{% endblock %} {% block content %}

{% if not task %}

Task not found.

{% else %}

Task Log
========

[Back to Logs]({{ url_for('tasks_index') }})

{% if not task.started_at %} {% else %} {% endif %} {% if task.finished_at or task.status in ['success', 'error', 'cancelled', 'manual'] %} {% endif %}

Type

{{ task.task_type }}

Status

{% if task.status == 'success' %} success {% elif task.status == 'error' %} error{% if task.exit_code is not none %} (code {{ task.exit_code }}){% endif %} {% elif task.status == 'cancelled' %} cancelled {% elif task.status == 'manual' %} finished (manual) {% else %} {{ task.status }} {% endif %}

Created

{{ task.created_at.strftime('%b %d %Y %I:%M%p')|replace(' 0', ' ') if task.created_at else '' }}

Started

{{ task.started_at.strftime('%b %d %Y %I:%M%p')|replace(' 0', ' ') if task.started_at else '' }}

Finished

{{ task.finished_at.strftime('%b %d %Y %I:%M%p')|replace(' 0', ' ') if task.finished_at else '' }}

{% if params %} Parameters {% for key, value in params.items() %} {% endfor %}

{{ key }}

{{ value }}

{% endif %} {% if task.status in ['queued', 'running'] %}

Cancel Task

Mark Finished

{% endif %}

Log Output
----------

{{ task.log_text or '' }}

{% endif %}

{% if task %} (function () { const logEl = document.getElementById('task-log'); const statusEl = document.getElementById('task-status'); const createdEl = document.getElementById('task-created'); const startedEl = document.getElementById('task-started'); const finishedEl = document.getElementById('task-finished'); const finishedLabelEl = document.getElementById('task-finished-label'); let lastLog = logEl ? logEl.textContent : ''; function formatTimestamp(iso) { if (!iso) return ''; const utcIso = /[\[zZ\]]|[\[+-\]]\d{2}:\d{2}$/.test(iso) ? iso : `${iso}Z`; const date = new Date(utcIso); if (Number.isNaN(date.getTime())) return ''; const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; const month = months[date.getMonth()]; const day = date.getDate(); const year = date.getFullYear(); let hours = date.getHours(); const minutes = String(date.getMinutes()).padStart(2, '0'); const ampm = hours >= 12 ? 'PM' : 'AM'; hours = hours % 12; if (hours === 0) hours = 12; return `${month} ${day} ${year} ${hours}:${minutes}${ampm}`; } const localDateEls = document.querySelectorAll('.local-datetime[data-iso]'); localDateEls.forEach((el) => { const value = formatTimestamp(el.dataset.iso || ''); if (value) { el.textContent = value; } }); function statusLabel(status, exitCode) { if (status === 'success') return 'success'; if (status === 'error') return `error${exitCode !== null ? ' (code ' + exitCode + ')' : ''}`; if (status === 'cancelled') return 'cancelled'; if (status === 'manual') return 'finished (manual)'; return status || ''; } function updateMetadata(data) { if (statusEl) statusEl.textContent = statusLabel(data.status, data.exit_code); const created = formatTimestamp(data.created_at); const started = formatTimestamp(data.started_at); const finished = formatTimestamp(data.finished_at); if (startedEl) { startedEl.textContent = started; } else if (createdEl) { createdEl.textContent = created; } const isDone = data.status && !['queued', 'running'].includes(data.status); if (isDone) { if (finishedLabelEl && finishedLabelEl.style.display === 'none') { finishedLabelEl.style.display = ''; } if (finishedEl) { finishedEl.style.display = ''; finishedEl.textContent = finished; } } else { if (finishedLabelEl) finishedLabelEl.style.display = 'none'; if (finishedEl) finishedEl.style.display = 'none'; } } function updateLog(text) { if (!logEl) return; if (text !== lastLog) { logEl.textContent = text; lastLog = text; logEl.parentElement.scrollTop = logEl.parentElement.scrollHeight; } } function poll() { fetch('{{ url_for("task_status", task_id=task.id) }}') .then((resp) => resp.json()) .then((data) => { if (!data || data.error) { return; } updateMetadata(data); updateLog(data.log_text || ''); if (data.status && !['queued', 'running'].includes(data.status)) { clearInterval(timer); } }) .catch(() => {}); } const timer = setInterval(poll, 1000); poll(); })(); {% endif %} {% endblock %}
```

--------------------------------

### Run database migrations

Source: https://github.com/weisserw/ibjjf-elo/blob/main/README.md

Runs database migrations using Flask-Migrate. Creates a SQLite database in app/instance/app.db.

```bash
/app $ flask db upgrade
```

--------------------------------

### Task List Rendering (Jinja2)

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_index.html

This snippet shows how tasks are iterated and displayed, including their creation time, event, type, status, and a link to view details. It also includes logic for displaying status and cancellation options.

```html
{% for task in tasks %} {% else %} {% endfor %}

Created

Event

Type

Status

Log

{{ task.created_at.strftime('%b %d %Y %I:%M%p')|replace(' 0', ' ') if task.created_at else '' }}

{{ task_event_names.get(task.id) or '' }}

{{ task.task_type }}

{% if task.status == 'success' %} success {% elif task.status == 'error' %} error{% if task.exit_code is not none %} (code {{ task.exit_code }}){% endif %} {% elif task.status == 'cancelled' %} cancelled {% elif task.status == 'manual' %} finished (manual) {% else %} {{ task.status }} {% endif %}

[View]({{ url_for('task_detail', task_id=task.id) }})

{% if task.status in ['queued', 'running'] %}

Cancel

{% endif %}
```

--------------------------------

### JavaScript for dynamic form population and validation

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_import.html

This script dynamically populates the tournament selection dropdown, auto-fills tournament ID and name, and sets the Gi/No-Gi mode based on the tournament name. It also includes a confirmation dialog for potential Gi/No-Gi mismatches.

```javascript
(function () {
    const form = document.querySelector('form');
    if (!form) {
        return;
    }
    const select = document.getElementById('bjjcompsystem_tournament');
    const nameInput = form.querySelector('input[name="tournament_name"]');
    const idInput = form.querySelector('input[name="tournament_id"]');
    const giInputs = form.querySelectorAll('input[name="gi_mode"]');

    function isNoGiName(name) {
        const lower = name.toLowerCase();
        return (
            lower.includes('no gi') ||
            lower.includes('no-gi') ||
            lower.includes('sem kimono')
        );
    }

    function getGiMode() {
        for (const input of giInputs) {
            if (input.checked) {
                return input.value;
            }
        }
        return 'gi';
    }

    function setGiMode(value) {
        for (const input of giInputs) {
            if (input.value === value) {
                input.checked = true;
            }
        }
    }

    function populateSelect(tournaments) {
        if (!select) {
            return;
        }
        select.innerHTML = '';
        const placeholder = document.createElement('option');
        placeholder.value = '';
        placeholder.textContent = 'Select a tournament...';
        select.appendChild(placeholder);
        tournaments.forEach((t) => {
            const option = document.createElement('option');
            option.value = t.id;
            option.textContent = t.name;
            select.appendChild(option);
        });
    }

    function loadTournaments() {
        if (!select) {
            return;
        }
        fetch('{{ url_for("bjjcompsystem_tournaments") }}')
            .then((resp) => resp.json())
            .then((data) => {
                if (!data || !Array.isArray(data.tournaments)) {
                    throw new Error('Invalid response');
                }
                populateSelect(data.tournaments);
            })
            .catch(() => {
                select.innerHTML = '';
                const option = document.createElement('option');
                option.value = '';
                option.textContent = 'Unable to load tournaments';
                select.appendChild(option);
            });
    }

    if (select) {
        select.addEventListener('change', function () {
            const selectedOption = select.options[select.selectedIndex];
            if (!selectedOption || !selectedOption.value) {
                return;
            }
            if (idInput) {
                idInput.value = selectedOption.value;
            }
            if (nameInput) {
                nameInput.value = selectedOption.textContent.trim();
            }
            const nameIsNoGi = isNoGiName(selectedOption.textContent || '');
            setGiMode(nameIsNoGi ? 'nogi' : 'gi');
        });
    }

    loadTournaments();

    form.addEventListener('submit', function (event) {
        const name = nameInput ? nameInput.value.trim() : '';
        if (!name) {
            return;
        }
        const nameIsNoGi = isNoGiName(name);
        const giMode = getGiMode();

        if (nameIsNoGi && giMode === 'gi') {
            const ok = window.confirm(
                'This tournament name indicates it is no-gi, but you are importing it as gi. Continue?'
            );
            if (!ok) {
                event.preventDefault();
            }
        } else if (!nameIsNoGi && giMode === 'nogi') {
            const ok = window.confirm(
                'This tournament name does not indicate no-gi, but you are importing it as no-gi. Continue?'
            );
            if (!ok) {
                event.preventDefault();
            }
        }
    });
})();
```

--------------------------------

### Helper script for parsing bracket HTML

Source: https://github.com/weisserw/ibjjf-elo/blob/main/docs/BRACKET_LAYOUT_REVERSE_ENGINEERING.md

A script to parse first-round seed rows from saved IBJJF HTML, including mapping swapped seeds back to their original slots.

```bash
python3 scripts/bracket_initial_pairings.py example_bracket.html
```

--------------------------------

### Run Python web app

Source: https://github.com/weisserw/ibjjf-elo/blob/main/README.md

Runs the Flask web application in debug mode.

```bash
/app $ flask run --debug
```

--------------------------------

### Athlete Matches Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/athlete_matches.html

Jinja2 template for displaying a list of matches for a given athlete, including event details, opponent, result, and video link. Allows for editing and saving.

```html
{% extends "base.html" %} {% block title %}Matches for {{ athlete.name }}{% endblock %} {% block content %} 

Matches for {{ athlete.name }}
==============================

##### (Enter NONE to blank out a match video if footage from livestream / flo is unavailable)

 [Back to Athlete]({{ url_for('athlete_edit', id=athlete.id) }})

Save All

{% for match in matches %} {% endfor %}

Date

Event

Weight

Opponent

Result

Video Link

{{ match.happened_at.strftime('%Y-%m-%d') }}

{{ match.event.name }}

{{ match.division.weight }}

{{ match.opponent.athlete.name }}

{{ 'Win' if match.athlete_participant.winner else 'Loss' }}

Save All

[Back to Athlete]({{ url_for('athlete_edit', id=athlete.id) }})

{% endblock %}
```

--------------------------------

### Jinja2 Template Structure

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/flo_search_names_settings.html

This snippet shows the basic Jinja2 template structure, including extending a base template and defining content blocks.

```html
{% extends "base.html" %} {% block title %}Flo Search Names{% endblock %} {% block content %} 

Flo Search Names
================

These mappings override how athlete names are searched on FloGrappling event pages when building video links. If an athlete name exactly matches **Athlete Name**, the search uses **Search Name** instead. Use **Comment** for context like inconsistent naming on Flo.

{% if error %}

{{ error }}

{% endif %} {% for mapping in mappings %} {% endfor %}

Athlete Name (exact)

Search Name

Comment

Actions

Save Delete

Add

[Back to Dashboard]({{ url_for('index') }})

{% endblock %}
```

--------------------------------

### Pagination Controls

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_index.html

Renders pagination links for navigating through the list of tasks.

```html
{% if page > 1 %} [Previous]({{ url_for('tasks_index', page=page - 1, task_type=selected_task_type) }}) {% else %} Previous {% endif %} {% if page < total_pages %} [Next]({{ url_for('tasks_index', page=page + 1, task_type=selected_task_type) }}) {% else %} Next {% endif %}

*   Page {{ page }} of {{ total_pages }}
```

--------------------------------

### Python function for bracket slots

Source: https://github.com/weisserw/ibjjf-elo/blob/main/docs/BRACKET_LAYOUT_REVERSE_ENGINEERING.md

The implementation of bracket slot generation and display order conversion is located in app/seeding.py.

```python
import math

def _bracket_slots(n):
    """Returns first-round bracket rows as (red_seed, blue_seed) pairs, with None for a bye.

    The output must match IBJJF's visual bracket rows top-to-bottom closely enough that our estimated bracket can be compared against their official viewer.
    """
    if n == 0:
        return [], 0
    # Find the smallest power of two greater than or equal to n
    power_of_two = 1 << (n - 1).bit_length()
    # Generate canonical seed layouts for power_of_two
    canonical_layout = _IBJJF_SEED_LAYOUTS[power_of_two]
    # Map canonical layout to the actual number of participants
    first_round = []
    for i in range(n // 2):
        red_seed = canonical_layout[2 * i]
        blue_seed = canonical_layout[2 * i + 1]
        first_round.append((red_seed, blue_seed))
    # Add byes for odd number of participants
    if n % 2 == 1:
        first_round.append((canonical_layout[2 * (n // 2)], None))
    return first_round, power_of_two

def _ibjjf_display_order(first_round, play_in_count):
    """Converts canonical rows into IBJJF visual row order."""
    # This is a placeholder and needs to be implemented based on observed rules.
    # The actual implementation will depend on the bracket size and play-in count.
    return first_round

def _side(seed, n):
    """Uses _bracket_slots(n) but maps side 0 to the half containing seed 1."""
    slots, size = _bracket_slots(n)
    for i, (red, blue) in enumerate(slots):
        if red == seed or blue == seed:
            # Determine which half seed 1 belongs to
            seed1_half = 0 # Assume seed 1 is in the first half by default
            for j, (r, b) in enumerate(slots):
                if r == 1 or b == 1:
                    seed1_half = j
                    break
            # If the current seed is in the same half as seed 1, it's side 0
            if i == seed1_half:
                return 0
            else:
                return 1
    return -1 # Seed not found

# Example canonical power-of-two seed layouts (simplified)
_IBJJF_SEED_LAYOUTS = {
    2: [1, 2],
    4: [1, 4, 2, 3],
    8: [1, 8, 2, 7, 3, 6, 4, 5],
    16: [1, 16, 2, 15, 3, 14, 4, 13, 5, 12, 6, 11, 7, 10, 8, 9],
    32: [1, 32, 2, 31, 3, 30, 4, 29, 5, 28, 6, 27, 7, 26, 8, 25, 9, 24, 10, 23, 11, 22, 12, 21, 13, 20, 14, 19, 15, 18, 16, 17]
}

```

--------------------------------

### JavaScript for rendering events and matches

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

This snippet handles rendering a list of events with selection buttons and a list of matches with winner selection buttons. It also includes pagination logic.

```javascript
function renderEvents(events, page, totalPages, totalResults) {
    resultsEl.innerHTML = '';
    const table = document.createElement('table');
    table.className = 'table is-fullwidth is-striped';
    table.innerHTML = '<thead>' +
        '<tr>' +
        '<th>Name</th>' +
        '<th>IBJJF ID</th>' +
        '<th>Actions</th>' +
        '</tr>' +
        '</thead>' +
        '<tbody>';
    events.forEach(function (event) {
        const ibjjfId = event.ibjjf_id ? event.ibjjf_id : 'N/A';
        table.innerHTML += '<tr>' +
            '<td>' + event.name + '</td>' +
            '<td>' + ibjjfId + '</td>' +
            '<td><button class="button is-small is-link event-select-button" data-event-id="' + event.id + '" data-event-name="' + event.name + '" data-event-ibjjf-id="' + ibjjfId + '">Select</button></td>' + '</tr>';
    }).join('') + '</tbody>';
    resultsEl.appendChild(table);
    setFeedback('Select a tournament to load unrecorded matches.', false);
    const buttons = resultsEl.querySelectorAll('.event-select-button');
    buttons.forEach(function (button) {
        button.addEventListener('click', function () {
            selectedEvent = {
                id: button.getAttribute('data-event-id'),
                name: button.getAttribute('data-event-name'),
                ibjjf_id: button.getAttribute('data-event-ibjjf-id')
            };
            loadUnrecordedMatches(selectedEvent.id);
        });
    });
    const pagination = document.createElement('nav');
    pagination.className = 'pagination is-small mt-3';
    pagination.setAttribute('role', 'navigation');
    pagination.setAttribute('aria-label', 'search results pagination');
    const prev = document.createElement('a');
    prev.className = 'pagination-previous';
    prev.textContent = 'Previous';
    if (page <= 1) {
        prev.setAttribute('disabled', 'disabled');
    } else {
        prev.href = '#';
        prev.addEventListener('click', function (event) {
            event.preventDefault();
            searchEvents(page - 1);
        });
    }
    const next = document.createElement('a');
    next.className = 'pagination-next';
    next.textContent = 'Next';
    if (page >= totalPages) {
        next.setAttribute('disabled', 'disabled');
    } else {
        next.href = '#';
        next.addEventListener('click', function (event) {
            event.preventDefault();
            searchEvents(page + 1);
        });
    }
    const list = document.createElement('ul');
    list.className = 'pagination-list';
    const item = document.createElement('li');
    const label = document.createElement('span');
    label.className = 'pagination-link is-current';
    label.textContent = 'Page ' + page + ' of ' + totalPages + ' (' + totalResults + ' tournaments)';
    item.appendChild(label);
    list.appendChild(item);
    pagination.appendChild(prev);
    pagination.appendChild(next);
    pagination.appendChild(list);
    resultsEl.appendChild(pagination);
}
function renderSelectedEvent(event) {
    if (!event) {
        selectedEventEl.innerHTML = '';
        if (recomputeEventIdInput) recomputeEventIdInput.value = '';
        if (recomputeEventNameInput) recomputeEventNameInput.value = '';
        return;
    }
    const ibjjfId = event.ibjjf_id ? ' (IBJJF ID: ' + event.ibjjf_id + ')' : '';
    selectedEventEl.innerHTML = '<h2 class="title is-5">Selected Tournament: ' + event.name + ibjjfId + '</h2>';
    if (recomputeEventIdInput) recomputeEventIdInput.value = event.id || '';
    if (recomputeEventNameInput) recomputeEventNameInput.value = event.name || '';
    if (recomputeGiModeSelect) {
        recomputeGiModeSelect.value = inferGiModeFromEventName(event.name);
    }
}
function renderMatches(matches) {
    matchesContainer.innerHTML = '';
    if (!matches.length) {
        matchesContainer.innerHTML = '<div class="notification is-warning is-light">No unrecorded matches found for this tournament.</div>';
        return;
    }
    const table = document.createElement('table');
    table.className = 'table is-fullwidth is-striped';
    table.innerHTML = '<thead>' +
        '<tr>' +
        '<th>Date</th>' +
        '<th>Division</th>' +
        '<th>Competitors</th>' +
        '<th>Actions</th>' +
        '</tr>' +
        '</thead>' +
        '<tbody>';
    matches.map(function (match) {
        const division = match.division.belt + ' / ' + match.division.age + ' / ' + match.division.gender + ' / ' + match.division.weight;
        const archiveEventName = match.event_name || (selectedEvent && selectedEvent.name) || '';
        const archiveUrl = archiveBaseUrl + '/tournaments/archive?event_name=' + encodeURIComponent(archiveEventName) + '&category=' + encodeURIComponent(division);
        const divisionCell = '<a href="' + archiveUrl + '" target="_blank" rel="noopener noreferrer">' + division + '</a>';
        const competitors = match.participants.map(function (p) {
            return p.athlete_name;
        }).join(' vs ');
        const buttons = match.participants.map(function (p) {
            return (
                '<button class="button is-small is-link winner-button mr-1 mb-1" type="button" data-match-id="' + match.id + '" data-winner-id="' + p.athlete_id + '" data-winner-name="' + p.athlete_name + '">' +
                'Set ' + p.athlete_name + ' Winner' +
                '</button>'
            );
        }).join('');
        return (
            '<tr>' +
            '<td>' + formatDate(match.happened_at) + '</td>' +
            '<td>' + divisionCell + '</td>' +
            '<td>' + competitors + '</td>' +
            '<td>' + buttons + '</td>' +
            '</tr>'
        );
    }).join('') + '</tbody>';
    matchesContainer.appendChild(table);
    const winnerButtons = matchesContainer.querySelectorAll('.winner-button');
    winnerButtons.forEach(function (button) {
        button.addEventListener('click', function () {
            if (!selectedEvent) {
                return;
            }
            const matchId = button.getAttribute('data-match-id');
            const winnerId = button.getAttribute('data-winner-id');
            const winnerName = button.getAttribute('data-winner-name');
            openWinnerModal(winnerName).then(function (selection) {
                if (!selection) {
                    return;
                }
                const body = new URLSearchParams();
                body.set('event_id', selectedEvent.id);
                body.set('match_id', matchId);
                body.set('winner_id', winnerId);
                body.set('loser_no_show', selection.loserNoShow ? 'true' : 'false');
                fetch('{{ url_for("set_unrecorded_match_winner") }}', {
                    meth
```

--------------------------------

### Athlete List Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/athletes.html

Jinja2 template for rendering athlete search results.

```html
{% extends "base.html" %} {% block title %}Athletes{% endblock %} {% block content %}

Athletes
========

Search

{% if athletes %}

Results:
--------

{% for athlete in athletes %}*   [{{ athlete.name }}]({{ url_for('athlete_edit') }}?id={{ athlete.id }})
{% endfor %}

{% elif search_term %}

No athletes found.

{% endif %} [Back to Dashboard]({{ url_for('index') }})

{% endblock %}
```

--------------------------------

### Jinja Template for Past Events

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/events_past.html

This Jinja template iterates through a list of events and displays them with links to their respective livestream pages. It also includes search functionality and a fallback for when no events are found.

```html
{% extends "base.html" %} {% block title %}Past Events{% endblock %} {% block content %}

Past Events
===========

Search

{% if events %}

Results:
--------

{% for event in events %}*   [{{ event.name }}]({{ url_for('event_livestreams') }}?id={{ event.ibjjf_id }}&name={{ event.name }})
{% endfor %}

{% elif search_term %}

No events found.

{% endif %} [Back to Dashboard]({{ url_for('index') }})

{% endblock %}
```

--------------------------------

### Event Listeners and Form Submission

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

JavaScript code for handling search button clicks, Enter key press for search, and form submission for recomputing rankings.

```javascript
searchButton.addEventListener('click', searchEvents);
input.addEventListener('keydown', function (event) {
    if (event.key === 'Enter') {
        event.preventDefault();
        searchEvents();
    }
});

if (recomputeForm) {
    recomputeForm.addEventListener('submit', function (event) {
        const modeEl = document.getElementById('recompute-gi-mode');
        const modeLabel = modeEl ? modeEl.options[modeEl.selectedIndex].text : 'selected mode';
        const ok = window.confirm('Start regenerate ranking board task for ' + modeLabel + '?');
        if (!ok) {
            event.preventDefault();
        }
    });
}
```

--------------------------------

### Admin Login HTML Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/login.html

The Jinja2 template for the admin login page.

```html
{% extends "base.html" %} {% block title %}Admin Login{% endblock %} {% block content %}

Admin Login
-----------

{% if error %}

{{ error }}

{% endif %}

Password

Login

{% endblock %}
```

--------------------------------

### Load Unrecorded Matches

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

JavaScript function to fetch and display unrecorded matches for a given event.

```javascript
function loadUnrecordedMatches(eventId) {
    setFeedback('Loading unrecorded matches...', false);
    fetch('{{ url_for("event_unrecorded_matches", event_id="EVENT_ID_PLACEHOLDER") }}'.replace('EVENT_ID_PLACEHOLDER', eventId))
        .then(function (resp) {
            if (!resp.ok) {
                throw new Error('Failed to load matches');
            }
            return resp.json();
        })
        .then(function (data) {
            selectedEvent = data.event;
            renderSelectedEvent(data.event);
            renderMatches(Array.isArray(data.matches) ? data.matches : []);
            setFeedback('', false);
        })
        .catch(function () {
            renderSelectedEvent(null);
            matchesContainer.innerHTML = '';
            setFeedback('Unable to load unrecorded matches for this tournament.', true);
        });
}
```

--------------------------------

### Upcoming Events Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/events_upcoming.html

Jinja2 template for displaying upcoming events.

```html
{% extends "base.html" %} {% block title %}Upcoming Events{% endblock %} {% block content %}

Upcoming Events
===============

{% for event in events %}*   [{{ event.name }}]({{ url_for('event_livestreams') }}?id={{ event.event_id }}&name={{ event.name }})
{% endfor %}

[Back to Dashboard]({{ url_for('index') }})

{% endblock %}
```

--------------------------------

### Search Events

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

JavaScript function to search for events based on a query and render the search results.

```javascript
function searchEvents(page) {
    const nextPage = page || 1;
    const q = input.value.trim();
    setFeedback('Searching tournaments...', false);
    resultsEl.innerHTML = '';
    fetch('{{ url_for("events_search") }}?q=' + encodeURIComponent(q) + '&page=' + encodeURIComponent(nextPage))
        .then(function (resp) {
            if (!resp.ok) {
                throw new Error('Search failed');
            }
            return resp.json();
        })
        .then(function (data) {
            const events = Array.isArray(data.events) ? data.events : [];
            const resultPage = Number(data.page || 1);
            const totalPages = Number(data.total_pages || 1);
            const totalResults = Number(data.total_results || 0);
            renderSearchResults(events, resultPage, totalPages, totalResults);
        })
        .catch(function () {
            resultsEl.innerHTML = '';
            setFeedback('Unable to search tournaments right now.', true);
        });
}
```

--------------------------------

### JavaScript for Event Search and Winner Modal

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

This JavaScript code handles the event search functionality, displays search results, and manages the 'Set Winner' modal, including options for disqualification due to no-show.

```javascript
(function () { const input = document.getElementById('event-search-input'); const searchButton = document.getElementById('event-search-button'); const feedbackEl = document.getElementById('event-search-feedback'); const resultsEl = document.getElementById('event-search-results'); const selectedEventEl = document.getElementById('selected-event'); const matchesContainer = document.getElementById('matches-container'); const recomputeForm = document.getElementById('recompute-ranks-form'); const recomputeEventIdInput = document.getElementById('recompute-event-id'); const recomputeEventNameInput = document.getElementById('recompute-event-name'); const recomputeGiModeSelect = document.getElementById('recompute-gi-mode'); const archiveBaseUrl = {{ archive_base_url|tojson }}; const winnerModal = document.getElementById('set-winner-modal'); const winnerModalMessage = document.getElementById('set-winner-modal-message'); const winnerModalNoShow = document.getElementById('set-winner-loser-no-show'); const winnerModalClose = document.getElementById('set-winner-modal-close'); const winnerModalCancel = document.getElementById('set-winner-modal-cancel'); const winnerModalConfirm = document.getElementById('set-winner-modal-confirm'); let selectedEvent = null; let winnerModalResolve = null; function showToast(message, isError) { const toast = document.createElement('div'); toast.textContent = message; toast.style.position = 'fixed'; toast.style.top = '1rem'; toast.style.right = '1rem'; toast.style.zIndex = '9999'; toast.style.padding = '0.75rem 1rem'; toast.style.borderRadius = '6px'; toast.style.color = '#fff'; toast.style.fontWeight = '600'; toast.style.boxShadow = '0 4px 12px rgba(0, 0, 0, 0.2)'; toast.style.background = isError ? '#d9534f' : '#23a559'; document.body.appendChild(toast); window.setTimeout(function () { toast.remove(); }, 2500); } function setFeedback(text, isError) { if (!text) { feedbackEl.innerHTML = ''; return; } feedbackEl.innerHTML = '<div class="notification ' + (isError ? 'is-danger' : 'is-info is-light') + '">' + text + '</div>'; } function formatDate(iso) { if (!iso) return ''; const parsed = new Date(iso); if (Number.isNaN(parsed.getTime())) return iso; return parsed.toLocaleString(); } function inferGiModeFromEventName(name) { const value = (name || '').toLowerCase(); if (value.includes('no-gi') || value.includes('no gi') || value.includes('sem kimono')) { return 'nogi'; } return 'gi'; } function openWinnerModal(winnerName) { if (!winnerModal || !winnerModalMessage || !winnerModalNoShow) { return Promise.resolve(null); } winnerModalMessage.textContent = 'Start background task to set ' + winnerName + ' as winner?'; winnerModalNoShow.checked = false; winnerModal.classList.add('is-active'); return new Promise(function (resolve) { winnerModalResolve = resolve; }); } function closeWinnerModal(result) { if (!winnerModal) { return; } winnerModal.classList.remove('is-active'); if (winnerModalResolve) { const resolve = winnerModalResolve; winnerModalResolve = null; resolve(result); } } if (winnerModal) { const modalBackground = winnerModal.querySelector('.modal-background'); if (modalBackground) { modalBackground.addEventListener('click', function () { closeWinnerModal(null); }); } } if (winnerModalClose) { winnerModalClose.addEventListener('click', function () { closeWinnerModal(null); }); } if (winnerModalCancel) { winnerModalCancel.addEventListener('click', function () { closeWinnerModal(null); }); } if (winnerModalConfirm) { winnerModalConfirm.addEventListener('click', function () { closeWinnerModal({ loserNoShow: winnerModalNoShow && winnerModalNoShow.checked }); }); } document.addEventListener('keydown', function (event) { if (event.key === 'Escape' && winnerModal && winnerModal.classList.contains('is-active')) { closeWinnerModal(null); } }); function renderSearchResults(events, page, totalPages, totalResults) { resultsEl.innerHTML = ''; if (!events.length) { setFeedback('No tournaments found.', false); return; } const table = document.createElement('table'); table.className = 'table is-fullwidth is-striped'; table.innerHTML = '<thead><tr><th>Name</th><th>IBJJF ID</th><th>Unrecorded Matches</th><th></th></tr></thead>' + '<tbody>' + events.map(function (event) { const ibjjfId = event.ibjjf_id || ''; const unrecordedCount = Number(event.unrecorded_match_count || 0); return ( '<tr>' + '<td>' + event.name + '</td>' + '<td>' + ibjjfId + '</td>' + '<td>' + unrecordedCount + '</td>' + '<td><button class="button is-small is-link is-light event-select-button" type="button" data-event-id="' + ev
```

--------------------------------

### Admin Dashboard Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/index.html

This is the Jinja2 template for the admin dashboard, displaying navigation links to various management sections.

```html
{% extends "base.html" %} {% block title %}Admin Dashboard{% endblock %} {% block content %}

Admin Dashboard
===============

*   [Athletes]({{ url_for	'athletes' )	}}
*   [Upcoming Events]({{ url_for	'upcoming_events'	) }}
*   [Past Events]({{ url_for	'past_events'	) }}
*   [Flo Search Names]({{ url_for	'flo_search_names_settings'	) }}
*   [Team Name Mappings]({{ url_for	'team_name_mappings_settings'	) }}
*   [Import Results]({{ url_for	'tasks_import'	) }}
*   [Unrecorded Match Winners]({{ url_for	'tasks_unrecorded_winners'	) }}
*   [Missing Medals Scan]({{ url_for	'missing_medals_scan'	) }}
*   [Wordpress Dashboard](https://wordpress.com/home/ibjjfrankings.wordpress.com)

[Logout]({{ url_for	'logout'	) }}

{% endblock %}
```

--------------------------------

### Create Set Winner Task

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/tasks_unrecorded_winners.html

JavaScript function to create a task for setting an unrecorded winner, handling API requests and user feedback.

```javascript
fetch('{{ url_for("event_set_winner_task", event_id="EVENT_ID_PLACEHOLDER") }}'.replace('EVENT_ID_PLACEHOLDER', eventId), { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8' }, body: body.toString() })
    .then(function (resp) {
        return resp.json().then(function (data) {
            return { ok: resp.ok, data: data };
        });
    })
    .then(function (result) {
        if (!result.ok) {
            throw new Error((result.data && result.data.error) || 'Failed to create set winner task.');
        }
        showToast((result.data && result.data.message) || 'Set winner task created.', false);
        loadUnrecordedMatches(selectedEvent.id);
    })
    .catch(function (err) {
        showToast(err.message || 'Failed to create set winner task.', true);
    });
```

--------------------------------

### Edit Live Streams Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/event_livestreams.html

This is the Jinja2 template for the event live streams editing page.

```html
{% extends "base.html" %} {% block title %}Edit Live Streams{% endblock %} {% block content %} 

Edit Live Streams for {{ event_name }}
=======================================

{% if error %}

{{ error }}

{% endif %}

{% for stream in streams %} {% endfor %}

Day

Mat

URL

Start Time

End Time

Drift Factor

Hide All?

Actions

Save Delete

Add

Flo Per-Mat Links
-----------------

{% for fml in flo_mat_links %} {% endfor %}

Mat

Flo URL

Actions

Save Delete

Add

Save

[Back to Dashboard]({{ url_for('index') }})

{% endblock %}
```

--------------------------------

### Athlete Edit Form Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/athlete_edit.html

This is the main HTML template for the athlete edit form, using Jinja2 templating.

```html
{% extends "base.html" %} {% block title %}Edit Athlete{% endblock %} {% block content %} {% if athlete %} {{ athlete.name }} ================== Current Profile Photo {% if photo_url %} ![Current profile photo for {{ athlete.name }}]({{ photo_url }}) {% else %} No profile photo uploaded yet. {% endif %} Upload Profile Photo JPG only. Max 1MB. Instagram Profile Personal Name Nickname Translation BJJ Heroes Link Country Code Country Note Country Note (Portuguese Translation) Hide athlete full name on site Save {% if message %} {{ message }} {% endif %} {% if error_message %} {{ error_message }} {% endif %} {% else %} Athlete not found. {% endif %} [Back to Search]({{ url_for('athletes') }}) [View Matches]({{ url_for('athlete_matches') }}?id={{ athlete.id }}) [View Medals]({{ url_for('athlete_medals') }}?id={{ athlete.id }}) {% endblock %}
```

--------------------------------

### Athlete Medals Template

Source: https://github.com/weisserw/ibjjf-elo/blob/main/admin/templates/athlete_medals.html

This Jinja2 template renders a table of medals for a given athlete, including details like date, event, division, and source. It also provides navigation links and save functionality.

```html
{% extends "base.html" %} {% block title %}Medals for {{ athlete.name }}{% endblock %} {% block content %} 

Medals for {{ athlete.name }}
=============================

{% if session.get('medal_find_flash') %}

{{ session.pop('medal_find_flash') }}

{% endif %}

 [Back to Athlete]({{ url_for('athlete_edit', id=athlete.id) }}) [Find missing medals →]({{ url_for('athlete_medals_find_missing', id=athlete.id) }})

Save All

{% for medal in medals %} {% endfor %}

Date

Event

Division

Gi

Team

Default Gold

Place

Source

{{ medal.happened_at.strftime('%Y-%m-%d') }}

{{ medal.event.name }}

{{ medal.division.display_name() }}

{{ 'Gi' if medal.division.gi else 'No-Gi' }}

{{ medal.team.name }}

{{ 'Yes' if medal.default_gold else 'No' }}

{% if medal.default_gold %}  {% else %}  {% endif %}

{% if medal.imported_via == 'historical_auto' %} hist-auto {% elif medal.imported_via == 'historical_manual' %} hist-manual {% elif medal.imported_via == 'recent_scan_auto' %} recent-auto {% elif medal.imported_via == 'recent_scan_manual' %} recent-manual {% else %} — {% endif %}

Delete

Save All

{% for medal in medals %}

 

{% endfor %} [Back to Athlete]({{ url_for('athlete_edit', id=athlete.id) }})

{% endblock %}
```
Tokens:
Raw