121 lines
3.9 KiB
JavaScript
121 lines
3.9 KiB
JavaScript
/**************************************
|
||
文件名：leaderBoard.js
|
||
功能：该模块用于处理主菜单排行榜相关内容
|
||
版本：2.0(23.01.08)
|
||
**************************************/
|
||
|
||
/**************************************
|
||
对象名：LeaderBoard
|
||
参数：lang: 传入语言
|
||
**************************************/
|
||
function LeaderBoard(lang){
|
||
//设置排行榜缓存标签
|
||
this.HighRankKey = 'MinesweeperRank';
|
||
//从缓存中获取排行榜
|
||
this.highRank = this.getRank();
|
||
//获取HTML中排行榜
|
||
this.leadList = document.querySelector(".leadList");
|
||
//获取排行榜下一页按钮
|
||
this.next = document.querySelector(".next");
|
||
//获取语言
|
||
this.lang = lang;
|
||
|
||
//在设置监听的匿名函数中，“this”不是指代的leaderBoard对象，必须单独获取
|
||
let self = this;
|
||
//下一页按钮事件监听
|
||
this.next.addEventListener("click", function(){
|
||
let nextDiff = self.next.innerHTML;
|
||
if(nextDiff == "Easy" || nextDiff == "简单" || nextDiff == "簡単"){
|
||
self.rankRender("easy");
|
||
}else if(nextDiff == "Hard" || nextDiff == "困难" || nextDiff == "難しい"){
|
||
self.rankRender("hard");
|
||
}else if(nextDiff == "Extra"){
|
||
self.rankRender("extra");
|
||
}
|
||
});
|
||
}
|
||
|
||
/**************************************
|
||
方式名：getRank()
|
||
功能：从缓存中获取排行榜
|
||
返回值：返回排行榜对象
|
||
**************************************/
|
||
LeaderBoard.prototype.getRank = function(){
|
||
let newRank = {
|
||
easyRank: [],
|
||
hardRank: [],
|
||
extraRank: []
|
||
}
|
||
const rank = window.localStorage.getItem(this.HighRankKey);
|
||
//如果缓存中没有排行榜，返回空的排行榜对象
|
||
return rank ? JSON.parse(rank) : newRank;
|
||
}
|
||
|
||
/**************************************
|
||
方式名：rankRender(difficulty)
|
||
参数：difficulty: 游戏难度(easy为简单，hard为困难，extra为ex难度)
|
||
功能：渲染排行榜
|
||
**************************************/
|
||
LeaderBoard.prototype.rankRender = function(difficulty){
|
||
let rank = null;
|
||
let diffCon = '';
|
||
let nextCon = '';
|
||
switch(difficulty){
|
||
case "easy":
|
||
rank = this.highRank.easyRank;
|
||
switch(this.lang){
|
||
case "zh_cn":
|
||
diffCon = "简单";
|
||
nextCon = "困难";
|
||
break;
|
||
case "en":
|
||
diffCon = "Easy";
|
||
nextCon = "Hard";
|
||
break;
|
||
case "jp":
|
||
diffCon = "簡単";
|
||
nextCon = "難しい";
|
||
break;
|
||
}
|
||
break;
|
||
case "hard":
|
||
rank = this.highRank.hardRank;
|
||
switch(this.lang){
|
||
case "zh_cn":
|
||
diffCon = "困难";
|
||
break;
|
||
case "en":
|
||
diffCon = "Hard";
|
||
break;
|
||
case "jp":
|
||
diffCon = "難しい";
|
||
break;
|
||
}
|
||
nextCon = "Extra";
|
||
break;
|
||
case "extra":
|
||
rank = this.highRank.extraRank;
|
||
switch(this.lang){
|
||
case "zh_cn":
|
||
nextCon = "简单";
|
||
break;
|
||
case "en":
|
||
nextCon = "Easy";
|
||
break;
|
||
case "jp":
|
||
nextCon = "簡単";
|
||
break;
|
||
}
|
||
diffCon = "Extra";
|
||
break;
|
||
}
|
||
this.leadList.innerHTML = '';
|
||
for (let i = 0; i < rank.length; i++){
|
||
let li = document.createElement("li");
|
||
li.innerHTML =
|
||
`<div>${i+1}</div><div>${rank[i].ID}</div><div>${rank[i].time}</div>`;
|
||
this.leadList.appendChild(li);
|
||
}
|
||
document.querySelector(".leaderDif").innerHTML = diffCon;
|
||
this.next.innerHTML = nextCon;
|
||
} |