欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

用javascript做一個(gè)小游戲平臺 (二) 游戲選擇器

 更新時(shí)間:2010年01月01日 01:17:51   作者:  
昨天晚上“設(shè)計(jì)”了n久,那些代碼都還沒有運(yùn)行起來,有點(diǎn)心急、有點(diǎn)郁悶。
今天先預(yù)覽一下今晚的成果,如下(挫了點(diǎn),別扔磚頭):

今天主要設(shè)計(jì)了下選擇器,就是進(jìn)入游戲時(shí)展現(xiàn)游戲列表,然后用來選擇游戲的一個(gè)白癡的功能。

選擇器建立在昨天的游戲類基礎(chǔ)上,針對昨天的代碼我作了部分修改:
復(fù)制代碼 代碼如下:

//5.游戲類:名稱,邏輯方法,鍵盤方法,開始方法,開始關(guān)卡方法,結(jié)束方法
var Game = function(name, logicalFn, keyFn, startFn, loadFn, endFn) {
//游戲名
this._name = name || "未命名";
//5.a.1:邏輯控制
this._LControl = logicalFn || function(date) {
//簡單游戲邏輯控制
if (this._FrameMain) {
var innHTML = "游戲時(shí)間:" + date.getSeconds() + "秒" + date.getMilliseconds();
innHTML += "<br/>當(dāng)前游戲沒有編寫,您可以按Esc退出該游戲;";
this._FrameMain.innerHTML = innHTML;
}
};
//5.a.2:鍵盤控制
this._KControl = keyFn || function(event) {
//簡單鍵盤邏輯
alert("您敲擊了" + event.keyCode + "鍵");
};
//5.b.1:標(biāo)題區(qū)域
this._FrameTitle = null;
//5.b.2:游戲區(qū)域
this._FrameMain = null;
//5.b.3:狀態(tài)顯示區(qū)
this._FrameState = null;
//5.b.4:控制區(qū)
this._FrameControl = null;
//5.c.1:開場動(dòng)畫
this._AnmLoad = new Animation("進(jìn)入游戲",null);
//5.c.2:過關(guān)動(dòng)畫
this._AnmNext = new Animation("加載中",null);
//5.c.3:結(jié)束動(dòng)畫
this._AnmEnd = new Animation("結(jié)束",null);
//5.d.1:開始:調(diào)用開始動(dòng)畫、開始處理方法、加載游戲
this._Start = function() {
this._AnmLoad = this._AnmLoad || new Animation(null);
var temp = this; //得到當(dāng)前對象
this._AnmLoad._palyEnd = this._AnmLoad._palyEnd || function() {
startFn && startFn();
temp._Load();
};
this._AnmLoad._play();
};
//5.d.2:結(jié)束
this._End = endFn || function() {
alert("游戲結(jié)束");
};
//5.d.3:加載:每次開始游戲時(shí)(關(guān)卡開始)
this._Load = function() {
this._AnmNext = this._AnmNext || new Animation(null);
var temp = this; //得到當(dāng)前對象
this._AnmNext._palyEnd = this._AnmNext._palyEnd || function() {
if (!loadFn) {
temp._FrameTitle = _HtmlControl._newPanel(0, 0, 400, 30);
temp._FrameTitle.innerHTML = temp._name || "未命名游戲";
temp._FrameMain = _HtmlControl._newPanel(0, 30, 350, 370);
temp._FrameState = _HtmlControl._newPanel(350, 30, 50, 180);
temp._FrameControl = _HtmlControl._newPanel(350, 210, 50, 190);
_HtmlControl._ClearArea();
_HtmlControl._AddControl(temp._FrameTitle);
_HtmlControl._AddControl(temp._FrameMain);
_HtmlControl._AddControl(temp._FrameState);
_HtmlControl._AddControl(temp._FrameControl);
} else {
loadFn();
}
}
this._AnmNext && this._AnmNext._play();
}
//5.e地圖
this._Map = [];
mapIndex = -1;
};

就是說選擇器它也是游戲類的一個(gè)對象,有加載動(dòng)畫,也有鍵盤處理等:
復(fù)制代碼 代碼如下:

//創(chuàng)建游戲
var game1 = new Game("貪吃蛇", null, null);
var game2 = new Game("俄羅斯方塊", null, null);
var game3 = new Game("推箱子", null, null);
var game4 = new Game("賽車", null, null);
var game5 = new Game("坦克大戰(zhàn)", null, null);
//----------------------------------------------------
//6.游戲列表
var _GameList = [game1, game2, game3, game4, game5];
//----------------------------------------------------
//7.游戲選擇器
var _GameChoose = new Game("選擇器", null, null);
{
_GameChoose._Map = _GameList;
_GameChoose._Load = function() {
this._FrameTitle = _HtmlControl._newPanel(0, 0, 400, 30);
this._FrameTitle.innerHTML = "請選擇游戲";
this._FrameMain = _HtmlControl._newPanel(0, 30, 240, 370);
this._FrameState = _HtmlControl._newPanel(240, 30, 160, 180);
this._FrameState.innerHTML = "你可以<br/>使用上下鍵<br/>選擇游戲";
this._FrameControl = _HtmlControl._newPanel(240, 210, 160, 190);
this._FrameControl.innerHTML = "按下Enter<br/>進(jìn)入游戲";
this._tempButtons = [];
this._tempButtonsIndex = 0;
//this._FrameMain.style.滾動(dòng)條//
if (this._Map.length > 0) {
for (var i = 0; i < this._Map.length; i++) {
var button = _HtmlControl._newButton(this._Map[i]._name, 200, 30);
this._FrameMain.appendChild(button);
this._tempButtons.push(button);
}
this._tempButtons[0].select();
}
_HtmlControl._AddControl(this._FrameTitle);
_HtmlControl._AddControl(this._FrameMain);
_HtmlControl._AddControl(this._FrameState);
_HtmlControl._AddControl(this._FrameControl);
};
_GameChoose._LControl = function(date) {
if (mapIndex != -1) {
this._Map && this._Map[mapIndex]._LControl(date);
}
};
_GameChoose._KControl = function(event) {
if (mapIndex == -1) {
switch (event.keyCode) {
case _KeyParameters.KeyUp:
{
//alert("上t");
if (this._tempButtonsIndex > 0) {
this._tempButtonsIndex--;
for (var i = 0; i < this._tempButtons.length; i++) {
this._tempButtons[i].unselect();
}
this._tempButtons[this._tempButtonsIndex].select();
}
}
break;
case _KeyParameters.KeyDown:
{
//alert("下");
if (this._tempButtonsIndex < this._tempButtons.length - 1) {
this._tempButtonsIndex++;
for (var i = 0; i < this._tempButtons.length; i++) {
this._tempButtons[i].unselect();
}
this._tempButtons[this._tempButtonsIndex].select();
}
}
break;
case _KeyParameters.KeyEnter:
{
mapIndex = this._tempButtonsIndex;
this._Map && this._Map[mapIndex]._Start();
}
break;
default:
{
} break;
}
} else {
if (event.keyCode == _KeyParameters.KeyESC) {
mapIndex = -1;
this._Start();
return;
}
this._Map && this._Map[mapIndex]._KControl(event);
}
}
}

就這么寫內(nèi)容,由于時(shí)間關(guān)系,貪吃蛇仍然沒有做,昨天最后一句口號被公司的人說了,說我把公司分配的任務(wù)扔了。

今天要改一句口號,以促進(jìn)第一個(gè)游戲的完成:白天權(quán)限,晚上貪吃蛇,我要把貪吃蛇做到極致,嘿嘿...

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]

寫的明顯很挫,但是為了提升自己的各方面能力,還是貼上來了,歡迎各位批評。

相關(guān)文章

  • JavaScript中的原始值和復(fù)雜值

    JavaScript中的原始值和復(fù)雜值

    這篇文章主要介紹了JavaScript中的原始值和復(fù)雜值 的相關(guān)資料,需要的朋友可以參考下
    2016-01-01
  • 利用JavaScript構(gòu)建樹形圖的方法詳解

    利用JavaScript構(gòu)建樹形圖的方法詳解

    ?樹形圖可視化廣泛用于分層數(shù)據(jù)分析。如果你沒有經(jīng)驗(yàn)還想創(chuàng)建一個(gè),那將會有些復(fù)雜。下面是一個(gè)詳細(xì)教程,教你如何使用JavaScript創(chuàng)建交互式樹形圖
    2022-06-06
  • JavaScript循環(huán)鏈表實(shí)現(xiàn)方法

    JavaScript循環(huán)鏈表實(shí)現(xiàn)方法

    這篇文章主要給大家介紹了關(guān)于JavaScript循環(huán)鏈表實(shí)現(xiàn)的相關(guān)資料,循環(huán)鏈表和單向鏈表很相似,唯一的區(qū)別是循環(huán)鏈表的尾節(jié)點(diǎn)是指向頭節(jié)點(diǎn)的,需要的朋友可以參考下
    2023-07-07
  • JavaScript 變量作用域分析

    JavaScript 變量作用域分析

    變量作用域是程序中定義這個(gè)變量的區(qū)域。先貼一段代碼,如果讀者對代碼的輸出并不感到困惑就不用往下面讀了。
    2011-07-07
  • 一不小心就做錯(cuò)的JS閉包面試題

    一不小心就做錯(cuò)的JS閉包面試題

    這篇文章為大家推薦了許多經(jīng)典的JS閉包面試題,也可以說是一不小心就做錯(cuò)的JS閉包面試題,感興趣的小伙伴們可以參考一下,自己試著解答這些大部分人都會做錯(cuò)的JS閉包面試題,檢驗(yàn)自己的知識水平
    2015-11-11
  • js時(shí)間戳格式化成日期格式的多種方法

    js時(shí)間戳格式化成日期格式的多種方法

    js需要把時(shí)間戳轉(zhuǎn)為為普通格式,一般的情況下可能用不到的,下面與大家分享幾種不錯(cuò)的方法,感興趣的朋友不要錯(cuò)過
    2013-11-11
  • js實(shí)現(xiàn)隨機(jī)8位驗(yàn)證碼

    js實(shí)現(xiàn)隨機(jī)8位驗(yàn)證碼

    這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)隨機(jī)8位驗(yàn)證碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2019-06-06
  • 基于zepto.js實(shí)現(xiàn)手機(jī)相冊功能

    基于zepto.js實(shí)現(xiàn)手機(jī)相冊功能

    這篇文章主要為大家詳細(xì)介紹了基于zepto.js實(shí)現(xiàn)手機(jī)相冊功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-07-07
  • webpack -v報(bào)錯(cuò)解決方案

    webpack -v報(bào)錯(cuò)解決方案

    這篇文章主要介紹了webpack -v報(bào)錯(cuò)解決方案,本篇文章通過簡要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下
    2021-09-09
  • JavaScript遍歷數(shù)組的三種方法map、forEach與filter實(shí)例詳解

    JavaScript遍歷數(shù)組的三種方法map、forEach與filter實(shí)例詳解

    這篇文章主要介紹了JavaScript遍歷數(shù)組的三種方法map、forEach與filter,結(jié)合實(shí)例形式詳細(xì)分析了javascript針對數(shù)組遍歷的map、forEach與filter三種方法相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下
    2019-02-02

最新評論