// 页脚交互功能脚本
document.addEventListener('DOMContentLoaded', function() {
    // 社交媒体链接交互
    const socialLinks = document.querySelectorAll('footer .social-links a');
    socialLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            const platform = this.getAttribute('data-platform');
            if (platform) {
                e.preventDefault();
                handleSocialClick(platform);
            }
        });
    });

    // 快速链接交互
    const quickLinks = document.querySelectorAll('footer .quick-links a');
    quickLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            if (this.getAttribute('href') === '#') {
                e.preventDefault();
                const linkType = this.getAttribute('data-link-type');
                handleQuickLink(linkType);
            }
        });
    });

    // 订阅表单提交
    const subscribeForm = document.getElementById('subscribe-form');
    if (subscribeForm) {
        subscribeForm.addEventListener('submit', function(e) {
            e.preventDefault();
            const emailInput = this.querySelector('input[type="email"]');
            if (emailInput && emailInput.value) {
                handleSubscribe(emailInput.value);
            } else {
                showMessage('请输入有效的邮箱地址', 'error');
            }
        });
    }

    // 处理社交媒体点击
    function handleSocialClick(platform) {
        let url = '';
        console.log('社交媒体点击:', platform);
        
        switch (platform) {
            case 'github':
                url = 'https://github.com/ITtools-collection/tools';
                break;
            case 'twitter':
                url = 'https://twitter.com/ITtools_collection';
                break;
            case 'wechat':
                showWeChatQRCode();
                return;
            default:
                console.log('未知平台:', platform);
                return;
        }
        
        if (url) {
            console.log('打开URL:', url);
            window.open(url, '_blank');
        }
    }

    // 处理快速链接点击
    function handleQuickLink(type) {
        switch (type) {
            case 'about':
                showDialog('关于我们', `<div class="p-4">
                    <p class="mb-3">IT工具合集是一个集成各类实用工具的在线平台，旨在帮助用户提高工作效率，解决技术难题。</p>
                    <p>我们提供多种工具，包括媒体处理、格式转换、开发辅助、网络工具等，所有工具均免费使用。</p>
                </div>`);
                break;
            case 'terms':
                showDialog('使用条款', `<div class="p-4">
                    <p class="mb-3">欢迎使用IT工具合集。使用本网站即表示您同意以下条款：</p>
                    <ul class="list-disc pl-5 space-y-1 mb-3">
                        <li>本网站提供的工具仅供学习和参考</li>
                        <li>用户需对自己的行为负责</li>
                        <li>禁止将本站工具用于非法用途</li>
                    </ul>
                    <p>我们保留随时修改这些条款的权利。</p>
                </div>`);
                break;
            case 'privacy':
                showDialog('隐私政策', `<div class="p-4">
                    <p class="mb-3">保护您的隐私是我们的首要任务。本隐私政策说明：</p>
                    <ul class="list-disc pl-5 space-y-1 mb-3">
                        <li>我们不会收集您的个人身份信息</li>
                        <li>您上传的文件和数据只会用于提供服务</li>
                        <li>我们不会向第三方出售您的任何数据</li>
                    </ul>
                    <p>如有任何隐私相关疑问，请联系我们。</p>
                </div>`);
                break;
            case 'faq':
                showDialog('常见问题', `<div class="p-4">
                    <div class="mb-4">
                        <h3 class="font-medium mb-1">1. 使用这些工具需要付费吗？</h3>
                        <p>不需要，所有工具均免费使用，无需注册。</p>
                    </div>
                    <div class="mb-4">
                        <h3 class="font-medium mb-1">2. 上传的文件会保存在服务器上吗？</h3>
                        <p>不会，您上传的文件仅在浏览器中处理，不会上传到我们的服务器。</p>
                    </div>
                    <div>
                        <h3 class="font-medium mb-1">3. 如何反馈问题或建议？</h3>
                        <p>您可以通过"联系我们"页面或反馈表单向我们提供建议。</p>
                    </div>
                </div>`);
                break;
            case 'contact':
                showDialog('联系我们', `<div class="p-4">
                    <p class="mb-4">如有任何问题、建议或合作意向，请通过以下方式联系我们：</p>
                    <div class="mb-3">
                        <p class="font-medium">电子邮件：</p>
                        <p>contact@ittools-collection.com</p>
                    </div>
                    <div>
                        <p class="font-medium">微信公众号：</p>
                        <p>IT工具合集</p>
                    </div>
                </div>`);
                break;
            default:
                break;
        }
    }

    // 处理订阅
    function handleSubscribe(email) {
        // 这里可以添加实际的订阅逻辑，比如发送到后端API
        // 当前仅显示成功消息
        showMessage('订阅成功！感谢您的关注', 'success');
        
        // 清空输入框
        const emailInput = document.querySelector('#subscribe-form input[type="email"]');
        if (emailInput) {
            emailInput.value = '';
        }
    }

    // 显示微信二维码
    function showWeChatQRCode() {
        showDialog('关注我们的微信', `<div class="p-4 text-center">
            <div class="w-48 h-48 mx-auto bg-gray-200 flex items-center justify-center mb-3">
                <i class="fas fa-qrcode text-gray-400 text-6xl"></i>
            </div>
            <p>扫描二维码关注我们的公众号</p>
        </div>`);
    }

    // 显示对话框
    function showDialog(title, content) {
        // 检查是否已存在对话框
        let dialog = document.getElementById('footer-dialog');
        if (dialog) {
            document.body.removeChild(dialog);
        }

        // 创建对话框
        dialog = document.createElement('div');
        dialog.id = 'footer-dialog';
        dialog.className = 'fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50';
        dialog.innerHTML = `
            <div class="bg-white rounded-lg shadow-xl w-full max-w-md">
                <div class="flex items-center justify-between p-4 border-b border-gray-200">
                    <h2 class="text-xl font-bold">${title}</h2>
                    <button class="dialog-close text-gray-500 hover:text-gray-700">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                <div class="max-h-96 overflow-y-auto">
                    ${content}
                </div>
                <div class="bg-gray-50 p-4 rounded-b-lg text-right">
                    <button class="dialog-close px-4 py-2 bg-gray-800 text-white rounded-md hover:bg-black transition-colors">
                        关闭
                    </button>
                </div>
            </div>
        `;

        // 添加到页面
        document.body.appendChild(dialog);

        // 添加关闭事件
        dialog.querySelectorAll('.dialog-close').forEach(btn => {
            btn.addEventListener('click', function() {
                document.body.removeChild(dialog);
            });
        });

        // 点击背景关闭
        dialog.addEventListener('click', function(e) {
            if (e.target === dialog) {
                document.body.removeChild(dialog);
            }
        });
    }

    // 显示消息提示
    function showMessage(message, type = 'success') {
        const messageDiv = document.createElement('div');
        messageDiv.className = `fixed bottom-4 right-4 p-4 rounded-md shadow-lg z-50 transition-all duration-300 transform translate-y-0 ${
            type === 'success' ? 'bg-green-500' : 'bg-red-500'
        } text-white`;
        messageDiv.innerHTML = message;
        
        document.body.appendChild(messageDiv);
        
        // 3秒后移除
        setTimeout(() => {
            messageDiv.style.transform = 'translateY(100%)';
            setTimeout(() => {
                document.body.removeChild(messageDiv);
            }, 300);
        }, 3000);
    }
});