@extends('desktop.layouts.app')

@section('content')
<div id="boardView" class="container">
    <div class="head">
        <h4>{{ $board->name }}</h4>
    </div>

    <div class="body">
        <table class="table table-borderless">
            <colgroup>
                @if($boardMeta->show_user_thumb_in_post)
                    <col width="82px"/>
                @endif
                <col width="*"/>
                <col width="*"/>
            </colgroup>
            <thead>
                <tr>
                    <th colspan="3">
                        <h4>
                            @if($post->is_notice || $post->is_speaker) [공지] @endif
                            @if($post->is_secret) <i class="fas fa-lock me-1"></i> @endif
                            {{ $post->subject }}
                        </h4>
                    </th>
                </tr>
                <tr>
                    <th rowspan="2" @if(!$boardMeta->show_user_thumb_in_post) class="w-0 p-0" @endif>
                        @if($boardMeta->show_user_thumb_in_post)
                            <img src="{{ $post->user->thumb }}" class="profile" width="82" height="82" alt="{{ $post->username }}" onerror="this.src='{{ NO_IMAGE_THUMB_SRC }}'"/>
                        @endif
                    </th>
                    <td>
                        <strong>{{ $post->username }}</strong> @if($boardMeta->use_post_user_regdate && $post->user->createdAt)<small>{{ $post->user->createdAt }}</small>@endif
                    </td>
                    <td>{{ $post->createdAt }}</td>
                </tr>
                <tr>
                    <td>
                        <ul>
                            <li><span>조회 <var id="txtPostHitCnt">{{ $post->hit }}</var></span></li>
                            @if(($boardMeta->use_comment) && $post->use_comment)
                                <li><span>댓글 <var id="txtPostCommentCnt">{{ $post->comment_rows }}</var></span></li>
                            @endif
                            @if($boardMeta->use_post_like)
                                <li><span>좋아요 <var id="txtPostLikeCnt">{{ $post->like }}</var></span></li>
                            @endif
                            @if($boardMeta->use_post_dislike)
                                <li><span>싫어요 <var id="txtPostDislikeCnt">{{ $post->dislike }}</var></span></li>
                            @endif
                            @if($boardMeta->show_post_ip || IS_ADMIN)
                                <li><span>{!! $post->ipAddress !!}</span></li>
                            @endif
                        </ul>
                    </td>
                    <td>
                        <ul>
                            @if($boardMeta->use_url_qrcode)
                                <li>
                                    <span>
                                        <i class="fa fa-qrcode"></i>
                                        <a href="{{ $post->viewURL }}" id="btnPostQRCode" data-title="{{ $post->subject }}">QR</a>
                                    </span>
                                </li>
                            @endif
                            @if($boardMeta->use_print)
                                <li>
                                    <span>
                                        <i class="fa fa-print"></i>
                                        <a href="{{ $post->viewURL }}" id="btnPostPrint">인쇄</a>
                                    </span>
                                </li>
                            @endif
                            @if($boardMeta->use_copy_post_url)
                                <li>
                                    <span>
                                        <i class="fa fa-link"></i>
                                        <a href="{{ $post->viewURL }}" id="btnPostCopy">주소</a>
                                    </span>
                                </li>
                            @endif
                            @if($boardMeta->use_sns)
                                <li>
                                    <span>
                                        <i class="fa-solid fa-share-nodes"></i>
                                        <a href="{{ $post->viewURL }}" class="dropdown-toggle" aria-expanded="false" data-bs-toggle="dropdown" data-bs-offset="0,10">공유</a>
                                        <div class="dropdown dropdown-menu-end">
                                            <ol class="dropdown-menu">
                                                <li class="dropdown-item btn-post-sns" data-target="1"><i class="fa-brands fa-facebook"></i> Facebook</li>
                                                <li class="dropdown-item btn-post-sns" data-target="2"><i class="fa-brands fa-twitter"></i> Twitter</li>
                                                <li class="dropdown-item btn-post-sns" data-target="3"><i class="fa-brands fa-reddit"></i> Reddit</li>
                                            </ol>
                                        </div>
                                    </span>
                                </li>
                            @endif
                        </ul>
                    </td>
                </tr>
            </thead>
            <tbody>
                @if($post->files->count() > 0 || $post->links->count() > 0)
                <tr>
                    <td colspan="3">
                        <ol>
                            {{-- Links --}}
                            @if($post->links->count() > 0)
                            @foreach($post->links as $link)
                                <li>
                                    <a href="{{ $link->url }}" class="btn-site-url" title="{{ $link->url }}" data-lid="{{ $link->id }}" target="_blank" rel="external">
                                        <i class="fas fa-external-link-alt"></i> {{ $link->url }}
                                    </a>
                                    @if($boardMeta->use_attached_url_qrcode)
                                        <a href="{{ $link->url }}" class="btn-qr-code border-start ps-2 ms-1" data-title="{{ $link->url }}">
                                            <i class="fa fa-qrcode"></i>
                                        </a>
                                    @endif
                                </li>
                            @endforeach
                            @endif

                            {{-- Files --}}
                            @if($post->files->count() > 0)
                            @foreach($post->files as $file)
                                <li>
                                    <a href="#" class="btn-file-download" title="{{ $file->origin_name }}" data-fid="{{ $file->id }}" target="_self" rel="tag">
                                        <i class="fas fa-save"></i> {{ $file->origin_name }} ({{ byteFormat($file->file_size, 2) }})
                                    </a>
                                </li>
                            @endforeach
                            @endif
                        </ol>
                    </td>
                </tr>
                @endif
                <tr>
                    <td colspan="3">
                        <blockquote>
                            {!! $post->content !!}
                        </blockquote>
                    </td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td colspan="3">
                        @if($boardMeta->use_post_like)
                            <button type="button" id="btnPostLike" class="btn btn-dark" value="1" data-active="{{ $post->isLike ? 1 : 0 }}" data-rows="{{ $post->like }}">
                                @if($post->isLike)
                                    <i class="fas fa-thumbs-up"></i>
                                @else
                                    <i class="far fa-thumbs-up"></i>
                                @endif
                                <span>{{ $post->like }}</span>
                            </button>
                        @endif
                        @if($boardMeta->use_post_dislike)
                            <button type="button" id="btnPostDislike" class="btn btn-dark" value="2" data-active="{{ $post->isDislike ? 1 : 0 }}" data-rows="{{ $post->dislike }}">
                                @if($post->isDislike)
                                    <i class="fas fa-thumbs-down"></i>
                                @else
                                    <i class="far fa-thumbs-down"></i>
                                @endif
                                <span>{{ $post->dislike }}</span>
                            </button>
                        @endif
                    </td>
                </tr>
                <tr>
                    <td colspan="3">
                        @if($post->tags->count() > 0)
                            <i class="fas fa-tags"></i>
                            {{ join(', ', array_column($post->tags->toArray() ?? [], 'tag')) }}
                        @endif
                    </td>
                </tr>
            </tfoot>
        </table>

        <nav>
            <div class="row">
                <div class="col">
                    <a href="{{ $listURL }}" class="btn btn-dark">목록</a>
                    @if($boardMeta->use_prev_next_post)
                        @if($post->beforePostID)
                            <a href="{{ $post->beforeViewURL }}" class="btn btn-dark">이전글</a>
                        @endif
                        @if($post->nextPostID)
                            <a href="{{ $post->nextViewURL }}" class="btn btn-dark">다음글</a>
                        @endif
                    @endif
                </div>
                <div class="col text-end">
                    <!-- 관리 -->
                    @auth
                        @if($boardMeta->use_bookmark)
                            <button type="button" name="btn_post_bookmark" id="btnPostBookmark" class="btn btn-dark @if($post->isBookmark) active @endif">즐겨찾기</button>
                        @endif
                    @endauth
                    @if($boardMeta->use_blame)
                        <button type="button" name="btn_post_blame" id="btnPostBlame" class="btn btn-dark" data-bs-toggle="modal" data-bs-target="#postBlameModal">신고</button>
                    @endif
                    @can('update', [$post, $boardMeta])
                        <button type="button" name="btn_post_edit" id="btnPostEdit" class="btn btn-primary">수정</button>
                    @endcan
                    @can('delete', [$post, $boardMeta])
                        <button type="button" name="btn_post_delete" id="btnPostDelete" class="btn btn-danger">삭제</button>
                    @endcan
                </div>
            </div>
        </nav>
    </div>

    @if($boardMeta->use_comment && $post->use_comment)
    <div class="foot">
        <table class="table table-borderless">
            <thead>
                <tr>
                    <th>
                        <div class="row">
                            <div class="col align-self-end">
                                <h5>
                                    댓글 <span id="txtCommentRows">{{ $post->comment_rows }}</span>개
                                </h5>
                            </div>
                            <div class="col-auto">
                                @if($post->comment_rows > 0)
                                <select id="commentSort" class="form-select w-auto">
                                    <option value="1">등록순</option>
                                    <option value="2">최신순</option>
                                    <option value="3">공감순</option>
                                    <option value="4">댓글순</option>
                                </select>
                                @endif
                            </div>
                        </div>
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        <!-- 댓글 목록 -->
                        <div id="commentList"></div>

                        <!-- 댓글 작성 -->
                        <div id="commentWrite">
                            @include('desktop.board.comment.write')
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    @endif

    @if($boardMeta->use_url_qrcode || $boardMeta->use_attached_url_qrcode)
    {{-- QR 코드 --}}
    <div id="modalQRCode" class="modal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header bg-dark text-white">
                    <h5 class="modal-title">게시글 QR</h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body text-center"></div>
                <div class="modal-footer justify-content-center">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
                </div>
            </div>
        </div>
    </div>
    @endif

    @if($boardMeta->use_blame)
    {{-- 신고하기 --}}
    <div class="modal fade" id="postBlameModal" tabindex="-1" aria-labelledby="postBlameModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header bg-dark text-white">
                    <h5 class="modal-title" id="postBlameModalLabel">게시글 신고하기</h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form name="f_post_blame" id="fPostBlame" class="f-post-blame">
                        <div class="mb-3">
                            <label for="type" class="form-label">신고 유형</label>
                            <select name="type" class="form-select">
                                <option value="">신고 유형을 선택해주세요.</option>
                                @foreach(MAP_BLAME_TYPE as $k => $v)
                                    <option value="{{ $k }}">{{ $v }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="reason" class="form-label">신고 내용</label>
                            <textarea name="reason" class="form-control" rows="4" minlength="1" maxlength="1000" placeholder="신고 내용을 상세하게 입력해주세요."></textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer justify-content-center">
                    <button type="submit" class="btn btn-primary" form="fPostBlame">확인</button>
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">취소</button>
                </div>
            </div>
        </div>
    </div>
    @endif

    <form name="f_post_view" id="fPostView" accept-charset="UTF-8" autocomplete="off" rel="nofollow">
        @csrf
        <input type="hidden" name="code" value="{{ $board->code }}"/>
        <input type="hidden" name="bid" value="{{ $post->board_id }}"/>
        <input type="hidden" name="pid" value="{{ $post->id }}"/>
        <input type="hidden" name="uid" value="{{ $post->user_id }}"/>
        <input type="hidden" name="list_url" value="{{ $listURL }}"/>
        <input type="hidden" name="edit_url" value="{{ $editURL }}"/>
        <input type="hidden" name="delete_url" value="{{ $deleteURL }}"/>
    </form>

    {{-- 최근 읽기 목록 --}}
    @include('desktop.board.component.latest')
</div>
@endsection

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/desktop/board/view.css') }}"/>
@endpush

@push('scripts')
    <script src="{{ asset('/plugin/editor/tinymce/tinymce.min.js') }}" defer></script>
    <script src="{{ asset('/plugin/editor/tinymce/config.js') }}" defer></script>
    <script src="{{ asset('js/board/post.js') }}" defer></script>
    <script src="{{ asset('js/board/comment.js') }}" defer></script>
    <script>
        window.addEventListener('DOMContentLoaded', function () {
            Comment.init({
                code: "{{ $board->code }}",
                bid: {{ $post->board_id }},
                pid: {{ $post->id }}
            });
            Comment.list({{ $page }}, {{ $id }});

            Prism.highlightAll();
        });
    </script>
@endpush