@extends('layouts.admin_layout.admin_layout')
@section('content')
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!-- content -->
<div class="content-wrapper">
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Manage Episodes</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{url('admin/dashboard')}}">Home</a></li>
                        <li class="breadcrumb-item"><a href="{{ url('admin/episode/'.$series->id) }}">Manage Episode</a>
                        </li>
                        <li class="breadcrumb-item active">Add Episode</li>
                    </ol>
                </div>
            </div>
        </div>
    </section>


    <section class="content">
        <div class="container-fluid">
            <!-- <x-alert /> -->
            <div class="card card-default">
                <div class="card-header">
                    <h3 class="card-title">Add Episode</h3>

                    <div class="card-tools">
                        <button type="button" class="btn btn-tool" data-card-widget="collapse"><i
                                class="fas fa-minus"></i></button>
                        <button type="button" class="btn btn-tool" data-card-widget="remove"><i
                                class="fas fa-remove"></i></button>
                    </div>
                </div>

                <form name="episodeForm" id="episodeForm" action="{{ url('admin/episode-submit/'.$series->id) }}"
                    method="post" enctype="multipart/form-data">@csrf
                    <div class="card-body">
                        <div class="col-md-12">
                            <div class="row">
                                <div class="form-group col-md-6">
                                    <label>Seasons*</label>
                                    <select name="season_id" id="season_id"
                                        class="form-control select2 @error('season_id') is-invalid @enderror"
                                        style="width: 100%;">
                                        <option disabled selected value>Choose Season</option>
                                        @foreach($series->seasons as $season)
                                        <option value="{{$season->id}}"
                                            {{ old('season_id') == $season->id ? 'selected' : '' }}>
                                            {{$season->season_name}}</option>
                                        @endforeach
                                    </select>
                                    @error('season_id')
                                    <div class="alert alert-danger">{{ $message }}</div>
                                    @enderror
                                </div>

                                <!--  -->

                                <div class="form-group col-md-6">
                                    <label for="name">Episode Name*</label>
                                    <input type="text" class="form-control @error('name') is-invalid @enderror"
                                        name="name" id="name" value="{{ old('name') }}"
                                        placeholder="Enter Episode Name">
                                    @error('name')
                                    <div class="alert alert-danger">{{ $message }}</div>
                                    @enderror
                                </div>

                                <!-- -->

                                <div class="form-group col-md-6">
                                    <label>Url Type*</label>
                                    <select name="url_type" id="url_type"
                                        class="form-control select2 @error('url_type') is-invalid @enderror"
                                        value="{{ old('url_type') }}" style="width: 100%;">
                                        <option disabled selected value>Select an --option</option>
                                        @foreach($urltype as $url)
                                        <option value="{{$url->id}}"
                                            {{ old('url_type') == $url->id ? 'selected' : '' }}>{{$url->type_name}}
                                        </option>
                                        @endforeach
                                    </select>
                                    @error('url_type')
                                    <div class="alert alert-danger">{{ $message }}</div>
                                    @enderror
                                </div>

                                <!--  -->

                                <div class="form-group col-md-6" id='url'>
                                    <label for="url">Base Url*</label>
                                    <div class="input-group">
                                        <input type="text" class="form-control @error('url') is-invalid @enderror"
                                            id="url" name="url" value="{{ old('url') }}"
                                            placeholder=" https://www.youtube.com/watch?v=II2EO3">
                                        </div>
                                        @error('url')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                </div>

                                <!--  -->
                                <!--  -->
                                <div class="form-group col-md-6" style="display: none;" id="upload_video">
                                    <label for="video_upload">Video Upload</label>
                                    <div class="input-group">
                                        <input type="file"
                                            class="form-control @error('video_upload') is-invalid @enderror"
                                            id="video_upload" name="video_upload" value="{{ old('video_upload') }}">
                                        @error('video_upload')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <!--  -->
                                
                                <!-- multiple quality url -->
                                <br>
                                
                                <div class="row add_input_fields col-12" id="urlQuality">
                                    <div class="form-group col-md-6">
                                        <label for="">Quality</label>
                                        <input type="text" name="quality[]" class="form-control" id="inputEmail4" placeholder="Quality" style="width:521px;">
                                    </div>
                                    
                                    <div class="form-group col-md-5" style="margin-left:15px;">
                                        <label for="">Url</label>
                                        <input type="text" name="urls[]" class="form-control" id="inputPassword4" placeholder="Url" style="width:470px;">
                                    </div>
                
                                    <button type="button" class="add_input_fields_button" style="height: fit-content;margin-top: 34px;margin-left: 41px;"> <i class="fa fa-plus"></i> </button>
                                </div>

                                <br>                      
                                <!-- multiple quality url -->
                                <!--  -->
                                <br>
                                <div class="form-group col-md-12">
                                    <label>Unlock Content*</label>
                                    <select name="watch_ads" id="watch_ads"
                                        class="form-control select2 @error('watch_ads') is-invalid @enderror"
                                        style="width: 100%;">
                                        <option value='free'>Free</option>
                                        <option value='yes'>Watch with Ads</option>
                                        <option value='paid'>Subscription</option>
                                        <option value='rent'>Rent</option>
                                    </select>
                                    @error('watch_ads')
                                    <p class="alert-danger">{{ $message }}</p>
                                    @enderror
                                </div>


                                <div class="form-group col-md-12" style="display: none;" id='content'>
                                    <label>Monetization</label>
                                    <select name="content_name" id="content_name" class="form-control select2"
                                            style="width: 100%;">
                                        <option disabled selected value>Choose</option>
                                        @foreach($contents as $content)

                                        <option value="{{$content->id}}">{{$content->prdct_name}}</option>

                                        @endforeach
                                    </select>
                                </div>
                            
                                <!--  -->
                                <div class="form-group col-md-6">
                                    <label for="image">Thumbnail*</label>
                                    <div class="input-group">
                                        <input type="file" id="image" name="image"
                                            class="dropify @error('image') is-invalid @enderror"
                                            value="{{ old('image') }}">
                                        @error('image')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <!--  -->
                                <div class="form-group col-md-6">
                                    <label for="banner_image">Poster*</label>
                                    <div class="input-group">
                                        <input type="file" id="banner_image" name="banner_image"
                                            class="dropify @error('banner_image') is-invalid @enderror"
                                            value="{{ old('banner_image') }}">
                                        @error('banner_image')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <div class="form-group">
                                    <input type="hidden" class="form-control" id="series_id" name="series_id"
                                        value="{{ old('series_id') }}">
                                </div>
<br>
                                <div class="col-md-12">
                                    <span class="badge badge-primary">Optional:</span>
                                </div>
                               
                                <div class="form-group col-md-6">
                                    <label for="token">Token</label>
                                    <input type="text" class="form-control" name="token" id="token"value="{{ old('token') }}" placeholder="Enter Token">
                                </div>
                                    
                                    <!-- -->
                                <div class="col-md-6">
                                    <label>Token Hints</label>
                                    <div class="form-group border rounded p-2">
                                        <p>
                                            Token type should be Json type.
                                            Token field name shoud be token(Ex:{token:"asdfgh"}).
                                        </p>
                                    </div>
                                </div>
                                    <!--  -->
                                    
                                <div class="form-group col-md-6">
                                    <label for="user_agent">User Agent</label>
                                    <input type="text" class="form-control" name="user_agent" id="user_agent"
                                                value="{{ old('user_agent') }}" placeholder="Enter User Agent">
                                </div>
                                
                                    <!-- -->
                                <!-- description -->
                                <br>
                                <div class="form-group col-md-12">
                                    <label for="description">
                                        Description
                                    </label>
                                    <textarea class="textarea" placeholder="Place some text here" name="description"
                                        required
                                        style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">
                                        {{Request::old('description')}}
                                    </textarea>
                                </div>
                            </div>
                        </div>
                    </div>

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

<!-- <script>
    $(document).ready(function(){
        var max_fields = 10;
        var wrapper = $(".add_input_fields"); //Fields wrapper
        var add_button = $(".add_input_fields_button"); //Add button ID
        var x = 1; //initlal text box count
        $(add_button).click(function(e){
            e.preventDefault();
            if(x < max_fields){
                x++;
                $(wrapper).append(
                    "<div class='row add_input_fields col-md-12 add_fields' style='margin-left:288px'><div class='form-group col-md-3'><input type='text' name='quality[]' class='form-control' placeholder='Quality'></div><div class='form-group col-md-4'><input type='text' style='margin-left:11px' name='urls[]' class='form-control' placeholder='Url'></div><a href='#' class='remove_field'> <i class='fas fa-times'></i></a></div>"
                    );
                }
            });
            // <input type="text" class="form-control" name="quality[]" placeholder="enter quality 4k,3k,hd"> 
            // <input type="text" class="form-control" name="urls[]" placeholder="enter quality 4k,3k,hd"> 
        $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
            e.preventDefault(); 
            $(this).parent('div').remove();
            x--;
        });
    });
</script> -->



@endsection