Migrazione codebase a git
BIN
assets/skins/archbtw/circle.jpg
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
assets/skins/archbtw/cross.jpg
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
assets/skins/archbtw/empty.jpg
Normal file
|
After Width: | Height: | Size: 4.1 KiB |
BIN
assets/skins/archbtw/win.mp3
Normal file
BIN
assets/skins/default/circle.jpg
Normal file
|
After Width: | Height: | Size: 1.9 KiB |
BIN
assets/skins/default/cross.jpg
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
assets/skins/default/empty.jpg
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
assets/skins/default/win.mp3
Normal file
BIN
assets/skins/legacy/circle.jpg
Normal file
|
After Width: | Height: | Size: 1.9 KiB |
BIN
assets/skins/legacy/cross.jpg
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
assets/skins/legacy/empty.jpg
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
assets/skins/legacy/win.mp3
Normal file
BIN
assets/skins/ludopatia/circle.jpg
Normal file
|
After Width: | Height: | Size: 212 KiB |
BIN
assets/skins/ludopatia/cross.jpg
Normal file
|
After Width: | Height: | Size: 163 KiB |
BIN
assets/skins/ludopatia/empty.jpg
Normal file
|
After Width: | Height: | Size: 199 KiB |
BIN
assets/skins/ludopatia/fill.mp3
Normal file
BIN
assets/skins/ludopatia/retry.mp3
Normal file
BIN
assets/skins/ludopatia/win.mp3
Normal file
47
index.html
Normal file
@@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="it">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>KASANE TETORIS</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script src="script.js"></script>
|
||||
|
||||
</head>
|
||||
<body onload="SvuotaTavola()">
|
||||
<h1>TRIS OFFICIALE</h1>
|
||||
<br><br>
|
||||
<div class="playfield">
|
||||
<div class="row">
|
||||
<div id="1" class="cell" onclick="SignCell(1)"></div>
|
||||
<div id="2" class="cell" onclick="SignCell(2)"></div>
|
||||
<div id="3" class="cell" onclick="SignCell(3)"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div id="4" class="cell" onclick="SignCell(4)"></div>
|
||||
<div id="5" class="cell" onclick="SignCell(5)"></div>
|
||||
<div id="6" class="cell" onclick="SignCell(6)"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div id="7" class="cell" onclick="SignCell(7)"></div>
|
||||
<div id="8" class="cell" onclick="SignCell(8)"></div>
|
||||
<div id="9" class="cell" onclick="SignCell(9)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br><br>
|
||||
<button onclick="Riavvia()">Riavvia</button>
|
||||
<p id="winTxt"></p>
|
||||
<br><br>
|
||||
|
||||
<form>
|
||||
<h3>Selezione skin</h3>
|
||||
<select name="skin" id="skinName">
|
||||
<option value="default">Predefinito</option>
|
||||
<option value="archbtw">Arch Linux</option>
|
||||
<option value="ludopatia">LET'S GO GAMBLING</option>
|
||||
</select>
|
||||
<button onclick="ChangeSkin()">Imposta</button>
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
87
script.js
Normal file
@@ -0,0 +1,87 @@
|
||||
var skinName = "default";
|
||||
var player = "cross";
|
||||
var cellResolution = "100px";
|
||||
var gameEnded = false;
|
||||
var crossSigned = [];
|
||||
var circleSigned = [];
|
||||
var audio = new Audio("yomama");
|
||||
const winConditions = [
|
||||
[1, 2, 3], [4, 5, 6], [7, 8, 9],
|
||||
[1, 4, 7], [2, 5, 8], [3, 6, 9],
|
||||
[1, 5, 9], [3, 5, 7]
|
||||
];
|
||||
|
||||
|
||||
function SignCell(cella){
|
||||
if(gameEnded == false && document.getElementById(cella).innerHTML == "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>"){
|
||||
audio.pause();
|
||||
audio = new Audio("assets/skins/" + skinName + "/fill.mp3");
|
||||
audio.play();
|
||||
document.getElementById(cella).innerHTML = "\<img src=\"assets/skins/" + skinName + "/" + player + ".jpg\" width=\"" + cellResolution + "\"\>";
|
||||
switch(player){
|
||||
case "cross":
|
||||
crossSigned.push(cella);
|
||||
player = "circle";
|
||||
break;
|
||||
case "circle":
|
||||
circleSigned.push(cella);
|
||||
player = "cross";
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
ControllaVittoria();
|
||||
|
||||
}
|
||||
|
||||
function ControllaVittoria(){
|
||||
for (var i = 0; i < winConditions.length; i++) {
|
||||
var [a, b, c] = winConditions[i];
|
||||
if (crossSigned.includes(a) && crossSigned.includes(b) && crossSigned.includes(c)) {
|
||||
audio.pause();
|
||||
audio = new Audio("assets/skins/" + skinName + "/win.mp3");
|
||||
audio.play();
|
||||
document.getElementById("winTxt").innerHTML = "HA VINTO CROCE (GIOCATORE 1)";
|
||||
gameEnded = true;
|
||||
}
|
||||
if (circleSigned.includes(a) && circleSigned.includes(b) && circleSigned.includes(c)) {
|
||||
audio.pause();
|
||||
audio = new Audio("assets/skins/" + skinName + "/win.mp3");
|
||||
audio.play();
|
||||
document.getElementById("winTxt").innerHTML = "HA VINTO CERCHIO (GIOCATORE 2)";
|
||||
gameEnded = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function Riavvia(){
|
||||
SvuotaTavola();
|
||||
audio.pause();
|
||||
audio = new Audio("assets/skins/" + skinName + "/retry.mp3");
|
||||
audio.play();
|
||||
gameEnded = false;
|
||||
player = "cross";
|
||||
}
|
||||
|
||||
function SvuotaTavola(){
|
||||
crossSigned = [];
|
||||
circleSigned = [];
|
||||
|
||||
document.getElementById("winTxt").innerHTML = "";
|
||||
|
||||
document.getElementById("1").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("2").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("3").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("4").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("5").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("6").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("7").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("8").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
document.getElementById("9").innerHTML = "\<img src=\"assets/skins/" + skinName + "/empty.jpg\" width=\"" + cellResolution + "\"\>";
|
||||
}
|
||||
|
||||
function ChangeSkin(){
|
||||
event.preventDefault()
|
||||
skinName = document.getElementById("skinName").value;
|
||||
Riavvia();
|
||||
}
|
||||
24
style.css
Normal file
@@ -0,0 +1,24 @@
|
||||
body{
|
||||
background-color: gainsboro;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
body, button{
|
||||
font-family: 'Comic Sans MS', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
}
|
||||
|
||||
.playfield{
|
||||
max-width: fit-content;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.row{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cell{
|
||||
margin: 5px;
|
||||
}
|
||||