import { Controller } from "@hotwired/stimulus"
export default class extends Controller {
 static targets = ["overlay", "content", "queryInput", "vectorSearchToggle", "searchButton", "results"]
 static values = { 
 searchUrl: String,
 resultsUrl: String
 }
 connect() {
 
 // Set default URLs if not provided
 if (!this.searchUrlValue) {
 this.searchUrlValue = "/search"
 }
 if (!this.resultsUrlValue) {
 this.resultsUrlValue = "/search"
 }
 
 // Add keyboard shortcuts
 this.boundKeydown = this.handleKeydown.bind(this)
 document.addEventListener('keydown', this.boundKeydown)
 
 }
 disconnect() {
 document.removeEventListener('keydown', this.boundKeydown)
 }
 open() {
 this.overlayTarget.classList.remove('hidden')
 this.queryInputTarget.focus()
 document.body.style.overflow = 'hidden'
 
 // Show suggestions when modal opens
 this.showSuggestions()
 }
 close() {
 this.overlayTarget.classList.add('hidden')
 this.queryInputTarget.value = ''
 this.resultsTarget.innerHTML = ''
 document.body.style.overflow = ''
 }
 async search(event) {
 event.preventDefault()
 
 const query = this.queryInputTarget.value.trim()
 if (!query) return
 
 const useVectorSearch = this.vectorSearchToggleTarget.checked
 const contentType = document.querySelector('input[name="content_type"]:checked')?.value || 'all'
 
 // Disable search button and show loading state
 this.searchButtonTarget.disabled = true
 this.searchButtonTarget.textContent = 'Searching...'
 
 try {
 // Build search parameters
 const params = new URLSearchParams({
 search: query,
 page: 1
 })
 
 if (useVectorSearch) {
 params.append('use_vector_search', 'true')
 // For now, we'll use a placeholder embedding - in production this would come from a semantic embedding service
 const placeholderEmbedding = Array(1536).fill(0.1) // 1536-dimensional placeholder
 params.append('embedding', JSON.stringify(placeholderEmbedding))
 } else {
 // Explicitly disable vector search
 params.append('use_vector_search', 'false')
 }
 
 // Add content type filter
 if (contentType && contentType !== 'all') {
 params.append('content_type', contentType)
 }
 
 // Make AJAX request to search endpoint
 const response = await fetch(`${this.searchUrlValue}?${params.toString()}`, {
 headers: {
 'Accept': 'text/html',
 'X-Requested-With': 'XMLHttpRequest'
 }
 })
 
 if (response.ok) {
 const html = await response.text()
 this.resultsTarget.innerHTML = html
 
 // Show suggestions if no results
 const noResults = this.resultsTarget.querySelector('.text-center.text-gray-500')
 if (noResults) {
 this.showSuggestions()
 } else {
 this.hideSuggestions()
 }
 } else {
 const errorData = await response.json().catch(() => ({ error: `Search failed: ${response.status}` }))
 throw new Error(errorData.error || `Search failed: ${response.status}`)
 }
 } catch (error) {
 console.error('Search error:', error)
 this.resultsTarget.innerHTML = `
 <div>
 <p>Search failed</p>
 <p>Please try again later.</p>
 </div>
 `
 } finally {
 // Re-enable search button
 this.searchButtonTarget.disabled = false
 this.searchButtonTarget.textContent = 'Search'
 }
 }
 handleKeydown(event) {
 // Close modal with Escape key
 if (event.key === 'Escape' && !this.overlayTarget.classList.contains('hidden')) {
 this.close()
 }
 
 // Open search with Cmd/Ctrl + K
 if ((event.metaKey &#124;&#124; event.ctrlKey) && event.key === 'k') {
 event.preventDefault()
 this.open()
 }
 
 // Open search with forward slash (like many modern apps)
 if (event.key === '/' && !event.ctrlKey && !event.metaKey && !event.altKey) {
 // Only open if not typing in an input field
 if (!['INPUT', 'TEXTAREA'].includes(event.target.tagName)) {
 event.preventDefault()
 this.open()
 }
 }
 
 // Handle Enter key in search input
 if (event.key === 'Enter' && event.target === this.queryInputTarget) {
 event.preventDefault()
 this.search(event)
 }
 }
 
 // Fill search input with suggested term
 fillSearch(event) {
 const searchTerm = event.currentTarget.dataset.searchTerm
 if (searchTerm) {
 this.queryInputTarget.value = searchTerm
 this.queryInputTarget.focus()
 }
 }
 
 // Show search suggestions
 showSuggestions() {
 const suggestions = document.getElementById('search-suggestions')
 if (suggestions) {
 suggestions.classList.remove('hidden')
 }
 }
 
 // Hide search suggestions
 hideSuggestions() {
 const suggestions = document.getElementById('search-suggestions')
 if (suggestions) {
 suggestions.classList.add('hidden')
 }
 }
}
</div><div class="naked_ctrl">
<form action="/index.cgi/larger-text" method="get" name="gate">
<p><a href="http://altstyle.alfasado.net">AltStyle</a> によって変換されたページ <a href="https://topenddevs.com/assets/controllers/search_modal_controller-829440b6.js">(-&gt;オリジナル)</a>
/ <label>アドレス: <input type="text" name="naked_post_url" value="https://topenddevs.com/assets/controllers/search_modal_controller-829440b6.js" size="22" /></label> <label>モード: <select name="naked_post_mode">
<option value="default">デフォルト</option>
<option value="speech">音声ブラウザ</option>
<option value="ruby">ルビ付き</option>
<option value="contrast">配色反転</option>
<option value="larger-text" selected="selected">文字拡大</option>
<option value="mobile">モバイル</option>
</select>
<input type="submit" value="表示" />
</p>
</form>
</div>