@extends(env('APP_NAME').'.layout')

@push('head')

    {!! resource($defaultSkinPath.'asset/common.css') !!}
    {!! resource('edmuhak/component/bbs/common.css') !!} <!-- 게시판 공통 css 하나로 사용 -->
	{!! resource($skinPath.'asset/board.css') !!}
    {!! resource($defaultSkinPath.'asset/compose.css') !!}
    {!! resource($skinPath.'asset/compose.css') !!}

    {!! editorScript(); !!}
@endpush

@section('content')
    <main class="bbs compose">
		<form name="compose-form" id="compose-form" method="post" enctype="multipart/form-data" action="/{{$db}}/process{{!empty($uid) ? '/'.$uid : ''}}">
			@csrf

	        <div class="form-group">
	            <label>제목 (Title)</label>
	            <input type="text" class="form-control" name="title" placeholder="Title" autocomplete="off" value="{{!empty($var->title) ? $var->title:''}}" />

	            @if (!empty($uid) and !empty($cfg->use->textUrl))
		            <div class="input-group mt-2">
		                <span class="input-group-text">Url</span>
		                <input type="text" class="form-control" name="url" placeholder="Url (auto-generate)" autocomplete="off" value="{{!empty($var->url) ? $var->url:''}}" disabled>
		                <button type="button" id="set-url" class="btn btn-secondary"><i class="bi bi-lock-fill"></i></button>
		            </div>
	            @endif
	        </div>

	        <div class="form-option mt-4">
	        	@if (!empty($cfg->use->category) and !empty($cfg->category))
        			@foreach ($cfg->category as $cat)
        				<div class="option-item">
        					<span {!! !empty($cat->color) ? 'class="badge" style="background-color: '.$cat->color.'"':'class="badge bg-primary"' !!}>
        						<input type="checkbox" autocomplete="off" name="category[]" value="{{$cat->title}}" @checked((isset($var->category) and in_array($cat->title, $var->category)))>{{$cat->title}}
        					</span>
        				</div>
        			@endforeach
        			<span class="bbs-divider"></span>
	        	@endif

	        	@if (!empty($cfg->use->notice))
	                <div class="option-item">
	                    <input type='checkbox' name='option[]' value='notice' @checked((isset($var->option->notice) and $var->option->notice==1))> 공지사항
	                </div>
	        	@endif

	        	@if (!empty($cfg->use->blockCopy))
	                <div class="option-item">
	                    <input type='checkbox' name='option[]' value='blockCopy' @checked((isset($var->option->blockCopy) and $var->option->blockCopy==1))> 복사방지
	                </div>
	        	@endif

	        	@if (!empty($cfg->use->showimage))
	                <div class="option-item">
	                    <input type='checkbox' name='option[]' value='showimage' @checked(((isset($var->option->showimage) and $var->option->showimage==1) or empty($uid)))> 대표이미지보이기
	                </div>
	        	@endif

	        	@if (!empty($cfg->use->noindent))
	                <div class="option-item">
	                    <input type='checkbox' name='option[]' value='noindent' @checked(((isset($var->option->noindent) and $var->option->noindent==1) or empty($uid)))> no-indent
	                </div>
	        	@endif
	        </div>

            {{-- <div class="form-group">
                <label>국가 (country)</label>
                <div class="form-option">
                    @foreach(countries() as $c)
                        <div class="option-item">
                            <input type='radio' name='country' value='{{ $c->config_name }}' data-code='{{ $c->config_oldcode }}' @checked((isset($var->country) and $var->country==$c->config_name))> {{ $c->config_name }}
                        </div>
                    @endforeach
                </div>
            </div>

            <div class="form-group">
                <label>관련 고객 (related member)</label>
                <div class="input-group">
                    <input placeholder="고객검색" type="text" class="form-control" style="width: auto; flex: 0 0 auto" id="member-search-kw">
                    <button type="button" class="btn btn-outline-secondary" id="member-search-btn"><i class="bi bi-search"></i></button>
                </div>
                <div>
                    <ul id="member-selector"></ul>
                    <ul id="member-selected">
                        @if (!empty($member))
                                <li id="member-{{ $member->mm_uid }}">
                                    [{{ $member->mm_uid }}]
                                    {{ $member->mm_name }}
                                    <input type="text" name="member_uid" value="{{ $member->mm_uid }}">
                                    <input type="text" name="member_name" value="{{ $member->mm_name }}">
                                    <i class="bi bi-trash3" onclick="removeMember('member-{{ $member->mm_uid }}')"></i>
                                </li>
                        @endif
                    </ul>
                </div>
            </div> --}}

            <div class="form-group">
                <label>관련 학교 (related schools)</label>
                <div class="input-group">
                    <input placeholder="학교검색" type="text" class="form-control" style="width: auto; flex: 0 0 auto" id="school-search-kw">
                    <button type="button" class="btn btn-outline-secondary" id="school-search-btn"><i class="bi bi-search"></i></button>
                </div>
                <div>
                    <ul id="school-selector"></ul>
                    <ul id="school-selected">
                        @if (!empty($schools))
                            @foreach ($schools as $school)
                                <li id="school-{{ $school->school_uid }}">
                                    [{{ $school->school_uid }}]
                                    {{ $school->school_name }}
                                    <input type="text" name="schools[]" value="{{ $school->school_uid }}">
                                    <i class="bi bi-trash3" onclick="removeSchool('school-{{ $school->school_uid }}')"></i>
                                </li>
                            @endforeach
                        @endif
                    </ul>
                </div>
            </div>

            <div class="form-group">
                <label>유튜브 임베디드 링크 (youtube link)</label>
                <input type="text" class="form-control" name="youtube_link" placeholder="" autocomplete="off" value="{{!empty($var->youtube_link) ? $var->youtube_link:''}}" />
            </div>

	        <div class="form-group">
	            <label>초록 (Abstract)</label>
	            <textarea name="abstract" class="form-control" placeholder="abstract">{{!empty($var->abstract) ? $var->abstract:''}}</textarea>
	        </div>

	        <div class="form-group mb-2">
	            <label>실제 내용 (Content) - html tag 포함</label>

	            <textarea name="content" class="form-control editor" id="{{$menuId}}-bbs-content{{!empty($var->uid) ? $var->uid:''}}">{!! !empty($var->content) ? $var->content:'' !!}</textarea>
	        </div>

	        @if ($access->FileUpload and isset($cfg->use->fileupload))
	        	@php($files = !empty($var->files) ? $var->files:[])
	        	@include('files-edit', ['files'=>$files])
	        @endif

	        @if ($access->FullControl and $uid)
	            <label>Date</label>
	            <div class="date-form row">
	                <div class="col-md input-group">
	                    <span class="input-group-text">Created at</span>
	                    <input type="text" name="created_at" class="form-control" value="{{$var->created_at}}" disabled>
	                    <button type="button" id="set-date-form" class="btn btn-secondary"><i class="bi bi-lock-fill"></i></button>
	                </div>
	            </div>
	        @endif

	        <div class="submit">
	            <button class="btn btn-lg btn-danger" type="submit">Save Changed</button>
	        </div>

		</form>

		@include($defaultPath.'footer')
	</main>

	<script type="text/javascript">
		@if ($access->FullControl and $uid)
	        $("#set-url").on('click', function(e){
	            e.preventDefault();

	            if ($('input[name="url"]').prop('disabled') == true) {
		            $(this).find('.bi-lock-fill').removeClass('bi-lock-fill').addClass('bi-unlock-fill');
		            $('input[name="url"]').prop('disabled', false);
	            } else {
		            $(this).find('.bi-unlock-fill').removeClass('bi-unlock-fill').addClass('bi-lock-fill');
		            $('input[name="url"]').prop('disabled', true);
	            }
	        });

	        $("#set-date-form").on('click', function(e){
	            e.preventDefault();

	            if ($('input[name="created_at"]').prop('disabled') == true) {
		            $(this).find('.bi-lock-fill').removeClass('bi-lock-fill').addClass('bi-unlock-fill');
		            $('input[name="created_at"]').prop('disabled', false);
	            } else {
		            $(this).find('.bi-unlock-fill').removeClass('bi-unlock-fill').addClass('bi-lock-fill');
		            $('input[name="created_at"]').prop('disabled', true);
	            }
	        });
		@endif

		{!! editorCreate('.editor', '/'.$db.'/ck-upload') !!}

        function setSchoolSelector(uid) {
            var $selected = $('#school-selected');

            $('#school-selector > li').each(function(){
                // $(this).attr('data-school_uid')
                $(this).on('click', function(){
                    $selected.append('<li>'+$(this).text()+'<input type="hidden" name="schools[]" value="'+$(this).attr('data-school_uid')+'"></li>');
                    $(this).remove();
                });
            });
        }

        function removeSchool(target) {
            if (confirm('정말 삭제하시겠습니까?')) {
                $('#'+target).remove();
            }
        }

        function setMemberSelector(uid) {
            var $selected = $('#member-selected');

            $('#member-selector > li').each(function(){
                $(this).on('click', function(){
                    // Check if the name="members" input already exists with a non-empty value
                    var alreadyExists = false;
                    $selected.find('input[name="member_uid"]').each(function(){
                        if ($(this).val().trim() !== '') {
                            alreadyExists = true;
                            return false; // Break the loop
                        }
                    });

                    if (alreadyExists) {
                        alert('A member is already selected.');
                    } else {
                        var memberUid = $(this).attr('data-member_uid');
                        var memberName = $(this).attr('data-member_name');

                        $selected.append('<li>'
                            + $(this).text()
                            + '<input type="hidden" name="member_uid" value="'+ memberUid +'">'
                            + '<input type="hidden" name="member_name" value="'+ memberName +'">'
                            + '</li>');
                        $(this).remove();
                    }
                });
            });
        }


        function removeMember(target) {
            if (confirm('정말 삭제하시겠습니까?')) {
                $('#'+target).remove();
            }
        }

        $(document).ready(function(){
            $('#school-search-kw').on('keydown', function(e){

                if (e.keyCode == 13) {
                    e.preventDefault();
                    $('#school-search-btn').click();
                }
            });

            $('#school-search-btn').on('click', function(e){
                e.preventDefault();

                var $obj = $(this);
                var kw = $('#school-search-kw').val();
                var $target = $('#school-selector');

                var country = $('input[name="country"]:checked').attr('data-code');
                var uhakType = $('input[name="category[]"]:checked').val();
                var eurl = '/{{ $db }}/search-school?kw='+kw;
                if (country != undefined) eurl += '&country='+country;
                if (uhakType != undefined) eurl += '&uhakType='+uhakType;

                $.ajax({
                    type: 'GET',
                    url: eurl,
                    cache: false,
                    success: function(result) {
                        $target.html(result);
                        setSchoolSelector();
                    }
                });
            });

            $('#member-search-kw').on('keydown', function(e){

                if (e.keyCode == 13) {
                    e.preventDefault();
                    $('#member-search-btn').click();
                }
            });

            $('#member-search-btn').on('click', function(e){
                e.preventDefault();

                var $obj = $(this);
                var kw = $('#member-search-kw').val();
                var $target = $('#member-selector');

                var eurl = '/{{ $db }}/search-member?kw='+kw;

                $.ajax({
                    type: 'GET',
                    url: eurl,
                    cache: false,
                    success: function(result) {
                        $target.html(result);
                        setMemberSelector();
                    }
                });
            });

        });
	</script>

@endsection