mirror of
https://github.com/unanmed/HumanBreak.git
synced 2025-04-27 01:23:25 +08:00
127 lines
3.6 KiB
TypeScript
127 lines
3.6 KiB
TypeScript
import { sleep } from 'mutate-animate';
|
|
import { Component, markRaw, ref, Ref, shallowReactive, watch } from 'vue';
|
|
import Book from '../ui/book.vue';
|
|
import Toolbox from '../ui/toolbox.vue';
|
|
import Equipbox from '../ui/equipbox.vue';
|
|
import Settings from '../ui/settings.vue';
|
|
import Desc from '../ui/desc.vue';
|
|
import Skill from '../ui/skill.vue';
|
|
import SkillTree from '../ui/skillTree.vue';
|
|
import Fly from '../ui/fly.vue';
|
|
import FixedDetail from '../ui/fixedDetail.vue';
|
|
import Shop from '../ui/shop.vue';
|
|
import Achievement from '../ui/achievement.vue';
|
|
import Bgm from '../ui/bgmList.vue';
|
|
|
|
// todo: 优化开启控制器
|
|
|
|
export const bookOpened = ref(false);
|
|
export const toolOpened = ref(false);
|
|
export const equipOpened = ref(false);
|
|
export const showStatusBar = ref(false);
|
|
export const settingsOpened = ref(false);
|
|
export const descOpened = ref(false);
|
|
export const skillOpened = ref(false);
|
|
export const skillTreeOpened = ref(false);
|
|
export const flyOpened = ref(false);
|
|
export const showStudiedSkill = ref(false);
|
|
export const fixedDetailOpened = ref(false);
|
|
export const shopOpened = ref(false);
|
|
export const startOpened = ref(true);
|
|
export const achievementOpened = ref(false);
|
|
export const bgmOpened = ref(false);
|
|
|
|
export const transition = ref(true);
|
|
export const noClosePanel = ref(false);
|
|
|
|
export const startAnimationEnded = ref(false);
|
|
|
|
let app: HTMLDivElement;
|
|
|
|
/** ui声明列表 */
|
|
const UI_LIST: [Ref<boolean>, Component][] = [
|
|
// [bookOpened, Book],
|
|
// [toolOpened, Toolbox],
|
|
// [equipOpened, Equipbox],
|
|
// [settingsOpened, Settings],
|
|
// [descOpened, Desc],
|
|
// [skillOpened, Skill],
|
|
// [skillTreeOpened, SkillTree],
|
|
// [flyOpened, Fly],
|
|
// [fixedDetailOpened, FixedDetail],
|
|
// [shopOpened, Shop],
|
|
// [achievementOpened, Achievement],
|
|
// [bgmOpened, Bgm]
|
|
];
|
|
|
|
/** ui栈 */
|
|
export const uiStack = shallowReactive<Component[]>([]);
|
|
|
|
export default function init() {
|
|
// app = document.getElementById('root') as HTMLDivElement;
|
|
// UI_LIST.forEach(([ref, com]) => {
|
|
// watch(ref, n => {
|
|
// if (n === true) {
|
|
// uiStack.push(markRaw(com));
|
|
// showApp();
|
|
// } else {
|
|
// const index = uiStack.findIndex(v => v === com);
|
|
// if (index === -1) return;
|
|
// if (uiStack.length === 1) {
|
|
// hideApp(index);
|
|
// } else {
|
|
// uiStack.splice(index, 1);
|
|
// }
|
|
// }
|
|
// });
|
|
// });
|
|
return {
|
|
uiStack,
|
|
transition,
|
|
bookOpened,
|
|
toolOpened,
|
|
equipOpened,
|
|
showStatusBar,
|
|
settingsOpened,
|
|
descOpened,
|
|
skillOpened,
|
|
skillTreeOpened,
|
|
flyOpened,
|
|
showStudiedSkill,
|
|
fixedDetailOpened,
|
|
shopOpened,
|
|
startOpened,
|
|
startAnimationEnded,
|
|
achievementOpened,
|
|
bgmOpened
|
|
};
|
|
}
|
|
|
|
async function showApp() {
|
|
core.lockControl();
|
|
|
|
if (transition.value) {
|
|
app.style.transition = 'all 0.6s linear';
|
|
} else {
|
|
app.style.transition = 'none';
|
|
}
|
|
app.style.display = 'flex';
|
|
await sleep(50);
|
|
app.style.opacity = '1';
|
|
}
|
|
|
|
async function hideApp(index: number) {
|
|
if (transition.value) {
|
|
app.style.transition = 'all 0.6s linear';
|
|
app.style.opacity = '0';
|
|
await sleep(600);
|
|
} else {
|
|
app.style.transition = '';
|
|
app.style.opacity = '0';
|
|
}
|
|
uiStack.splice(index, 1);
|
|
app.style.display = 'none';
|
|
if (!noClosePanel.value) core.closePanel();
|
|
noClosePanel.value = false;
|
|
}
|