|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
const tooltipTriggers = document.querySelectorAll('[data-tooltip]'); |
|
|
tooltipTriggers.forEach(trigger => { |
|
|
trigger.addEventListener('mouseenter', function() { |
|
|
const tooltip = document.createElement('div'); |
|
|
tooltip.className = 'absolute z-10 px-3 py-2 text-sm text-white bg-gray-900 rounded-lg shadow-lg'; |
|
|
tooltip.textContent = this.getAttribute('data-tooltip'); |
|
|
|
|
|
const rect = this.getBoundingClientRect(); |
|
|
tooltip.style.top = `${rect.top - 40}px`; |
|
|
tooltip.style.left = `${rect.left + rect.width / 2 - tooltip.offsetWidth / 2}px`; |
|
|
|
|
|
document.body.appendChild(tooltip); |
|
|
this._tooltip = tooltip; |
|
|
}); |
|
|
|
|
|
trigger.addEventListener('mouseleave', function() { |
|
|
if (this._tooltip) { |
|
|
document.body.removeChild(this._tooltip); |
|
|
this._tooltip = null; |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.addEventListener('click', function(e) { |
|
|
if (e.target.closest('.toggle-details')) { |
|
|
const card = e.target.closest('custom-policy-card'); |
|
|
const details = card.shadowRoot.querySelector('.policy-details'); |
|
|
const icon = card.shadowRoot.querySelector('.toggle-icon'); |
|
|
|
|
|
details.classList.toggle('hidden'); |
|
|
icon.setAttribute('data-feather', details.classList.contains('hidden') ? 'chevron-down' : 'chevron-up'); |
|
|
feather.replace(); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
const chatInput = document.querySelector('aside input[type="text"]'); |
|
|
const chatSendBtn = document.querySelector('aside button'); |
|
|
const chatContainer = document.getElementById('chat-container'); |
|
|
|
|
|
function addMessage(type, message) { |
|
|
const bubble = document.createElement('custom-chat-bubble'); |
|
|
bubble.setAttribute('type', type); |
|
|
bubble.setAttribute('message', message); |
|
|
chatContainer.appendChild(bubble); |
|
|
chatContainer.scrollTop = chatContainer.scrollHeight; |
|
|
} |
|
|
|
|
|
function handleSendMessage() { |
|
|
const message = chatInput.value.trim(); |
|
|
if (message) { |
|
|
addMessage('user', message); |
|
|
chatInput.value = ''; |
|
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
const responses = [ |
|
|
"I found this information in the 2025 Agricultural Support Policy: ...", |
|
|
"According to the latest guidelines from the Ministry of Agriculture...", |
|
|
"The policy you're asking about was updated last month. Here are the key points..." |
|
|
]; |
|
|
addMessage('ai', responses[Math.floor(Math.random() * responses.length)]); |
|
|
}, 1000); |
|
|
} |
|
|
} |
|
|
|
|
|
chatSendBtn.addEventListener('click', handleSendMessage); |
|
|
chatInput.addEventListener('keypress', function(e) { |
|
|
if (e.key === 'Enter') handleSendMessage(); |
|
|
}); |
|
|
}); |