@php
    if (empty($participants)) {
        $participants_id = '';
        $participated = '';
        $participants_hours = '';
        $participants_student = '';
    } else {
        $participants_id = $participants->participants_id;
        $participated = $participants->participated;
        $participants_hours = $participants->participants_hours;
        $participants_student = $participants->participants_student;
    }

    // if(empty($participants_setting)){

    //     $participants_st_id        = '';
    //     $participants_st_name      = '';
    // }

    // else {

    //     $participants_st_id        = $participants_setting->participants_st_id;
    //     $participants_st_name      = $participants_setting->participants_st_name;
    // }

@endphp
@extends('layouts.master')
@section('title', 'Participants Add/Edit')
{{-- <link rel="icon" href="{{ asset('/logo/siitlogo.png') }}" sizes="16x16" type="image/icon type"> --}}
@section('style')
    <style></style>
@endsection

@section('script')
    <script>
        function validateTime(input) {
            const value = input.value;
            const [hours, minutes] = value.split(':');

            // ตรวจสอบว่านาทีเป็น 00 หรือ 30
            if (minutes !== '00' && minutes !== '30') {
                document.getElementById('timeError').style.display = 'block';
                input.value = ''; // รีเซ็ตค่าใน input
            } else {
                document.getElementById('timeError').style.display = 'none';
            }
        }
        document.querySelector('form').addEventListener('submit', function(e) {
            const input = document.getElementById('timeInputExample').value.trim();
            const valid = /^([1-9]|[1-7][0-9]|80)(\.5)?$/.test(input);

            if (!valid) {
                e.preventDefault();
                alert("กรุณากรอกเฉพาะเลข 1 ถึง 80 หรือ ลงท้ายด้วย .5 เช่น 12, 8.5 เท่านั้น");
            }
        });
    </script>
@endsection

@section('content')
    @include('layouts.header')
    <section class="wrapper image-wrapper bg-image bg-overlay text-white" data-image-src="{{ asset('/bg/bgg02.png') }}"
        style="background-image: url('{{ asset('/bg/bgg02.png') }}');">
        <div class="container pt-md-16 py-14 pb-md-15 text-center">
            <div class="row">
                <div class="row">
                    <div class="col-lg-8 col-xxl-7 mx-auto text-center" data-cues="slideInDown" data-group="page-title"
                        data-delay="600">
                        <h1 class="fs-58 mb-2 text-light">Participants Add/Edit</h1>
                        {{-- <h2 class="fs-16 text-uppercase ls-xl text-light mb-4">Hello! This is Sandbox</h2> --}}
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class="container py-10">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <div>
                <span class="text-dark fs-30">Participants Add/Edit</span>
            </div>
            <div>
                {{-- <a href="{{ asset('/') }}" class="btn btn-lg btn-primary rounded-pill p-1 px-3"><i
                        class="uil uil-plus"></i>
                    Add</a> --}}
            </div>
        </div>

        <form action="{{ url('/participantsedit') }}" class="text-start mb-3" method="post" enctype="multipart/form-data">
            @csrf
            <div class="row">
                <div class="col-md-10"></div>
            </div>
            <input type="text" name="" value="{{ Auth::user()->id }}" hidden />
            <input type="text" name="participants_id" value="{{ $participants_id }}" hidden />
            <input type="text" name="activity_id" value="{{ $activity_id }}" hidden />
            <div class="row">
                {{-- <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <input id="textInputExample" type="text" class="form-control" placeholder="" name="">
                        <label for="textInputExample">Student ID*</label>
                    </div>
                </div> --}}

                {{-- <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <select class="form-select" placeholder="" value="{{ $participants_student }}"
                            name="participants_student" id="">
                            @foreach ($student as $i => $std)
                                <option value="{{ $std->student_code }}" @if ($participants_student == $std->student_code) selected @endif>
                                    {{ $std->student_code }}</option>
                            @endforeach
                        </select>
                        <label for="textInputExample">Student ID*</label>
                    </div>
                </div> --}}
                
                <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <input type="text" class="form-control @error('participants_student') is-invalid @enderror"
                            name="participants_student" id="participants_student"
                            value="{{ old('participants_student', $participants_student) }}" placeholder="Student ID">
                        <label for="participants_student">Student ID*</label>
                
                        @error('participants_student')
                            <div class="invalid-feedback">
                                {{ $message }} <!-- ข้อความผิดพลาดจากการ validate -->
                            </div>
                        @enderror
                    </div>
                </div>
                
                {{-- <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <input id="textInputExample" type="text" class="form-control" placeholder="participated" value="{{ $participated }}" name="participated">
                        <label for="textInputExample">Participanted as*</label>
                    </div>
                </div> --}}

                <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <select class="form-select" placeholder="" name="participants_st_id" id="">
                            @foreach ($participants_setting as $i => $std)
                                <option value="{{ $std->participants_st_id }}"
                                    @if ($participated == $std->participants_st_id) selected @endif>{{ $std->participants_st_name }}
                                </option>
                            @endforeach
                        </select>
                        <label for="textInputExample">Participanted as*</label>
                    </div>
                </div>

                <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <input type="text" id="timeInputExample" class="form-control" name="participants_hours"
                            placeholder="เช่น 8 หรือ 8.5" pattern="^([1-9]|[1-7][0-9]|80)(\.5)?$"
                            title="กรอกเฉพาะตัวเลข 1-80 หรือ ลงท้ายด้วย .5 เท่านั้น เช่น 8, 8.5, 12" required>
                        <label for="timeInputExample">Hours-Minute*</label>
                    </div>
                </div>

                {{-- <div class="col-md-12">
                    <div class="form-floating mb-4">
                        <select id="timeInputExample" class="form-control" name="participants_hours">
                            <!-- ตัวเลือกเวลาที่นาทีเป็น 00 และ 30 เท่านั้น -->
                            @for ($hour = 0; $hour < 24; $hour++)
                                <option value="{{ sprintf('%02d:00', $hour) }}">{{ sprintf('%02d:00', $hour) }}</option>
                                <option value="{{ sprintf('%02d:30', $hour) }}">{{ sprintf('%02d:30', $hour) }}</option>
                            @endfor
                        </select>
                        <label for="timeInputExample">Hours-Minute*</label>
                    </div>
                </div> --}}
            </div>
            <div align="center">
                <input class="btn btn-blue rounded-pill" type="submit" name="submit" value="Submit">
                <a class="btn btn-grape rounded-pill" href="{{ url('/participantslist', $activity_id) }}"
                    title="List">Back</a>
            </div>
        </form>
    </div>

    @include('layouts.footer')
@endsection