import { _decorator, Component, Node, Prefab, Tween, UITransform, Sprite, Color } from 'cc';
import { Holder } from '../adapter/abstract/Holder';
import { ScrollAdapter } from '../adapter/abstract/ScrollAdapter';
import { View } from '../adapter/abstract/View';
import { ContentType, ReleaseState } from '../adapter/define/enum';
import { IElement } from '../adapter/define/interface';
import { ReleaseEvent, ReleaseManager } from '../adapter/manager/ReleaseManager';
import { ClientEvent } from '../clientEvent';
import ItemDataConfig, { itemData } from '../config/ItemDataConfig';
import { Constant } from '../constant';
import { GameMng } from '../GameMng';
import { qi_pao_select_info } from './qi_pao_select_info';
import { shop_qipao_page } from './shop_qipao_page';

const { ccclass, property } = _decorator;
@ccclass('qipao_shop_view')
export class qipao_shop_view  extends ScrollAdapter<itemData[]> {

    @property(Prefab) shopPrefab: Prefab = null

    @property(UITransform) header: UITransform = null

    @property(Sprite) loading: Sprite = null

    @property(UITransform) foot: UITransform = null

    @property(Sprite) foot_loading: Sprite = null

    @property(Prefab) item_prefab: Prefab = null

    @property(Node) show_info_node:Node = null

    @property({ type: ContentType }) private _contentType: ContentType = ContentType.shop
    @property({ type: ContentType }) public get contentType() { return this._contentType }
    public set contentType(value: ContentType) {
        if (value == this._contentType) return
        this._contentType = value
    }

    private _headerTween: Tween<any>
    private _loadTween: Tween<any>

    private _footTween: Tween<any>
    private _loadFootTween: Tween<any>

    private _isHeaderPlay = false
    private _isFootPlay = false

    public qipao_list_data = []

    public cur_select_id = "";

    start() {
        this.initView();
    }
    initView(){
        this.releaseManager.on(ReleaseManager.Event.ON_PULL_UP, this.onPullUp, this)
        this.releaseManager.on(ReleaseManager.Event.ON_PULL_DOWN, this.onPullDown, this)
        this._headerTween = new Tween(this.header).to(0.518, {
            height: this.releaseManager.top * this.mainAxisSize
        }, { easing: "elasticOut" })
        this._loadTween = new Tween(this.loading.node).by(1, {
            angle: -360
        }).union().repeatForever()

        this._footTween = new Tween(this.foot).to(0.518, {
            height: this.releaseManager.top * this.mainAxisSize
        }, { easing: "elasticOut" })

        this._loadFootTween = new Tween(this.foot_loading.node).by(1, {
            angle: -360
        }).union().repeatForever()

        if(this._contentType===ContentType.bag){
            this.qipao_list_data = GameMng.getBagQiPaoList()
        }else{
            this.qipao_list_data = ItemDataConfig.Instance.getShopQiPaoList()
        }
        this.init_shop_item()
        ClientEvent.on(Constant.UI_EVENT.UI_MSG_UPDATE_SELECT_QIPAO,this.notice,this)
        //this.viewManager.on(ViewManager.Event.ON_MAGNETIC, this._onMagnetic, this)
    }

    onDestroy(){
        ClientEvent.off(Constant.UI_EVENT.UI_MSG_UPDATE_SELECT_QIPAO,this.notice,this)
    }
    notice(id:string){
        this.cur_select_id = id;
        // for (let index = 0; index < this.modelManager.length; index++) {
        //     const element = this.modelManager[index];
            
        // }
        this.show_info_node.getComponent(qi_pao_select_info).show(ItemDataConfig.Instance.getItemById(id))
        this.modelManager.update()
        
    }

    init_shop_item(){
        if(this.qipao_list_data.length<=0){

        }else{
            var list = []
            this.cur_select_id = this.qipao_list_data[0].id
            this.show_info_node.getComponent(qi_pao_select_info).show(ItemDataConfig.Instance.getItemById(this.cur_select_id))
            list.push(this.qipao_list_data)
            this.modelManager.clear()
            this.modelManager.insert(list)
            this.scrollManager.scrollToFooter(0)
        }
       
    }
    async  onPullUp(event: ReleaseEvent) {
        if (event.state == ReleaseState.RELEASE) {
            if (this._isFootPlay) {
                this._loadFootTween.start()
                // 等待并锁定头部
                event.wait()
                // 加载历史记录
                var list = await this.loadMore()
                // 插入数据
                this.modelManager.insert(list,0)
                // 释放解锁头部
                this.scheduleOnce(() => {
                    event.release()
                })
                this._loadFootTween.stop()
            }
        }
        var progress = event.progress
        if (event.state == ReleaseState.WAIT) {
            progress = 0.8
        }
        if (progress >= 0.8) {
            if (!this._isFootPlay) {
                this._footTween = new Tween(this.foot).to(0.518, {
                    height: this.releaseManager.bottom * this.mainAxisSize
                }, { easing: "elasticOut" })
                this._footTween.start()
                this._isFootPlay = true
            }
        } else {
            this._footTween.stop()
            this._isFootPlay = false
            this.foot.height = event.offset
            var color = new Color()
            color.set(this.foot_loading.color)
            color.a = 255 * Math.min(progress, 1)
            this.foot_loading.color = color
            // var y = 70 - 40 * progress
            // this.loading.node.setPosition(0, Math.max(y, 0))
        }
        this.foot_loading.node.angle = -360 * event.progress
    }

    async onPullDown(event: ReleaseEvent) {
        if (event.state == ReleaseState.RELEASE) {
            if (this._isHeaderPlay) {
                this._loadTween.start()
               // this.modelManager.clear()
                // 等待并锁定头部
                event.wait()
                // 加载历史记录
                var list = await this.reLoad()
                this.scrollToHeader()
                // 插入数据
              //  this.modelManager.insert(list,0)
                // 释放解锁头部
                this.scheduleOnce(() => {
                    event.release()
                })
                this._loadTween.stop()
            }
        }

        var progress = event.progress
        if (event.state == ReleaseState.WAIT) {
            progress = 0.8
        }
        if (progress >= 0.8) {
            if (!this._isHeaderPlay) {
                this._headerTween = new Tween(this.header).to(0.518, {
                    height: this.releaseManager.top * this.mainAxisSize
                }, { easing: "elasticOut" })
                this._headerTween.start()
                this._isHeaderPlay = true
            }
        } else {
            this._headerTween.stop()
            this._isHeaderPlay = false
            this.header.height = event.offset
            var color = new Color()
            color.set(this.loading.color)
            color.a = 255 * Math.min(progress, 1)
            this.loading.color = color
            // var y = 70 - 40 * progress
            // this.loading.node.setPosition(0, Math.max(y, 0))
        }
        this.loading.node.angle = -360 * event.progress
    }
    reLoad(): Promise<itemData[]> {
        return new Promise((resolve, reject) => {
            var list = []
            this.scheduleOnce(() => {
                this.init_shop_item()
                resolve(list)
            }, 1)
        })
    }
    loadMore(): Promise<itemData[]> {
        return new Promise((resolve, reject) => {
            this.scheduleOnce(() => {
                resolve([])
            }, 0)
        })
    }

    scrollToHeader() {
        this.scrollManager.scrollToFooter(1)
    }
    public getPrefab(data: itemData[]): Node | Prefab {
    
        return this.shopPrefab

    }
    public getHolder(node: Node, code: string): Holder<itemData[]> {
        return new myHolder(node, code, this)
    }
    public getView(): View<itemData[]> {
        return new myView(this)
    }
    public initElement(element: IElement, data: any): void {
    }
}

class myView extends View<itemData[], qipao_shop_view> {

    protected onVisible(): void {
    }
    protected onDisable(): void {
    }
}
class myHolder extends Holder<itemData[], qipao_shop_view>{
    private _shopItem: shop_qipao_page = null
    protected onCreated(): void {
        this._shopItem = this.node.getComponent(shop_qipao_page)
    }
    protected onVisible(): void {
        this._shopItem.show(this,this.adapter.item_prefab,this.data,this.adapter.cur_select_id,this.adapter.contentType)
    }
    protected onDisable(): void {
        this._shopItem.hide()
    }

}