import { Controller } from '@hotwired/stimulus'
export default class extends Controller {
 static targets = ["authorIdField", "preview", "image", "name", "form"]
 connect() {
 this.updateUI()
 }
 select(event) {
 const radio = event.target
 const { value: authorId, authorName, authorImageUrl } = radio.dataset
 if (this.hasAuthorIdFieldTarget) {
 this.authorIdFieldTarget.value = radio.value
 }
 this.updatePreview(authorName, authorImageUrl)
 this.updateUI()
 }
 updatePreview(authorName, authorImageUrl) {
 if (this.hasNameTarget) {
 this.nameTarget.textContent = authorName || '작성자를 선택하세요'
 }
 if (this.hasImageTarget) {
 if (authorImageUrl) {
 this.imageTarget.src = authorImageUrl
 this.imageTarget.alt = `${authorName}의 프로필 사진`
 this.imageTarget.classList.remove('hidden')
 } else {
 this.imageTarget.classList.add('hidden')
 }
 }
 }
 updateUI() {
 const hasAuthor = this.hasAuthorIdFieldTarget && this.authorIdFieldTarget.value.trim()
 if (this.hasPreviewTarget) {
 this.previewTarget.classList.remove('hidden')
 if (!hasAuthor && this.hasNameTarget && !this.nameTarget.textContent.trim()) {
 this.nameTarget.textContent = '작성자를 선택하세요'
 }
 }
 if (this.hasFormTarget) {
 this.formTarget.querySelectorAll('input:not([name="author_id"]), select, textarea, button')
 .forEach(el => el.disabled = !hasAuthor)
 }
 }
}
</div><div class="naked_ctrl">
<form action="/index.cgi/speech" method="get" name="gate">
<p><a href="http://altstyle.alfasado.net">AltStyle</a> によって変換されたページ <a href="https://coops.or.kr/assets/controllers/author_comment_controller-4be7cf97.js">(-&gt;オリジナル)</a>
/ <label>アドレス: <input type="text" name="naked_post_url" value="https://coops.or.kr/assets/controllers/author_comment_controller-4be7cf97.js" size="22" /></label> <label>モード: <select name="naked_post_mode">
<option value="default">デフォルト</option>
<option value="speech" selected="selected">音声ブラウザ</option>
<option value="ruby">ルビ付き</option>
<option value="contrast">配色反転</option>
<option value="larger-text">文字拡大</option>
<option value="mobile">モバイル</option>
</select>
<input type="submit" value="表示" />
</p>
</form>
</div>