import { _decorator, Component, Node, Button, Animation } from 'cc';
import { DialogueManager } from './DialogueManager';
const { ccclass, property } = _decorator;

/**
 * 电话管理器，控制电话UI的显示和隐藏，以及显示电话对话
 */
@ccclass('PhoneManager')
export class PhoneManager extends Component {
    @property({
        type: Node,
        tooltip: '电话UI面板'
    })
    phonePanel: Node = null;
    
    @property({
        type: Button,
        tooltip: '关闭按钮'
    })
    closeButton: Button = null;
    
    @property({
        type: Animation,
        tooltip: '电话动画组件(可选)'
    })
    phoneAnimation: Animation = null;
    
    @property({
        type: DialogueManager,
        tooltip: '对话管理器引用'
    })
    dialogueManager: DialogueManager = null;
    
    @property({
        tooltip: '电话对话内容'
    })
    phoneDialogue: string = "您好，这里是总机。有什么可以帮您的吗？";
    
    @property({
        tooltip: '对话表情类型',
    })
    emotionType: string = "normal";
    
    start() {
        // 初始化隐藏电话面板
        if (this.phonePanel) {
            this.phonePanel.active = false;
        }
        
        // 注册关闭按钮点击事件
        this.setupCloseButton();
    }
    
    /**
     * 设置关闭按钮事件
     */
    private setupCloseButton() {
        if (this.closeButton) {
            // 移除可能已存在的事件监听
            this.closeButton.node.off('click');
            
            // 使用按钮的点击事件监听方式
            this.closeButton.node.on('click', () => {
                console.log('电话关闭按钮被点击');
                this.hidePhonePanel();
            }, this);
            
            console.log('电话关闭按钮事件已注册');
        } else {
            console.error('电话关闭按钮未设置');
        }
    }
    
    /**
     * 显示电话面板
     */
    public showPhonePanel() {
        if (this.phonePanel) {
            this.phonePanel.active = true;
            
            // 确保面板在最前面
            this.phonePanel.setSiblingIndex(999);
            
            // 播放打开动画(如果有)
            if (this.phoneAnimation) {
                this.phoneAnimation.play('phone_open');
            }
            
            // 显示电话对话
            this.showPhoneDialogue();
        } else {
            console.error('电话面板未设置');
        }
    }
    
    /**
     * 显示电话对话
     */
    private showPhoneDialogue() {
        // 使用对话管理器显示电话对话
        if (this.dialogueManager && this.phoneDialogue) {
            this.dialogueManager.showDialogue(this.phoneDialogue, this.emotionType);
        } else {
            console.error('对话管理器未设置或对话内容为空');
        }
    }
    
    /**
     * 隐藏电话面板
     */
    public hidePhonePanel() {
        console.log('hidePhonePanel被调用');
        
        if (this.phonePanel) {
            // 播放关闭动画，并在动画结束后隐藏面板
            if (this.phoneAnimation) {
                this.phoneAnimation.play('phone_close');
                this.scheduleOnce(() => {
                    this.phonePanel.active = false;
                    console.log('电话面板已隐藏（动画后）');
                }, 0.5); // 假设动画时长为0.5秒
            } else {
                this.phonePanel.active = false;
                console.log('电话面板已隐藏（立即）');
            }
        }
    }
    
    onDestroy() {
        // 移除按钮事件监听
        if (this.closeButton) {
            this.closeButton.node.off('click');
        }
    }
}