@extends("admin.admin")
@section('adminContent')

<!-- ============================================================== -->
<!-- Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<div class="row page-titles">
    <div class="col-md-5 align-self-center">
        <h3 class="text-themecolor">Add Videos</h3>
    </div>
    <div class="text-right col-md-7" style="line-height: 4.5;">
        <a class=" waves-effect waves-light btn-warning btn" href="{{URL::to('admin/adminEventList')}}">Event List</a>
    </div>

    <div>
        <button class="right-side-toggle waves-effect waves-light btn-inverse btn btn-circle btn-sm pull-right m-l-10"><i class="ti-settings text-white"></i></button>
    </div>
</div>
<!-- ============================================================== -->
<!-- End Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Container fluid  -->
<!-- ============================================================== -->
<div class="container-fluid">


    <!-- Row -->


    <div class="row">
        <div class="col-6 offset-3">
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <div class="col-12">
                            <form action="" enctype="multipart/form-data" method="post">
                                @csrf
                                <div class="form-body pcustom">
                                    <!--@if($message=Session::get('success'))-->
                                    <!--<div class="alert alert-success" role="alert">-->
                                    <!--    {{$message}}-->
                                    <!--</div>-->
                                    <!--@elseif($message=Session::get('error'))-->
                                    <!--<div class=" alert alert-danger" role="alert">-->
                                    <!--    {{$message}}-->
                                    <!--</div>-->

                                    <!--@endif-->
                                    <div class="row ">

                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label class="control-label">Select Event<sup class="text-danger">*</sup></label>
                                                <select class="form-control" name="event">
                                                    <option value="{{old('event')}}" selected>--Select Event--</option>
                                                    @if($event)
                                                    @foreach($event as $item)
                                                    <option value="{{$item['event_id']}}">{{$item['event']}}</option>
                                                    @endforeach
                                                    @endif
                                                </select>
                                                @error('event')<div class="alert alert-danger"> {{$message}} </div> @enderror
                                            </div>
                                            <div class="form-group">
                                                <div id="linkElement">
                                                    <label class="control-label">Insert Link<sup class="text-danger">*</sup></label>
                                                    <input type="url" placeholder="Youtube video link*" name="link[]" class="form-control mb-3">
                                                </div>
                                                @error('link')
                                                <div class="alert alert-danger">
                                                   {{$message}}
                                                </div>
                                                @enderror
                                                
                                                <p class="text-primary btn-outline-none " style="cursor:pointer" id="addNewElement">Add More</p>
                                            </div>
                                        </div>

                                        <div class="col-lg-12 col-md-12 text-center">
                                            <button type="reset" class="btn btn-inverse waves-effect waves-light">Reset</button>

                                            <button class="btn btn-warning waves-effect waves-light" type="submit">Submit</button>
                                        </div>

                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Row -->
            <!-- ============================================================== -->
            <!-- End PAge Content -->
            <!-- ============================================================== -->
            <!-- ============================================================== -->
            <!-- Right sidebar -->
            <!-- ============================================================== -->

        </div>
    </div>
</div>
<!-- ============================================================== -->
<!-- End Container fluid  -->
<!-- ============================================================== -->
<script>
    $(document).ready(function(){
        $('#addNewElement').on('click',function(){
            const link = document.createElement('input');
            link.type='url';
            link.name='link[]';
            link.className='form-control mb-3';
            $('#linkElement').append(link);
        })
    })
</script>
@stop