]
8パズル
続いてJavaScriptを用意します。以下のソースコードを先程用意したHTMLと同じフォルダに保存してください。ファイル名はpuzzle.jsとします。
let taslar = [“t0″,”t1″,”t2″,”t3″,”t4″,”t5″,”t6″,”t7″,”t8”]
function tasBul(val){
for (i = 0; i < taslar.length; i++) {
if(document.getElementById(taslar[i]).firstChild.data == val){
return(taslar[i])
}
}
}
function degisme(id, bosTasId){
let yakinlar = []
if([2,5,8].includes(parseInt(bosTasId[1]))){
yakinlar = [+3,-3,-1]
}else if([0,3,6].includes(parseInt(bosTasId[1]))){
yakinlar = [+3,+1,-3]
}else{
yakinlar = [+3,+1,-3,-1]
}
for(i = 0; i < taslar.length; i++){
if(parseInt(bosTasId[1])+parseInt(yakinlar[i]) == parseInt(id[1])){
return(true);
}
}
return(false)
}
function pushed(id){
var btn = document.getElementById(id);
if (btn.firstChild.data!=" "){
bosTasId = tasBul(" ")
if(degisme(id, bosTasId) == false) return;
document.getElementById(bosTasId).firstChild.data = btn.firstChild.data;
btn.firstChild.data = " "
}
}
function solvable(rndList){
var count = 0;
for(i=0;i
count++;
}
}
}
if(count%2 == 0){
return(true);
}else{
return(false);
}
}
function randomTaslar(){
var rndList = []
while(true){
rndList = []
while(rndList.length < 9){ var randomnumber = Math.ceil(Math.random()*9)-1 if(rndList.indexOf(randomnumber) > -1) continue;
rndList[rndList.length] = randomnumber;
}
if(solvable(rndList)){
break;
}
}
for (i = 0; i < taslar.length; i++) { if(rndList[i] == 0){ val = " " }else{ val = rndList[i].toString() } document.getElementById(taslar[i]).firstChild.data = val } } ここまででゲームは動きますが、パズルのパネルの見た目を整えるためにCSSを入れます。以下のソースコードをコピーして、HTMLと同じフォルダに保存します。ファイル名はlayout.cssとします。 .tile { width:100px; height:100px; font-family:arial black; font-size: x-large; }
最近のコメント