sinvo/lifeRestart
1
0
Fork 0
mirror of https://github.com/VickScarlet/lifeRestart.git synced 2026-03-24 21:37:40 +08:00
Code Issues Projects Releases Wiki Activity

add summary

Browse Source
This commit is contained in:
Vick Scarlet
2021-08-18 15:41:58 +08:00
parent 3eff53a5aa
commit ee1ef21efd
8 changed files with 214 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
src/app.js
View File

@@ -1,3 +1,5 @@
import { max } from './functions/util.js';
import { summary } from './functions/summary.js'
import Life from './life.js'
class App{
constructor(){
@@ -9,12 +11,16 @@ class App{
#talentSelected = new Set();
#totalMax=20;
#isEnd = false;
#selectedExtendTalent = null;
async initial() {
this.initPages();
this.switch('loading');
await this.#life.initial();
this.switch('index');
window.onerror = (event, source, lineno, colno, error) => {
this.hint(`[ERROR] at (${source}:${lineno}:${colno})\n\n${error?.stack||error||'unknow Error'}`);
}
}
initPages() {
@@ -58,20 +64,7 @@ class App{
// Talent
const createTalent = ({ grade, name, description }) => {
const element = $(`<li>${name}（${description}）</li>`)
switch(grade) {
case 1:
element.addClass('sprcial_blue');
break;
case 2:
element.addClass('sprcial_purple');
break;
case 3:
element.addClass('sprcial_orange');
break;
default: break;
}
return element;
return $(`<li class="grade${grade}b">${name}（${description}）</li>`)
};
talentPage
@@ -86,14 +79,14 @@ class App{
li.click(()=>{
if(li.hasClass('selected')) {
li.removeClass('selected')
this.#talentSelected.delete(talent.id);
this.#talentSelected.delete(talent);
} else {
if(this.#talentSelected.size==3) {
this.hint('只能选3个天赋');
return;
}
li.addClass('selected');
this.#talentSelected.add(talent.id);
this.#talentSelected.add(talent);
}
});
});
@@ -106,7 +99,7 @@ class App{
this.hint('请选择3个天赋');
return;
}
this.#totalMax = 20 + this.#life.getTalentAllocationAddition(Array.from(this.#talentSelected));
this.#totalMax = 20 + this.#life.getTalentAllocationAddition(Array.from(this.#talentSelected).map(({id})=>id));
this.switch('property');
})
@@ -162,6 +155,18 @@ class App{
set(get()+1);
});
btnSub.click(()=>set(get()-1));
inputBox.on('input', ()=>{
const t = total();
let val = get();
if(t > this.#totalMax) {
val -= t - this.#totalMax;
}
val = limit(val);
if(val != inputBox.val()) {
set(val);
}
freshTotal();
});
return {group, get, set};
}
@@ -186,9 +191,9 @@ class App{
const select = Math.floor(Math.random() * 4) % 4;
if(arr[select] - sub <0) continue;
arr[select] -= sub;
t -= sub;
break;
}
t -= sub;
}
groups.CHR.set(arr[0]);
groups.INT.set(arr[1]);
@@ -198,13 +203,17 @@ class App{
propertyPage.find('#start')
.click(()=>{
if(total()!=this.#totalMax) {
this.hint(`你还有${this.#totalMax-total()}属性点没有分配完`);
return;
}
this.#life.restart({
CHR: groups.CHR.get(),
INT: groups.INT.get(),
STR: groups.STR.get(),
MNY: groups.MNY.get(),
SPR: 5,
TLT: Array.from(this.#talentSelected),
TLT: Array.from(this.#talentSelected).map(({id})=>id),
});
this.switch('trajectory');
this.#pages.trajectory.born();
@@ -246,9 +255,35 @@ class App{
trajectoryPage.find('#summary')
.click(()=>{
this.switch('summary');
})
const summaryPage = $(`
<div id="main">
<div class="head">人生总结</div>
<ul id="judge" class="judge" style="bottom: calc(35% + 2.5rem)">
<li class="grade2"><span>颜值：</span>9级 美若天仙</li>
<li><span>智力：</span>4级 智力一般</li>
<li><span>体质：</span>1级 极度虚弱</li>
<li><span>家境：</span>6级 小康之家</li>
<li><span>享年：</span>3岁 早夭</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
</ul>
<div class="head" style="top:auto; bottom:35%">天赋，你可以选一个，下辈子还能抽到</div>
<ul id="talents" class="selectlist" style="top:calc(65% + 0.5rem); bottom:8rem">
<li class="grade2b">黑幕（面试一定成功）</li>
</ul>
<button id="again" class="mainbtn" style="top:auto; bottom:0.1em"><span class="iconfont">&#xe6a7;</span>再次重开</button>
</div>
`);
summaryPage.find('#again')
.click(()=>{
this.times ++;
this.#life.talentExtend(this.#selectedExtendTalent);
this.switch('index');
});
this.#pages = {
loading: {
page: loadingPage,
@@ -259,28 +294,28 @@ class App{
btnRank: indexPage.find('#rank'),
btnRestart: indexPage.find('#restart'),
hint: indexPage.find('.hint'),
cnt: indexPage.find('.cnt'),
cnt: indexPage.find('#cnt'),
clear: ()=>{
indexPage.find('.hint').hide();
const times = this.times;
const btnRank = indexPage.find('#rank');
const cnt = indexPage.find('.cnt');
if(times < 0) {
btnRank.hide();
cnt.hide();
return;
}
const cnt = indexPage.find('#cnt');
if(times > 0) {
btnRank.show();
cnt.show();
cnt.text(`已重开${times}次`);
return;
}
btnRank.hide();
cnt.hide();
},
},
talent: {
page: talentPage,
clear: ()=>{
talentPage.find('ul.selectlist').children().remove();
talentPage.find('ul.selectlist').empty();
talentPage.find('#random').show();
this.#totalMax = 20;
},
@@ -294,7 +329,7 @@ class App{
trajectory: {
page: trajectoryPage,
clear: ()=>{
trajectoryPage.find('#lifeTrajectory').children().remove();
trajectoryPage.find('#lifeTrajectory').empty();
trajectoryPage.find('#summary').hide();
this.#isEnd = false;
},
@@ -302,17 +337,80 @@ class App{
trajectoryPage.find('#lifeTrajectory').trigger("click");
}
},
summary: {
page: summaryPage,
clear: ()=>{
const judge = summaryPage.find('#judge');
const talents = summaryPage.find('#talents');
judge.empty();
talents.empty();
this.#talentSelected.forEach(talent=>{
const li = createTalent(talent);
talents.append(li);
li.click(()=>{
if(li.hasClass('selected')) {
this.#selectedExtendTalent = null;
li.removeClass('selected');
} else if(this.#selectedExtendTalent != null) {
this.hint('只能继承一个天赋');
return;
} else {
this.#selectedExtendTalent = talent.id;
li.addClass('selected');
}
});
});
const records = this.#life.getRecord();
const s = (type, func)=>{
const value = func(records.map(({[type]:v})=>v));
const { judge, grade } = summary(type, value);
return { judge, grade, value };
};
console.table(records);
console.debug(records);
judge.append([
(()=>{
const { judge, grade, value } = s('CHR', max);
return `<li class="grade${grade}"><span>颜值：</span>${value} ${judge}</li>`
})(),
(()=>{
const { judge, grade, value } = s('INT', max);
return `<li class="grade${grade}"><span>智力：</span>${value} ${judge}</li>`
})(),
(()=>{
const { judge, grade, value } = s('STR', max);
return `<li class="grade${grade}"><span>体质：</span>${value} ${judge}</li>`
})(),
(()=>{
const { judge, grade, value } = s('MNY', max);
return `<li class="grade${grade}"><span>家境：</span>${value} ${judge}</li>`
})(),
(()=>{
const { judge, grade, value } = s('AGE', max);
return `<li class="grade${grade}"><span>享年：</span>${value} ${judge}</li>`
})(),
(()=>{
const { judge, grade, value } = s('SPR', max);
return `<li class="grade${grade}"><span>快乐：</span>${value} ${judge}</li>`
})(),
].join(''));
}
}
}
}
switch(page) {
const p = this.#pages[page];
if(!p) return;
$('#main').remove();
$('#main').detach();
p.clear();
p.page.appendTo('body');
}
hint(str) {
alert(str);
}
@@ -323,3 +421,4 @@ class App{
}
export default App;

2
src/functions/summary.js
View File

@@ -74,3 +74,5 @@ function summary(type, value) {
if(min==void 0 || value >= min) return {judge, grade};
}
}
export { summary };

21
src/functions/util.js
View File

@@ -9,4 +9,23 @@ function clone(value) {
}
}
export { clone };
function max(...arr) {
return Math.max(...arr.flat());
}
function min(...arr) {
return Math.min(...arr.flat());
}
function sum(...arr) {
let s = 0;
arr.flat().forEach(v=>s+=v);
return s;
}
function average(...arr) {
const s = sum(...arr);
return s / arr.flat().length;
}
export { clone, max, min, sum, average };

6
src/life.js
View File

@@ -99,7 +99,11 @@ class Life {
}
talentRandom() {
return this.#talent.talentRandom();
return this.#talent.talentRandom(localStorage.extendTalent);
}
talentExtend(talentId) {
localStorage.extendTalent = talentId;
}
getRecord() {

9
src/talent.js
View File

@@ -29,17 +29,22 @@ class Talent {
return { grade, name, description };
}
talentRandom() {
talentRandom(include) {
// 1000, 100, 10, 1
const talentList = {};
for(const talentId in this.#talents) {
const { id, grade, name, description } = this.#talents[talentId];
if(id == include) {
include = { grade, name, description, id };
continue;
}
if(!talentList[grade]) talentList[grade] = [{ grade, name, description, id }];
else talentList[grade].push({ grade, name, description, id });
}
return new Array(10)
.fill(1).map(()=>{
.fill(1).map((i)=>{
if(!i && include) return include;
const gradeRandom = Math.random();
let grade;
if(gradeRandom>=0.111) grade = 0;

4
view/index.html
View File

@@ -14,8 +14,6 @@
<script type="module">
import App from '../src/app.js';
const app = new App();
app
.initial()
.then(()=>app.main());
app.initial();
</script>
</html>

32
view/style.css
View File

@@ -125,6 +125,7 @@ html {
text-align: center;
}
.judge,
.lifeTrajectory,
.propinitial,
.selectlist {
@@ -166,16 +167,19 @@ html {
content: "　";
}
.sprcial_blue::before {
background-color: rgb(116, 191, 255);
.grade1,
.grade1b::before {
background-color: rgb(116, 191, 255) !important;
}
.sprcial_purple::before {
background-color: rgb(226, 167, 255);
.grade2,
.grade2b::before {
background-color: rgb(226, 167, 255) !important;
}
.sprcial_orange::before {
background-color: lightsalmon;
.grade3,
.grade3b::before {
background-color: lightsalmon !important;
}
.selected {
@@ -220,6 +224,7 @@ html {
background-color: aliceblue;
}
.judge > li,
.lifeTrajectory > li {
position: relative;
width: calc(100% - 7rem);
@@ -230,9 +235,24 @@ html {
box-shadow: lightblue 0 0 0.4rem;
}
.judge > li > span,
.lifeTrajectory > li > span {
position: absolute;
left: 0;
width: 6rem;
text-align: right;
}
.judge > li {
box-shadow: lightgray 0 0 0.4rem;
width: calc(100% - 9rem);
margin: 0.5rem;
padding: 0.5rem 1rem 0.5rem 7rem;
}
.judge > li > span {
background-color: white;
height: calc(100% - 1rem);
padding: 0.5rem 0;
top: 0;
}

34
view/test.html
View File

@@ -12,20 +12,28 @@
</head>
<body style="margin: 0; height: 100%">
<div id="main">
<ul id="lifeTrajectory" class="lifeTrajectory">
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了你出生了</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<li><span>0岁：</span>你出生了，你是女孩</li>
<div class="head">人生总结</div>
<ul id="judge" class="judge" style="bottom: calc(35% + 2.5rem)">
<li class="grade2"><span>颜值：</span>9级 美若天仙</li>
<li><span>智力：</span>4级 智力一般</li>
<li><span>体质：</span>1级 极度虚弱</li>
<li><span>家境：</span>6级 小康之家</li>
<li><span>享年：</span>3岁 早夭</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
<li><span>快乐：</span>3级 不太幸福的人生</li>
</ul>
<button id="summary" class="mainbtn" style="top:auto; bottom:0.1rem">人生总结</button>
<div class="head" style="top:auto; bottom:35%">天赋，你可以选一个，下辈子还能抽到</div>
<ul id="talents" class="selectlist" style="top:calc(65% + 0.5rem); bottom:8rem">
<li class="grade2b">黑幕（面试一定成功）</li>
</ul>
<button id="again" class="mainbtn" style="top:auto; bottom:0.1em"><span class="iconfont">&#xe6a7;</span>再次重开</button>
</div>
</body>
</html>