import { _decorator, Button, Component, EditBox, instantiate, Node, ScrollView, UITransform, Vec2, Vec3 } from 'cc';
import { LayerMgr } from '../../script/Manager/LayerMgr';
import { allMapList, getAllMapKeys, MapData, UserMap } from '../../script/Manager/LocalDataMgr';
import { MapItem } from './MapItem';
const { ccclass, property } = _decorator;

@ccclass('SelectMapPanel')
export class SelectMapPanel extends Component {
@property(Node)
    itemRoot: Node = null;
    @property(Node)
    itemPrefab: Node = null;
    @property(Button)
    btnClose: Button = null;
    @property(ScrollView)
    scrollView:ScrollView = null;
    @property(EditBox)
    editBox:EditBox = null;
    @property(Button)
    btnTurn:Button = null;

    _mapData:MapData = null
    _allMapList:{ [key: number]: string };
    _items: Node[] = [];
    _hasCreatedItems:boolean = false;
    protected start(): void {
        this.btnClose.node.on(Node.EventType.TOUCH_END,this.onBtnCloseClick,this)
        this.btnTurn.node.on(Node.EventType.TOUCH_END,this.scrollToItem,this)
    }

    init() {
        if(this._hasCreatedItems) return;
        this._hasCreatedItems = true;
        this._allMapList = allMapList
        this._mapData = UserMap.getMapData()
        let allMapKeys = getAllMapKeys()
        let count = allMapKeys.length;
        for (let i = 0; i < count; i++) {
            this.createItem(allMapKeys[i]);
        }
    }

    onBtnCloseClick()
    {
        this.node.active = false
    }

    createItem(key: number) {
        let itemNode = instantiate(this.itemPrefab);
        itemNode.parent = this.itemRoot;
        this._items.push(itemNode);
        itemNode.active = true
        let mapItem = itemNode.getComponent(MapItem)
        mapItem.init(key,this.judgeSelect(key))
    }

    judgeSelect(key)
    {
        let selMaps = this._mapData.selectedMaps
        let index = selMaps.indexOf(key)
        return index !== -1
    }


    clearSelectAllMaps()
    {
        UserMap.removeAllSelectMap()
        this.refreshMapSelectioin()
    }

    refreshMapSelectioin()
    {
        let allMapKeys = getAllMapKeys()
        let count = allMapKeys.length;
        for(let i = 0; i < count; i++){
            let item = this._items[i]
            item.getComponent(MapItem).setSelectMap(false)
        }
    }

    slideToBottom()
    {   
        this.scrollView.scrollToBottom()
    }

    selectAllMap()
    {
        UserMap.addAllSelectMap()
        this._items.forEach((item)=>{
            item.getComponent(MapItem).setSelectMap(true)
        })
    }

    //获取上一关的
    lastLevel()
    {

    }

    nextLevel()
    {

    }

    scrollToItem() {
        let page = parseInt(this.editBox.string);
        if (isNaN(page)) return;
        let itemNode = this.itemRoot.children[page];
        if (!itemNode) return;

        const viewHeight = this.scrollView.node.getComponent(UITransform).height;
        const itemHeight = itemNode.getComponent(UITransform).height;

        // 获取itemNode在content中的位置（局部坐标）
        const itemPos = itemNode.position;
        const itemTop = -itemPos.y;
        // 使item在视图中居中需要滚动的偏移量（从content顶部到视图顶部的距离）
        let offset = itemTop - (viewHeight - itemHeight) / 2;

        // 获取内容总高度（content节点的高度）
        const contentHeight = this.itemRoot.getComponent(UITransform).height;
        // 最大可滚动的偏移量
        const maxScrollOffset = Math.max(0, contentHeight - viewHeight);
        // 限制offset在[0, maxScrollOffset]之间
        offset = Math.max(0, Math.min(maxScrollOffset, offset));

        // 滚动到该偏移量
        this.scrollView.scrollToOffset(new Vec2(0, offset), 0.5);
    }
}