Skip to content

Commit

Permalink
fix: 分数缓存逻辑调整
Browse files Browse the repository at this point in the history
  • Loading branch information
@StreakingMan
StreakingMan committed Oct 12, 2022
1 parent 9682d31 commit a8a6312
Show file tree
Hide file tree
Showing 6 changed files with 61 additions and 19 deletions.
23 changes: 17 additions & 6 deletions src/App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import {
LAST_SCORE_STORAGE_KEY,
LAST_TIME_STORAGE_KEY,
PLAYING_THEME_ID_STORAGE_KEY,
resetScoreStorage,
wrapThemeDefaultSounds,
} from './utils';
import { Theme } from './themes/interface';
Expand All @@ -18,20 +19,30 @@ const ThemeChanger = React.lazy(() => import('./components/ThemeChanger'));
const ConfigDialog = React.lazy(() => import('./components/ConfigDialog'));
const WxQrCode = React.lazy(() => import('./components/WxQrCode'));

// 读取缓存关卡得分
const initLevel = Number(localStorage.getItem(LAST_LEVEL_STORAGE_KEY) || '1');
const initScore = Number(localStorage.getItem(LAST_SCORE_STORAGE_KEY) || '0');
const initTime = Number(localStorage.getItem(LAST_TIME_STORAGE_KEY) || '0');

const App: FC<{ theme: Theme<any> }> = ({ theme: initTheme }) => {
console.log('initTheme', initTheme);
// console.log(JSON.stringify(theme));

const [theme, setTheme] = useState<Theme<any>>(initTheme);
const [diyDialogShow, setDiyDialogShow] = useState<boolean>(false);

// 读取缓存关卡得分
const [initLevel, setInitLevel] = useState<number>(
Number(localStorage.getItem(LAST_LEVEL_STORAGE_KEY) || '1')
);
const [initScore, setInitScore] = useState<number>(
Number(localStorage.getItem(LAST_SCORE_STORAGE_KEY) || '0')
);
const [initTime, setInitTime] = useState<number>(
Number(localStorage.getItem(LAST_TIME_STORAGE_KEY) || '0')
);

const changeTheme = (theme: Theme<any>) => {
sessionStorage.setItem(PLAYING_THEME_ID_STORAGE_KEY, theme.title);
localStorage.setItem(PLAYING_THEME_ID_STORAGE_KEY, theme.title);
setInitLevel(1);
setInitScore(0);
setInitTime(0);
resetScoreStorage();
wrapThemeDefaultSounds(theme);
domRelatedOptForTheme(theme);
setTheme({ ...theme });
Expand Down
8 changes: 2 additions & 6 deletions src/components/Game.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
LAST_SCORE_STORAGE_KEY,
LAST_TIME_STORAGE_KEY,
randomString,
resetScoreStorage,
timestampToUsedTimeString,
waitTimeout,
} from '../utils';
Expand Down Expand Up @@ -170,7 +171,6 @@ const Game: FC<{
Record<MySymbol['id'], number>
>({});
const [finished, setFinished] = useState<boolean>(false);
const [tipText, setTipText] = useState<string>('');
const [animating, setAnimating] = useState<boolean>(false);

// 音效
Expand Down Expand Up @@ -394,14 +394,12 @@ const Game: FC<{

// 输了
if (updateQueue.length === 7) {
setTipText('失败了');
setFinished(true);
}

if (!updateScene.find((s) => s.status !== 2)) {
// 胜利
if (level === maxLevel) {
setTipText('完成挑战');
setFinished(true);
return;
}
Expand All @@ -428,9 +426,7 @@ const Game: FC<{
useEffect(() => {
if (finished) {
intervalRef.current && clearInterval(intervalRef.current);
localStorage.setItem(LAST_LEVEL_STORAGE_KEY, '1');
localStorage.setItem(LAST_SCORE_STORAGE_KEY, '0');
localStorage.setItem(LAST_TIME_STORAGE_KEY, '0');
resetScoreStorage();
}
}, [finished]);
// 更新使用时间
Expand Down
24 changes: 20 additions & 4 deletions src/components/Score.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ const Score: FC<{
// 综合评分
const rating = Math.max(0, score) * 100 - Math.round(time / 1000);
// 分主题排行
const themeId = sessionStorage.getItem(PLAYING_THEME_ID_STORAGE_KEY);
const themeId = localStorage.getItem(PLAYING_THEME_ID_STORAGE_KEY);

const uploadRankInfo = (id?: string) => {
const _userId = localStorage.getItem(USER_ID_STORAGE_KEY);
Expand Down Expand Up @@ -93,6 +93,13 @@ const Score: FC<{
.then((res) => {
setRankList(res as any);
cb && cb(res as any);
const _userId = localStorage.getItem(USER_ID_STORAGE_KEY);
if (_userId) {
setTimeout(() => {
const rankEl = document.getElementById(_userId + 'el');
rankEl?.scrollIntoView({ behavior: 'smooth' });
});
}
})
.catch((e) => {
console.log(e);
Expand Down Expand Up @@ -219,22 +226,31 @@ const Score: FC<{
<tr>
<th>名次</th>
<th>名称</th>
{/*<th>通关数</th>*/}
<th>通关数</th>
{/*<th>用时</th>*/}
{/*<th>得分</th>*/}
<th>综合评分</th>
</tr>
</thead>
<tbody>
{rankList.map((rank, idx) => (
<tr key={idx}>
<tr
key={idx}
id={rank.userId}
style={{
background:
rank.userId === userId
? 'rgb(0 0 0 / 20%)'
: '',
}}
>
<td>{idx + 1}</td>
<td>
{rank.username}
{rank.userId === userId &&
'(你)'}
</td>
{/*<td>{rank.level}</td>*/}
<td>{rank.level}</td>
{/*<td>*/}
{/* {timestampToUsedTimeString(*/}
{/* rank.time*/}
Expand Down
16 changes: 15 additions & 1 deletion src/main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,12 @@ import Bmob from 'hydrogen-js-sdk';
import {
DEFAULT_BGM_STORAGE_KEY,
domRelatedOptForTheme,
LAST_LEVEL_STORAGE_KEY,
LAST_SCORE_STORAGE_KEY,
LAST_TIME_STORAGE_KEY,
parsePathCustomThemeId,
PLAYING_THEME_ID_STORAGE_KEY,
resetScoreStorage,
wrapThemeDefaultSounds,
} from './utils';
import { getDefaultTheme } from './themes/default';
Expand All @@ -34,7 +38,17 @@ const errorTip = (tip: string) => {

// 加载成功后数据转换（runtime）以及转场
const successTrans = (theme: Theme<any>) => {
sessionStorage.setItem(
// 如果上次玩的不是这个主题，清除缓存分数
const lastPlayTheme = localStorage.getItem(PLAYING_THEME_ID_STORAGE_KEY);
if (
!lastPlayTheme ||
![customThemeIdFromPath, theme.title].includes(lastPlayTheme)
) {
resetScoreStorage();
}

// 缓存当前主题id
localStorage.setItem(
PLAYING_THEME_ID_STORAGE_KEY,
customThemeIdFromPath || theme.title
);
Expand Down
2 changes: 1 addition & 1 deletion src/themes/default/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export const getDefaultTheme: () => Theme<DefaultSoundNames> = () => {
title: '有解的羊了个羊',
desc: '真的可以通关~',
dark: true,
maxLevel: 5,
maxLevel: 10,
backgroundColor: '#8dac85',
icons: icons.map((icon) => ({
name: icon,
Expand Down
7 changes: 6 additions & 1 deletion src/utils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,16 @@ export const DEFAULT_TRIPLE_SOUND_STORAGE_KEY = 'defaultTripleSound';
export const DEFAULT_CLICK_SOUND_STORAGE_KEY = 'defaultClickSound';
export const USER_NAME_STORAGE_KEY = 'username';
export const USER_ID_STORAGE_KEY = 'userId';
// session
export const PLAYING_THEME_ID_STORAGE_KEY = 'playingThemeId';

export const linkReg = /^(https|data):+/;

export const resetScoreStorage = () => {
localStorage.setItem(LAST_LEVEL_STORAGE_KEY, '1');
localStorage.setItem(LAST_SCORE_STORAGE_KEY, '0');
localStorage.setItem(LAST_TIME_STORAGE_KEY, '0');
};

export const randomString: (len: number) => string = (len) => {
const pool = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
let res = '';
Expand Down

2 comments on commit a8a6312

@vercel
Copy link

@vercel vercel bot commented on a8a6312 Oct 12, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

solvable-sheep-game – ./

solvable-sheep-game-skm-studio.vercel.app
solvable-sheep-game.vercel.app
solvable-sheep-game-git-master-skm-studio.vercel.app
solvable-sheep-game.streakingman.com

@vercel
Copy link

@vercel vercel bot commented on a8a6312 Oct 12, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

solvable-sheep-game-diy – ./

solvable-sheep-game-sdqr.vercel.app
solvable-sheep-game-diy-git-master-skm-studio.vercel.app
solvable-sheep-game-diy-skm-studio.vercel.app

Please sign in to comment.