@version(2)
@load('css/skin.css')

@php $zmk_editing = isset($oDocument) && $oDocument; @endphp

<div class="zmk">
	<header class="zmk-page-head">
		<h2 class="zmk-page-title">@if ($zmk_editing){{ $lang->kin_modify_answer }}@else{{ $lang->kin_write_answer }}@endif</h2>
	</header>

	<div class="zmk-answer-quote">
		<em class="zmk-badge zmk-badge-open">{{ $lang->kin_question }}</em>
		<a href="{{ getUrl('', 'mid', $mid, 'act', 'dispKinView', 'document_srl', $kin_question_srl) }}">{{ $kin_question_document->getTitleText() }}</a>
	</div>

	<form action="./" method="post" class="zmk-write-form" data-empty-content="{{ $lang->kin_content_required }}" onsubmit="return zmkSyncEditor(this);">
		@csrf
		<input type="hidden" name="module" value="kin" />
		<input type="hidden" name="mid" value="{{ $mid }}" />
		<input type="hidden" name="act" value="procKinInsertAnswer" />
		<input type="hidden" name="question_srl" value="{{ $kin_question_srl }}" />
		{{-- 에디터는 이 필드의 값을 초기 본문으로 읽는다. 수정일 때 기존 본문을 실어야 한다 --}}
		<input type="hidden" name="content" value="{{ $zmk_editing ? $oDocument->getContentText() : '' }}" />
		@if ($zmk_editing)
		<input type="hidden" name="document_srl" value="{{ $oDocument->document_srl }}" />
		@endif

		<div class="zmk-field">
			<div class="zmk-editor">{!! $kin_editor !!}</div>
		</div>

		<div class="zmk-form-foot">
			<a href="{{ getUrl('', 'mid', $mid, 'act', 'dispKinView', 'document_srl', $kin_question_srl) }}" class="zmk-btn">{{ $lang->cmd_cancel }}</a>
			<button type="submit" class="zmk-btn zmk-btn-primary">@if ($zmk_editing){{ $lang->cmd_modify }}@else{{ $lang->kin_submit_answer }}@endif</button>
		</div>
	</form>
</div>

<script>
// 코어 에디터는 폼의 editor_sequence 속성으로 자기 내용을 찾는다.
// 제출 직전에 그 내용을 content 필드로 옮겨야 서버가 본문을 받는다.
function zmkSyncEditor(form) {
	var seq = form.getAttribute('editor_sequence');
	if (!seq) return true;

	try {
		var content = editorGetContent(seq);
		if (form.content) form.content.value = content;

		if (!String(content).replace(/<[^>]*>/g, '').trim()) {
			alert(form.getAttribute('data-empty-content'));
			return false;
		}
	} catch (e) {}

	return true;
}
</script>