Skip to content

M
mangala-pardusacikhack
Kaydet (Commit) 207c06a5 authored tarafından Abdülkerim AKSAK's avatar Abdülkerim AKSAK
Dosyalara gözat
Seçenekler

Oyun sonu overlay tasarımı.

üst e64b7278
Hide whitespace changes
Inline Side-by-side
Showing with 515 additions and 162 deletions
pages/clientGameArea.html
Dosyayı görüntüle @ 207c06a5
......@@ -12,15 +12,26 @@
<div class="container-fluid">
<div id="overlay">
<div>
<p id="text"></p>
<div style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
<div style="display: flex; justify-content: center; align-items: center; height: 250px; width: 550px;flex-direction: column; background-image: linear-gradient(
to bottom,
#416e75,
#529290,
#6db7a6,
#94dbb5,
#c6ffc1
); border-radius: 20px;">
<div style="margin-bottom: 25px;"><p id="text" style="color:#ffe268;"></p></div>
<div>
<button class="big-button" onclick="yenidenOyna()" style="font-size: 11px;width: 150px;">Yeniden
Oyna
</button>
</div>
</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>
<div id="overlayOda" onclick="overlayOff()">
<a href="../main.html"><img width="60" height="60" src="../assets/image/geri.png" alt="geri" style="margin-left: 15px;"></a>
<div class="row" style="padding: 30px">
......
pages/gameArea.html
Dosyayı görüntüle @ 207c06a5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../assets/gameArea.css" />
<link rel="stylesheet" href="../assets/bootstrap.min.css" />
</head>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../assets/gameArea.css" />
<link rel="stylesheet" href="../assets/bootstrap.min.css" />
</head>
<body>
<div class="container-fluid">
<div id="overlay">
<div>
<p id="text"></p>
<body>
<div class="container-fluid">
<div id="overlay">
<div
style="
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
"
>
<div
style="
display: flex;
justify-content: center;
align-items: center;
height: 250px;
width: 550px;
flex-direction: column;
background-image: linear-gradient(
to bottom,
#416e75,
#529290,
#6db7a6,
#94dbb5,
#c6ffc1
);
border-radius: 20px;
"
>
<div style="margin-bottom: 25px">
<p id="text" style="color: #ffe268"></p>
</div>
<div>
<button
class="big-button"
onclick="yenidenOyna()"
style="font-size: 11px; width: 150px"
>
Yeniden Oyna
</button>
</div>
</div>
</div>
</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" onclick="window.open(this.href, 'Anasayfaya Dön',
'left=20,top=20,width=400,height=300,toolbar=no,location=no,scrollbars=no,status=no,fullscreen=no,resizable=no'); return false;"><img width="60" height="60"
src="../assets/image/geri.png" alt="geri" id="yeniPencere2"/></a>
<div class="row" style="margin: 0">
<div class="col-4">
<div class="geriButonu">
<a
href="turnBackMain.html"
onclick="window.open(this.href, 'Anasayfaya Dön',
'left=20,top=20,width=400,height=300,toolbar=no,location=no,scrollbars=no,status=no,fullscreen=no,resizable=no'); return false;"
><img
width="60"
height="60"
src="../assets/image/geri.png"
alt="geri"
id="yeniPencere2"
/></a>
</div>
</div>
</div>
<div class="col-4">
<div class="bos"></div>
</div>
<div class="col-4 text-right" id="user1">
<div id="user2card">
<b id="user1Kullaniciadi">Oyuncu 1</b>
<img src="../assets/image/clock.gif" width="70" height="70" id="clock1" style="visibility: hidden;">
<div class="col-4">
<div class="bos"></div>
</div>
<div class="col-4 text-right" id="user1">
<div id="user2card">
<b id="user1Kullaniciadi">Oyuncu 1</b>
<img
src="../assets/image/clock.gif"
width="70"
height="70"
id="clock1"
style="visibility: hidden"
/>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="clear"></div>
<div class="row" id="tahta">
<div class="col" style="align-items: center;">
<div id="tahtaCerceve">
<div id="tahtaGorunum">
<div class="a">
<div class="hazine1" style="float: left;">
<div id="user1hole7" class="rectangle"></div>
</div>
<div class="boncuklar" style="float: left;">
<div class="boncuklar1">
<div class="cirlce" onclick="tikla(this.id)" id="user1hole6">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user1hole5">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user1hole4">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user1hole3">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user1hole2">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user1hole1">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="clear"></div>
<div class="row" id="tahta">
<div class="col" style="align-items: center">
<div id="tahtaCerceve">
<div id="tahtaGorunum">
<div class="a">
<div class="hazine1" style="float: left">
<div id="user1hole7" class="rectangle"></div>
</div>
<div class="boncuklar2">
<div class="cirlce" onclick="tikla(this.id)" id="user2hole1">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
<div class="boncuklar" style="float: left">
<div class="boncuklar1">
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole6"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole5"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole4"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole3"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole2"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user1hole1"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div class="clear"></div>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user2hole2">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
<div class="boncuklar2">
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole1"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole2"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole3"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole4"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole5"
>
<span
class="dot_black"
id="drag1"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag2"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag3"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag4"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div
class="cirlce"
onclick="tikla(this.id)"
id="user2hole6"
>
<span
class="dot_black"
id="drag5"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag6"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag7"
draggable="true"
ondragstart="drag(event)"
></span>
<span
class="dot_black"
id="drag8"
draggable="true"
ondragstart="drag(event)"
></span>
</div>
<div class="clear"></div>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user2hole3">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user2hole4">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user2hole5">
<span class="dot_black" id="drag1" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag2" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag3" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag4" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="cirlce" onclick="tikla(this.id)" id="user2hole6">
<span class="dot_black" id="drag5" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag6" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag7" draggable="true" ondragstart="drag(event)"></span>
<span class="dot_black" id="drag8" draggable="true" ondragstart="drag(event)"></span>
</div>
<div class="clear"></div>
</div>
</div>
<dic class="clear"></dic>
<div class="hazine2" style="float: left;">
<div id="user2hole7" class="rectangle"></div>
<dic class="clear"></dic>
<div class="hazine2" style="float: left">
<div id="user2hole7" class="rectangle"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row" style="margin: 0;">
<div class="col-4 text-left" id="user2">
<div id="user2card">
<b id="user2Kullaniciadi">Oyuncu 2</b>
<img src="../assets/image/clock.gif" width="70" height="70" id="clock2" style="visibility: visible;">
<div class="row" style="margin: 0">
<div class="col-4 text-left" id="user2">
<div id="user2card">
<b id="user2Kullaniciadi">Oyuncu 2</b>
<img
src="../assets/image/clock.gif"
width="70"
height="70"
id="clock2"
style="visibility: visible"
/>
</div>
</div>
<!-- toast js fonksiyonu eklenecek-->
<div class="col-4 text-center"></div>
<div class="col-4 text-right">
<div class="oda"></div>
</div>
</div>
<!-- toast js fonksiyonu eklenecek-->
<div class="col-4 text-center "></div>
<div class="col-4 text-right">
<div class="oda"></div>
</div>
</div>
</div>
<script src="settings.js"></script>
<script>
document.getElementById("user2Kullaniciadi").innerHTML=user_name_list[0];
document.getElementById("user1Kullaniciadi").innerHTML=user_name_list[1];
</script>
</body>
<script src="settings.js"></script>
<script>
document.getElementById("user2Kullaniciadi").innerHTML =
user_name_list[0];
document.getElementById("user1Kullaniciadi").innerHTML =
user_name_list[1];
</script>
</body>
</html>
<script src="gameArea.js"></script>
\ No newline at end of file
<script src="gameArea.js"></script>
pages/robotGameArea.html
Dosyayı görüntüle @ 207c06a5
......@@ -12,13 +12,22 @@
<body>
<div class="container-fluid">
<div id="overlay">
<div>
<p id="text"></p>
<div style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
<div style="display: flex; justify-content: center; align-items: center; height: 250px; width: 550px;flex-direction: column; background-image: linear-gradient(
to bottom,
#416e75,
#529290,
#6db7a6,
#94dbb5,
#c6ffc1
); border-radius: 20px;">
<div style="margin-bottom: 25px;"><p id="text" style="color:#ffe268;"></p></div>
<div>
<button class="big-button" onclick="yenidenOyna()" style="font-size: 11px;width: 150px;">Yeniden
Oyna
</button>
</div>
</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>
......
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