ぷよぷよを改造する最終回。
今回は、おじゃまぷよを追加。
しかも、おじゃまぷよは通常４個で消えるところ、６個で消えるようにした。
もはや嫌がらせに近い・・・。
まず先に完成品。
ぷよぷよ
akasairoha.sakura.ne.jp
背景も画像を入れてみた。
それではソース。
<body style="margin:0;">
<!-- <div id="stage" style="position:absolute; left: 0; top: 0; overflow: hidden;"></div> -->
<!-- <div id="stage" style="position:relative; margin: 0 auto; overflow: hidden;background: url(img/puyo_4bg.png)"></div> -->
<!-- 背景画像追加 -->
<div id="stage" style="position:relative; margin: 0 auto; overflow: hidden;background: url(img/background.png)"></div>
<!-- <div id="score" style="position:absolute; left: 0; top: 0; overflow: hidden; text-align: right;"></div> -->
<div id="score" style="margin: 0 auto; overflow: hidden; text-align: right;"></div>
<div style="display:none">
<img src="img/puyo_1.png" id="puyo_1">
<img src="img/puyo_2.png" id="puyo_2">
<img src="img/puyo_3.png" id="puyo_3">
<img src="img/puyo_4.png" id="puyo_4">
<img src="img/puyo_5.png" id="puyo_5">
<img src="img/puyo_6.png" id="puyo_6">
<img src="img/puyo_7.png" id="puyo_7">
<img src="img/puyo_8.png" id="puyo_8">
<img src="img/puyo_9.png" id="puyo_9">
<img src="img/puyo_10.png" id="puyo_10">
<!-- おじゃまぷよ追加 -->
<img src="img/ojama.png" id="ojama">
<img src="img/batankyu.png" id="batankyu">
<img src="img/zenkeshi.png" id="zenkeshi">
<img src="img/0.png" id="font0">
<img src="img/1.png" id="font1">
<img src="img/2.png" id="font2">
<img src="img/3.png" id="font3">
<img src="img/4.png" id="font4">
<img src="img/5.png" id="font5">
<img src="img/6.png" id="font6">
<img src="img/7.png" id="font7">
<img src="img/8.png" id="font8">
<img src="img/9.png" id="font9">
</div>
</body>// config.jsより
// 設定を記載しておくクラス
class Config {
}
//おじゃまぷよの設定
Config.ojamaColor = 15;
Config.ojamaRarity = 5;
Config.eraseOjamaPuyoCount = 6;//puyoimage.jsより
static initialize() {
this.puyoImages = [];
for(let i = 0; i < 10; i++) {
const image = document.getElementById(`puyo_${i + 1}`);
image.removeAttribute('id');
image.width = Config.puyoImgWidth;
image.height = Config.puyoImgHeight;
image.style.position = 'absolute';
this.puyoImages[i] = image;
}
this.batankyuImage = document.getElementById('batankyu');
this.batankyuImage.width = Config.puyoImgWidth * 6;
this.batankyuImage.style.position = 'absolute';
//おじゃまぷよを追加
// 後から考えたら、別に分ける必要なかったかな。まぁいいや
this.ojamaImage = [];
const ojama = document.getElementById('ojama');
ojama.removeAttribute('id');
ojama.width = Config.puyoImgWidth;
ojama.height = Config.puyoImgHeight;
ojama.style.position = 'absolute';
this.ojamaImage = ojama;
}
static getPuyo(index) {
//const image = this.puyoImages[index - 1].cloneNode(true);
let image = "";
//おじゃまぷよ
if(index == Config.ojamaColor){
image = this.ojamaImage.cloneNode(true);
} else {
image = this.puyoImages[index - 1].cloneNode(true);
}
return image;
}// player.jsより
if(Math.floor(Math.random() * Config.ojamaRarity) == 0){
//おじゃまぷよ
this.centerPuyo = Config.ojamaColor;
this.movablePuyo = Config.ojamaColor;
this.centerPuyoElement = PuyoImage.ojamaImage.cloneNode(true);
this.movablePuyoElement = PuyoImage.ojamaImage.cloneNode(true);
Stage.stageElement.appendChild(this.centerPuyoElement);
Stage.stageElement.appendChild(this.movablePuyoElement);
} else {
// 新しいぷよの色を決める
const puyoColors = Math.max(1, Math.min(10, Config.puyoColors));
this.centerPuyo = Math.floor(Math.random() * puyoColors) + 1;
this.movablePuyo = Math.floor(Math.random() * puyoColors) + 1;
// 新しいぷよ画像を作成する
this.centerPuyoElement = PuyoImage.getPuyo(this.centerPuyo);
this.movablePuyoElement = PuyoImage.getPuyo(this.movablePuyo);
Stage.stageElement.appendChild(this.centerPuyoElement);
Stage.stageElement.appendChild(this.movablePuyoElement);
}// stage.jsより
// 実際に削除できるかの確認を行う
for(let y = 0; y < Config.stageRows; y++) {
for(let x = 0; x < Config.stageCols; x++) {
sequencePuyoInfoList.length = 0;
const puyoColor = this.board[y][x] && this.board[y][x].puyo;
checkSequentialPuyo(x, y);
if(puyoColor !== 15){
// おじゃまぷよ以外
// ４個そろったら消すリストに追加
if(sequencePuyoInfoList.length == 0 || sequencePuyoInfoList.length < Config.erasePuyoCount) {
// 連続して並んでいる数が足りなかったので消さない
if(sequencePuyoInfoList.length) {
// 退避していたぷよを消さないリストに追加する
existingPuyoInfoList.push(...sequencePuyoInfoList);
}
} else {
// これらは消して良いので消すリストに追加する
this.erasingPuyoInfoList.push(...sequencePuyoInfoList);
erasedPuyoColor[puyoColor] = true;
}
} else {
// おじゃまぷよ
// 6個そろったら消すリストに追加
if(sequencePuyoInfoList.length == 0 || sequencePuyoInfoList.length < Config.eraseOjamaPuyoCount) {
// 連続して並んでいる数が足りなかったので消さない
if(sequencePuyoInfoList.length) {
// 退避していたぷよを消さないリストに追加する
existingPuyoInfoList.push(...sequencePuyoInfoList);
}
} else {
// これらは消して良いので消すリストに追加する
this.erasingPuyoInfoList.push(...sequencePuyoInfoList);
erasedPuyoColor[puyoColor] = true;
}
}
}
}ざっくり説明すると、ぷよを消すリストに追加する時に４（通常）か６（おじゃまぷよ）で分岐。
ゲームとして面白いかは別にして、とりあえずこれで改造終わり。
最後に一言。
やっぱり、普通のぷよぷよが一番完成されているよ。
間違いなく。
