mirror of
https://github.com/unanmed/HumanBreak.git
synced 2025-01-19 04:19:30 +08:00
百科全书
This commit is contained in:
parent
1ce3662bec
commit
1f1cd6ea3b
@ -1394,13 +1394,7 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a = {
|
||||
values: values,
|
||||
version: core.firstData.version,
|
||||
guid: core.getGuid(),
|
||||
time: new Date().getTime(),
|
||||
tower6: core.saveLoopMap('tower6', [
|
||||
'tower1',
|
||||
'tower2',
|
||||
'tower4',
|
||||
'tower5'
|
||||
])
|
||||
time: new Date().getTime()
|
||||
};
|
||||
|
||||
return data;
|
||||
@ -2264,12 +2258,8 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a = {
|
||||
// cls为道具类型，只可能是 tools, constants 和 equips
|
||||
// 返回一个数组，代表当前某类型道具的显示内容和顺序
|
||||
// 默认按id升序排列，您可以取消下面的注释改为按名称排列
|
||||
|
||||
return Object.keys(core.status.hero.items[cls] || {})
|
||||
.filter(function (id) {
|
||||
return !core.material.items[id].hideInToolbox;
|
||||
})
|
||||
.sort(/*function (id1, id2) { return core.material.items[id1].name <= core.material.items[id2].name ? -1 : 1 }*/);
|
||||
//
|
||||
// 用不到这个东西
|
||||
},
|
||||
drawStatusBar: function () {
|
||||
// 自定义绘制状态栏，需要开启状态栏canvas化
|
||||
|
||||
@ -1254,6 +1254,7 @@ var items_296f5d02_12fd_4166_a7c1_b5e830c9ee3a =
|
||||
"cls": "constants",
|
||||
"name": "百科全书",
|
||||
"canUseItemEffect": "true",
|
||||
"text": "一个包含游戏中所有功能详细说明的百科全书，可以查看游戏中所有的功能"
|
||||
"text": "一个包含游戏中所有功能详细说明的百科全书，可以查看游戏中所有的功能",
|
||||
"useItemEffect": "core.plugin.descOpened.value = true;"
|
||||
}
|
||||
}
|
||||
@ -415,7 +415,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
};
|
||||
|
||||
/// 能否使用快捷商店
|
||||
this.canUseQuickShop = function (id) {
|
||||
this.canUseQuickShop = function () {
|
||||
// 如果返回一个字符串，表示不能，字符串为不能使用的提示
|
||||
// 返回null代表可以使用
|
||||
|
||||
@ -492,7 +492,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
core.registerAction(
|
||||
'longClick',
|
||||
'shops',
|
||||
(x, y, px, py) => {
|
||||
(x, y) => {
|
||||
if (
|
||||
!core.status.lockControl ||
|
||||
!core.hasFlag('@temp@shop') ||
|
||||
@ -2906,7 +2906,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
);
|
||||
areaSprite[maps[0]] = btn;
|
||||
if (i === nowArea) btn.setCss(`border: 2px solid gold;`);
|
||||
btn.addEventListener('click', e => {
|
||||
btn.addEventListener('click', () => {
|
||||
if (i === nowArea) return;
|
||||
changeArea(i);
|
||||
});
|
||||
@ -2924,7 +2924,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
transition
|
||||
);
|
||||
areaSprite._area_last_ = last;
|
||||
last.addEventListener('click', e => {
|
||||
last.addEventListener('click', () => {
|
||||
areaPage--;
|
||||
drawAreaList(false);
|
||||
});
|
||||
@ -2941,7 +2941,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
transition
|
||||
);
|
||||
areaSprite._area_next_ = next;
|
||||
next.addEventListener('click', e => {
|
||||
next.addEventListener('click', () => {
|
||||
areaPage++;
|
||||
drawAreaList(false);
|
||||
});
|
||||
@ -5967,13 +5967,13 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
xhr.open(type, url);
|
||||
xhr.send(data);
|
||||
const res = await new Promise(res => {
|
||||
xhr.onload = e => {
|
||||
xhr.onload = () => {
|
||||
if (xhr.status !== 200) {
|
||||
console.error(`hot reload: http ${xhr.status}`);
|
||||
res('@error');
|
||||
} else res('success');
|
||||
};
|
||||
xhr.onerror = e => {
|
||||
xhr.onerror = () => {
|
||||
res('@error');
|
||||
console.error(`hot reload: error on connection`);
|
||||
};
|
||||
@ -6245,8 +6245,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = {
|
||||
if (core.isReplaying()) showToolbox = true;
|
||||
core.plugin.showStatusBar.value = false;
|
||||
|
||||
var statusItems = core.dom.status,
|
||||
toolItems = core.dom.tools;
|
||||
var toolItems = core.dom.tools;
|
||||
core.setFlag('hideStatusBar', true);
|
||||
core.setFlag('showToolbox', showToolbox || null);
|
||||
if (
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { sleep } from 'mutate-animate';
|
||||
import { onMounted, onUnmounted, onUpdated } from 'vue';
|
||||
import { cancelGlobalDrag, useDrag, useWheel } from '../plugin/use';
|
||||
|
||||
@ -88,27 +89,27 @@ function draw() {
|
||||
*/
|
||||
async function calHeight() {
|
||||
await new Promise(res => {
|
||||
const canvas = ctx.canvas;
|
||||
const style2 = getComputedStyle(canvas);
|
||||
canvas.style.width = `${width}px`;
|
||||
canvas.width = width * scale;
|
||||
canvas.height = parseFloat(style2.height) * scale;
|
||||
if (props.noScroll) canvas.style.width = `0px`;
|
||||
|
||||
if (props.type === 'horizontal') {
|
||||
main.style.flexDirection = 'column';
|
||||
canvas.style.height = `${width}px`;
|
||||
canvas.style.width = '98%';
|
||||
canvas.style.margin = '0 1% 0 1%';
|
||||
canvas.width = parseFloat(style2.width) * scale;
|
||||
canvas.height = width * scale;
|
||||
if (props.noScroll) canvas.style.height = `0px`;
|
||||
}
|
||||
requestAnimationFrame(() => {
|
||||
const style = getComputedStyle(content);
|
||||
total = parseFloat(style[canvasAttr]);
|
||||
|
||||
res('');
|
||||
|
||||
const canvas = ctx.canvas;
|
||||
const style2 = getComputedStyle(canvas);
|
||||
canvas.style.width = `${width}px`;
|
||||
canvas.width = width * scale;
|
||||
canvas.height = parseFloat(style2.height) * scale;
|
||||
if (props.noScroll) canvas.style.width = `0px`;
|
||||
|
||||
if (props.type === 'horizontal') {
|
||||
main.style.flexDirection = 'column';
|
||||
canvas.style.height = `${width}px`;
|
||||
canvas.style.width = '98%';
|
||||
canvas.style.margin = '0 1% 0 1%';
|
||||
canvas.width = parseFloat(style2.width) * scale;
|
||||
canvas.height = width * scale;
|
||||
if (props.noScroll) canvas.style.height = `0px`;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -54,7 +54,8 @@ export default function init() {
|
||||
toolOpened,
|
||||
equipOpened,
|
||||
showStatusBar,
|
||||
settingsOpened
|
||||
settingsOpened,
|
||||
descOpened
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
3
src/types/plugin.d.ts
vendored
3
src/types/plugin.d.ts
vendored
@ -106,6 +106,9 @@ interface PluginUis {
|
||||
/** 章节显示的内容 */
|
||||
readonly chapterContent: Ref<boolean>;
|
||||
|
||||
/** 百科全书是否打开了 */
|
||||
readonly descOpened: Ref<boolean>;
|
||||
|
||||
/** ui栈 */
|
||||
readonly uiStack: Ref<Component[]>;
|
||||
|
||||
|
||||
124
src/ui/desc.vue
124
src/ui/desc.vue
@ -1,14 +1,134 @@
|
||||
<template>
|
||||
<div id="desc"></div>
|
||||
<div id="desc">
|
||||
<div id="tools">
|
||||
<span class="button-text" @click="exit"
|
||||
><left-outlined /> 返回游戏</span
|
||||
>
|
||||
</div>
|
||||
<div id="desc-main">
|
||||
<Scroll id="desc-left">
|
||||
<div id="desc-list">
|
||||
<span
|
||||
v-for="(data, k) in desc"
|
||||
class="selectable desc-item"
|
||||
:selected="selected === k"
|
||||
@click="selected = k"
|
||||
>{{ data.text }}</span
|
||||
>
|
||||
</div>
|
||||
</Scroll>
|
||||
<a-divider
|
||||
id="divider"
|
||||
:type="isMobile ? 'horizontal' : 'vertical'"
|
||||
></a-divider>
|
||||
<div id="desc-right">
|
||||
<Scroll><span v-html="content"></span></Scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { computed, ref } from 'vue';
|
||||
import desc from '../data/desc.json';
|
||||
import { LeftOutlined } from '@ant-design/icons-vue';
|
||||
import Scroll from '../components/scroll.vue';
|
||||
import { has } from '../plugin/utils';
|
||||
import { isMobile } from '../plugin/use';
|
||||
|
||||
type DescKey = keyof typeof desc;
|
||||
|
||||
const selected = ref(Object.keys(desc)[0] as DescKey);
|
||||
|
||||
function exit() {
|
||||
core.plugin.descOpened.value = false;
|
||||
}
|
||||
|
||||
const content = computed(() => {
|
||||
return desc[selected.value].desc
|
||||
.map((v, i, a) => {
|
||||
if (/^\d+\./.test(v)) return `${' '.repeat(4)}${v}`;
|
||||
else if (
|
||||
(has(a[i - 1] && v !== '<br>') && a[i - 1] === '<br>') ||
|
||||
i === 0
|
||||
) {
|
||||
return `${' '.repeat(8)}${v}`;
|
||||
} else return v;
|
||||
})
|
||||
.join('');
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#desc {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 2.7vh;
|
||||
font-family: 'normal';
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#desc-main {
|
||||
width: 80%;
|
||||
height: 80%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#desc-left {
|
||||
flex-basis: 30%;
|
||||
}
|
||||
|
||||
#desc-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#desc-right {
|
||||
flex-basis: 70%;
|
||||
}
|
||||
|
||||
#divider {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.desc-item {
|
||||
padding: 1% 3% 1% 3%;
|
||||
}
|
||||
|
||||
#tools {
|
||||
width: 100%;
|
||||
font-family: 'normal';
|
||||
font-size: 3.2vh;
|
||||
height: 5vh;
|
||||
position: fixed;
|
||||
left: 10vw;
|
||||
top: 5vh;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
#desc-main {
|
||||
flex-direction: column;
|
||||
width: 90%;
|
||||
height: 75%;
|
||||
}
|
||||
|
||||
#divider {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
margin: 5% 0 5% 0;
|
||||
}
|
||||
|
||||
#desc-left {
|
||||
height: 40%;
|
||||
}
|
||||
|
||||
#desc-right {
|
||||
height: 50%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -18,7 +18,10 @@
|
||||
>
|
||||
</div>
|
||||
</Scroll>
|
||||
<a-divider id="divider" type="vertical"></a-divider>
|
||||
<a-divider
|
||||
id="divider"
|
||||
:type="isMobile ? 'horizontal' : 'vertical'"
|
||||
></a-divider>
|
||||
<div id="setting-right">
|
||||
<Scroll style="height: 100%">
|
||||
<span
|
||||
@ -39,6 +42,7 @@ import settingInfo from '../data/settings.json';
|
||||
import { type } from '../plugin/utils';
|
||||
import Scroll from '../components/scroll.vue';
|
||||
import { LeftOutlined } from '@ant-design/icons-vue';
|
||||
import { isMobile } from '../plugin/use';
|
||||
|
||||
type Settings = typeof settingInfo;
|
||||
|
||||
@ -61,7 +65,7 @@ function exit() {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-family: 'normal';
|
||||
font-size: 24px;
|
||||
font-size: 2.7vh;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@ -84,10 +88,12 @@ function exit() {
|
||||
|
||||
#setting-left {
|
||||
flex-basis: 40%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#setting-right {
|
||||
flex-basis: 60%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#divider {
|
||||
@ -97,10 +103,32 @@ function exit() {
|
||||
#tools {
|
||||
width: 100%;
|
||||
font-family: 'normal';
|
||||
font-size: 1.7em;
|
||||
font-size: 3.2vh;
|
||||
height: 5vh;
|
||||
position: fixed;
|
||||
left: 10vw;
|
||||
top: 10vh;
|
||||
top: 5vh;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
#settings-main {
|
||||
flex-direction: column;
|
||||
width: 90%;
|
||||
height: 75%;
|
||||
}
|
||||
|
||||
#divider {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
margin: 5% 0 5% 0;
|
||||
}
|
||||
|
||||
#setting-left {
|
||||
height: 40%;
|
||||
}
|
||||
|
||||
#setting-right {
|
||||
height: 50%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user