b23_zuma/assets/script/ui/GameLoadingUI.ts

/** @format */
import {UI} from '../enums/UI'
import {BaseUI} from './BaseUI'
import {Data, Mgr} from '../GameControl'
import {ccUtils} from '../utils/ccUtils'
import {observer, render, node, label, editBox, list} from '../mobx/observer'
import {msgCmd} from '../proto/msg_cmd'
import {ConstValue} from '../data/ConstValue'

const {ccclass, property} = cc._decorator

@ccclass
@observer
export class GameLoadingUI extends BaseUI {
    @node('left')
    left: cc.Node
    @node('right')
    right: cc.Node
    @node('pb')
    pb: cc.Node
    pbCurNum: number = 0
    pbAllNum: number = 0

    onShow(args, fromUI: number) {
        this.closeDoor()
        this.scheduleOnce(() => {
            this.pb.active = true
            this.pbCurNum = 0
            this.pbAllNum = 1 + (Data.game.gameAssetMap.size > 0 ? 0 : 1)
            ccUtils.setProgress(0, this.pb)
            console.log(Date.now())
            if (Data.game.gameAssetMap.size > 0) {
                this.openDoor()
            } else {
                this.loadAllRes().then(res => {
                    console.log(Date.now())
                    this.openDoor()
                })
            }
        }, 0.6)
    }

    onHide(): any {
        this.pb.active = false
        this.unscheduleAllCallbacks()
    }

    update(dt) {
        if (this.pb.active && this.pbCurNum < this.pbAllNum) {
            this.pbCurNum += dt
            ccUtils.setProgress(this.pbCurNum / this.pbAllNum, this.pb)
        }
    }

    closeDoor() {
        //关门动画
        this.left.stopAllActions()
        this.right.stopAllActions()
        this.left.x = -ConstValue.CANVAS_WIDTH / 2
        this.right.x = ConstValue.CANVAS_WIDTH / 2
        let t = cc.tween
        t(this.left)
            .then(t().to(0.5, {x: 0}))
            .start()
        t(this.right)
            .then(t().to(0.5, {x: 0}))
            .start()
    }

    openDoor() {
        Mgr.ui.closeAll([UI.GameLoadingUI])
        Mgr.ui.show(UI.ZumaUI)
        //开门动画
        let t = cc.tween
        t(this.left)
            .then(
                t()
                    .delay(1)
                    .call(() => {
                        this.pb.active = false
                    })
                    .to(0.5, {x: -ConstValue.CANVAS_WIDTH / 2})
                    .call(() => {
                        this.hide()
                    })
                    .union(),
            )
            .start()
        t(this.right)
            .then(
                t()
                    .delay(1)
                    .to(0.5, {x: ConstValue.CANVAS_WIDTH / 2})
                    .union(),
            )
            .start()
    }

    loadAllRes() {
        let records = Data.game.gameBundle.getDirWithPath('')
        let tempMap = new Map()
        for (let i = 0; i < records.length; i++) {
            let record = records[i]
            let type
            let path = record.path
            if (path.includes('prefab')) {
                type = cc.Prefab
            } else if (path.includes('animation')) {
                type = cc.AnimationClip
            } else if (path.includes('atlas')) {
                type = cc.SpriteAtlas
            } else if (path.includes('texture')) {
                type = cc.SpriteFrame
            }
            if (type == record.ctor) tempMap.set(record.path, record)
        }
        let loadPromises = []
        tempMap.forEach((record, path) => {
            loadPromises.push(this.loadGameRes(path, record.ctor))
        })
        return Promise.all(loadPromises)
    }

    loadGameRes(url: string, type: typeof cc.Asset) {
        return new Promise((resolve, reject) => {
            Data.game.gameBundle.load(url, type, (error, assets: cc.Asset) => {
                if (error) {
                    reject(error)
                } else {
                    Data.game.gameAssetMap.set(url, assets)
                    resolve(assets)
                }
            })
        })
    }

    //UI或者其他函数=======================================

    //网络事件=======================================
    // onXXXRsp() {}

    //触发事件=======================================
    // @render
    // showRender() {}

    // 点击事件=======================================
    // onClick() {}
}