wip
This commit is contained in:
salam committed
1 parent
eec5840a6b
commit
f9712cbd25
15 files changed
+247
-22
No files matched your search
@@ -233,4 +233,8 @@ less padding in table
|
||||
@apply bg-gray-100 dark:bg-gray-600/30 drop-shadow
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dragging {
|
||||
@apply border-red-500
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="740" height="1110" viewBox="0 0 74 111">
|
||||
<rect id="" width="74" height="111" fill="#00a000"/>
|
||||
<g fill="none" stroke="#fff" stroke-width="0.5" transform="translate(3 3)">
|
||||
<path id="Border" d="M 0 0 h 68 v 105 h -68 Z"/>
|
||||
<path id="Centre line" d="M 0 52.5 h 68"/>
|
||||
<circle id="Centre circle" r="9.15" cx="34" cy="52.5"/>
|
||||
<circle id="Centre mark" r="0.75" cx="34" cy="52.5" fill="#fff" stroke="none"/>
|
||||
<g id="Penalty area">
|
||||
<path id="Penalty area line" d="M 13.84 0 v 16.5 h 40.32 v -16.5"/>
|
||||
<path id="Goal area line" d="M 24.84 0 v 5.5 h 18.32 v -5.5"/>
|
||||
<circle id="Penalty mark" r="0.75" cx="34" cy="10.94" fill="#fff" stroke="none"/>
|
||||
<path id="Penalty arc" d="M 26.733027 16.5 a 9.15 9.15 0 0 0 14.533946 0"/>
|
||||
</g>
|
||||
<use xlink:href="#Penalty area" transform="rotate(180,34,52.5)" />
|
||||
<path id="Corner arcs" d="M 0 2 a 2 2 0 0 0 2 -2M 66 0 a 2 2 0 0 0 2 2M 68 103 a 2 2 0 0 0 -2 2M 2 105 a 2 2 0 0 0 -2 -2"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -0,0 +1 @@
|
||||
@livewire('player-calculator', ['filters' => $filters])
|
||||
@@ -0,0 +1,15 @@
|
||||
<div class="flex flex-rows justify-between gap-4 sm:flex-row sm:items-center">
|
||||
<!-- Left Aligned Actions -->
|
||||
<div class="flex flex-rows items-center gap-3">
|
||||
@foreach ($leftActions as $action)
|
||||
{{ $action }}
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
<!-- Right Aligned Actions -->
|
||||
<div class="flex flex-rows items-center gap-3 sm:ms-auto">
|
||||
@foreach ($rightActions as $action)
|
||||
{{ $action }}
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@@ -3,7 +3,7 @@
|
||||
'player_name',
|
||||
);
|
||||
@endphp
|
||||
<x-filament-panels::page>
|
||||
<x-filament-panels::page class="gap-0">
|
||||
|
||||
<script>
|
||||
window.addEventListener('reset-tab', () => {
|
||||
|
||||
@@ -0,0 +1,68 @@
|
||||
@php
|
||||
use Illuminate\Support\HtmlString;
|
||||
@endphp
|
||||
|
||||
|
||||
<div class="grid grid-cols-6 gap-10" class="drag-and-drop" x-data="{ adding: false, removing: false }">
|
||||
<div class="col-span-2 h-full drag-and-drop__container drag-and-drop__container--from">
|
||||
@foreach ($player as $position => $names)
|
||||
<div class="text-bold py-2"> {{ ucfirst(strtolower($position)) }}</div>
|
||||
<div class="grid grid-cols-2 gap-2 cursor-grab drag-and-drop__items"
|
||||
:class="{ 'drag-and-drop__items--removing': removing }" x-on:drop="removing = false"
|
||||
x-on:drop.prevent="
|
||||
const target = event.target.closest('div');
|
||||
const element = document.getElementById(event.dataTransfer.getData('text/plain'));
|
||||
target.appendChild(element);
|
||||
"
|
||||
x-on:dragover.prevent="removing = true" x-on:dragleave.prevent="removing = false">
|
||||
@foreach ($names as $ss_player_id => $name)
|
||||
<div color="gray" id="{{ $ss_player_id }}"
|
||||
class="border border-gray-200 bg-gray-100 p-1 rounded text-xs cursor-grap drag-and-drop__item"
|
||||
:class="{ 'drag-and-drop__item--dragging': dragging }"
|
||||
x-on:dragstart.self="
|
||||
dragging = true;
|
||||
event.dataTransfer.effectAllowed='move';
|
||||
event.dataTransfer.setData('text/plain', event.target.id);
|
||||
"
|
||||
x-on:dragend="dragging = false" x-data="{ dragging: false }" draggable="true">
|
||||
{{ new HtmlString($name) }}
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<div class="col-span-3 h-full drag-and-drop__container drag-and-drop__container--to">
|
||||
<div class="drag-and-drop__items grid grid-cols-5 gap-2 justify-center w-130 bg-size-[100%_100%] p-2 border-5 border-green-600"
|
||||
style="background-image:url({{ asset('images/soccerfield.png') }});">
|
||||
@foreach ($positions as $pos)
|
||||
@if ($pos)
|
||||
<div class="border-5 border-white/30 h-full aspect-square p-1 m-1 rounded-xl"
|
||||
:class="{ 'drag-and-drop__items--adding': adding }" x-on:drop="adding = false"
|
||||
x-on:drop.prevent="
|
||||
const target = event.target.closest('ul');
|
||||
const element = document.getElementById(event.dataTransfer.getData('text/plain'));
|
||||
target.appendChild(element);
|
||||
"
|
||||
x-on:dragover.prevent="adding = true" x-on:dragleave.prevent="adding = false">
|
||||
<div class="text-white/30 font-black text-center text-xl">
|
||||
{{ $pos }}
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<div></div>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-3">
|
||||
<x-filament::button wire:click="openNewUserModal" color="gray" icon="phosphor-x-circle">
|
||||
Reset
|
||||
</x-filament::button>
|
||||
<x-filament::button wire:click="openNewUserModal" color="gray" icon="phosphor-calculator">
|
||||
Calculate
|
||||
</x-filament::button>
|
||||
<x-filament::button wire:click="openNewUserModal" color="gray" icon="phosphor-copy">
|
||||
Copy
|
||||
</x-filament::button>
|
||||
</div>
|
||||
</div>
|
||||
Reference in new issue
Block a user