@extends('layouts.project-form-base', ['title' => 'Add Draft', 'formTitle' => 'Add New Draft', 'back' => getRoute("project.show", $project->id)])
@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 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 pright-40">
                                    <label for="">Source File:</label>
                                    <div class="document-atach-file">
                                        <input class="form-control custm-form-control valid project_form_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>
                                    @error('source_file')
                                    <span class="invalid-feedback d-block" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                                @if($project->project_type == "1")
                                <div class="form-group pright-40">
                                    <label for="">Preview File:</label>
                                    <div class="document-atach-file">
                                        <input class="form-control custm-form-control valid project_form_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>
                                    @error('preview_file')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                                @else
                                <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>
                                @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}}]" onclick="scrollDown()">
                                        <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}}]" onclick="scrollDown()">
                                        <label for="quetions[{{$quetion->id}}]" >No</label>
                                    </li>
                                </ul>
                                @error('quetions')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                                @enderror
                            </div>
                            @endforeach
                            <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">Submit</button>
                            </div>
                        </div>
                    </fieldset>
                </div>
            </form>
    </div>
</div>
@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="https://cdn.ckeditor.com/4.15.1/standard/ckeditor.js"></script>
<script>
       CKEDITOR.replace( 'editor' );

       function scrollDown() {
        window.scrollTo(0, document.body.scrollHeight);
    }
    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