daily update

src/ui/themes/default/achievement.js

@@ -0,0 +1,101 @@
+export default class Achievement extends AchievementUI {
+    constructor() {
+        super();
+        this.btnBack.on(Laya.Event.CLICK, this, () => $ui.switchView(UI.pages.MAIN));
+        const min = Math.min(this.btnAchievement.fontSize, this.btnStatistics.fontSize);
+        const max = Math.max(this.btnAchievement.fontSize, this.btnStatistics.fontSize);
+        this.#state = {min, max};
+        this.btnStatistics.on(Laya.Event.CLICK, this, ()=>this.switch('statistics'));
+        this.btnAchievement.on(Laya.Event.CLICK, this, ()=>this.switch('achievement'));
+
+        this.listAchievements.renderHandler = new Laya.Handler(this, this.onRenderAchievement);
+        this.listAchievements.scrollBar.elasticDistance = 150;
+        this.on(Laya.Event.RESIZE, this, () => {
+            this.boxPage.width = 2 * this.width;
+            this.boxA.width = this.boxB.width = this.width;
+            if(this.boxPage.x < 0) {
+                this.boxPage.x = - this.width;
+            }
+
+            const renderWidth = this.listAchievements?._itemRender?.props?.width;
+            if(renderWidth) {
+                const col = Math.max(Math.floor((this.width - 65) / renderWidth), 1);
+                this.listAchievements.width = col * renderWidth + (col - 1) * (this.listAchievements.spaceY || 0) + 30;
+            }
+        });
+    }
+
+    #state;
+    #tweens;
+
+    init() {
+        this.switch('statistics', 0);
+
+        const {statistics, achievements, PropertyTypes: pt} = core;
+
+        this.listAchievements.array = achievements;
+
+        this.labRemakeTimes.text = statistics[pt.TMS].value;
+        this.labRemakeTimesJudge.text = statistics[pt.TMS].judge;
+        this.labAchievementCountJudge.color = $ui.gradeColor(statistics[pt.TMS].grade);
+
+        this.labAchievementCount.text = statistics[pt.CACHV].value;
+        this.labAchievementCountJudge.text = statistics[pt.CACHV].judge;
+        this.labAchievementCountJudge.color = $ui.gradeColor(statistics[pt.CACHV].grade);
+
+        this.labEventRate.text = parseInt(statistics[pt.REVT].value*100)+'%';
+        this.prgEventRate.value = statistics[pt.REVT].value;
+
+        this.labTalentRate.text = parseInt(statistics[pt.RTLT].value*100)+'%';
+        this.prgTalentRate.value = statistics[pt.RTLT].value;
+    }
+
+    switch(page, time=300) {
+        if(this.#tweens) {
+            this.#tweens.forEach(tween => Laya.Tween.clear(tween));
+        }
+        this.#tweens = [];
+
+        switch (page) {
+            case 'statistics':
+                time = - this.boxPage.x / this.width * time;
+                this.#tweens.push(
+                    Laya.Tween.to(this.boxPage, {x: 0}, time, Laya.Ease.backOut, Laya.Handler.create(this, () => this.#tweens = null)),
+                    Laya.Tween.to(this.btnStatistics, {fontSize: this.#state.max, anchorX: 0.5, anchorY: 1}, time, Laya.Ease.backOut),
+                    Laya.Tween.to(this.btnAchievement, {fontSize: this.#state.min, anchorX: 0.5, anchorY: 1}, time, Laya.Ease.backOut),
+                );
+                break;
+            case 'achievement':
+                time = (this.width + this.boxPage.x) / this.width * time;
+                this.#tweens.push(
+                    Laya.Tween.to(this.boxPage, {x: - this.width}, time, Laya.Ease.backOut, Laya.Handler.create(this, () => this.#tweens = null)),
+                    Laya.Tween.to(this.btnStatistics, {fontSize: this.#state.min, anchorX: 0.5, anchorY: 1}, time, Laya.Ease.backOut),
+                    Laya.Tween.to(this.btnAchievement, {fontSize: this.#state.max, anchorX: 0.5, anchorY: 1}, time, Laya.Ease.backOut),
+                );
+                break;
+        }
+    }
+
+    onRenderAchievement(box, index) {
+        const dataSource = box.dataSource;
+
+        const name = box.getChildByName('name');
+        const description = box.getChildByName('description');
+        const completed = box.getChildByName('completed');
+        const uncomplete = box.getChildByName('uncomplete');
+
+        if(dataSource.isAchieved) {
+            name.text = dataSource.name;
+            description.text = dataSource.description;
+            completed.visible = true;
+            uncomplete.visible = false;
+        } else {
+            name.text = dataSource.hide? '???': dataSource.name;
+            description.text = dataSource.hide? '???': dataSource.description;
+            completed.visible = false;
+            uncomplete.visible = true;
+        }
+
+        box.colorFilter = $ui.gradeFilter(dataSource.grade);
+    }
+}

src/ui/themes/default/main.js

@@ -0,0 +1,16 @@
+export default class Main extends MainUI {
+    constructor() {
+        super();
+        this.btnRemake.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.TALENT));
+        this.btnAchievement.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.ACHIEVEMENT));
+        this.btnThanks.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.THANKS));
+        this.btnGithub.on(Laya.Event.CLICK, this, goto, ['github']);
+        this.btnDiscord.on(Laya.Event.CLICK, this, goto, ['discord']);
+    }
+
+    init() {
+        this.btnDiscord.visible =
+        this.btnAchievement.visible =
+        this.btnThanks.visible = !!core.times;
+    }
+}

src/ui/themes/default/popup/achievementPopup.js

@@ -0,0 +1,20 @@
+export default class achievementPopup extends AchievementPopupUI {
+    constructor() {
+        super();
+    }
+
+    async popup({achievement}, parent) {
+        Laya.Tween.clearAll(this);
+        Laya.Tween.clearAll(this.boxBg);
+        this.alpha = 0.8;
+        this.labName.text = achievement.name;
+        this.labName.color = $ui.gradeColor(achievement.grade);
+        this.x = - this.width;
+        this.boxBg.x = this.boxBg.width;
+        await Promise.all([
+            Laya.promises.Tween.to(this, {x: 0}, 300, Laya.Ease.strongOut),
+            Laya.promises.Tween.to(this.boxBg, {x: 0}, 300, Laya.Ease.strongOut, 50),
+        ])
+        await Laya.promises.Tween.to(this, {alpha: 0}, 3000, Laya.Ease.strongIn);
+    }
+}

src/ui/themes/default/property.js

@@ -0,0 +1,243 @@
+export default class Property extends PropertyUI {
+    constructor() {
+        super();
+
+        const types =
+        this.#types = core.PropertyTypes;
+
+        this.btnCharmIncrease.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.CHR, 1]);
+        this.btnCharmReduce.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.CHR, -1]);
+
+        this.btnIntelligenceIncrease.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.INT, 1]);
+        this.btnIntelligenceReduce.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.INT, -1]);
+
+        this.btnStrengthIncrease.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.STR, 1]);
+        this.btnStrengthReduce.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.STR, -1]);
+
+        this.btnMoneyIncrease.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.MNY, 1]);
+        this.btnMoneyReduce.on(Laya.Event.CLICK, this, this.onPropertyAllocate, [types.MNY, -1]);
+
+        this.inputCharm.on(Laya.Event.INPUT, this, this.onPropertyAllocateInput, [types.CHR]);
+        this.inputIntelligence.on(Laya.Event.INPUT, this, this.onPropertyAllocateInput, [types.INT]);
+        this.inputStrength.on(Laya.Event.INPUT, this, this.onPropertyAllocateInput, [types.STR]);
+        this.inputMoney.on(Laya.Event.INPUT, this, this.onPropertyAllocateInput, [types.MNY]);
+
+        const selectAll = ({currentTarget: item}) => { item.text=''; };
+        this.inputCharm.on(Laya.Event.MOUSE_DOWN, this, selectAll);
+        this.inputIntelligence.on(Laya.Event.MOUSE_DOWN, this, selectAll);
+        this.inputStrength.on(Laya.Event.MOUSE_DOWN, this, selectAll);
+        this.inputMoney.on(Laya.Event.MOUSE_DOWN, this, selectAll);
+
+        this.btnRandomAllocate.on(Laya.Event.CLICK, this, this.random);
+        this.btnNext.on(Laya.Event.CLICK, this, this.next);
+
+        this.listSelectedTalents.renderHandler = Laya.Handler.create(this, this.renderTalent, null, false);
+    }
+
+    #types;
+    #propertyPoints;
+    #propertyAllocate;
+    #propertyAllocateLimit;
+
+    init({talents}) {
+        this.listSelectedTalents.array = talents;
+        const talentIds = talents.map(talent => talent.id);
+        // core.talentReplace(talentIds);
+        this.#propertyPoints = core.getPropertyPoints(talentIds);
+        this.#propertyAllocateLimit = core.propertyAllocateLimit;
+        this.labLeftPropertyPoint.text = this.#propertyPoints;
+        this.#propertyAllocate = {
+            [this.#types.CHR]: 0,
+            [this.#types.INT]: 0,
+            [this.#types.STR]: 0,
+            [this.#types.MNY]: 0,
+            [this.#types.TLT]: talentIds,
+        }
+        this.updateAllocate();
+    }
+
+    next() {
+        if (this.total < this.#propertyPoints) {
+            return;
+        }
+        $ui.switchView(
+            UI.pages.TRAJECTORY,
+            {
+                propertyAllocate: this.#propertyAllocate,
+                talents: this.listSelectedTalents.array,
+            }
+        );
+    }
+
+    get total() {
+        return this.#propertyAllocate[this.#types.CHR]
+            +  this.#propertyAllocate[this.#types.INT]
+            +  this.#propertyAllocate[this.#types.STR]
+            +  this.#propertyAllocate[this.#types.MNY];
+    }
+
+    updateAllocate() {
+        const charm = this.#propertyAllocate[this.#types.CHR];
+        const intelligence = this.#propertyAllocate[this.#types.INT];
+        const strength = this.#propertyAllocate[this.#types.STR];
+        const money = this.#propertyAllocate[this.#types.MNY];
+
+        this.inputCharm.text = ''+charm;
+        this.inputIntelligence.text = ''+intelligence;
+        this.inputStrength.text = ''+strength;
+        this.inputMoney.text = ''+money;
+
+        this.labLeftPropertyPoint.text = this.#propertyPoints - this.total;
+
+        this.btnCharmIncrease.disabled = this.btnCharmIncrease.gray = false;
+        this.btnCharmReduce.disabled = this.btnCharmReduce.gray = false;
+        this.btnIntelligenceIncrease.disabled = this.btnIntelligenceIncrease.gray = false;
+        this.btnIntelligenceReduce.disabled = this.btnIntelligenceReduce.gray = false;
+        this.btnStrengthIncrease.disabled = this.btnStrengthIncrease.gray = false;
+        this.btnStrengthReduce.disabled = this.btnStrengthReduce.gray = false;
+        this.btnMoneyIncrease.disabled = this.btnMoneyIncrease.gray = false;
+        this.btnMoneyReduce.disabled = this.btnMoneyReduce.gray = false;
+
+        if (this.total >= this.#propertyPoints) {
+            this.btnCharmIncrease.disabled = this.btnCharmIncrease.gray = true;
+            this.btnIntelligenceIncrease.disabled = this.btnIntelligenceIncrease.gray = true;
+            this.btnStrengthIncrease.disabled = this.btnStrengthIncrease.gray = true;
+            this.btnMoneyIncrease.disabled = this.btnMoneyIncrease.gray = true;
+        } else if (this.total <= 0) {
+            this.btnCharmReduce.disabled = this.btnCharmReduce.gray = true;
+            this.btnIntelligenceReduce.disabled = this.btnIntelligenceReduce.gray = true;
+            this.btnStrengthReduce.disabled = this.btnStrengthReduce.gray = true;
+            this.btnMoneyReduce.disabled = this.btnMoneyReduce.gray = true;
+        }
+
+        if (charm <= this.#propertyAllocateLimit[0]) {
+            this.btnCharmReduce.disabled = this.btnCharmReduce.gray = true;
+        } else if (charm >= this.#propertyAllocateLimit[1]) {
+            this.btnCharmIncrease.disabled = this.btnCharmIncrease.gray = true;
+        }
+
+        if (intelligence <= this.#propertyAllocateLimit[0]) {
+            this.btnIntelligenceReduce.disabled = this.btnIntelligenceReduce.gray = true;
+        } else if (intelligence >= this.#propertyAllocateLimit[1]) {
+            this.btnIntelligenceIncrease.disabled = this.btnIntelligenceIncrease.gray = true;
+        }
+
+        if (strength <= this.#propertyAllocateLimit[0]) {
+            this.btnStrengthReduce.disabled = this.btnStrengthReduce.gray = true;
+        } else if (strength >= this.#propertyAllocateLimit[1]) {
+            this.btnStrengthIncrease.disabled = this.btnStrengthIncrease.gray = true;
+        }
+
+        if (money <= this.#propertyAllocateLimit[0]) {
+            this.btnMoneyReduce.disabled = this.btnMoneyReduce.gray = true;
+        } else if (money >= this.#propertyAllocateLimit[1]) {
+            this.btnMoneyIncrease.disabled = this.btnMoneyIncrease.gray = true;
+        }
+    }
+
+    check(left, right, value) {
+        if (value < left) return false;
+        if (value > right) return false;
+        return true;
+    }
+
+    random() {
+        let t = this.#propertyPoints;
+        const arr = new Array(4).fill(this.#propertyAllocateLimit[1]);
+
+        while (t > 0) {
+            const sub = Math.round(Math.random() * (Math.min(t, this.#propertyAllocateLimit[1]) - 1)) + 1;
+            while(true) {
+                const select = Math.floor(Math.random() * 4) % 4;
+                if(arr[select] - sub <0) continue;
+                arr[select] -= sub;
+                t -= sub;
+                break;
+            }
+        }
+        this.#propertyAllocate[this.#types.CHR] = this.#propertyAllocateLimit[1] - arr[0];
+        this.#propertyAllocate[this.#types.INT] = this.#propertyAllocateLimit[1] - arr[1];
+        this.#propertyAllocate[this.#types.STR] = this.#propertyAllocateLimit[1] - arr[2];
+        this.#propertyAllocate[this.#types.MNY] = this.#propertyAllocateLimit[1] - arr[3];
+
+        this.updateAllocate();
+    }
+
+    onPropertyAllocate(type, value) {
+        if (!this.check(
+                this.#propertyAllocateLimit[0],
+                this.#propertyAllocateLimit[1],
+                this.#propertyAllocate[type] + value
+        )) {
+            return;
+        }
+        if (!this.check(
+            0,
+            this.#propertyPoints,
+            this.total + value
+        )) {
+            return;
+        }
+        this.#propertyAllocate[type] += value;
+        this.updateAllocate();
+    }
+
+    onPropertyAllocateInput(type, inputItem) {
+        let value = parseInt(inputItem.text) || 0;
+        const total = this.total;
+        if (total + value < 0) {
+            value = this.#propertyAllocateLimit[0] * 4 - total;
+        } else if (total + value > this.#propertyPoints) {
+            value = this.#propertyPoints - total;
+        }
+
+        if (value < this.#propertyAllocateLimit[0]) {
+            value = this.#propertyAllocateLimit[0];
+        } else if (value > this.#propertyAllocateLimit[1]) {
+            value = this.#propertyAllocateLimit[1];
+        }
+
+
+        const alter = value - this.#propertyAllocate[type];
+        if (alter) {
+            this.onPropertyAllocate(type, alter);
+        } else {
+            this.updateAllocate();
+        }
+    }
+
+    renderTalent(box) {
+        const dataSource = box.dataSource;
+
+        const labTitle = box.getChildByName("labTitle");
+        const grade1 = box.getChildByName("grade1");
+        const grade2 = box.getChildByName("grade2");
+        const grade3 = box.getChildByName("grade3");
+        const labDescription = box.getChildByName("labDescription");
+
+        labTitle.text = dataSource.name;
+        labDescription.text = dataSource.description;
+        switch (dataSource.grade) {
+            case 1:
+                grade1.visible = true;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+            case 2:
+                grade1.visible = false;
+                grade2.visible = true;
+                grade3.visible = false;
+                break;
+            case 3:
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = true;
+                break;
+            default:
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+        }
+    }
+}

src/ui/themes/default/summary.js

@@ -0,0 +1,136 @@
+export default class Summary extends SummaryUI {
+    constructor() {
+        super();
+        this.listSelectedTalents.renderHandler = Laya.Handler.create(this, this.renderTalent, null, false);
+        this.btnAgain.on(Laya.Event.CLICK, this, this.onAgain);
+    }
+
+    #selectedTalent;
+
+    onAgain() {
+        core.talentExtend(this.#selectedTalent);
+        core.times ++;
+        $ui.switchView(UI.pages.MAIN);
+    }
+
+    init({talents}) {
+        const {summary, lastExtendTalent} = core;
+        const gradeFilters = [
+            $ui.common.grade0,
+            $ui.common.grade1,
+            $ui.common.grade2,
+            $ui.common.grade3,
+        ];
+        const gradeColors = [
+            $ui.common.filter0,
+            $ui.common.filter1,
+            $ui.common.filter2,
+            $ui.common.filter3,
+        ];
+
+        const age = summary[core.PropertyTypes.HAGE];
+        this.labAge.text = ''+age.value;
+        this.labAgeJudge.text = age.judge;
+        this.labAgeJudge.color = gradeColors[age.grade];
+
+        const sum = summary[core.PropertyTypes.SUM];
+        this.labTotal.text = ''+sum.value;
+        this.labTotalJudge.text = sum.judge;
+        this.labTotalJudge.color = gradeColors[sum.grade];
+
+        const chr = summary[core.PropertyTypes.HCHR];
+        this.labCharm.text = ''+chr.value;
+        this.prgCharm.value = chr.progress;
+        this.labCharmJudge.text = chr.judge;
+        this.labCharmJudge.color = gradeColors[chr.grade];
+        this.boxCharmGrade.colorFilter = gradeFilters[chr.grade];
+
+        const int = summary[core.PropertyTypes.HINT];
+        this.labIntelligence.text = ''+int.value;
+        this.prgIntelligence.value = int.progress;
+        this.labIntelligenceJudge.text = int.judge;
+        this.labIntelligenceJudge.color = gradeColors[int.grade];
+        this.boxIntelligenceGrade.colorFilter = gradeFilters[int.grade];
+
+        const str = summary[core.PropertyTypes.HSTR];
+        this.labStrength.text = ''+str.value;
+        this.prgStrength.value = str.progress;
+        this.labStrengthJudge.text = str.judge;
+        this.labStrengthJudge.color = gradeColors[str.grade];
+        this.boxStrengthGrade.colorFilter = gradeFilters[str.grade];
+
+        const mny = summary[core.PropertyTypes.HMNY];
+        this.labMoney.text = ''+mny.value;
+        this.prgMoney.value = mny.progress;
+        this.labMoneyJudge.text = mny.judge;
+        this.labMoneyJudge.color = gradeColors[mny.grade];
+        this.boxMoneyGrade.colorFilter = gradeFilters[mny.grade];
+
+        const spr = summary[core.PropertyTypes.HSPR];
+        this.labSpirit.text = ''+spr.value;
+        this.prgSpirit.value = spr.progress;
+        this.labSpiritJudge.text = spr.judge;
+        this.labSpiritJudge.color = gradeColors[spr.grade];
+        this.boxSpiritGrade.colorFilter = gradeFilters[spr.grade];
+
+        talents.sort(({id:a, grade:ag}, {id:b, grade:bg},)=>{
+            if(a == lastExtendTalent) return -1;
+            if(b == lastExtendTalent) return 1;
+            return bg - ag;
+        });
+        this.#selectedTalent = talents[0].id;
+        this.listSelectedTalents.array = talents;
+    }
+
+    renderTalent(box) {
+        const dataSource = box.dataSource;
+
+        const labTitle = box.getChildByName("labTitle");
+        const grade1 = box.getChildByName("grade1");
+        const grade2 = box.getChildByName("grade2");
+        const grade3 = box.getChildByName("grade3");
+        const labDescription = box.getChildByName("labDescription");
+        const selected = box.getChildByName("selected");
+        const unselected = box.getChildByName("unselected");
+
+        labTitle.text = dataSource.name;
+        labDescription.text = dataSource.description;
+        switch (dataSource.grade) {
+            case 1:
+                grade1.visible = true;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+            case 2:
+                grade1.visible = false;
+                grade2.visible = true;
+                grade3.visible = false;
+                break;
+            case 3:
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = true;
+                break;
+            default:
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+        }
+
+        selected.visible = dataSource.id == this.#selectedTalent;
+        unselected.visible = !selected.visible;
+        box.off(Laya.Event.CLICK, this, this.onSelectTalent);
+        box.on(Laya.Event.CLICK, this, this.onSelectTalent, [dataSource.id]);
+    }
+
+    onSelectTalent(talentId) {
+        if(talentId == this.#selectedTalent) {
+            this.#selectedTalent = null;
+        } else {
+            this.#selectedTalent = talentId;
+        }
+
+        this.listSelectedTalents.refresh();
+    }
+}

src/ui/themes/default/talent.js

@@ -0,0 +1,111 @@
+export default class Talent extends TalentUI {
+    constructor() {
+        super();
+        this.btnDrawCard.on(Laya.Event.CLICK, this, this.onClickDrawCard);
+        this.btnNext.on(Laya.Event.CLICK, this, this.onClickNext);
+        this.listTalents.renderHandler = Laya.Handler.create(this, this.renderTalent, null, false);
+        this.listTalents.scrollBar.elasticDistance = 150;
+        this.on(Laya.Event.RESIZE, this, () => {
+            const renderWidth = this.listTalents?._itemRender?.props?.width;
+            if(renderWidth) {
+                const col = Math.max(Math.floor((this.width - 40) / renderWidth), 1);
+                this.listTalents.width = col * renderWidth + (col - 1) * (this.listTalents.spaceY || 0);
+            }
+        });
+    }
+
+    #selected = new Set();
+    static load() {
+        return ['images/background/background_2@3x.png'];
+    }
+
+    init() {
+        this.pageDrawCard.visible = true;
+        this.pageResult.visible = false;
+        this.btnNext.label = 'UI_Talent_Select_Uncomplete';
+        this.#selected.clear();
+    }
+
+    close() {}
+
+    onClickDrawCard() {
+        this.pageDrawCard.visible = false;
+        this.pageResult.visible = true;
+        this.listTalents.array = core.talentRandom();
+    }
+
+    onClickNext() {
+        if(this.#selected.size < core.talentSelectLimit) {
+            return;
+        }
+
+        const talents = [...this.#selected].map(index => this.listTalents.array[index]);
+        $ui.switchView(UI.pages.PROPERTY, { talents });
+    }
+
+    renderTalent(box, index) {
+        const dataSource = box.dataSource;
+
+        const hboxTitle = box.getChildByName("hboxTitle");
+        const labTitle = hboxTitle.getChildByName("labTitle");
+        const grades = hboxTitle.getChildByName("grades");
+        const grade1 = grades.getChildByName("grade1");
+        const grade2 = grades.getChildByName("grade2");
+        const grade3 = grades.getChildByName("grade3");
+        const labDescription = box.getChildByName("labDescription");
+        const unselected = box.getChildByName("unselected");
+        const selected = box.getChildByName("selected");
+
+
+        switch (dataSource.grade) {
+            case 1:
+                grades.x = 0;
+                labTitle.x = 1;
+                grade1.visible = true;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+            case 2:
+                grades.x = 0;
+                labTitle.x = 1;
+                grade1.visible = false;
+                grade2.visible = true;
+                grade3.visible = false;
+                break;
+            case 3:
+                grades.x = 0;
+                labTitle.x = 1;
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = true;
+                break;
+            default:
+                grades.x = 1;
+                labTitle.x = 0;
+                grade1.visible = false;
+                grade2.visible = false;
+                grade3.visible = false;
+                break;
+        }
+        labTitle.text = dataSource.name;
+        labTitle.event(Laya.Event.RESIZE);
+        labDescription.text = dataSource.description;
+        unselected.visible = !( selected.visible = this.#selected.has(index) );
+        box.offAll(Laya.Event.CLICK);
+        box.on(Laya.Event.CLICK, this, () => {
+            if(this.#selected.has(index)) {
+                this.#selected.delete(index);
+            } else {
+                if(this.#selected.size >= core.talentSelectLimit) {
+                    return;
+                }
+                this.#selected.add(index);
+            }
+
+            this.btnNext.label = this.#selected.size === core.talentSelectLimit
+                ? 'UI_Next'
+                : 'UI_Talent_Select_Uncomplete';
+            unselected.visible = !( selected.visible = this.#selected.has(index) );
+        });
+    }
+}

src/ui/themes/default/thanks.js

@@ -0,0 +1,6 @@
+export default class Thanks extends ThanksUI {
+    constructor() {
+        super();
+        this.btnBack.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.MAIN));
+    }
+}

src/ui/themes/default/trajectory.js

@@ -0,0 +1,162 @@
+export default class Trajectory extends TrajectoryUI {
+    constructor() {
+        super();
+        let pos1 = [0, 0];
+        this.panelTrajectory.on(Laya.Event.MOUSE_DOWN, this, e => pos1 = [e.stageX, e.stageY]);
+        this.panelTrajectory.on(Laya.Event.MOUSE_UP, this, e => {
+            const distanceX = e.stageX - pos1[0];
+            const distanceY = e.stageY - pos1[1];
+            if(Math.sqrt(Math.abs(distanceX) + Math.abs(distanceY)) > 10) {
+                return;
+            }
+            this.onNext();
+        });
+        this.btnSummary.on(Laya.Event.CLICK, this, this.onSummary);
+
+        this.panelTrajectory.vScrollBar.elasticDistance = 150;
+
+        let interval = null;
+        let timeout = null;
+
+        const scroll = alter => {
+            let value = this.panelTrajectory.vScrollBar.value + alter;
+            if(value < 0) value = 0;
+            if(value > this.panelTrajectory.vScrollBar.max) value = this.panelTrajectory.vScrollBar.max;
+            this.panelTrajectory.scrollTo(0, value);
+        }
+        const on = (btn, alter) => {
+            btn.off(Laya.Event.CLICK, this, scroll);
+            btn.on(Laya.Event.CLICK, this, scroll, [100*alter]);
+            timeout = setTimeout(() => {
+                btn.off(Laya.Event.CLICK, this, scroll);
+                interval = setInterval(() => scroll(10*alter), 10);
+            }, 100);
+        }
+        const clear = () => {
+            if(interval) {
+                clearInterval(interval);
+                interval = null;
+            }
+            if(timeout) {
+                clearTimeout(timeout);
+                timeout = null;
+            }
+        };
+        this.btnUp.on(Laya.Event.MOUSE_DOWN, this, on, [this.btnUp, -1]);
+        this.btnDown.on(Laya.Event.MOUSE_DOWN, this, on, [this.btnDown, 1]);
+        this.btnUp.on(Laya.Event.MOUSE_UP, this, clear);
+        this.btnUp.on(Laya.Event.MOUSE_OUT, this, clear);
+        this.btnDown.on(Laya.Event.MOUSE_UP, this, clear);
+        this.btnDown.on(Laya.Event.MOUSE_OUT, this, clear);
+        this.scbSpeed.on(Laya.Event.CHANGE, this, () => this.speed = this.scbSpeed.value);
+        this.scbSpeed.on(Laya.Event.MOUSE_UP, this, () => this.onNext());
+    }
+
+    #speed;
+    #auto;
+
+    static load() {
+        return ['images/slider/vslider_1@3x$bar.png'];
+    }
+
+    static #createComponent = plugin.extractComponents(CyberTrajectory.uiView, ['boxTrajectoryItem']);
+    #createTrajectoryItem() {
+        const item = CyberTrajectory.#createComponent('boxTrajectoryItem');
+        item.labContent = item.getChildByName('labContent');
+        item.labAge = item.getChildByName('hboxAge').getChildByName('labAge');
+        return item;
+    }
+    #isEnd;
+    #trajectoryItems;
+    #talents;
+
+    init({propertyAllocate, talents}) {
+        this.boxSpeed.visible = true;
+        this.btnSummary.visible = false;
+        this.#trajectoryItems = [];
+        this.#isEnd = false;
+        this.#talents = talents;
+        core.restart(propertyAllocate);
+        this.updateProperty();
+        this.onNext();
+    }
+
+    close() {
+        this.scbSpeed.value = 0;
+        this.speed = 0;
+        this.#trajectoryItems.forEach(item => {
+            item.removeSelf();
+            item.destroy();
+        });
+        this.#trajectoryItems = null;
+    }
+
+    updateProperty() {
+        const types = core.PropertyTypes;
+        const propertys = core.propertys;
+
+        this.labCharm.text = propertys[types.CHR];
+        this.labIntelligence.text = propertys[types.INT];
+        this.labStrength.text = propertys[types.STR];
+        this.labMoney.text = propertys[types.MNY];
+        this.labSpirit.text = propertys[types.SPR];
+    }
+
+    onNext() {
+        if(this.#isEnd) return;
+
+        const { age, content, isEnd } = core.next();
+        this.#isEnd = isEnd;
+
+        if(isEnd) {
+            this.boxSpeed.visible = false;
+            this.btnSummary.visible = true;
+        }
+
+        this.renderTrajectory(age, content);
+
+        Laya.timer.frameOnce(1, this, () => {
+            this.panelTrajectory.scrollTo(0, this.panelTrajectory.contentHeight);
+        });
+        this.updateProperty();
+    }
+
+    renderTrajectory(age, content) {
+        const item = this.#createTrajectoryItem();
+        item.labAge.text = ''+age;
+        item.labContent.text = content.map(
+            ({type, description, grade, name, postEvent}) => {
+                switch(type) {
+                    case 'TLT':
+                        return `天赋【${name}】发动：${description}`;
+                    case 'EVT':
+                        return description + (postEvent?`\n${postEvent}`:'');
+                }
+            }
+        ).join('\n');
+        this.vboxTrajectory.addChild(item);
+        this.#trajectoryItems.push(item);
+        this.#trajectoryItems.forEach((item, index) => item.y = index);
+    }
+
+    onSummary() {
+        const talents = this.#talents;
+        $ui.switchView(UI.pages.SUMMARY, {talents});
+    }
+
+    get speed() {
+        return this.#speed;
+    }
+
+    set speed(speed) {
+        this.#speed = speed;
+        this.prgSpeed.value = speed / this.scbSpeed.max;
+        clearInterval(this.#auto);
+        this.#auto = null;
+        if(!speed) return;
+        this.#auto = setInterval(
+            () => this.onNext(),
+            3000 * (1 - this.prgSpeed.value) + 300
+        );
+    }
+}