51 lines
1.6 KiB
PHP
51 lines
1.6 KiB
PHP
@php
|
|
use Illuminate\Support\HtmlString;
|
|
@endphp
|
|
|
|
{{-- In Tailwind CSS, a value of 24 equals 96 pixels (or 6rem) --}}
|
|
<div class="chessboard grid w-258 h-180 grid-cols-10 grid-rows-7 relative gap-2"
|
|
style="background-image:url({{ asset('svg/soccerfield.svg') }});" x-data x-init="
|
|
setTimeout(() => {
|
|
$store.main.loadPlayer({{ json_encode($grid) }});
|
|
}, 1000); ">
|
|
|
|
{{-- 0 => array:9 [▼
|
|
"player_id" => 789695
|
|
"name" => "Favio Álvarez"
|
|
"position" => "MIDFIELD"
|
|
"position_color" => "info"
|
|
"color" => "info"
|
|
"info" => "Ev 3, Right, 8 min"
|
|
"type" => ""
|
|
"x" => 104
|
|
"y" => 104
|
|
|
|
7 => array:3 [▼
|
|
"type" => "ST"
|
|
"x" => 832
|
|
"y" => 104
|
|
]
|
|
] --}}
|
|
|
|
@foreach ($grid as $key => $ele)
|
|
|
|
@if(isset($ele['player_id']))
|
|
<x-filament::button color="{{ $ele['position_color'] }}"
|
|
@click="$store.main.console({{$key}})"
|
|
id="{{ $ele['player_id'] }}"
|
|
class="piece relative size-24 select-none aspect-square font-bold rounded"
|
|
tooltip="{{ $ele['info'] }}">
|
|
<div class="absolute top-0 left-0 w-full text-center text-xs p-1 rounded-t-xl bg-white/10">{{ $ele['position'] }}</div>
|
|
{{ $ele['name'] }}
|
|
</x-filament::button>
|
|
@elseif($ele['type'])
|
|
<div class="size-24 bg-white/10">
|
|
<div class="font-black text-3xl text-center text-white/25 p-3">
|
|
{{ $ele['type'] }}
|
|
</div>
|
|
</div>
|
|
@else
|
|
<div class="size-24"></div>
|
|
@endif
|
|
@endforeach
|
|
</div> |