@extends('admin.layout.master')
@section('problems', 'active')
@section('contant')
@php
    use Carbon\Carbon;
    $current = Carbon::now();
   $trialExpires = $current->addDays(7);
@endphp
    <div class="content-body">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title" id="tel-repeater">Create Problem</h4>
                        <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a>
                        <div class="heading-elements">
                            <ul class="list-inline mb-0">
                                <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                                <li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li>
                                <li><a data-action="expand"><i class="ft-maximize"></i></a></li>
                                <li><a data-action="close"><i class="ft-x"></i></a></li>
                            </ul>
                        </div>
                    </div>
                    {{-- @if (session('success')) <div class="alert-success">{{session('success')}}</div> @endif --}}

                    <div class="card-content collapse show">
                        <div class="card-body">
                            @if (Session::get('errors'))
                                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                        <span class="sr-only">Close</span>
                                    </button>
                                    <strong>{{ Session::get('errors')->first() }}</strong>
                                </div>
                                {!! Session::forget('errors') !!}
                            @endif
                            @if (Session::get('success'))
                                <div class="alert alert-success alert-dismissible fade show" role="alert">
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                        <span class="sr-only">Close</span>
                                    </button>
                                    <strong>{{ Session::get('success') }}</strong>
                                </div>
                                {!! Session::forget('success') !!}
                            @endif
                            <form class="row" action="{{route('admin.create.problem.process')}}" method="post">
                                @csrf
                                <div class="form-group col-md-12 mb-2">
                                    <label for="Title">Title (Required)</label>
                                    <input type="text" id="Title" class="form-control border-info" placeholder="Title"
                                        name="title" value="{{old('Title')}}">
                                        @error('title')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <fieldset class="form-group">
                                        <label for="DescribeProblem">Describe Problem (Optional)</label>
                                        <textarea class="form-control border-info" id="DescribeProblem" rows="3"
                                            placeholder="Describe problem (as a binary question)" name="description">{{old('description')}}</textarea>
                                            @error('description')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <label for="total_answer">Total Answer</label>
                                    <select id="total_answer" name="total_answer" class="form-control border-info">
                                        {{-- <option value="none" selected="" disabled="">select</option> --}}
                                        <option value="2" @if(old('total_answer')=="2") selected @endif >2</option>
                                        <option value="3" @if(old('total_answer')=="3") selected @endif >3</option>
                                        <option value="4" @if(old('total_answer')=="4") selected @endif >4</option>
                                        <option value="5" @if(old('total_answer')=="5") selected @endif >5</option>
                                        <option value="6" @if(old('total_answer')=="6") selected @endif >6</option>
                                        <option value="7" @if(old('total_answer')=="7") selected @endif >7</option>
                                        <option value="8" @if(old('total_answer')=="8") selected @endif >8</option>
                                    </select>
                                    <span class="text-danger">{{ $errors->first('total_answer') }}</span>
                                </div>

                                <div class="form-group col-md-6 mb-2">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#1" class="text-info">Answer #1</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer1_hide" value="yes" @if(old('is_answer1_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer1_hide" value="no" @if(old('is_answer1_hide')=='no') checked @elseif(empty(old('is_answer1_hide'))) checked @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer1_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#1" class="form-control border-info"
                                            placeholder="Answer#1" name="answer1" value="{{old('answer1')}}">
                                            @error('answer1')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#2" class="text-info">Answer #2</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer2_hide" value="yes" @if(old('is_answer2_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer2_hide" value="no" @if(old('is_answer2_hide')=='no') checked @elseif(empty(old('is_answer2_hide'))) checked @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer2_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#2" class="form-control border-info"
                                            placeholder="Answer#2" name="answer2" value="{{old('answer2')}}">
                                        @error('answer2')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer3" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#3" class="text-info">Answer #3</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer3_hide" value="yes" @if(old('is_answer3_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer3_hide" value="no" @if(old('is_answer3_hide')=='no') checked @elseif(empty(old('is_answer3_hide'))) checked @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer3_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#3" class="form-control border-info"
                                            placeholder="Answer#3" name="answer3" value="{{old('answer3')}}">
                                        @error('answer3')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer4" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#4" class="text-info">Answer #4</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer4_hide" value="yes" @if(old('is_answer4_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer4_hide" value="no" @if(old('is_answer4_hide')=='no') checked @elseif(empty(old('is_answer4_hide'))) checked @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer4_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#4" class="form-control border-info"
                                            placeholder="Answer#4" name="answer4" value="{{old('answer4')}}">
                                        @error('answer4')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer5" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#5" class="text-info">Answer #5</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer5_hide" value="yes" @if(old('is_answer5_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer5_hide" value="no" @if(old('is_answer5_hide')=='no') checked @elseif(empty(old('is_answer5_hide'))) checked  @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer5_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#5" class="form-control border-info"
                                            placeholder="Answer#5" name="answer5" value="{{old('answer5')}}">
                                        @error('answer5')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer6" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#6" class="text-info">Answer #6</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer6_hide" value="yes"  @if(old('is_answer6_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer6_hide" value="no"  @if(old('is_answer6_hide')=='no') checked @elseif(empty(old('is_answer6_hide'))) checked  @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer6_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#6" class="form-control border-info"
                                            placeholder="Answer#6" name="answer6" value="{{old('answer6')}}">
                                        @error('answer6')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer7" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#7" class="text-info">Answer #7</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer7_hide" value="yes" @if(old('is_answer7_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer7_hide" value="no" @if(old('is_answer7_hide')=='no') checked @elseif(empty(old('is_answer7_hide'))) checked  @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer7_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#7" class="form-control border-info"
                                            placeholder="Answer#7" name="answer7" value="{{old('answer7')}}">
                                        @error('answer7')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-6 mb-2 answer8" style="display:none">
                                    <fieldset class="form-group">
                                        <div class="row justify-content-between">
                                            <div class="col-md-6">
                                                <label for="Answer#8" class="text-info">Answer #8</label>
                                            </div>
                                            <div class="col-md-6 text-right">
                                                <fieldset class="radio">
                                                    <label class="text-info"></label>
                                                    <label for="correct">Hide Answer?</label>
                                                    <label>
                                                        <input type="radio" name="is_answer8_hide" value="yes" @if(old('is_answer8_hide')=='yes') checked @endif> Yes
                                                    </label>
                                                    <label>
                                                        <input type="radio" name="is_answer8_hide" value="no" @if(old('is_answer8_hide')=='no')  checked @elseif(empty(old('is_answer8_hide'))) checked @endif> No
                                                    </label>
                                                </fieldset>
                                                @error('is_answer8_hide')
                                                        <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <input type="text" id="Answer#8" class="form-control border-info"
                                            placeholder="Answer#8" name="answer8" value="{{old('answer8')}}">
                                            @error('answer8')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </fieldset>
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <fieldset class="radio">
                                        <label for="correct">Do you want to hide the question?</label>
                                        <label>
                                            <input type="radio" name="is_question_hide" value="yes" @if(old('is_question_hide')=='yes') checked @endif> Yes
                                        </label>
                                        <label>
                                            <input type="radio" name="is_question_hide" value="no" @if(old('is_question_hide')=='no') checked @elseif(empty(old('is_question_hide'))) checked @endif> No
                                        </label>
                                    </fieldset>
                                    @error('is_question_hide')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <fieldset class="radio">
                                        <label for="correct">Do you want to show the answer..?</label>
                                        <label>
                                            <input type="radio" name="is_hide" value="0" checked> Yes
                                        </label>
                                        <label>
                                            <input type="radio" name="is_hide" value="1"> No
                                        </label>
                                    </fieldset>
                                    @error('is_hide')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <label for="MaxUser">Max # Per/User</label>
                                    <input type="number" id="MaxUser" class="form-control border-info"
                                        placeholder="type..." name="max_user" min="1" @if(!empty(old('max_user'))) value="{{old('max_user')}}" @else value="1" @endif>
                                        @error('max_user')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <label for="MaxTotal">Max # Total</label>
                                    <input type="number" id="MaxTotal" class="form-control border-info"
                                        placeholder="type..." name="max_total" min="1" @if(!empty(old('max_total')))  value="{{old('max_total')}}" @else value="1" @endif >
                                        @error('max_total')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <label for="EndDate">End Date & Time</label>
                                    <input type="datetime-local" id="EndDate" class="form-control border-info" name="end_date" @if(!empty(old('end_date')))  value="{{old('end_date')}}" @else value="{{$trialExpires}}" @endif>
                                    @error('end_date')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                    @if(session('expiry_error')) <div class="text-danger">{{session('expiry_error')}}</div> @endif
                                </div>
                                <div class="form-group col-md-12 mb-2">
                                    <label for="MaxTotal">Score</label>
                                    <input type="number" id="score" step='0.1' value="0" class="form-control border-info"
                                        placeholder="type..." name="score" value="{{old('score')}}">
                                    @error('score')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                                {{-- <div class="form-group col-md-12 mb-2">
                                    <fieldset class="radio">
                                        <label for="correct">Correct Answer</label>
                                        <label>
                                            <input type="radio" name="correct" value="1" > # 1
                                        </label>
                                        <label>
                                            <input type="radio" name="correct" value="2"> # 2
                                        </label>
                                        <label class="answer3" style="display:none">
                                            <input type="radio" name="correct" value="3"> # 3
                                        </label>
                                        <label class="answer4" style="display:none">
                                            <input type="radio" name="correct" value="4"> # 4
                                        </label>
                                        <label class="answer5" style="display:none">
                                            <input type="radio" name="correct" value="5"> # 5
                                        </label>
                                        <label class="answer6" style="display:none">
                                            <input type="radio" name="correct" value="6"> # 6
                                        </label>
                                        <label class="answer7" style="display:none">
                                            <input type="radio" name="correct" value="7"> # 7
                                        </label>
                                        <label class="answer8" style="display:none">
                                            <input type="radio" name="correct" value="8"> # 8
                                        </label>

                                    </fieldset>
                                    @error('correct')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div> --}}
                                <div class="form-group col-md-12 text-right">
                                    <button type="submit" class="btn btn-info">
                                        <i class="la la-check-square-o"></i> Create
                                    </button>
                                    <a href="{{route('superadmin.problems')}}" class="btn btn-warning mr-1">
                                        <i class="la la-angle-left"></i> Back
                                      </a>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('script')
    <script>
        $(document).ready(function() {
            total_answer = $('#total_answer').val();
            if (total_answer == 2) {
                $('.answer3').hide()
                $('.answer4').hide()
                $('.answer5').hide()
                $('.answer6').hide()
                $('.answer7').hide()
                $('.answer8').hide()
            } else if (total_answer == 3) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').hide()
                $('.answer5').hide()
                $('.answer6').hide()
                $('.answer7').hide()
                $('.answer8').hide()
            } else if (total_answer == 4) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').show()
                $('.answer5').hide()
                $('.answer6').hide()
                $('.answer7').hide()
                $('.answer8').hide()
            } else if (total_answer == 5) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').show()
                $('.answer5').show()
                $('.answer6').hide()
                $('.answer7').hide()
                $('.answer8').hide()
            } else if (total_answer == 6) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').show()
                $('.answer5').show()
                $('.answer6').show()
                $('.answer7').hide()
                $('.answer8').hide()
            } else if (total_answer == 7) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').show()
                $('.answer5').show()
                $('.answer6').show()
                $('.answer7').show()
                $('.answer8').hide()
            } else if (total_answer == 8) {
                //alert("ok");
                $('.answer3').show()
                $('.answer4').show()
                $('.answer5').show()
                $('.answer6').show()
                $('.answer7').show()
                $('.answer8').show()
            }
            $(document).on("change", "#total_answer", function() {
                total_answer = $(this).val();
                //alert(total_answer);
                if (total_answer == 2) {
                    $('.answer3').hide()
                    $('.answer4').hide()
                    $('.answer5').hide()
                    $('.answer6').hide()
                    $('.answer7').hide()
                    $('.answer8').hide()
                } else if (total_answer == 3) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').hide()
                    $('.answer5').hide()
                    $('.answer6').hide()
                    $('.answer7').hide()
                    $('.answer8').hide()
                } else if (total_answer == 4) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').show()
                    $('.answer5').hide()
                    $('.answer6').hide()
                    $('.answer7').hide()
                    $('.answer8').hide()
                } else if (total_answer == 5) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').show()
                    $('.answer5').show()
                    $('.answer6').hide()
                    $('.answer7').hide()
                    $('.answer8').hide()
                } else if (total_answer == 6) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').show()
                    $('.answer5').show()
                    $('.answer6').show()
                    $('.answer7').hide()
                    $('.answer8').hide()
                } else if (total_answer == 7) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').show()
                    $('.answer5').show()
                    $('.answer6').show()
                    $('.answer7').show()
                    $('.answer8').hide()
                } else if (total_answer == 8) {
                    //alert("ok");
                    $('.answer3').show()
                    $('.answer4').show()
                    $('.answer5').show()
                    $('.answer6').show()
                    $('.answer7').show()
                    $('.answer8').show()
                }
            });
        });
    </script>
@endpush