ghassan/takeone-youtube-clone
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Wire match header to real SportsMatch data; add Match#/Court + country flags

Browse Source 
The match page header rendered hard-coded demo content (Sami Al Manea vs Hassan
Al Shallan, Match# 103, referee Ghassan Yusuf, external takeone-dev links) on
EVERY match video, ignoring the SportsMatch record the create form saves.

- Video::sportsMatch() hasOne relationship.
- SportsMatch::headerData() maps the record into the header's shape (fighters +
  country flags, championship, weight class, referee, venue, match#/court),
  null-safe, with a country-name/ISO2 -> flag-icons resolver.
- match.blade header now renders from headerData(): real names/flags, no
  external links, and degrades gracefully to just title/views/date when a video
  has no match data (instead of the fake card).
- sports-match-modal: add Match # and Court fields (stored in the existing
  competition JSON, no migration) and convert fighter/referee country inputs to
  the mandated <x-country-select> so header flags resolve from ISO2.
- Tracker updated for the new country-select usages.

Verified: empty state (no SportsMatch) shows only title/views/date; a populated
record renders fighters, flags (bh/us), championship, Match# 42, Court 3, U21,
referee; modal compiles with the new fields.

Co-Authored-By: Claude Opus 4.8 <[email protected]>
This commit is contained in:
ghassanandClaude Opus 4.8 committed 2026-07-29 01:57:07 +03:00
1 parent 8ea63a6720
commit af276f2cd1
5 files changed
+150 -100
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

resources/views/videos/types/match.blade.php
+62 -96
View File
@@ -2014,62 +2014,10 @@
@section('content')
@php
// ===== DUMMY DATA FALLBACKS =====
$blueFighter =
$blueFighter ??
(object) [
'name' => 'Sami Al Manea',
'flag' => 'bh',
'photo' => 'https://takeone-dev.innovator.bh/storage/images/profiles/profile_5.png?v=1773157950',
'team' => 'Emperor TaeKwonDo Academy',
'country' => 'Bahrain',
'logo' => 'https://takeone-dev.innovator.bh/storage/clubs/1/branding/logo_1771488666.png',
'member_id' => 5,
'club_url' => 'https://takeone-dev.innovator.bh/mobile/eta',
];
$redFighter =
$redFighter ??
(object) [
'name' => 'Hassan Al Shallan',
'flag' => 'bh',
'photo' => 'https://takeone-dev.innovator.bh/storage/images/profiles/profile_11.png?t=1773268056907',
'team' => 'Legend TaeKwonDo Academy',
'country' => 'Bahrain',
'logo' => 'https://takeone-dev.innovator.bh/storage/clubs/logos/logo_1773267551.png',
'member_id' => 11,
'club_url' => 'https://takeone-dev.innovator.bh/clubs/legend-taekwondo-academy',
];
$match =
$match ??
(object) [
'number' => '103',
'court' => '2',
'weight_category' => 'U18',
'score_blue' => 7,
'score_red' => 5,
'features' =>
'Electronic scoring system (PSS & head‑gear) • Video replay available for head kicks and gam-jeom appeals',
];
$referee =
$referee ??
(object) [
'name' => 'Ghassan Yusuf',
'flag' => 'bh',
'photo' => 'https://takeone-dev.innovator.bh/storage/images/profiles/profile_8.png?t=1773267305519',
'member_id' => 4,
];
$championship =
$championship ??
(object) [
'name' => 'Championship 2026',
'url' => '/championship/2026',
];
$venue =
$venue ??
(object) [
'name' => 'Manama Sports Hall',
'map_link' => 'https://maps.google.com/?q=Manama+Sports+Hall+Bahrain',
];
// Real match data (fighters, referee, championship, match#/court, venue)
// for this video. null when no SportsMatch record exists — the header then
// degrades to just the title/views/date instead of showing demo content.
$hd = $video->sportsMatch?->headerData();
@endphp
<!-- Video Layout Container -->
@@ -2096,52 +2044,70 @@
<div class="event-header">
<div class="event-header-left">
<div class="event-logo">
<img src="https://picsum.photos/seed/event-logo/200/200" alt="Event logo">
@if ($hd && $hd['event_logo'])
<img src="{{ route('media.thumbnail', $hd['event_logo']) }}" alt="Event logo">
@else
<i class="bi bi-trophy" style="font-size: 26px; color: var(--text-secondary);"></i>
@endif
</div>
<div class="event-text">
<!-- Title with Trophy Icon BEFORE "Taekwondo Finals" -->
@php
$flagStyle = 'width:20px;height:15px;border-radius:2px;display:inline-block;vertical-align:middle;';
$hasBlue = $hd && $hd['blue']['name'];
$hasRed = $hd && $hd['red']['name'];
// Ordered inline meta pieces — only the ones that actually have data.
$metaPieces = [];
if ($hd) {
if ($hd['championship']) $metaPieces[] = ['type' => 'champ', 'val' => $hd['championship']];
if ($hd['match_number']) $metaPieces[] = ['type' => 'num', 'val' => $hd['match_number']];
if ($hd['court']) $metaPieces[] = ['type' => 'court', 'val' => $hd['court']];
if ($hd['referee']['name']) $metaPieces[] = ['type' => 'ref', 'val' => $hd['referee']];
}
@endphp
<h1 class="title">
<i class="bi bi-trophy trophy-icon" title="Match Type"></i>
<span>{{ $video->title }} –</span>
<span style="color: #2563eb; font-weight: bold">
<span class="fi fi-{{ $blueFighter->flag ?? 'bh' }}" style="width:20px;height:15px;border-radius:2px;display:inline-block;vertical-align:middle;"></span>
<a href="https://takeone-dev.innovator.bh/member/{{ $blueFighter->member_id ?? 5 }}"
title="View {{ $blueFighter->name ?? 'Sami Al Manea' }}'s profile">
{{ $blueFighter->name ?? 'Sami Al Manea' }}
</a>
</span>
<span>vs</span>
<span style="color: #ef4444; font-weight: bold">
<span class="fi fi-{{ $redFighter->flag ?? 'bh' }}" style="width:20px;height:15px;border-radius:2px;display:inline-block;vertical-align:middle;"></span>
<a href="https://takeone-dev.innovator.bh/member/{{ $redFighter->member_id ?? 11 }}"
title="View {{ $redFighter->name ?? 'Hassan Al Shallan' }}'s profile">
{{ $redFighter->name ?? 'Hassan Al Shallan' }}
</a>
</span>
<span>({{ $match->weight_category ?? 'U18' }})</span>
<i class="bi bi-trophy trophy-icon" title="Sports match"></i>
<span>{{ $video->title }}@if ($hasBlue || $hasRed) –@endif</span>
@if ($hasBlue)
<span style="color: #2563eb; font-weight: bold">
@if ($hd['blue']['flag'])<span class="fi fi-{{ $hd['blue']['flag'] }}" style="{{ $flagStyle }}"></span>@endif
{{ $hd['blue']['name'] }}
</span>
@endif
@if ($hasBlue && $hasRed)<span>vs</span>@endif
@if ($hasRed)
<span style="color: #ef4444; font-weight: bold">
@if ($hd['red']['flag'])<span class="fi fi-{{ $hd['red']['flag'] }}" style="{{ $flagStyle }}"></span>@endif
{{ $hd['red']['name'] }}
</span>
@endif
@if ($hd && $hd['weight_category'])<span>({{ $hd['weight_category'] }})</span>@endif
</h1>
<!-- Meta: Championship Link • Match# • Court • Referee (all inline) -->
<a class="meta-link" href="{{ $championship->url ?? '/championship/2026' }}"
style="white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; line-height: 1.4;">
<span
style="color: #ffffff; font-weight: bold; font-size: 0.85rem;">{{ $championship->name ?? 'Championship 2026' }}</span>
<span style="color: var(--text-secondary);">•</span>
<span style="color: #ff00dd; font-weight: bold; font-size: 0.85rem;">Match#
{{ $match->number ?? '103' }}</span>
<span style="color: var(--text-secondary);">•</span>
<span style="color: #00af09; font-weight: bold; font-size: 0.85rem;">Court
{{ $match->court ?? '2' }}</span>
<span style="color: var(--text-secondary);">•</span>
<span
style="color: #ffd900; font-weight: bold; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 2px;">
<span class="fi fi-{{ $referee->flag ?? 'bh' }}" style="width:20px;height:15px;border-radius:2px;display:inline-block;vertical-align:middle;"></span> {{ $referee->name ?? 'Ghassan Yusuf' }}
{{-- Inline meta: championship • Match# • Court • referee • views/date.
Only non-empty pieces render; views/date always show. --}}
<div class="meta-link"
style="display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; line-height: 1.4;">
@foreach ($metaPieces as $piece)
@if (!$loop->first)<span style="color: var(--text-secondary);">•</span>@endif
@if ($piece['type'] === 'champ')
<span style="color: #ffffff; font-weight: bold; font-size: 0.85rem;">{{ $piece['val'] }}</span>
@elseif ($piece['type'] === 'num')
<span style="color: #ff00dd; font-weight: bold; font-size: 0.85rem;">Match# {{ $piece['val'] }}</span>
@elseif ($piece['type'] === 'court')
<span style="color: #00af09; font-weight: bold; font-size: 0.85rem;">Court {{ $piece['val'] }}</span>
@elseif ($piece['type'] === 'ref')
<span style="color: #ffd900; font-weight: bold; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 2px;">
@if ($piece['val']['flag'])<span class="fi fi-{{ $piece['val']['flag'] }}" style="{{ $flagStyle }}"></span>@endif
{{ $piece['val']['name'] }}
</span>
@endif
@endforeach
@if (count($metaPieces))<span style="color: var(--text-secondary);">•</span>@endif
<span style="color: var(--text-secondary); font-weight: bold; font-size: 0.85rem;">
{{ number_format($video->view_count) }} views • {{ $video->created_at->format('M d, Y') }}
</span>
<span
style="color: var(--text-secondary); font-weight: bold; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 2px;">
- {{ number_format($video->view_count) }} views •
{{ $video->created_at->format('M d, Y') }}</span>
</a>
</div>
</div>
</div>