@extends('layouts.project-form-base', ['title' => 'Add Draft', 'formTitle' => 'Add New Draft', 'back' =>
getRoute("project.show", $project->id), 'custom_class' => 'add_extended_pro'])
@section('content')
@section('css')
<style>
    #wrapper {
        padding: 0px;
    }
</style>
@endsection
@section('content')
<div class="new-member pt-10 mt-0" id="msform">
    <div class="container">
        @if(isset($draft))
        <form id="AddDraftForm" method="POST"
            action="{{ getRoute('project.drafts.update', [$project->id, $draft->id]) }}" enctype="multipart/form-data">
            @method('PUT')
            @else
            <form class="position-relative" id="AddDraftForm" method="POST"
                action="{{ getRoute('project.drafts.store', $project->id) }}" enctype="multipart/form-data">
                @endif
                @csrf
                <input type="hidden" name="project_type" value="{{$project->project_type ?? ''}}">
                <div class="row">
                    <fieldset>
                        <div class="tab-content outer-context">
                            <div role="tabpanel" class="tab-pane active" id="home">
                                <div class="form-group image-uploader-js">
                                    <label for="">Source File:</label>
                                    <div class="document-atach-file">
                                        <input
                                            class="form-control custm-form-control valid project_form_input required_input"
                                            type="file" id="add_files" name="source_file" aria-invalid="false">
                                        <span class="material-icons mall_icon">backup</span>
                                        <strong>Drag & drop files here</strong>
                                        <span>or <b>browse</b> to choose a file</span>
                                        <p>Formats accepted Doc,<span>Docx, Odt, Pdf, Jpg, Png, Jpeg, Psd, Ai, Zip, Mp4,
                                                Mov, tiff,
                                                ttf, eps</span></p>
                                    </div>

                                    <ul class="cat-img-listing"></ul>

                                    @error('source_file')
                                    <span class="invalid-feedback d-block" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                                @if($project->project_type == "2")
                                <div class="form-group pright-40">
                                    <label for="">Preview File:</label>
                                    <textarea name="preview_content" id="editor"
                                        class="project_form_input custm-form-control py-3 form-control"></textarea>
                                    @error('preview_content')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                                @else

                                <div class="form-group image-uploader-js">
                                    <label for="">Preview File:</label>
                                    <div class="document-atach-file">
                                        <input
                                            class="form-control custm-form-control valid project_form_input required_input"
                                            type="file" id="add_files" name="preview_file" aria-invalid="false">
                                        <span class="material-icons mall_icon">backup</span>
                                        <strong>Drag & drop files here</strong>
                                        <span>or <b>browse</b> to choose a file</span>
                                        <p>Formats accepted Doc,<span>Docx, Odt, Pdf, Jpg, Png, Jpeg, Psd, Ai, Zip, Mp4,
                                                Mov, tiff,
                                                ttf, eps</span></p>
                                    </div>

                                    <ul class="cat-img-listing"></ul>

                                    @error('preview_file')
                                    <span class="invalid-feedback d-block" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                                @endif
                            </div>
                        </div>
                        <div class="form_btn_action">
                            <button type="button" class="next action-button" data-type="next">Proceed</button>
                        </div>
                    </fieldset>
                    <fieldset>
                        <div class="tab-content outer-context">
                            @foreach($questionnairs as $key => $quetion)
                            <div class="form-group @if(!$loop->first) d-none @endif">
                                <label for="" class="mt-27"> {{$quetion->title ?? ''}}</label>
                                <ul class="btn-listing">
                                    <li class="btn-listing-li field_yes">
                                        <input type="radio" id="quetions[{{$quetion->id}}]" value="Yes"
                                            name="quetions[{{$quetion->id}}]">
                                        <label for="quetions[{{$quetion->id}}]">Yes</label>
                                    </li>
                                    <li class="btn-listing-li field_no">
                                        <input type="radio" id="quetions[{{$quetion->id}}]" value="No"
                                            name="quetions[{{$quetion->id}}]">
                                        <label for="quetions[{{$quetion->id}}]">No</label>
                                    </li>
                                </ul>

                                @error('quetions')
                                <span class="invalid-feedback d-block" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                                @enderror
                            </div>
                            @endforeach
                            <div class="form-group d-none">
                                <label for="" class="mt-27">Expected Time (in Minutes)</label>
                                <select name="expected_time" class="form-control mb-5">
                                    <option>Select Time</option>
                                    @for($i = 1; $i <= 24; $i++) <option value="{{$i * 15}}">{{$i * 15}} Minute</option>
                                        @endfor
                                </select>
                            </div>
                            <div class="form_btn_action form-group d-none">
                                <button type="button" class="prev action-button" data-type="prev">Previous</button>
                                <button type="submit" class="action-button draft-submit">Submit</button>
                            </div>
                        </div>
                    </fieldset>
                </div>
            </form>
    </div>
</div>
@include('inc.logo-loader')
@endsection
@section('script')
<script src="{{asset('assets/front/common/js/next-prev.js?v='.time())}}"></script>
<script src="{{asset('assets/front/common/js/showNextInput.js?v='.time())}}"></script>
<script src="{{asset('assets/plugins/ckeditor/ckeditor.js?v='.time())}}"></script>
<script>
    var ckeditor_element = document.getElementById('editor');
    if (ckeditor_element) {
        CKEDITOR.replace( 'editor' );
    }

$(document).ready(function(){
    $(".draft-submit").click(function(){
        $(".logo-loader-js").show();
    });
});

document.addEventListener("change", function(event) {
        // Check if the changed element is a radio button
        if (event.target.type === "radio") {
            // If so, trigger the scroll action
            scrollDown();
        }
    });

    // Scroll function
    function scrollDown() {
        window.scrollTo(0, document.body.scrollHeight);
    }
</script>
@endsection