@extends('layouts.app')

@section('content')

<div class="row mb-2">
    <div class="col text-left">
        <a href="{{ url('modules/show/' . $module->id) }}" class="go-back"><small><- Back</small></a>
    </div>
</div>
<h2><small>{{ __('Add video to module:') }}</small><br> {{ $module->name }}</h2>
<div class="row">
    <div class="col-md-7">
        <div class="files-wrapper py-4">
            <form method="POST" action="{{ route('module_video_store', $module->id) }}" enctype="multipart/form-data" novalidate="novalidate">
                @csrf

                <div class="row">
                    <div class="col">
                        <div class="form-group image-group position-relative">
                            <label class="d-block" for="image">{{ __('Thumb') }}*</label>
                            <img id="image-preview" style="max-width:100%" class="mb-2" src="" alt="">
                            <div class="custom-file">
                                <span class="d-block mb-2"></span>
                                <label class="upload-label mt-1" for="image">
                                    Select <i class="fas fa-upload"></i>
                                </label>
                                <input type="file" class="form-control-file image-file-input mt-3" accept="image/x-png,image/jpeg" id="image" name="image" hidden>
                                <div class="help-block d-block"><b>{{ __('Format:') }}</b> {{ __('png, jpg, jpeg') }}<br> <b>{{ __('Dimensions:') }}</b> 180x270</div>
                            </div>
                            @if ($errors->has('image'))
                            <span class="invalid-feedback">{{ $errors->first('image') }}</span>
                            @else
                            <div class="invalid-feedback">{{ __('The image field is required.') }}</div>
                            @endif
                        </div>
                    </div>
                    <div class="col">
                        <div class="form-group position-relative video">
                            <label for="video">{{ __('File') }}*</label>
                            <div class="custom-file mt-4">
                                <span class="d-block mb-2"></span>
                                <label class="upload-label mt-1" for="video">
                                    Select <i class="fas fa-upload"></i>
                                </label>
                                <input type="file" class="form-control-file videofile mt-3" accept="video/mp4" id="video" name="video" hidden>
                                <div class="help-block d-block"><b>{{ __('Format:') }}</b> {{ __('mp4') }}</div>
                            </div>
                            @if ($errors->has('video'))
                            <span class="invalid-feedback">{{ $errors->first('video') }}</span>
                            @else
                            <div class="invalid-feedback">{{ __('The video field is required.') }}</div>
                            @endif
                        </div>
                    </div>
                </div>
                <div class="row mt-5">
                    <div class="col">
                        <div class="form-group">
                            <label for="orientation" class="form-label">{{ __('Initial orientation') }}</label>
                            <input id="orientation" type="number" min="0" max="360" class="form-control initial-orientation" name="orientation" value="{{ old('orientation') ? old('orientation') : 180 }}">
                            @if ($errors->has('orientation'))
                                <span class="invalid-feedback">{{ $errors->first('orientation') }}</span>
                            @else
                                <div class="invalid-feedback">{{ __('The orientation field is required.') }}</div>
                            @endif
                        </div>
                    </div>
                    <div class="col">
                        <div class="form-group">
                            <label class="d-block" for="video-type">{{ __('Type') }}</label>
                            <span class="switch switch-sm">
                                <input type="checkbox" class="switch video-type-switch" id="video-type" name="video-type">
                                <label for="video-type">{{ __('Mono') }}</label>
                            </span>
                        </div>
                    </div>
                </div>

                <div class="form-group row mb-5">
                    <div class="col text-right">
                        <button type="submit" class="btn btn-action">
                            {{ __('Save') }}
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection