スロットマシンの続き
判定の関数を加えてslot3を止めた後に呼び出すようにする
ちなみに、if文の判定がこの条件ではまずい
(s1+s2+s3)==s1*3
→なぜか
7,6,8でも777と同じ挙動になってしまう。
これは条件ミス。
--->test3.html
<!DOCTYPE html>
<html lang="ja">
<head>
<link rel="stylesheet" href="test3.css">
<title>スロットマシン</title>
<meta charset="UTF-8">
<script src="../jquery-3.4.1.min.js"></script>
</head>
<body>
<p>Your coins <span id="coins"></span></p><!--所持コイン-->
<div id="slot1">0</div>
<div id="slot2">0</div>
<div id="slot3">0</div>
<div>
<button id="b1">start</button>
<button id="b2">start</button>
<button id="b3">start</button>
<p>
<button id="reset">reset</button>
</p>
<div id="msg"></div>
</div>
<script src="test3.js"></script>
</body>
</html>
--->test3.js
$(function(){
var cnt1 = 0;
var cnt2 = 0;
var cnt3 = 0;
var timer1, timer2, timer3;
var coins = 3;//coin9枚から
$('#coins').text(coins);
//-------------------
//slot1に関して
//-------------------
$('#b1').on('click',function(){
if($('#b1').text() =='start'){ //startだったら始める
$('#b1').text('stop');//stopボタンに変更
timer1 = setInterval(function(){//無名関数
cnt1++;
if(cnt1 == 10){
cnt1 = 0;
}
$('#slot1').text(cnt1);//slot1にcnt1を表示
},500);//ここでsetIntervalが終わる
}else{ //stopだったら止める
$('#b1').text('start');//startボタンに変更
$('#b1').prop('disabled',true);//もうボタンは押せないようにする
clearInterval(timer1);
}
});
//-------------------
//slot2に関して
//-------------------
$('#b2').on('click',function(){
if($('#b2').text() =='start'){ //startだったら始める
$('#b2').text('stop');//stopボタンに変更
timer2 = setInterval(function(){//無名関数
cnt2++;
if(cnt2 == 10){
cnt2 = 0;
}
$('#slot2').text(cnt2);//slot1にcnt1を表示
},500);//ここでsetIntervalが終わる
}else{ //stopだったら止める
$('#b2').text('start');//startボタンに変更
$('#b2').prop('disabled',true);//もうボタンは押せないようにする
clearInterval(timer2);
}
});
//-------------------
//slot3に関して
//-------------------
$('#b3').on('click',function(){
if($('#b3').text() =='start'){ //startだったら始める
$('#b3').text('stop');//stopボタンに変更
timer3 = setInterval(function(){//無名関数
cnt3++;
if(cnt3 == 10){
cnt3 = 0;
}
$('#slot3').text(cnt3);//slot1にcnt1を表示
},500);//ここでsetIntervalが終わる
}else{ //stopだったら止める
$('#b3').text('start');//startボタンに変更
$('#b3').prop('disabled',true);//もうボタンは押せないようにする
clearInterval(timer3);
hantei();
}
});
//-------------------
//判定に関して
//-------------------
function hantei(){
console.log('here is in hantei');
var s1 = $('#slot1').text();//slot1の内容をtextでgetterとして取得
var s2 = $('#slot2').text();
var s3 = $('#slot3').text();
if(s1==s2 && s2==s3 && s1==7){//全部7
//大当たり
$('#msg').text('おおあたり');
coins += 10;
}else if(s1==s2 && s2==s3){//小当たり
$('#msg').text('こあたり');
coins += 3;
}else{
$('#msg').text('はずれ');
}
//判定の後初期化する
coins--;//i++みたいなやつの反対。1つ減らす
if(coins >= 0){//coinsが0以上なら
$('#coins').text(coins);
$('#b1').prop('disabled',false);//クリックできるようにする
$('#b2').prop('disabled',false);
$('#b3').prop('disabled',false);
}else{
$('#msg').text('game over');
}
}
/*
//-----reset-------
$('#reset').on('click',function(){
$('#b1').prop('disabled',false);
$('#b2').prop('disabled',false);
$('#b3').prop('disabled',false);
cnt1 = 0;
cnt2 = 0;
cnt3 = 0;
$('#slot1').text(cnt1);
$('#slot2').text(cnt2);
$('#slot3').text(cnt3);
$('#msg').text('');
});
*/
});
