第一步:
// 初始化游戏逻辑
initGame();
第二步:
function initGame() {
// 添加点击事件监听
menuContainer.addEventListener('click', startGame);// 在开始菜单界面点击时,开始游戏
overContainer.addEventListener('click', startGame);// 在游戏结束界面点击时,开始游戏
gameContainer.addEventListener('click', onGameClick);// 在游戏界面点击时,检测是否点击了小球
console.log('初始化游戏逻辑完成,请点击开始按钮');
}
第三步:
/**
* 开始游戏
* 逻辑说明:显示游戏界面和信息显示栏,隐藏其他界面,清除游戏界面上可能存在的小球,并创建关卡1
*/
function startGame() {
console.log('开始游戏');
setVisible(overContainer, false);
setVisible(menuContainer, false);
setVisible(gameContainer, true);
setVisible(infoContainer, true);
createLevel(1);
}
第四步:
/**
* 创建关卡
* @param lev 关卡
*/
function createLevel(lev) {
console.log('创建游戏关卡:', lev);
}
第五步:
/**
* 点击游戏界面时调用的方法
* @param event
*/
function onGameClick(event) {
gameOver();
}
第六步:
/**
* 游戏结束,设置游戏状态为false,弹出游戏结束界面,隐藏其它界面,并显示最终得分
*/
function gameOver() {
console.log('显示游戏结束界面!');
overContainer.innerText = '游戏结束\n\n得分:99\n\n\n重新开始';
setVisible(overContainer, true);
setVisible(gameContainer, false);
setVisible(infoContainer, false);
}