Kaydet (Commit) f544d56f authored tarafından Abdülkerim AKSAK's avatar Abdülkerim AKSAK
......@@ -61,7 +61,7 @@
left: 0;
right: 0;
bottom: 0;
background-color: rgba(51, 68, 67, 0.90);
background-color: rgba(51, 68, 67, 0.80);
z-index: 2;
cursor: pointer;
color:aliceblue;
......@@ -242,6 +242,17 @@ body{
font-size: 20px;
font-family: "Itim";
}
#text{
position: absolute;
top: 40%;
left: 50%;
font-size: 50px;
text-align: center;
color: white;
transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
font-family: 'Itim';
}
......@@ -322,4 +333,6 @@ body{
box-shadow: 0 0 0 2px var(--colorShadeB), 0 0.25em 0 0 var(--colorShadeB);
}
\ No newline at end of file
}
......@@ -49,10 +49,17 @@ app.on("ready", () => {
//Yeni pencere
ipcMain.on("key:newWindow", () => {
addWindow = new BrowserWindow({
width: 400,
height: 300,
webPreferences: {
//* Frontend kısmında "Electron require() is not defined" hata çözümü.
nodeIntegration: true,
contextIsolation: false,
enableRemoteModule: true,
},
width: 430,
height: 370,
title: "Oyun Ayarları",
});
addWindow.loadURL(
url.format({
pathname: path.join(__dirname, "./pages/settings.html"),
......
This diff is collapsed.
......@@ -37,7 +37,8 @@
</div>
<div class="row" style="margin: 0;">
<div class="col-4"><div class="geriButonu"><a href="turnBackMain.html"><img width="60" height="60" src="../assets/image/geri.png" alt="geri"></a></div></div>
<div class="col-4"><div class="geriButonu"><a href="turnBackMain.html" onclick="window.open(this.href, 'Anasayfaya Dön',
'left=20,top=20,width=405,height=350,toolbar=1,resizable=0'); return false;"><img width="60" height="60" src="../assets/image/geri.png" alt="geri"></a></div></div>
<div class="col-4"><div class="bos"><button class="btn-primary" onclick="overlay()">overlay</button></div></div>
<div class="col-4 text-right" id="user1">
<div id="user2card">
......
......@@ -11,16 +11,20 @@
<body>
<div class="container-fluid">
<div id="overlay" onclick="overlayOff()">
<div id="text">Bitti</div>
<div id="overlay">
<div><p id="text"></p></div>
<div style="position: absolute;
top: 50%;
left: 40%;"><button class="big-button" onclick="yenidenOyna()" style="font-size: 11px;width: 150px;">Yeniden Oyna</button></div>
</div>
<div class="row" style="margin: 0;">
<div class="col-4"><div class="geriButonu"><a href="turnBackMain.html"><img width="60" height="60" src="../assets/image/geri.png" alt="geri"></a></div></div>
<div class="col-4"><div class="geriButonu"><a href="turnBackMain.html" onclick="window.open(this.href, 'Anasayfaya Dön',
'left=20,top=20,width=405,height=350,toolbar=1,resizable=0'); return false;"><img width="60" height="60" src="../assets/image/geri.png" alt="geri"></a></div></div>
<div class="col-4"><div class="bos"><button class="btn-primary" onclick="overlay()">overlay</button></div></div>
<div class="col-4 text-right" id="user1">
<div id="user2card">
<b>Oyuncu 2</b>
<b>Oyuncu 1</b>
</div>
</div>
</div>
......@@ -129,8 +133,8 @@
</div>
</div>
<!-- toast js fonksiyonu eklenecek-->
<div class="col-4 text-center "><div class="toast">Muaz odaya katıldı</div></div>
<div class="col-4 text-right"><div class="oda">Oda Numarası:Bjkcz</div></div>
<div class="col-4 text-center "><div class="toast"></div></div>
<div class="col-4 text-right"><div class="oda"></div></div>
</div>
......
......@@ -23,6 +23,9 @@ var treasure2=new Hole(0,"user2hole7");
user1hole.push(treasure1);
user2hole.push(treasure2);
var player=2;
waitcolor="#ed664c";//// Kırmızı renk beklesin
playercolor="#ffe268";// Sarı renk oynasın
function tikla(id){
// ekranda bulunan kuyulardaki kuyulara tıklama ile tetiklenen fonk.
......@@ -35,6 +38,10 @@ function tikla(id){
player=2;
dagit(Number(id[4]),Number(id[9]));
boncukCiz();
if(player==2){
document.getElementById("user1").style.backgroundColor=waitcolor;
document.getElementById("user2").style.backgroundColor=playercolor;
}
}
}else if(Number(id[4])==2 && player==Number(id[4])){
......@@ -43,10 +50,15 @@ function tikla(id){
player=1;
dagit(Number(id[4]),Number(id[9]));
boncukCiz();
if(player==1){
document.getElementById("user1").style.backgroundColor=playercolor;
document.getElementById("user2").style.backgroundColor=waitcolor;
}
}
}
}
function dagit(user,hole){
......@@ -311,10 +323,50 @@ function drop(ev) {
//overlay ac kapa
function overlay() {
document.getElementById("overlay").style.display = "block";
state = false;
document.getElementById("overlay").style.display = "block";
if(user1hole[6].value > user2hole[6].value){
document.getElementById("text").innerHTML = "Kaybettiniz :(";
}else if( user1hole[6].value == user2hole[6].value){
document.getElementById("text").innerHTML = "Berabere.";
}else{
document.getElementById("text").innerHTML = "Tebrikler! Kazandınız. :)";
}
}
function overlayOff() {
document.getElementById("overlay").style.display = "none";
}
function overlayOff() {
document.getElementById("overlay").style.display = "none";
function yenidenOyna(){
// yeniden oynanmasi icin degiskenleri baslangic konumuna getirir.
player = 2;
document.getElementById("user1").style.backgroundColor=waitcolor;
document.getElementById("user2").style.backgroundColor=playercolor;
for (var i = 1; i < 7; i++) {
var hole1 = new Hole(4,"user1hole"+i.toString());
var hole2 = new Hole(4,"user2hole"+i.toString());
user1hole.push(hole1);
user2hole.push(hole2);
};
treasure1=new Hole(0,"user1hole7");
treasure2=new Hole(0,"user2hole7");
user1hole.push(treasure1);
user2hole.push(treasure2);
boncukCiz();
overlayOff();
}
......@@ -88,13 +88,27 @@
a{
color:#334443;
}
.geributon{
margin-left: 15px;
margin-top:10px ;
}
.titleGeri{
margin-left: 70px;
margin-top:10px ;
text-align: center;
}
</style>
</head>
<body>
<div class="back"></div>
<div class="front">
<h1>Clutch Software</h1>
<div class="geributon" style="float:left;"><a href="../main.html"><img width="60" height="60" src="../assets/image/geri.png" alt="geri"></a></div>
<div class="titleGeri" style="float:left;"><h1>Clutch Software</h1></div>
<div style="clear:both;"></div>
<h4 class="baslik">TAKIM </h4>
<div class="row" style="padding: 15px;">
<div class="col-1 align-self-center">
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
display: flex;
align-items: center;
justify-content: center;
background-image: linear-gradient(to bottom, #416e75, #529290, #6db7a6, #94dbb5, #c6ffc1);
}
div {
border-radius:10%;
height: 580px;
width: 600px;
border-radius: 10%;
overflow: scroll;
}
div.back {
border-radius:10%;
position: absolute;
background: linear-gradient(180deg, #FFDA89, #FF8B36);
box-shadow: inset -2px 0px 4px rgba(255, 255, 255, 0.3), inset 0 0 56px rgb(225, 133, 70, 0.3);
filter: drop-shadow(0px 52px 94px rgba(253, 115, 51, 0.349));
}
div.front {
border-radius:10%;
background: linear-gradient(180deg, rgb(255, 230, 186, 0.3), rgba(255, 237, 222, 0.6));
position: relative;
backdrop-filter: blur(16px);
box-shadow: inset -1px 1px 1px rgba(255, 255, 255, 0.4), inset 0px 0px 35px rgba(0, 0, 0, 0.08);
}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@font-face {
font-family: "Itim";
src: url('../assets/fonts/Itim-Regular.ttf') format("truetype");
}
body {
display: flex;
align-items: center;
justify-content: center;
background-image: linear-gradient(to bottom, #416e75, #529290, #6db7a6, #94dbb5, #c6ffc1);
font-family: "Itim";
color: #334443
}
div.back::-webkit-scrollbar {
display: none;
}
div.front::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
div.back {
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
}
div.front {
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
}
div.back {
height: 525px;
width: 600px;
overflow: auto;
border-radius: 10%;
position: absolute;
background: linear-gradient(180deg, #FFDA89, #FF8B36);
box-shadow: inset -2px 0px 4px rgba(255, 255, 255, 0.3), inset 0 0 56px rgb(225, 133, 70, 0.3);
filter: drop-shadow(0px 52px 94px rgba(253, 115, 51, 0.349));
}
div.front {
height: 525px;
width: 600px;
overflow: auto;
border-radius: 10%;
background: linear-gradient(180deg, rgb(255, 230, 186, 0.3), rgba(255, 237, 222, 0.6));
position: relative;
backdrop-filter: blur(16px);
box-shadow: inset -1px 1px 1px rgba(255, 255, 255, 0.4), inset 0px 0px 35px rgba(0, 0, 0, 0.08);
}
p{
padding-bottom:20px;
padding-left:20px;
padding-right: 20px;
}
p {
padding-bottom: 20px;
padding-left: 20px;
padding-right: 20px;
}
h2,h1{
padding-left:20px;
padding-right: 20px;
}
h2 {
h1{
text-align: center;
}
padding-left: 20px;
padding-right: 20px;
}
h1 {
text-align: center;
}
</style>
.geributon {
margin-left: 15px;
margin-top: 10px;
}
.titleGeri {
margin-left: 20%;
text-align: center;
}
</style>
</head>
<body>
<div class="back">
</div>
<div class="front">
<div class="back"></div>
<div class="front">
<div class="geributon" style="float:left;"><a href="../main.html"><img width="60" height="60"
src="../assets/image/geri.png" alt="geri"></a></div>
<div class="titleGeri" style="float:left;">
<h1>Oyun Kuralları</h1>
<h2>1. Kural</h2>
<p>Kura neticesinde başlama hakkı kazanan oyuncu kendi bölgesinde bulunan istediği kuyudan 4 adet taşı alır. Bir adet taşı aldığı kuyuya bırakıp saatin tersi yönünde, yani sağa doğru her bir kuyuya birer adet taş bırakarak elindeki taşlar bitene kadar dağıtır. Elindeki son taş hazinesine denk gelirse, oyuncu tekrar oynama hakkına sahip olur. Oyuncunun kuyusunda tek taş varsa, sırası geldiğinde bu taşı sağındaki kuyuya taşıyabilir. Hamle sırası rakibine geçer. Her seferinde oyuncunun elinde kalan son taş oyunun kaderini belirler.</p>
<h2>2. Kural</h2>
<p>Hamle sırası gelen oyuncu kendi kuyusundan aldığı taşları dağıtırken elinde taş kaldıysa, rakibinin bölgesindeki kuyulara da taş bırakmaya devam eder. Oyuncunun elindeki son taş, rakibinin bölgesinde denk geldiği kuyudaki taşların sayısını çift sayı yaparsa (2, 4, 6, 8 gibi) oyuncu bu kuyuda yer alan tüm taşların sahibi olur ve onları kendi hazinesine koyar. Hamle sırası rakibine geçer.</p>
<h2>3. Kural</h2>
<p>Oyuncu taşları dağıtırken elinde kalan son taş, yine kendi bölgesinde yer alan boş bir kuyuya denk gelirse ve eğer boş kuyusunun karşısındaki kuyuda da rakibine ait taş varsa, hem rakibinin kuyusundaki taşları alır, hem de kendi boş kuyusuna bıraktığı taşı alıp hazinesine koyar. Hamle sırası rakibine geçer.</p>
<h2>4. Kural</h2>
<p>Oyunculardan herhangi birinin bölgesinde yer alan taşlar bittiğinde oyun seti biter. Oyunda kendi bölgesinde taşları ilk biten oyuncu, rakibinin bölgesinde bulunan tüm taşları da kazanır. Dolayısıyla, oyunun dinamiği son ana kadar hiç düşmez.
Mangala Oyunu 5 set olarak oynanır.
Oyunu kazanan oyuncu (1) puan, kaybeden (0) puan ve berabere bitiren oyuncular yarım (0,5) puan alır.<p>
</div>
<div style="clear:both;"></div>
<h2>1. Kural</h2>
<p>Kura neticesinde başlama hakkı kazanan oyuncu kendi bölgesinde bulunan istediği kuyudan 4 adet taşı alır. Bir
adet taşı aldığı kuyuya bırakıp saatin tersi yönünde, yani sağa doğru her bir kuyuya birer adet taş bırakarak
elindeki taşlar bitene kadar dağıtır. Elindeki son taş hazinesine denk gelirse, oyuncu tekrar oynama hakkına sahip
olur. Oyuncunun kuyusunda tek taş varsa, sırası geldiğinde bu taşı sağındaki kuyuya taşıyabilir. Hamle sırası
rakibine geçer. Her seferinde oyuncunun elinde kalan son taş oyunun kaderini belirler.</p>
<h2>2. Kural</h2>
<p>Hamle sırası gelen oyuncu kendi kuyusundan aldığı taşları dağıtırken elinde taş kaldıysa, rakibinin bölgesindeki
kuyulara da taş bırakmaya devam eder. Oyuncunun elindeki son taş, rakibinin bölgesinde denk geldiği kuyudaki
taşların sayısını çift sayı yaparsa (2, 4, 6, 8 gibi) oyuncu bu kuyuda yer alan tüm taşların sahibi olur ve onları
kendi hazinesine koyar. Hamle sırası rakibine geçer.</p>
<h2>3. Kural</h2>
<p>Oyuncu taşları dağıtırken elinde kalan son taş, yine kendi bölgesinde yer alan boş bir kuyuya denk gelirse ve
eğer boş kuyusunun karşısındaki kuyuda da rakibine ait taş varsa, hem rakibinin kuyusundaki taşları alır, hem de
kendi boş kuyusuna bıraktığı taşı alıp hazinesine koyar. Hamle sırası rakibine geçer.</p>
<h2>4. Kural</h2>
<p>Oyunculardan herhangi birinin bölgesinde yer alan taşlar bittiğinde oyun seti biter. Oyunda kendi bölgesinde
taşları ilk biten oyuncu, rakibinin bölgesinde bulunan tüm taşları da kazanır. Dolayısıyla, oyunun dinamiği son
ana kadar hiç düşmez.
Mangala Oyunu 5 set olarak oynanır.
Oyunu kazanan oyuncu (1) puan, kaybeden (0) puan ve berabere bitiren oyuncular yarım (0,5) puan alır.
<p>
</div>
</body>
</html>
</html>
\ No newline at end of file
This diff is collapsed.
......@@ -14,6 +14,7 @@
const zorlukDerecesi = 4;
class Hole {
constructor(value,id) {
this.id=id;
......@@ -61,26 +62,39 @@ var treasure2=new Hole(0,"user2hole7");
user1hole.push(treasure1);
user2hole.push(treasure2);
var player=2;
playercolor="#ed664c";
waitcolor="#ffe268";
function tikla(id){
// ekranda bulunan kuyulardaki kuyulara tıklama ile tetiklenen fonk.
// tiklanan kuyunun html' deki id sini alır
// Paramaters:
// id --> tiklanan kuyunun html' deki id sini alır ex.("user1hole5")
console.log(player);
if(Number(id[4])==1 && player==Number(id[4]) && id[10]=="x"){ //bilgisayar tikladiysa x gelecek
if(user1hole[Number(id[9])-1].value != 0){
//player=2;
dagit(Number(id[4]),Number(id[9]));
boncukCiz();
if(player==2){
document.getElementById("user1").style.backgroundColor=waitcolor;
document.getElementById("user2").style.backgroundColor=playercolor;
}
}
}else if(Number(id[4])==2 && player==Number(id[4])){ //kullanici tikladiginda
if(user2hole[Number(id[9])-1].value != 0){
//player=1; //bu burada kalmali
dagit(Number(id[4]),Number(id[9]));
if(player==1){
document.getElementById("user1").style.backgroundColor=playercolor;
document.getElementById("user2").style.backgroundColor=waitcolor;
}
boncukCiz();
if(zorlukDerecesi == 4){
while(player == 1 && state){
......@@ -103,10 +117,13 @@ function tikla(id){
wait(2000);
}
}
}
}
}
......@@ -163,16 +180,19 @@ function dagit(user,hole){
player = 1; // ozaman sira tekrar sende
}else{
player = 2; // degilse sira karsiya gecti
}
}else if( sira == -1 && user2hole[sonHole].value % 2 == 0){ // son tas karsi tarafin kuyusunu cift yapiyorsa hepsini al
player = 2;
user1hole[6].value += user2hole[sonHole].value;
user1hole[6].addedDotcount += user2hole[sonHole].value;
user2hole[sonHole].value = 0;
user2hole[sonHole].addedDotcount = 0;
}else if(sira==1 && user1hole[sonHole].value == 1 && user2hole[5 - sonHole].value > 0){ // son tas kendindenki bos kuyuna geliyosa,
player = 2;
// ve karsi kuyu da tas varsa kendi tek tasini ve karsidakileri hepsini al
//console.log(user2hole[5 - sonHole].value + " kural 3 gerceklesti.");
user1hole[6].value += user2hole[5 - sonHole].value + 1;
......@@ -183,6 +203,7 @@ function dagit(user,hole){
user2hole[5 - sonHole].addedDotcount = 0;
}else{
player=2;
}
//renklendirme işini yapılmadı düzgün çalışmıyordu.
......@@ -245,9 +266,11 @@ function dagit(user,hole){
player = 2;
}else{
player = 1;
}
}else if( sira == -1 && user1hole[sonHole].value % 2 == 0){ // son tas karsi tarafin kuyusunu cift yapiyorsa hepsini al
player = 1;
user2hole[6].value += user1hole[sonHole].value;
user2hole[6].addedDotcount += user1hole[sonHole].value;
user1hole[sonHole].value = 0;
......@@ -255,6 +278,7 @@ function dagit(user,hole){
}else if(sira==1 && user2hole[sonHole].value == 1 && user1hole[5 - sonHole].value > 0){ // son tas kendindenki bos kuyuna geliyosa,
// ve karsi kuyu da tas varsa kendi tek tasini ve karsidakileri hepsini al
player = 1;
//console.log(user1hole[5 - sonHole].value);
user2hole[6].value += user1hole[5 - sonHole].value + 1;
user2hole[6].addedDotcount += user1hole[5 - sonHole].value + 1;
......@@ -265,6 +289,7 @@ function dagit(user,hole){
}else{
player = 1;
}
......@@ -600,17 +625,19 @@ function drop(ev) {
//overlay ac kapa
function overlay() {
state = false;
document.getElementById("overlay").style.display = "block";
let temp = document.createElement('p');
const text_div = document.getElementById("text");
if(user1hole[6].value > user2hole[6].value){
temp.textContent = "Kaybettiniz. :(";
document.getElementById("text").innerHTML = "Kaybettiniz :(";
}else if( user1hole[6].value == user2hole[6].value){
temp.textContent = "Berabere.";
document.getElementById("text").innerHTML = "Berabere.";
}else{
temp.textContent = "Tebrikler! Kazandınız. :)";
document.getElementById("text").innerHTML = "Tebrikler! Kazandınız. :)";
}
text_div.appendChild(temp);
}
......@@ -618,4 +645,33 @@ function overlay() {
function overlayOff() {
document.getElementById("overlay").style.display = "none";
}
\ No newline at end of file
function yenidenOyna(){
// yeniden oynanmasi icin degiskenleri baslangic konumuna getirir.
player = 2;
robotMedium = 0;
state = true; //true ise oyun devam ediyor.
document.getElementById("user1").style.backgroundColor=waitcolor;
document.getElementById("user2").style.backgroundColor=playercolor;
bosalt();
for (var i = 1; i < 7; i++) {
var hole1 = new Hole(4,"user1hole"+i.toString());
var hole2 = new Hole(4,"user2hole"+i.toString());
user1hole.push(hole1);
user2hole.push(hole2);
};
treasure1=new Hole(0,"user1hole7");
treasure2=new Hole(0,"user2hole7");
user1hole.push(treasure1);
user2hole.push(treasure2);
boncukCiz();
overlayOff();
}
......@@ -7,7 +7,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../assets/bootstrap.min.css" />
<link rel="stylesheet" href="../assets/button.sccs" />
<style>
@font-face {
font-family: "Itim";
......@@ -143,12 +143,20 @@
</div>
<div class="col-7">
<!--<a href="#" class="btn">Oyuna Dön</a>-->
<button class="big-button">Kaydet</button>
<button class="big-button" id="save" type="button">Kaydet</button>
</div>
</div>
</div>
</div>
</body>
<script>
const remote = require("electron").remote;
document.getElementById("save").addEventListener("click", function (e) {
var window = remote.getCurrentWindow();
window.close();
});
</script>
</html>
......@@ -16,7 +16,7 @@
width: 400px;
height: 250px;
background-color: #334443;
border-style: solid;
color: aliceblue;
font-family: "Itim";
}
......@@ -113,16 +113,26 @@
</div>
<div class="row">
<div class="col">
<button class="big-button">Anasayfaya Dön</button>
<button class="big-button" id="anasayfayaDon">Anasayfaya Dön</button>
</div>
<div class="col">
<!--<a href="#" class="btn">Oyuna Dön</a>-->
<button class="big-button">Oyuna Dön</button>
<button class="big-button" onclick="window.close()">Oyuna Dön</button>
</div>
</div>
</div>
</div>
</body>
<script>
document.getElementById("anasayfayaDon").addEventListener("click", function (e) {
console.log( window.opener.location.href);
var dosyaYolu= __dirname;
dosyaYolu= dosyaYolu.toString().substring(0,dosyaYolu.length-5 );
window.opener.location.href="file://" + dosyaYolu + "/main.html";
close();
});
</script>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment