Little Strange Software

スマホアプリの開発を行う LittleStrangeSoftware のブログです。

【JavaScript】テキストアドベンチャーゲームのシステムを作りかけてみました

 どうも!LSSです!!

 

先日、このブログに

という記事を書きました。

 

で、考えていたんですが、

「容易にシステムとなるスクリプトをコピペできて、誰でもカンタンに項目を増やせるようなWebゲームブックシステムを公開したら…誰かゲームブック作ってくれないかな?」

とw

 

で、とりあえず、作ってみました!

 

 

サンプル

 

 

 

コード

 

<style><!--
#gamen{border:2px solid #aaccff;}
.sntk{text-decoration:underline #ffaaff;}
--></style>
<div id="gamen"> </div>
<script>// <![CDATA[
hstr=[0];
st=[];

st[0]={
text:'あなたは今、門の前にいます。',
sentaku:[
{goto:1,sttext:'門を叩く'}
,
{goto:2,sttext:'門を押し開ける'}
]};

st[1]={

text:'叩いてみましたが、何の反応もない…。',
sentaku:[
{goto:1,sttext:'さらに門を叩く'}
,
{goto:0,sttext:'もう一度考えてみる'}
]};

st[2]={

text:'強引に押し開けようとした!しかし開かなかった…。',
sentaku:[
{goto:1,sttext:'門を叩く'}
,
{goto:0,sttext:'もう一度考えてみる'}
]};

gamen.addEventListener('click',clk,false);
gw();
function clk(e){
a=e.srcElement.id;
if(a.match(/s[0-9]+/)){hstr.push(st[hstr[hstr.length-1]].sentaku[parseInt(a.substr(1))].goto);gw();}
}
function gw(){
txt='';
for(i=0;i<hstr.length;i++){
txt+=st[hstr[i]].text+'<br/>';
}
for(i=0;i<st[hstr[hstr.length-1]].sentaku.length;i++){
txt+='<span id="s'+i+'" class="sntk">'+st[hstr[hstr.length-1]].sentaku[i].sttext+'</span><br/>';
}
gamen.innerHTML=txt;
}
// ]]></script>

 

 

サンプルはあくまでサンプル

3つの項目の中で堂々巡りするだけのお話となっていますw

 

st[項目番号]={
text:'表示される文章',
sentaku:[
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
,
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
]};

 

という形式で項目をいくつでも作成できます。(項目番号はカブらないようにする必要があります。)

選択肢は

{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}

の部分で、サンプルでは2つづつ用意していますが、カンマで区切る事で3つでも4つでも用意できます。(1つでもOK)

 

例えば4つ選択肢を用意するなら、

 

st[項目番号]={
text:'表示される文章',
sentaku:[
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
,
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
,
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
,
{goto:選択肢を選んだ場合の行先項目番号,sttext:'選択肢文章'}
]};

 

のように書く事になります。

 

また「表示される文章」の中にHTMLタグを使う事もでき、例えば

 

text:'あいうえお<br/>かきくけこ',

のように書くと、

 

あいうえお
かきくけこ

 

と表示されます。 

 

 

と、作ってはみたものの…

データ形式が分かり辛いかもですね^^;;;

 

このままゲームブックにする事は可能ではありますが、もっと簡単にする必要がある…かな??

 

 

 

ってなとこで、今回はこのへんで!

次回もまた、よろしくお願いします^^