テキストRPGをHTMLとJSで作ってみようと思うんだが

**名前は開発中のものです。** · 2020/07/09(木) 18:10:53.88

TRPGまとめ読んでたら作りたくなってきた
なおJSは実務未経験

**名前は開発中のものです。** · 2020/07/09(木) 18:14:37.90

プレイヤーの変数は名前とHPと攻撃力
配列に戦闘とイベントをランダムで入れてその配列を進めていく

**名前は開発中のものです。** · 2020/07/09(木) 18:26:05.78

とりあえずver0.01作った

**名前は開発中のものです。** · 2020/07/09(木) 18:27:03.38

<ぼでぃ>
<スパン>HP:</スパン><スパン id="HP"></スパン>
<スパン>攻撃力:</スパン><スパン id="ATTACK"></スパン>
<スパン>フロア:</スパン><スパン id="FLOOR"></スパン>
<スクリプト>
let HP = 10;
let ATTACK = 1;
let FLOOR = 0;

let PROGRESS=[];

const status = () =>{
document.querySelector("#HP").textContent = HP;
document.querySelector("#ATTACK").textContent = ATTACK;
document.querySelector("#FLOOR").textContent = FLOOR + 1;
}
status();
</スクリプト>
</ぼでぃ>

**名前は開発中のものです。** · 2020/07/09(木) 18:31:55.39

戦闘シーケンスどうやって作るか
とりあえずモンスターのHPと攻撃力設定しておく
交互に攻撃してHPゼロになったら戦闘シーケンス終了
装備とかクリティカルヒットとか回避はあとあと考えるか
攻撃はとりあえずプレイヤー先攻がデフォ

**名前は開発中のものです。** · 2020/07/09(木) 19:08:28.94

**名前は開発中のものです。** · 2020/07/09(木) 19:23:27.12

配列がディープコピーしたいけどググっても素のJSでやる方法がすぐ出てこないからramda.js使う

https://ramdajs.com/

**名前は開発中のものです。** · 2020/07/09(木) 19:24:09.77

でモンスターの配列をディープコピー
let MONSTERS = [["ゴブリン",3,1]];

const getAnyMonster = (MONSTERS) =>{
const EntityMONSTER = R.clone(MONSTERS);
return EntityMONSTER[0];
}

**名前は開発中のものです。** · 2020/07/09(木) 19:26:28.62

戦闘を何度も繰り返したいときはこんな感じ？
const battle = (PLAYER,MONSTER) =>{
const attack = () =>{
while (
Math.sign(PLAYER[1]) === 1 &&
Math.sign(MONSTER[1]) === 1
) {
console.table(PLAYER[1],PLAYER[2],MONSTER[1],MONSTER[2])
PLAYER[1] = PLAYER[1] - MONSTER[2];
indicate(`${PLAYER[0]}のHP`+PLAYER[1]);
MONSTER[1] = MONSTER[1] - PLAYER[2];
indicate(`${MONSTER[0]}のHP`+MONSTER[1]);
}
indicate(`戦闘は終了した`);
}
attack();
}

PROGRESS=[battle, battle, battle, battle, battle, battle, battle];
PROGRESS.forEach(SEQUENCE=>{
SEQUENCE(PLAYER,getAnyMonster(MONSTERS));
})

**名前は開発中のものです。** · 2020/07/09(木) 19:27:00.30

データ構造はこんなもん

let NAME = "Hiroyuki";
let HP = 11;
let AP = 2;
let FLOOR = 0;

let PROGRESS=[];

**名前は開発中のものです。** · 2020/07/09(木) 19:35:48.27

モンスター複数にしてランダムでモンスター出るようにした

let PLAYER=[NAME,HP,AP];
let MONSTERS = [["ゴブリン",3,1],["骸骨剣士",5,2],["ドワーフ",6,1]];

const shuffleArray = array => {
for (let i = array.length - 1; i > 0; i--) {
let r = Math.floor(Math.random() * (i + 1));
let tmp = array[i];
array[i] = array[r];
array[r] = tmp;
}
return array
}

const getAnyMonster = (MONSTERS) =>{
const EntityMONSTER = R.clone(MONSTERS);
return shuffleArray(EntityMONSTER)[0];
}

**名前は開発中のものです。** · 2020/07/09(木) 19:41:06.61

モンスター複数っていうかモンスターの種類が複数で出現は1体ずつ

あと死亡状態確認の関数も定義した

const deathCheck = () =>{ if(Math.sign(PLAYER[1]) !== 1){ indicate(`${PLAYER[0]}は死亡した`) } }

**名前は開発中のものです。** · 2020/07/09(木) 19:52:24.97

匿名でhtmlファイルの共有簡単にできるやつなんか無いのか
とりあえず検索してすぐ出たやつで上のこれ共有しとく
ただのHTMLとJSだからセットアップ無しでそのまま動く

https://volafile.org/r/1bq7592g8

**名前は開発中のものです。** · 2020/07/09(木) 19:57:45.35

あと戦闘以外のイベント作りたい
とりあえずHPかAPを増減するだけのイベントだけ設定するか

戦闘もイベントも結果が選択によって変わるのと確率の要素入れたい
とりあえずまずイベントだけ作ってPROGRESSに入れてみるか

**名前は開発中のものです。** · 2020/07/09(木) 20:20:38.39

デバッグめんどくさいからシード値か何かでランダムの部分固定したい

イベント追加した
イベントの結果を2つ以上にして結果をランダムにするのと
イベントを実行するの実装するか

const THINGS = [
["HPが1増えた", ()=>{PLAYER[1]=PLAYER[1]+1}],
["HPが5減った", ()=>{PLAYER[1]=PLAYER[1]-5}]
];

const getAnyHappening = () =>{
const EntityTHINGS = R.clone(THINGS);
return shuffleArray(EntityTHINGS)[0];
}

const happening = (THING) =>{
indicate(THING[0]);
THING[1]();
deathCheck();
}

PROGRESS=[happening, battle, battle, happening, battle, battle, battle];
PROGRESS.forEach(SEQUENCE=>{
if(SEQUENCE===battle){SEQUENCE(PLAYER,getAnyMonster(MONSTERS))};
if(SEQUENCE===happening){SEQUENCE(getAnyHappening())};
})

**名前は開発中のものです。** · 2020/07/12(日) 20:25:51.01

おい誰か反応してやれよ