@extends('admin.layouts.master')

@section('content')
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">Create Challenges</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{asset('/')}}">Home</a></li>
                        <li class="breadcrumb-item active">
                            <a href="{{asset(route('challenges.index'))}}">Challenges</a>
                        </li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    @if(session()->has('success'))
        <div class="alert alert-success">
            {{ session()->get('success') }}
        </div>
    @endif
    @if(session()->has('error'))
        <div class="alert alert-success">
            {{ session()->get('error') }}
        </div>
    @endif
    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div><br />
    @endif
    <section class="content">
        <div class="row">
            <div class="col-12">
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">Create Challenge</h3>
                    </div>
                    <div class="card-body">
                        <form role="form" method="post" action="{{ !isset($challenge->id) ? route('challenges.store') : route('challenges.update', $challenge->id) }}" enctype="multipart/form-data">
                            @csrf
                            @if(isset($challenge->id))
                            {{ method_field('PUT') }}
                            @endif
                            <div class="card-body">
                                <!-- Challenge Title -->
                                <div class="form-group">
                                    <label for="title">Challenge Title</label>
                                    <input type="text" class="form-control" id="title" name="title" required placeholder="Enter Challenge Title" value="{{ old('title', $challenge->title ?? '') }}">
                                </div>

                                <!-- About the Challenge -->
                                <div class="form-group">
                                    <label for="about">About the Challenge</label>
                                    <textarea class="form-control" id="about" name="about" required placeholder="Enter Challenge Details">{{ old('about', $challenge->about ?? '') }}</textarea>
                                </div>

                                <!-- Terms and Conditions -->
                                <div class="form-group">
                                    <label for="terms_conditions">Terms and Conditions(*Each new line is a new bullet point)</label>
                                    <textarea class="form-control" id="terms_conditions" name="terms_conditions" required placeholder="Enter Terms and Conditions">{{ old('terms_conditions', $challenge->terms_conditions ?? '') }}</textarea>
                                </div>

                                <!-- Duration -->
                                <div class="form-group">
                                    <label for="duration">Duration</label>
                                    <input type="number" class="form-control" id="duration" name="duration" required placeholder="Enter Duration" value="{{ old('duration', $challenge->duration ?? '') }}">
                                </div>

                                <!-- Duration Type -->
                                <div class="form-group" style="display:none;">
                                    <label for="duration_type">Duration Type</label>
                                    <select class="form-control select2" style="width: 100%;" name="duration_type">
                                        <option value="days" {{ (old('duration_type', $challenge->duration_type ?? '') == 'days') ? 'selected' : '' }}>Days</option>
                                        <option value="weeks" {{ (old('duration_type', $challenge->duration_type ?? '') == 'weeks') ? 'selected' : '' }}>Weeks</option>
                                        <option value="months" {{ (old('duration_type', $challenge->duration_type ?? '') == 'months') ? 'selected' : '' }}>Months</option>
                                    </select>
                                </div>

                                <div class="form-group">
                                    <label for="duration_type">Difficulty Level</label>
                                    <input type="text" class="form-control" id="difficulty_level" name="difficulty_level" placeholder="Difficulty Level" value="{{ old('difficulty_level', $challenge->difficulty_level ?? '') }}">
                                </div>

                                <!-- Target Audience -->
                                <div class="form-group">
                                    <label for="target_audience">Target Audience</label>
                                    <input type="text" class="form-control" id="target_audience" name="target_audience" required placeholder="Enter Target Audience" value="{{ old('target_audience', $challenge->target_audience ?? '') }}">
                                </div>

                                <!-- Specific Days (optional) -->
                                <div class="form-group" style="display:none;">
                                    <label for="days">Specific Days (Optional)</label>
                                    <select class="form-control select2" multiple="multiple" style="width: 100%;" name="days[]">
                                        <option value="Monday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Monday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Monday</option>
                                        <option value="Tuesday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Tuesday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Tuesday</option>
                                        <option value="Wednesday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Wednesday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Wednesday</option>
                                        <option value="Thursday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Thursday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Thursday</option>
                                        <option value="Friday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Friday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Friday</option>
                                        <option value="Saturday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Saturday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Saturday</option>
                                        <option value="Sunday" {{ (is_array(old('days', json_decode($challenge->days ?? '[]'))) && in_array('Sunday', old('days', json_decode($challenge->days ?? '[]')))) ? 'selected' : '' }}>Sunday</option>
                                    </select>
                                </div>
                                <div class="row form-group">
                                    <div class="col">
                                        <label>Thumbnail</label>
                                        <input type = "file" data-max-file-size="100K" {{!$challenge['id'] ? 'required' : ''}} name = "thumbnail"  class="dropify" data-default-file="{{ old('thumbnail', $challenge['thumbnail']) }}" data-show-remove="false">
                                    </div>
                                </div>
                            </div>

                            <div class="card-footer">
                                <button type="submit" class="btn btn-primary">Submit</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection